@font-face {font-family: 'muli_extra_light'; font-style: normal; font-weight: normal; font-display: swap; src: url('../fonts/muli_extra_light.woff2') format('woff2'), url('../fonts/muli_extra_light.ttf') format('truetype');}
@font-face {font-family: 'dancing'; font-style: normal; font-weight: normal; font-display: swap; src: url('../fonts/dancing.woff2') format('woff2'), url('../fonts/dancing.ttf') format('truetype');}

[v-cloak] {display: none !important;}
[v-cloak] > * {display: none !important;}

html, body {height: 100% !important; scrollbar-gutter: stable;}
body {margin: 0 !important; padding: 0 !important; font-family: 'muli_extra_light', sans-serif !important; font-size: 1rem !important; background: #000000 !important; color: #1B557D !important; overflow-x: hidden;}

header {width: 100%; height: 400px !important; position: relative; overflow: hidden; z-index: 1; font-weight: lighter; background: url('../images/header_back.webp') no-repeat bottom center/cover;}

a {text-decoration: none !important;}

select, input[type=text], input[type=tel], input[type=email], input[type=password], button, textarea {outline: none !important; box-shadow: none !important; -webkit-touch-callout: none; -webkit-user-select: none;}

body .form-control:focus,
body .form-select:focus {
    border-color: var(--bs-border-color);
    box-shadow: none !important;
    outline: 0 !important;
}

.dancing {font-family: 'dancing', sans-serif !important;}
.text-white-75 {--bs-text-opacity: 1; color: rgba(255, 255, 255, .75) !important;}
.text-white-50 {--bs-text-opacity: 1; color: rgba(255, 255, 255, .5) !important;}
.text-gold {color: #c9a96e;}
.text-gold-gradient {background: linear-gradient(135deg, #a08552 0%, #e2cfa0 40%, #f0ddb0 55%, #c9a96e 80%, #8f6f3a 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;}
.text-gold-gradient span {-webkit-text-fill-color: initial; background: none; background-clip: unset; -webkit-background-clip: unset;}
.animated {transition: all 0.3s ease-in-out;}
.fs-7 {font-size: 0.75rem !important;}
.lang-switcher {z-index: 1000;}
.no-mp {margin: 0 !important; padding: 0 !important;}

.btn-locale-active {color: #2a1f0e !important; background: linear-gradient(135deg, #a08552 0%, #e2cfa0 40%, #f0ddb0 55%, #c9a96e 80%, #8f6f3a 100%) !important; border-color: #b8975a !important; border-radius: 0 !important;}
.btn-locale-inactive {color: #f0ddb0 !important; background: transparent !important; border: 1px solid transparent !important; border-image: linear-gradient(135deg, #a08552 0%, #e2cfa0 40%, #f0ddb0 55%, #c9a96e 80%, #8f6f3a 100%) 1 !important; border-radius: 0 !important;}

.divider-gold {height: 1px; background: linear-gradient(135deg, #a08552 0%, #e2cfa0 40%, #f0ddb0 55%, #c9a96e 80%, #8f6f3a 100%); opacity: 0.5;}
.divider-gold-fade {height: 1px; background: linear-gradient(135deg, transparent 10%, #a08552 20%, #e2cfa0 30%, #f0ddb0 50%, #c9a96e 70%, #8f6f3a 80%, transparent 90%);}

.page-container {max-width: 1440px; width: 1440px; margin: 0 auto;}

.sticky-header {position: fixed; top: 0; left: 0; transform: translateY(-100px); width: 100%; background: #000000; z-index: 1050; transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);}
.sticky-header--visible {transform: translateY(0);}
.sticky-header-inner {width: 1440px;}

.noscript-notice {text-align: center; padding: 2rem;}

.cookie-consent-bar {z-index: 1080; background: rgba(12, 12, 12, 0.97); border-top: 1px solid rgba(201, 169, 110, 0.35); backdrop-filter: blur(6px);}
#bot-cookie-open-preferences {font-size: inherit; vertical-align: baseline;}

.check {z-index: 2100 !important;}
.element-block {display: block !important; opacity: 0 !important; z-index: 100;}
.element-visible {display: block !important; opacity: 1 !important; z-index: 200;}
.element-hidden {display: block !important; opacity: 0 !important; z-index: 100;}
.element-none {display: none !important; opacity: 0 !important; z-index: 100;}

.dropdown-menu-dark {--bs-dropdown-bg: rgba(0, 0, 0, 0.8) !important;}

/* Backgrounds */
.bg-center-back11 {background: url('../images/center_back_1_desktop.webp') top center / cover no-repeat fixed;}

/* Spin */
.spin {
    animation-name: fa-spin;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-direction: normal;
}
@keyframes fa-spin {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

/* Buttons */
.btn-gold {display: inline-block; padding: 6px 16px; font-family: 'muli_extra_light', sans-serif; font-weight: 600; letter-spacing: 0.08em; border: 1px solid #b8975a; border-radius: 6px; transition: filter 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45), inset 0 1px 1px rgba(255, 245, 200, 0.35); text-decoration: none !important;}
.btn-gold-on {color: #2a1f0e; background: linear-gradient(135deg, #a08552 0%, #e2cfa0 40%, #f0ddb0 55%, #c9a96e 80%, #8f6f3a 100%);}
.btn-gold-off {color: #ffffff; background: #000000;}

/* Artwork thumbnail */
.shadow-artwork {box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6), 0 5px 15px rgba(0, 0, 0, 0.3); transition: transform 0.3s ease, box-shadow 0.3s ease;}
.shadow-artwork:hover {transform: scale(1.1); box-shadow: 0 20px 45px rgba(0, 0, 0, 0.9), 0 10px 20px rgba(0, 0, 0, 0.48);}
.order-item-thumb {max-width: 5rem; width: 100%; height: auto; vertical-align: middle;}

/* Forms */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px rgba(0, 0, 0, .25) inset !important;
    box-shadow: 0 0 0 1000px rgba(0, 0, 0, .25) inset !important;
    -webkit-text-fill-color: #ffffff !important;
    caret-color: #ffffff;
}

.form-floating>textarea:focus~label::after, .form-floating>textarea:not(:placeholder-shown)~label::after {background: transparent !important;}
.dropdown-floating>label {position: absolute; top: 0; left: 0; z-index: 2; height: 100%; padding: 1rem 0.75rem; pointer-events: none; border: 1px solid transparent; transform-origin: 0 0; transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out; color: rgba(255,255,255,0.65); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.dropdown-floating.has-value>label {opacity: 0.65; transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);}
.dropdown-floating>.btn.form-control {padding-top: 1.625rem; padding-bottom: 0.625rem; height: calc(3.5rem + 2px);}

.password-reveal-btn {min-width: 3.25rem; cursor: pointer; display: flex; align-items: center; justify-content: center;}
.password-reveal-btn:focus-visible {outline: 2px solid rgba(255, 193, 7, 0.85); outline-offset: 0; z-index: 3;}

.password-strength-meter-wrap .Password {max-width: none; margin: 0;}
.password-strength-meter-wrap .Password__strength-meter {background: rgba(255, 255, 255, 0.2); margin: 0; border-radius: var(--bs-border-radius, 0.375rem); border-top-left-radius: 0; border-top-right-radius: 0;}
.password-strength-meter-wrap .Password__strength-meter::before,
.password-strength-meter-wrap .Password__strength-meter::after {display: none;}

/* Account tabs */
#customer-account-tabs {
    --customer-account-tab-stroke: rgba(var(--bs-secondary-rgb), var(--bs-border-opacity, 1));
    --customer-account-tab-bottom-mask: #000000;
    --bs-nav-tabs-border-color: var(--customer-account-tab-stroke);
    --bs-nav-tabs-link-hover-border-color: var(--customer-account-tab-stroke) var(--customer-account-tab-stroke) var(--customer-account-tab-stroke);
    --bs-nav-tabs-link-active-border-color: var(--customer-account-tab-stroke) var(--customer-account-tab-stroke) var(--customer-account-tab-bottom-mask);
}
#customer-account-tabs .nav-link,
#customer-account-tabs .nav-link:hover,
#customer-account-tabs .nav-link:focus,
#customer-account-tabs .nav-link.active,
#customer-account-tabs .nav-link.active:hover,
#customer-account-tabs .nav-link.active:focus {
    background: transparent !important;
    background-color: transparent !important;
}

/* Profile form layout */
.contact-form--constrained {
    width: 75% !important;
}
