:root { --brand-gold: #C8963E; --brand-espresso: #2B1E16; --brand-sand: #F6F0E6; --brand-white: #FFFFFF; --brand-text: #201711; --brand-muted: #7A6A5C; --brand-border: #E5D9C8; --brand-hover: #A87A2B; --brand-success: #3E6B52; --brand-error: #A94442; --bg-main: #F7F3EC; --bg-card: #FFFFFF; --bg-subtle: #EFE8DC; --bg-accent-section: #EADFCF; --text-primary: #231B15; --text-secondary: #6B5E52; --text-muted: #948577; --accent-gold: #C8963E; --accent-gold-hover: #A87A2B; --accent-gold-light: rgba(200, 150, 62, 0.12); --brand-dark: #2B1E16; --border-color: 137,159,135; /* #E2D5C3 */ --hero-gradient: linear-gradient(135deg, rgba(200, 150, 62, 0.18) 0%, rgba(247, 243, 236, 0.96) 42%, rgba(255, 255, 255, 0.92) 100%); --font-sans: 'Plus Jakarta Sans', sans-serif; --font-serif: 'Cinzel', serif; } .text-brand-dark { color: var(--brand-dark); } .text-gold { color: var(--brand-gold); } .font-serif { font-family: var(--font-serif); } .btn-gold { color: var(--brand-white); background: linear-gradient(135deg, var(--brand-gold) 0%, var(--accent-gold) 100%); border: 1px solid var(--brand-gold); border-radius: 999px; box-shadow: 0 12px 24px rgba(200, 150, 62, 0.18); transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease; } .btn-gold:hover, .btn-gold:focus, .btn-gold:active { color: var(--brand-white); background: linear-gradient(135deg, var(--brand-hover) 0%, var(--brand-gold) 100%); border-color: var(--brand-hover); box-shadow: 0 16px 28px rgba(168, 122, 43, 0.22); } .bg-card-custom { background-color: var(--bg-card); border: 1px solid var(--brand-border); border-radius: 1.5rem; box-shadow: 0 18px 42px rgba(43, 30, 22, 0.04); } .bg-brand-dark { background-color: var(--brand-dark); } .bg-brand-sand { background-color: var(--brand-sand); } /* BASE */ * { margin: 0; padding: 0; } html { height: 100%; } #main { min-height: 380px; } .product-action .tooltip-text { padding: 5px 10px; box-sizing: content-box; } /* COOKIES STYLE */ .accept_cookies { box-sizing: border-box; width: 100%; padding: 30px 20px; position: fixed; z-index: 99999; box-shadow: rgba(0, 0, 0, .2) 0 2px 14px 0; display: block; bottom: 0; background: linear-gradient(to bottom, #ffffff 0%,rgb(255, 255, 255) 100%); opacity: 0.85; } .accept_cookies .popup-content-wrapper{ max-width: 1170px; margin: 0 auto; } .accept_cookies .popup-container{ display: flex; } .accept_cookies .popup-container .logo { background: url(/img/assets/logo.png?v=1) no-repeat center / 75%; width: 20%; } .accept_cookies .popup-container .text { text-align: left; width: 60%; } .accept_cookies .popup-container .text h4{ font-size: 14px !important; margin-bottom: 0; } .accept_cookies .popup-container .text p{ font-size: 12px; color: #878787; line-height: 16px; } .accept_cookies .popup-container .text a { color: rgb(0, 95, 253); } .accept_cookies .popup-container .cbtn { text-align: center; width: 30%; } .accept_cookies .popup-container .cbtn a { border: 1px solid !important; background-color: white; padding: 5px 10px; border-radius: 2px; font-weight: bold; opacity: 0.75; cursor: pointer; white-space: nowrap; line-height: 36px; margin-right: 6px; font-size: 12px; transition: opacity 0.25s ease; } .accept_cookies .popup-container .cbtn a:hover{ opacity: 1; } .accept_cookies .popup-container .cbtn a#accept-all-cookies { background-color: #000000; color: #FFF; } .accept_cookies .popup-container li { margin-right: 15px; } .accept_cookies .popup-container .disabled { -webkit-filter: grayscale(100%); filter: grayscale(100%); } .chk { cursor: pointer; font-size: 1px; background: rgb(239, 239, 239); border: 1px solid rgb(60, 94, 57); display: inline-block; height: 15px; margin: 0 auto; padding: 0; outline: 0 none; width: 15px; position: relative; vertical-align: top; box-sizing: content-box; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 1px 1px 0 rgba(217, 217, 217, 0.1); -moz-box-shadow: 1px 1px 0 rgba(217, 217, 217, 0.1); -o-box-shadow: 1px 1px 0 rgba(217, 217, 217, 0.1); box-shadow: 1px 1px 0 rgba(217, 217, 217, 0.1); } .chk > div { width: 11px; height: 11px; margin: auto; border-radius: 1px; top: 2px; position: relative; left: 0; background: transparent; transition: background 0.2s ease; z-index: 3; } .chk.chked > div, .chk.chked:hover > div { background: #c49c1c; } #cookie-widget .chk:hover > div{ background: #c49c1c; } #cookie-widget.chk.chked > div, #cookie-widget .chk.chked:hover > div { background: #c49c1c; } #cookie-widget .checkbox > .chk::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #FFF; display: block; content: ""; z-index: 2; } #cookie-widget .checkbox > .chk::after { content: ""; width: 15px; height: 15px; display: block; position: absolute; border-radius: 50%; overflow: hidden; opacity: 0; transition: all .20s ease-in-out; background-color: rgba(70, 70, 70, 0.1); top: calc((100% - 15px) / 2); left: calc((100% - 15px) / 2); z-index: 1; } #cookie-widget .checkbox > .chk.chked::after { background-color: rgba(38, 84, 160, 0.2); } #cookie-widget .checkbox > .chk:hover::after, #cookie-widget .checkbox > .chk.click-animation::after{ opacity: 1; width: 35px; height: 35px; top: calc((100% - 35px) / 2); left: calc((100% - 35px) / 2); } .cs-checkbox-list { margin: 15px 30px 10px; } .agree_to > *{ vertical-align: top; cursor: pointer; } .agree_to a{ margin: 0 !important; color: #3c5e39; } .agree_to a:hover{ text-decoration: underline!important; } .rchk > div { display: inline-block; margin-right: 10px; margin-top: 2px; } .rchk > label { width: calc(100% - 40px); vertical-align: top; display: inline-block; } .rchk > label a { display: inline !important; } .chk:hover > div { background: rgba(60, 94, 57, 0.6); } .chk.chked > div { background: rgb(60, 94, 57); } /* Form input validation */ .validate { position: relative; } .frm_input div.validate { width: 100%; } .frm_input label { color: #545454; display: inline-block; font-size: 14px; } input.valid, .v-ok > div > input, .v-ok > div > textarea, .v-ok > input, .v-ok > textarea { background: white url("/img/pub/svg/chk_ok.svg?v=2") no-repeat scroll right center / 18px auto; } input.invalid, .v-error > div > input, .v-error > div > textarea, .v-error > input, .v-error > textarea { background: white url("/img/pub/svg/chk_err.svg?v=1") no-repeat scroll right center / 18px auto; } .v-error input { border-color: red; } /* ERROR BUBBLE */ .v-error .errMsg { opacity: 0; background: #ffeb80; position: absolute; bottom: -8px; font-size: 12px; line-height: 22px; padding: 2px 15px; color: rgb(71, 71, 71); white-space: nowrap; left: 50%; transform: translateX(-50%); z-index: 10; pointer-events: none; box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2); transition: opacity 0.12s ease-in-out, bottom 0.12s ease-in-out; top: unset; } .v-error .errMsg::after{ content: ""; margin: 0 auto; border-left: 4px solid rgb(255, 235, 128); border-top: 4px solid rgb(255, 235, 128); border-bottom: 4px solid transparent; border-right: 4px solid transparent; height: 0; width: 0; display: block; transform: rotate(45deg); top: -4px; position: absolute; left: 0; right: 0; } .v-error:hover .errMsg, .v-error:focus-within .errMsg { opacity: 1; bottom: -35px; } /* ========================================== CUSTOM CHECKBOX COLORS (BY ATTRIBUTE ID) ========================================== */ /* 3: Zils / Blue / Синий */ .cust-checkbox-label.color-3 .cust-check, .color-3 { background-color: #0000ff !important; } /* 101: Melns / Black / Черный */ .cust-checkbox-label.color-101 .cust-check, .color-101 { background-color: #000000 !important; } /* 102: Balts / White / Белый */ .cust-checkbox-label.color-102 .cust-check, .color-102 { background-color: #ffffff !important; border: 1px solid #d1d5db !important; } /* 103: Pelēks / Grey / Серый */ .cust-checkbox-label.color-103 .cust-check, .color-103 { background-color: #808080 !important; } /* 104: Tumši zils / Navy blue / Темно-синий */ .cust-checkbox-label.color-104 .cust-check, .color-104 { background-color: #001f3f !important; } /* 105: Gaiši zils / Light blue / Голубой */ .cust-checkbox-label.color-105 .cust-check, .color-105 { background-color: #87ceeb !important; } /* 106: Sarkans / Red / Красный */ .cust-checkbox-label.color-106 .cust-check, .color-106 { background-color: #e53935 !important; } /* 107: Zaļš / Green / Зеленый */ .cust-checkbox-label.color-107 .cust-check, .color-107 { background-color: #2e7d32 !important; } /* 108: Haki / Khaki / Хаки */ .cust-checkbox-label.color-108 .cust-check, .color-108 { background-color: #6b705c !important; } /* 109: Bēšs / Beige / Бежевый */ .cust-checkbox-label.color-109 .cust-check, .color-109 { background-color: #f5f5dc !important; border: 1px solid #e0e0e0 !important; } /* 110: Brūns / Brown / Коричневый */ .cust-checkbox-label.color-110 .cust-check, .color-110 { background-color: #795548 !important; } /* 111: Dzeltens / Yellow / Желтый */ .cust-checkbox-label.color-111 .cust-check, .color-111 { background-color: #fdd835 !important; } /* 112: Rozā / Pink / Розовый */ .cust-checkbox-label.color-112 .cust-check, .color-112 { background-color: #ff80ab !important; } /* 113: Violets / Purple / Фиолетовый */ .cust-checkbox-label.color-113 .cust-check, .color-113 { background-color: #8e24aa !important; } /* 114: Oranžs / Orange / Оранжевый */ .cust-checkbox-label.color-114 .cust-check, .color-114 { background-color: #ff9800 !important; } /* 115: Zelta / Gold / Золотой */ .cust-checkbox-label.color-115 .cust-check, .color-115 { background: linear-gradient(135deg, #bf953f, #fcf6ba, #b38728, #fbf5b7, #aa771c) !important; } /* 116: Sudraba / Silver / Серебряный */ .cust-checkbox-label.color-116 .cust-check, .color-116 { background: linear-gradient(135deg, #e0e0e0, #ffffff, #b0b0b0, #f5f5f5, #9e9e9e) !important; } /* 117: Daudzkrāsains / Multicolor / Разноцветный */ .cust-checkbox-label.color-117 .cust-check, .color-117 { background: linear-gradient(135deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #8b00ff) !important; } /* Media queries */ @media (max-width: 1199.98px) { html, body { max-width: 100%; overflow-x: hidden; } body.mobile-menu-open { overflow: hidden; } .mobile-menu { left: 0; width: calc(100vw - 24px); max-width: min(350px, calc(100vw - 24px)); visibility: hidden; transform: translateX(calc(-100% - 24px)); -webkit-transition: transform 0.3s ease-in-out, visibility 0.3s ease-in-out; transition: transform 0.3s ease-in-out, visibility 0.3s ease-in-out; } .mobile-menu.active { visibility: visible; transform: translateX(0); } .mobile-menu .mobilemenu-account a { min-height: 56px; } .mobile-menu .menu-btn { align-items: stretch; } .mobile-menu .menu-btn button { background-color: transparent; -webkit-transition: transform 0.3s ease-in-out, color 0.3s ease-in-out; transition: transform 0.3s ease-in-out, color 0.3s ease-in-out; } .mobilemenu-content { flex: 1 1 auto; min-height: 0; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; } .mobilemenu-content .main-wrap ul.menu-ul li.menu-li .menu-btn button[aria-expanded="true"] i { transform: rotate(45deg); } .mobile-menu, .cart-drawer { max-width: calc(100vw - 16px); } .slider-content, .breadcrumb-area, .main-header, #main, footer { max-width: 100%; } } @media (max-width: 767.98px) { .account-page, .account-page .ap-detail, .account-page .ap-detail-info, .account-page .acc-info, .account-page .wish-table, .account-page .od-wrap { min-width: 0; max-width: 100%; overflow-x: hidden; } .account-page .acc-title, .account-page #address-book-section .extra-bg .d-flex.justify-content-between, .account-page .ap-profile a { gap: 12px; } .account-page .acc-title { align-items: flex-start !important; flex-direction: column; } .account-page .btn-style, .account-page input, .account-page select, .account-page textarea { max-width: 100%; } .account-page .field-row, .account-page .btn-row, .account-page .row-mtm, .account-page .row-mtm15, .account-page .row-mtm20, .account-page .row-mtm30 { --bs-gutter-x: 16px; } .account-page .od-wrap .col-6:last-child, .account-page .od-wrap .col-lg-3:last-child, .account-page .od-wrap .col-lg-6:last-child { overflow-wrap: anywhere; } }