/* =========================================================
   EMA BOUTIQUE
   GLOBAL FINAL DESIGN SYSTEM
   Luxury / Minimal / Compact / Responsive
========================================================= */


/* =========================================================
   VARIABLES
========================================================= */

:root {

    --ema-black: #24231f;
    --ema-black-deep: #191815;

    --ema-cream: #f5f2ec;
    --ema-white: #fbfaf7;

    --ema-gold: #b89a6b;
    --ema-gold-light: #d8c4a1;
    --ema-gold-soft: #eee5d8;

    --ema-olive: #626a5b;
    --ema-olive-soft: #e7ebe3;

    --ema-gray: #858078;
    --ema-gray-light: #b8b2a8;

    --ema-border: #e5e0d7;
    --ema-border-dark: #d1cabf;

    --ema-danger: #a9473f;

    --ema-shadow-sm:
        0 6px 18px
        rgba(36, 35, 31, .035);

    --ema-shadow-md:
        0 12px 30px
        rgba(36, 35, 31, .06);

    --ema-shadow-lg:
        0 24px 55px
        rgba(36, 35, 31, .09);

    --ema-radius-sm: 10px;
    --ema-radius-md: 14px;
    --ema-radius-lg: 18px;
    --ema-radius-xl: 24px;
}


/* =========================================================
   RESET
========================================================= */

* {
    box-sizing: border-box;
}

html {
    direction: rtl;
    scroll-behavior: smooth;

    text-rendering:
        optimizeLegibility;

    -webkit-font-smoothing:
        antialiased;

    -moz-osx-font-smoothing:
        grayscale;
}

body {
    min-width: 320px;
    margin: 0;

    background:
        var(--ema-cream);

    color:
        var(--ema-black);

    font-family:
        Tahoma,
        Arial,
        sans-serif;

    overflow-x: hidden;

    -webkit-font-smoothing:
        antialiased;
}

img {
    max-width: 100%;
}

button,
input,
select,
textarea {
    font-family: inherit;
}

a {
    transition:
        color .2s ease,
        background-color .2s ease,
        border-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

::selection {
    background:
        var(--ema-gold);

    color:
        #fff;
}


/* =========================================================
   SCROLLBAR
========================================================= */

::-webkit-scrollbar {
    width: 9px;
}

::-webkit-scrollbar-track {
    background:
        #ece8e0;
}

::-webkit-scrollbar-thumb {
    background:
        #b7aa96;

    border-radius:
        999px;
}

::-webkit-scrollbar-thumb:hover {
    background:
        var(--ema-gold);
}


/* =========================================================
   GLOBAL CONTAINER
========================================================= */

.ema-container {
    width:
        min(
            1180px,
            calc(100% - 32px)
        );

    margin-inline:
        auto;
}


/* =========================================================
   HEADER
========================================================= */

.ema-navbar{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    z-index:9999;

    background:rgba(255,255,255,.18);

    backdrop-filter:blur(18px);

    -webkit-backdrop-filter:blur(18px);

    border-bottom:1px solid rgba(255,255,255,.15);

    transition:.35s ease;

}

.ema-navbar-inner {
    width:
        min(
            1280px,
            calc(100% - 32px)
        );

    min-height:
        72px;

    margin:
        0 auto;

    display:
        flex;

    align-items:
        center;

    gap:
        20px;
}

.ema-logo {
    flex:
        0 0 auto;

    color:
        var(--ema-black);

    font-size:
        1.3rem;

    font-weight:
        800;

    letter-spacing:
        .14em;

    text-decoration:
        none;
}

.ema-logo:hover {
    color:
        var(--ema-gold);
}

.ema-nav-links {
    display:
        flex;

    align-items:
        center;

    gap:
        3px;

    flex:
        0 0 auto;
}

.ema-nav-link {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    padding: 0 14px;
    border-radius: 0;
    color: #34322e;
    font-size: .78rem;
    font-weight: 500;
    letter-spacing: .02em;
    text-decoration: none;
    transition: color .2s ease;
}
       
       
        

.ema-nav-link:hover {
    background: transparent;
    color: #b89b6a;
}

    color:
        var(--ema-black);
}

.ema-search {
    position:
        relative;

    flex:
        1 1 280px;

    max-width:
        360px;

    margin-inline-start:
        auto;
}

.ema-search-form {
    position:
        relative;
}

.ema-search-input {
    width:
        100%;

    min-height:
        41px;

    padding:
        0 43px 0 13px;

    border:
        1px solid
        var(--ema-border);

    border-radius:
        11px;

    background:
        rgba(255,255,255,.9);

    color:
        var(--ema-black);

    outline:
        none;

    font-size:
        .75rem;
}

.ema-search-input::placeholder {
    color:
        #aaa59d;
}

.ema-search-input:focus {
    border-color:
        var(--ema-gold);

    box-shadow:
        0 0 0 3px
        rgba(184,154,107,.08);
}

.ema-search-button {
    position:
        absolute;

    top:
        4px;

    right:
        4px;

    width:
        33px;

    height:
        33px;

    display:
        grid;

    place-items:
        center;

    border:
        0;

    border-radius:
        8px;

    background:
        var(--ema-black);

    color:
        #fff;

    cursor:
        pointer;
}

.ema-search-button:hover {
    background:
        var(--ema-black-deep);
}

.ema-actions {
    display:
        flex;

    align-items:
        center;

    gap:
        6px;

    flex:
        0 0 auto;
}

.ema-action {
    position:
        relative;

    width:
        39px;

    height:
        39px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        10px;

    color:
        #4c4841;

    text-decoration:
        none;

    font-size:
        .95rem;
}

.ema-action:hover {
    background:
        var(--ema-gold-soft);

    color:
        var(--ema-black);
}

.ema-account-button {
    min-height:
        39px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        6px;

    padding:
        0 12px;

    border:
        1px solid
        var(--ema-border);

    border-radius:
        10px;

    background:
        rgba(255,255,255,.86);

    color:
        #46423b;

    font-size:
        .7rem;

    font-weight:
        700;

    text-decoration:
        none;
}

.ema-account-button:hover {
    border-color:
        var(--ema-gold-light);

    background:
        var(--ema-gold-soft);

    color:
        var(--ema-black);
}

.ema-mobile-toggle {
    width:
        40px;

    height:
        40px;

    display:
        none;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        var(--ema-border);

    border-radius:
        10px;

    background:
        rgba(255,255,255,.9);

    color:
        var(--ema-black);

    cursor:
        pointer;
}


/* =========================================================
   MOBILE MENU
========================================================= */

#emaMobileMenu {
    border-top:
        1px solid
        rgba(36,35,31,.06);

    background:
        var(--ema-cream);
}

#emaMobileMenu .ema-nav-link {
    justify-content:
        flex-start;
}


/* =========================================================
   ALERTS
========================================================= */

.ema-alerts {
    position:
        fixed;

    top:
        18px;

    right:
        18px;

    z-index:
        1080;

    width:
        min(
            420px,
            calc(100vw - 36px)
        );
}

.ema-alert {
    border:
        0;

    border-radius:
        13px;

    box-shadow:
        0 14px 40px
        rgba(0,0,0,.1);

    font-size:
        .8rem;
}


/* =========================================================
   FOOTER
========================================================= */

.ema-footer {
    margin-top:
        0;

    padding:
        58px 0 22px;

    background:
        var(--ema-black);

    color:
        rgba(255,255,255,.68);
}

.ema-footer-inner {
    width:
        min(
            1180px,
            calc(100% - 32px)
        );

    margin:
        0 auto;
}

.ema-footer-brand {
    color:
        #fff;

    font-size:
        1.35rem;

    font-weight:
        800;

    letter-spacing:
        .14em;
}

.ema-footer-title {
    margin-bottom:
        13px;

    color:
        #fff;

    font-size:
        .86rem;

    font-weight:
        800;
}

.ema-footer-text {
    max-width:
        470px;

    margin-top:
        13px;

    color:
        rgba(255,255,255,.57);

    font-size:
        .78rem;

    line-height:
        2;
}

.ema-footer-links {
    display:
        flex;

    flex-direction:
        column;

    gap:
        7px;
}

.ema-footer-links a {
    color:
        rgba(255,255,255,.62);

    font-size:
        .75rem;

    text-decoration:
        none;
}

.ema-footer-links a:hover {
    color:
        var(--ema-gold-light);
}

.ema-footer-bottom {
    margin-top:
        38px;

    padding-top:
        17px;

    border-top:
        1px solid
        rgba(255,255,255,.1);

    color:
        rgba(255,255,255,.4);

    font-size:
        .68rem;

    text-align:
        center;
}


/* =========================================================
   BACK TO TOP
========================================================= */

.ema-back-top {
    position:
        fixed;

    left:
        18px;

    bottom:
        18px;

    z-index:
        1000;

    width:
        42px;

    height:
        42px;

    display:
        grid;

    place-items:
        center;

    border:
        0;

    border-radius:
        11px;

    background:
        var(--ema-black);

    color:
        #fff;

    opacity:
        0;

    visibility:
        hidden;

    transform:
        translateY(8px);

    transition:
        .25s ease;

    cursor:
        pointer;
}

.ema-back-top.show {
    opacity:
        1;

    visibility:
        visible;

    transform:
        translateY(0);
}


/* =========================================================
   BUTTONS
========================================================= */

.btn-ema-dark {
    background:
        var(--ema-black);

    border-color:
        var(--ema-black);

    color:
        #fff;
}

.btn-ema-dark:hover {
    background:
        var(--ema-black-deep);

    border-color:
        var(--ema-black-deep);

    color:
        #fff;
}

.btn-ema-light {
    background:
        var(--ema-white);

    border-color:
        var(--ema-white);

    color:
        var(--ema-black);
}

.btn-ema-light:hover {
    background:
        var(--ema-gold-soft);

    border-color:
        var(--ema-gold-soft);

    color:
        var(--ema-black);
}

.btn-ema-gold {
    background:
        var(--ema-gold);

    border-color:
        var(--ema-gold);

    color:
        #fff;
}

.btn-ema-gold:hover {
    background:
        #a68659;

    border-color:
        #a68659;

    color:
        #fff;
}

.btn-ema-outline {
    background:
        transparent;

    border:
        1px solid
        var(--ema-border-dark);

    color:
        var(--ema-black);
}

.btn-ema-outline:hover {
    background:
        var(--ema-black);

    border-color:
        var(--ema-black);

    color:
        #fff;
}


/* =========================================================
   FORMS
========================================================= */

.form-control,
.form-select {
    min-height:
        46px;

    border-radius:
        12px;

    border-color:
        var(--ema-border);

    background:
        rgba(255,255,255,.9);

    color:
        var(--ema-black);
}

.form-control::placeholder {
    color:
        #a7a199;
}

.form-control:focus,
.form-select:focus {
    border-color:
        var(--ema-gold);

    box-shadow:
        0 0 0 .2rem
        rgba(184,154,107,.09);
}


/* =========================================================
   COMMON CARDS
========================================================= */

.ema-card {
    background:
        var(--ema-white);

    border:
        1px solid
        rgba(36,35,31,.055);

    border-radius:
        var(--ema-radius-lg);

    box-shadow:
        var(--ema-shadow-sm);
}

.ema-card-hover {
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}

.ema-card-hover:hover {
    transform:
        translateY(-4px);

    border-color:
        rgba(184,154,107,.24);

    box-shadow:
        var(--ema-shadow-md);
}


/* =========================================================
   SECTIONS
========================================================= */

.ema-section {
    padding:
        68px 0;
}

.ema-section-light {
    background:
        var(--ema-cream);
}

.ema-section-white {
    background:
        var(--ema-white);
}

.ema-section-soft {
    background:
        #eeece6;
}

.ema-section-olive {
    background:
        var(--ema-olive);

    color:
        #fff;
}

.ema-section-dark {
    background:
        var(--ema-black);

    color:
        #fff;
}


/* =========================================================
   SECTION HEADINGS
========================================================= */

.ema-eyebrow {
    position:
        relative;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    margin-bottom:
        8px;

    color:
        var(--ema-gold);

    font-size:
        .7rem;

    font-weight:
        800;

    letter-spacing:
        .1em;

    text-transform:
        uppercase;
}

.ema-eyebrow::before {
    content:
        "";

    width:
        22px;

    height:
        1px;

    background:
        var(--ema-gold);
}

.ema-section-title {
    margin-bottom:
        10px;

    color:
        var(--ema-black);

    font-size:
        clamp(
            1.65rem,
            3vw,
            2.35rem
        );

    font-weight:
        800;

    line-height:
        1.25;
}

.ema-section-title::after {
    content:
        "";

    display:
        block;

    width:
        36px;

    height:
        2px;

    margin-top:
        12px;

    background:
        var(--ema-gold);
}

.ema-section-text {
    max-width:
        670px;

    color:
        var(--ema-gray);

    line-height:
        1.95;
}


/* =========================================================
   PRODUCT CARDS
   FINAL COMPACT GLOBAL SIZE
========================================================= */

.product-card {
    height:
        100% !important;

    overflow:
        hidden !important;

    border-radius:
        14px !important;

    background:
        var(--ema-white) !important;

    border:
        1px solid
        rgba(36,35,31,.05) !important;

    box-shadow:
        0 5px 16px
        rgba(36,35,31,.03) !important;

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

.product-card:hover {
    transform:
        translateY(-3px);

    border-color:
        rgba(184,154,107,.2) !important;

    box-shadow:
        0 11px 26px
        rgba(36,35,31,.06) !important;
}


/* =========================================================
   PRODUCT IMAGE
========================================================= */

.product-image {
    position:
        relative !important;

    overflow:
        hidden !important;

    width:
        100% !important;

    height:
        230px !important;

    max-height:
        230px !important;

    aspect-ratio:
        auto !important;

    background:
        #ebe8e1 !important;
}

.product-image img {
    width:
        100% !important;

    height:
        100% !important;

    display:
        block;

    object-fit:
        cover !important;

    transition:
        transform .4s ease;
}

.product-card:hover
.product-image img {
    transform:
        scale(1.03);
}


/* =========================================================
   PRODUCT BADGES
========================================================= */

.product-badge {
    position:
        absolute !important;

    top:
        8px !important;

    right:
        8px !important;

    z-index:
        3;

    min-height:
        24px !important;

    display:
        inline-flex;

    align-items:
        center;

    padding:
        0 8px !important;

    border-radius:
        999px;

    background:
        var(--ema-black) !important;

    color:
        #fff !important;

    font-size:
        .57rem !important;

    font-weight:
        700;
}

.product-badge.sale {
    background:
        var(--ema-gold) !important;
}

.product-badge.new {
    background:
        var(--ema-olive) !important;
}


/* =========================================================
   PRODUCT BODY
========================================================= */

.product-body {
    padding:
        10px 11px 12px !important;
}

.product-brand {
    margin-bottom:
        2px !important;

    color:
        #8d887e !important;

    font-size:
        .58rem !important;

    font-weight:
        700;

    letter-spacing:
        .07em;

    text-transform:
        uppercase;
}

.product-name {
    display:
        -webkit-box !important;

    -webkit-line-clamp:
        2;

    -webkit-box-orient:
        vertical;

    min-height:
        34px !important;

    overflow:
        hidden;

    margin-bottom:
        6px !important;

    color:
        var(--ema-black) !important;

    font-size:
        .74rem !important;

    font-weight:
        700;

    line-height:
        1.5;
}

.price-row {
    display:
        flex;

    align-items:
        baseline;

    flex-wrap:
        wrap;

    gap:
        6px;
}

.current-price {
    color:
        var(--ema-black) !important;

    font-size:
        .71rem !important;

    font-weight:
        800;
}

.old-price {
    color:
        #9b978f !important;

    font-size:
        .59rem !important;

    text-decoration:
        line-through;
}


/* =========================================================
   PRODUCT GRID
========================================================= */

.product-grid {
    row-gap:
        16px;
}


/* =========================================================
   PRODUCT GRID WIDTH CONTROL
========================================================= */

.product-grid > [class*="col-"] {
    padding-inline:
        6px;
}


/* =========================================================
   EMPTY STATES
========================================================= */

.ema-empty-state {
    padding:
        68px 24px;

    border-radius:
        18px;

    background:
        var(--ema-white);

    border:
        1px dashed
        #d7d1c7;

    text-align:
        center;
}

.ema-empty-state-icon {
    width:
        68px;

    height:
        68px;

    display:
        grid;

    place-items:
        center;

    margin:
        0 auto 17px;

    border-radius:
        50%;

    background:
        var(--ema-gold-soft);

    color:
        #806b4f;

    font-size:
        1.45rem;
}


/* =========================================================
   PAGINATION
========================================================= */

.pagination .page-link {
    color:
        #4d4942;

    border-color:
        var(--ema-border);

    background:
        var(--ema-white);
}

.pagination .page-link:hover {
    color:
        var(--ema-black);

    background:
        var(--ema-gold-soft);

    border-color:
        var(--ema-gold-light);
}

.pagination .page-item.active .page-link {
    color:
        #fff;

    background:
        var(--ema-black);

    border-color:
        var(--ema-black);
}


/* =========================================================
   UTILITY
========================================================= */

.ema-accent {
    color:
        var(--ema-gold) !important;
}

.ema-accent-olive {
    color:
        var(--ema-olive) !important;
}

.ema-bg-gold {
    background:
        var(--ema-gold-soft) !important;
}

.ema-bg-olive {
    background:
        var(--ema-olive-soft) !important;
}

.ema-border-gold {
    border-color:
        var(--ema-gold-light) !important;
}


/* =========================================================
   RESPONSIVE DESKTOP
========================================================= */

@media (min-width: 1200px) {

    .product-image {
        height:
            225px !important;

        max-height:
            225px !important;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (min-width: 768px)
and (max-width: 991.98px) {

    .product-image {
        height:
            220px !important;

        max-height:
            220px !important;
    }

}


/* =========================================================
   MOBILE HEADER
========================================================= */

@media (max-width: 1100px) {

    .ema-nav-links {
        display:
            none;
    }

    .ema-mobile-toggle {
        display:
            inline-flex;
    }

    .ema-search {
        max-width:
            none;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .ema-navbar-inner {
        min-height:
            66px;

        width:
            min(
                100% - 20px,
                1280px
            );

        gap:
            8px;
    }

    .ema-logo {
        font-size:
            1.12rem;
    }

    .ema-account-button {
        width:
            38px;

        padding:
            0;

        justify-content:
            center;

        font-size:
            0;
    }

    .ema-account-button::before {
        content:
            "♙";

        font-size:
            .95rem;
    }

    .ema-action {
        width:
            37px;

        height:
            37px;
    }

    .ema-section {
        padding:
            52px 0;
    }

    .product-grid {
        row-gap:
            13px;
    }

    .product-grid > [class*="col-"] {
        padding-inline:
            5px;
    }

    .product-image {
        height:
            180px !important;

        max-height:
            180px !important;
    }

    .product-body {
        padding:
            8px 9px 10px !important;
    }

    .product-brand {
        font-size:
            .54rem !important;
    }

    .product-name {
        min-height:
            31px !important;

        font-size:
            .69rem !important;
    }

    .current-price {
        font-size:
            .66rem !important;
    }

    .old-price {
        font-size:
            .54rem !important;
    }

    .product-badge {
        top:
            6px !important;

        right:
            6px !important;

        min-height:
            21px !important;

        padding:
            0 6px !important;

        font-size:
            .52rem !important;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .ema-search {
        display:
            none;
    }

    .product-image {
        height:
            165px !important;

        max-height:
            165px !important;
    }

    .product-name {
        font-size:
            .65rem !important;
    }

    .current-price {
        font-size:
            .62rem !important;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {

        scroll-behavior:
            auto !important;

        transition-duration:
            .01ms !important;

        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;
    }

}
body{

    padding-top:72px;

}

.ema-navbar.scrolled{

    background:rgba(255,255,255,.95);

    backdrop-filter:blur(22px);

    -webkit-backdrop-filter:blur(22px);

    box-shadow:0 10px 30px rgba(0,0,0,.08);

}

/* ================= HERO SLIDER ================= */

.hero-slider{
    width:100%;
    height:88vh;
    min-height:650px;
    position:relative;
    overflow:hidden;
}

.heroSwiper,
.heroSwiper .swiper-wrapper,
.heroSwiper .swiper-slide{
    width:100%;
    height:100%;
}

.heroSwiper .swiper-slide{
    position:relative;
}

.heroSwiper img{
    width:100%;
    height:100%;
    object-fit:cover;
    transform:scale(1);
    transition:8s;
}

.swiper-slide-active img{
    transform:scale(1.08);
}

.hero-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,
    rgba(0,0,0,.78),
    rgba(0,0,0,.28));
    z-index:2;
}

.hero-content{
    position:absolute;
    left:8%;
    top:50%;
    transform:translateY(-50%);
    z-index:5;
    max-width:650px;
    color:#fff;
}

.hero-content h1{
    font-size:64px;
    font-weight:900;
    margin-bottom:20px;
    line-height:1.15;
}

.hero-content p{
    font-size:20px;
    line-height:2;
    margin-bottom:35px;
    opacity:.95;
}

.hero-btn{
    display:inline-block;
    padding:18px 42px;
    border-radius:12px;
    background:#d4af37;
    color:#111;
    text-decoration:none;
    font-weight:800;
    transition:.35s;
}

.hero-btn:hover{
    background:#fff;
    transform:translateY(-5px);
}

.swiper-button-next,
.swiper-button-prev{
    color:#fff;
}

.swiper-pagination-bullet{
    background:#fff;
    opacity:.6;
}

.swiper-pagination-bullet-active{
    opacity:1;
    background:#d4af37;
}

@media(max-width:992px){

.hero-slider{
    min-height:520px;
}

.hero-content h1{
    font-size:42px;
}

.hero-content p{
    font-size:17px;
}

}

@media(max-width:768px){

.hero-slider{
    min-height:420px;
}

.hero-content{
    left:30px;
    right:30px;
}

.hero-content h1{
    font-size:30px;
}

.hero-content p{
    display:none;
}

}

/* =========================================================
   EMA V4 Slate Compact — white / soft-gray / deep-slate theme
========================================================= */
:root{
    --ema-black:#2b3740;--ema-black-deep:#202a31;--ema-cream:#f2f4f6;--ema-white:#fff;
    --ema-gold:#607f91;--ema-gold-light:#8fa8b7;--ema-gold-soft:#e7eef2;
    --ema-gray:#7b8790;--ema-gray-light:#aeb7bd;--ema-border:#e1e6e9;--ema-border-dark:#cbd3d8;
}
body{background:#f2f4f6;color:#2b3740;font-size:14px}
.ema-navbar{background:rgba(43,55,64,.96);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 5px 20px rgba(25,34,40,.13)}
.ema-navbar-inner{min-height:64px;gap:14px}
.ema-logo{width:43px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.35);border-radius:9px;color:#fff!important;font-size:15px!important;letter-spacing:.08em;font-weight:900;text-decoration:none}
.ema-nav-link{color:rgba(255,255,255,.82)!important;font-size:.72rem!important;padding:8px 9px!important}
.ema-nav-link:hover{color:#fff!important;background:rgba(255,255,255,.08)!important;border-radius:8px}
.ema-search-input{height:36px!important;background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.12)!important;color:#fff!important;font-size:.7rem!important}
.ema-search-input::placeholder{color:rgba(255,255,255,.55)}
.ema-search-button,.ema-account-button,.ema-action{color:#fff!important}
.ema-account-button{font-size:.7rem!important}
.ema-action{width:34px!important;height:34px!important;border-radius:9px!important;background:rgba(255,255,255,.09)!important}
main{padding-top:64px}
.btn-dark,.btn-primary,.checkout-submit,.small-dark-btn{background:#304552!important;border-color:#304552!important}
.btn-dark:hover,.btn-primary:hover,.checkout-submit:hover,.small-dark-btn:hover{background:#4b6878!important;border-color:#4b6878!important}
.btn-outline-dark{border-color:#526a78!important;color:#304552!important}
.btn-outline-dark:hover{background:#304552!important;color:#fff!important}
@media(max-width:767.98px){.ema-navbar-inner{min-height:58px}.ema-nav-links{display:none}.ema-search{display:none}.ema-actions{gap:6px}.ema-mobile-toggle{color:#fff!important}.ema-logo{width:40px;height:32px;font-size:13px!important}main{padding-top:58px}.ema-navbar-inner{width:calc(100% - 20px)}}

/* EMA V5 — concrete slate + white luxury system */
:root{--ema-slate:#4b535a;--ema-slate-deep:#363d43;--ema-slate-soft:#eef1f3;--ema-white:#fff;--ema-bg:#f8f9fa;--ema-border:#e2e6e9;--ema-green:#1f8a57;--ema-green-soft:#e8f6ef;--ema-text:#2f3438;--ema-muted:#7a838a}
body{background:#fff;color:var(--ema-text)}
.ema-navbar{background:rgba(75,83,90,.97)!important;border-bottom:1px solid rgba(255,255,255,.08)!important;box-shadow:0 5px 22px rgba(34,40,44,.12)}
.ema-navbar-inner{min-height:64px;gap:12px}
.ema-logo{width:72px;height:34px;display:flex;align-items:center}.ema-logo img{width:72px;height:30px;display:block;object-fit:contain}
.ema-nav-link{color:#f4f6f7!important;font-size:.74rem}.ema-nav-link:hover{background:rgba(255,255,255,.12)!important;color:#fff!important}
.ema-search-input{background:#fff!important;border-color:rgba(255,255,255,.2)!important}.ema-search-button{background:var(--ema-slate-deep)!important}.ema-account-button{background:rgba(255,255,255,.1)!important;border-color:rgba(255,255,255,.18)!important;color:#fff!important}.ema-account-button:hover{background:#fff!important;color:var(--ema-slate-deep)!important}.ema-action{color:#fff!important}.ema-action:hover{background:rgba(255,255,255,.12)!important;color:#fff!important}
#emaMobileMenu{background:var(--ema-slate-deep)!important;border-top-color:rgba(255,255,255,.1)!important}.ema-mobile-toggle{display:none!important;background:rgba(255,255,255,.1)!important;border-color:rgba(255,255,255,.2)!important;color:#fff!important}
.ema-footer{background:var(--ema-slate-deep)!important}.page-kicker,.checkout-eyebrow,.section-eyebrow{color:var(--ema-slate)!important}.btn-dark,.btn-primary,.checkout-submit{background:var(--ema-slate)!important;border-color:var(--ema-slate)!important}.btn-dark:hover,.btn-primary:hover,.checkout-submit:hover{background:var(--ema-slate-deep)!important;border-color:var(--ema-slate-deep)!important}
@media(max-width:991.98px){.ema-nav-links,.ema-search{display:none!important}.ema-mobile-toggle{display:inline-flex!important;margin-inline-start:auto}.ema-navbar-inner{width:calc(100% - 22px);min-height:58px}.ema-logo{width:66px}.ema-logo img{width:66px;height:28px}}
@media(max-width:575.98px){.ema-navbar-inner{gap:7px}.ema-account-button{padding:0 9px;font-size:.66rem}.ema-action{width:36px;height:36px}}


/* EMA 2026 clean navigation + mobile polish */
.ema-mobile-search{display:none!important}
.ema-mobile-menu-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.ema-mobile-menu-grid .ema-nav-link{display:flex;align-items:center;justify-content:center;gap:7px;padding:11px 8px;border:1px solid rgba(255,255,255,.15);border-radius:12px}
.ema-mobile-search-form{display:flex;gap:8px;margin-top:10px}
.ema-mobile-search-form input{min-width:0;flex:1;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:11px 13px;background:rgba(255,255,255,.9);outline:none}
.ema-mobile-search-form button{width:44px;border:0;border-radius:12px;background:var(--ema-black);color:#fff}
@media(max-width:991.98px){.ema-mobile-search{display:grid!important}.ema-actions{margin-inline-start:auto}.ema-mobile-menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:575.98px){.ema-mobile-menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ema-account-button span{display:none}.ema-account-button{width:38px!important;justify-content:center;padding:0!important}.ema-actions{gap:4px}.ema-action{width:36px!important;height:36px!important}.ema-logo img{max-width:62px!important}}

/* =========================================================
   EMA FINAL POLISH — 2026
   Luxury store / clean Persian UI / mobile first
========================================================= */

/* Footer used by base.html */
.ema-footer{padding:56px 0 22px!important;background:linear-gradient(145deg,#20262b,#303b42)!important;color:rgba(255,255,255,.72)!important}
.ema-footer .footer-logo{margin:0 0 14px;color:#fff;font-size:1.25rem;font-weight:900;letter-spacing:.08em}
.ema-footer .footer-text{max-width:430px;margin:0;color:rgba(255,255,255,.64);font-size:.82rem;line-height:2.05}
.ema-footer h5{margin:0 0 15px;color:#fff;font-size:.84rem;font-weight:800}
.ema-footer .footer-links{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.ema-footer .footer-links li{margin:0;padding:0;line-height:1.6}
.ema-footer .footer-links a{color:rgba(255,255,255,.66);text-decoration:none;font-size:.78rem;white-space:normal}
.ema-footer .footer-links a:hover{color:#fff;transform:translateX(-3px)}
.ema-footer .footer-social{display:flex;gap:9px;flex-wrap:wrap}
.ema-footer .footer-social a{width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:12px;color:#fff;text-decoration:none;background:rgba(255,255,255,.06)}
.ema-footer .footer-social a:hover{background:rgba(255,255,255,.14);transform:translateY(-2px)}
.ema-footer hr{margin:34px 0 17px;border-color:rgba(255,255,255,.1);opacity:1}
.ema-footer .footer-copy{text-align:center;color:rgba(255,255,255,.42);font-size:.68rem;line-height:1.8}

/* Prevent content/footer from visually colliding on account pages */
.profile-page,.address-page{padding-bottom:90px!important}
.profile-page{background:linear-gradient(180deg,#f5f7f8 0%,#fff 100%)!important}
.address-page{background:linear-gradient(180deg,#f5f7f8 0%,#fff 100%)!important}
.profile-page .dashboard-card,.address-page .address-card{box-shadow:0 18px 55px rgba(35,45,52,.07)!important;border-color:#e4e8eb!important}
.profile-page .info-item,.profile-page .address-card{background:#f8fafb!important;border-color:#e5e9ec!important}
.profile-page .address-info{line-height:2.05!important;overflow-wrap:anywhere}
.profile-page .address-actions{padding-top:4px}
.profile-page .address-actions .btn{white-space:nowrap}
.address-page .form-control,.address-page select{border:1px solid #dfe5e8!important;background:#fbfcfd!important;color:#30373c!important;box-shadow:none!important}
.address-page .form-control:focus,.address-page select:focus{border-color:#708491!important;box-shadow:0 0 0 4px rgba(96,127,145,.1)!important}
.address-page .actions{border-top-color:#e6eaed!important}

@media(max-width:575.98px){
 .ema-footer{padding:42px 0 18px!important}
 .ema-footer .row>div{margin-bottom:4px}
 .ema-footer .footer-social{margin-top:4px}
 .profile-page,.address-page{padding-bottom:58px!important}
 .profile-page .dashboard-card{padding:20px 15px!important}
 .profile-page .address-card{padding:17px!important}
 .profile-page .address-header{align-items:flex-start}
 .profile-page .address-info{font-size:.8rem;line-height:2!important}
}

/* =========================================================
   EMA PRO MAX VISUAL PASS
   ========================================================= */
.shop-page{position:relative;background:radial-gradient(circle at 8% 8%,rgba(216,196,161,.25),transparent 24%),linear-gradient(180deg,#fbf8f2 0,#f4efe7 48%,#eee9df 100%)!important;padding-top:54px!important}
.shop-page:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 0 48%,rgba(255,255,255,.3) 50%,transparent 52%);opacity:.55}
.shop-shell{position:relative;z-index:1}
.shop-header{padding:34px;border:1px solid rgba(184,154,107,.18);border-radius:28px;background:rgba(255,255,255,.72);backdrop-filter:blur(14px);box-shadow:0 20px 55px rgba(36,35,31,.07);margin-bottom:26px!important}
.shop-title{letter-spacing:-.03em!important}
.shop-kicker{padding:7px 11px;border-radius:999px;background:#24231f;color:#e3cfad!important;letter-spacing:.13em!important}
.shop-description{color:#6e695f!important}
.shop-search-input{min-height:54px!important;border-radius:16px!important;border-color:#ded4c4!important;background:#fff!important;box-shadow:0 8px 22px rgba(36,35,31,.04)}
.product-card{border-radius:22px!important;border:1px solid rgba(184,154,107,.16)!important;box-shadow:0 14px 34px rgba(36,35,31,.055)!important;background:rgba(255,255,255,.94)!important}
.product-card:hover{transform:translateY(-8px)!important;box-shadow:0 25px 48px rgba(36,35,31,.12)!important}
.product-image{background:linear-gradient(145deg,#eee9df,#e1dbd0)!important}
.product-image img{transition:transform .55s cubic-bezier(.2,.8,.2,1)!important}
.product-card:hover .product-image img{transform:scale(1.065)!important}
.product-info{padding:18px 18px 20px!important}
.product-name{font-weight:800!important}
.product-price,.current-price{color:#8d6a3d!important;font-weight:900!important}

/* Account / address pages: stable mobile typography and spacing */
.auth-page,.address-page{overflow:hidden}
.auth-form .form-control,.address-page .form-control,.address-page .form-select{width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis}
.auth-form label,.address-page label{display:block;line-height:1.7;white-space:normal}
.auth-form .form-help{overflow-wrap:anywhere}
.address-page .form-control,.address-page select{min-height:52px!important;border-radius:14px!important}
.address-page textarea.form-control{min-height:120px!important;resize:vertical}

@media(max-width:767px){
  .shop-page{padding-top:28px!important}
  .shop-header{padding:22px 18px!important;border-radius:22px!important}
  .shop-title{font-size:2rem!important}
  .product-card{border-radius:18px!important}
  .product-info{padding:14px!important}
  .auth-content{overflow:hidden}
}

/* Stable account/address layout */
.profile-page,.address-page{position:relative;isolation:isolate}
.profile-page .container,.address-page .container{position:relative;z-index:1}
.profile-page .address-card{overflow:hidden}
.profile-page .address-info{line-height:2!important;overflow-wrap:anywhere;word-break:normal}
.profile-page .address-info>div{margin-bottom:5px}
.profile-page .address-actions{display:flex!important;gap:8px!important;flex-wrap:wrap!important;align-items:center!important}
.profile-page .address-actions form{margin:0!important}
.ema-footer{position:relative;z-index:2;clear:both;overflow:hidden}
.ema-footer .row{align-items:flex-start}
.ema-footer .footer-links{margin-bottom:0!important}
@media(max-width:575px){.profile-page .address-actions .btn{flex:1 1 auto}.ema-footer{padding-top:42px!important}.ema-footer .row{row-gap:28px!important}.ema-footer .footer-copy{padding-top:4px}}
