/**
 * Темы оформления Quadrosvet (themes.css).
 *
 * По умолчанию на сайте активна theme-best (класс на body в header.php).
 * ?theme=classic  — прежний стиль (чёрный + золото), themes.css не подключается
 * ?theme=best     — явно best (то же, что без параметра)
 * ?theme=slate    — и другие альтернативы для сравнения
 */

/* === Токены тем === */

body.theme-best {
    /* ivory-оболочка + champagne-акценты slate — для mass premium lighting */
    --qs-color-gold: #c0a070;
    --qs-color-gold-light: #d9bc8a;
    --qs-color-bg-soft: #faf9f7;
    --qs-color-nav-bg: #5a5650;
    --qs-color-nav-hover: #6b665e;
    --qs-color-footer-top: #5a5650;
    --qs-color-footer-mid: #4d4843;
    --qs-color-footer-bottom: #403c37;
    --qs-color-footer-divider: #6b665e;
    --qs-color-submenu-hover: #6b665e;
    --qs-color-accent-hover: #a88858;
    --qs-color-accent-hover-border: #917648;
    --qs-color-cookie-banner: rgba(90, 86, 80, 0.96);
    --qs-color-mobile-bar-from: #6b665e;
    --qs-color-mobile-bar-to: #5a5650;
}

body.theme-warm-light {
    --qs-color-gold: #b8956a;
    --qs-color-gold-light: #d4b483;
    --qs-color-bg-soft: #faf8f5;
    --qs-color-nav-bg: #4a4540;
    --qs-color-nav-hover: #5c5348;
    --qs-color-footer-top: #4a4540;
    --qs-color-footer-mid: #3d3834;
    --qs-color-footer-bottom: #2e2a27;
    --qs-color-footer-divider: #5a5248;
    --qs-color-submenu-hover: #5c5348;
    --qs-color-accent-hover: #a07848;
    --qs-color-accent-hover-border: #8a6840;
    --qs-color-cookie-banner: rgba(74, 69, 64, 0.96);
    --qs-color-mobile-bar-from: #5c5348;
    --qs-color-mobile-bar-to: #4a4540;
}

body.theme-slate {
    --qs-color-gold: #c4a574;
    --qs-color-gold-light: #d9bc8a;
    --qs-color-bg-soft: #f4f6f8;
    --qs-color-nav-bg: #3d4a5c;
    --qs-color-nav-hover: #4a5a70;
    --qs-color-footer-top: #3d4a5c;
    --qs-color-footer-mid: #344052;
    --qs-color-footer-bottom: #2a3441;
    --qs-color-footer-divider: #4d5d72;
    --qs-color-submenu-hover: #4a5a70;
    --qs-color-accent-hover: #a88850;
    --qs-color-accent-hover-border: #907040;
    --qs-color-cookie-banner: rgba(61, 74, 92, 0.96);
    --qs-color-mobile-bar-from: #455a6b;
    --qs-color-mobile-bar-to: #3d4a5c;
}

body.theme-ivory {
    --qs-color-gold: #c9a96e;
    --qs-color-gold-light: #d4b896;
    --qs-color-bg-soft: #faf8f5;
    --qs-color-nav-bg: #6b6358;
    --qs-color-nav-hover: #7d7568;
    --qs-color-footer-top: #6b6358;
    --qs-color-footer-mid: #5a5349;
    --qs-color-footer-bottom: #4a443c;
    --qs-color-footer-divider: #7a7268;
    --qs-color-submenu-hover: #7d7568;
    --qs-color-accent-hover: #b08a55;
    --qs-color-accent-hover-border: #967648;
    --qs-color-cookie-banner: rgba(107, 99, 88, 0.96);
    --qs-color-mobile-bar-from: #faf6f0;
    --qs-color-mobile-bar-to: #f5f0e8;
    --qs-color-mobile-action-text: #5a5349;
}

body.theme-midnight {
    --qs-color-gold: #e8a838;
    --qs-color-gold-light: #f0b84d;
    --qs-color-bg-soft: #f0f2f5;
    --qs-color-nav-bg: #1e2a3a;
    --qs-color-nav-hover: #2a3a50;
    --qs-color-footer-top: #1e2a3a;
    --qs-color-footer-mid: #172230;
    --qs-color-footer-bottom: #0f1820;
    --qs-color-footer-divider: #2d3f52;
    --qs-color-submenu-hover: #2a3a50;
    --qs-color-accent-hover: #d49220;
    --qs-color-accent-hover-border: #b87a18;
    --qs-color-cookie-banner: rgba(30, 42, 58, 0.96);
    --qs-color-mobile-bar-from: #243447;
    --qs-color-mobile-bar-to: #1e2a3a;
}

body.theme-stone {
    --qs-color-gold: #a08050;
    --qs-color-gold-light: #b89968;
    --qs-color-bg-soft: #f5f5f5;
    --qs-color-nav-bg: #5c5c5c;
    --qs-color-nav-hover: #6a6a6a;
    --qs-color-footer-top: #5c5c5c;
    --qs-color-footer-mid: #4d4d4d;
    --qs-color-footer-bottom: #3a3a3a;
    --qs-color-footer-divider: #6a6a6a;
    --qs-color-submenu-hover: #6a6a6a;
    --qs-color-accent-hover: #887040;
    --qs-color-accent-hover-border: #705830;
    --qs-color-cookie-banner: rgba(92, 92, 92, 0.96);
    --qs-color-mobile-bar-from: #666666;
    --qs-color-mobile-bar-to: #555555;
}

/* === Общие переопределения оболочки === */

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .mainmenu-area {
    background: var(--qs-color-nav-bg);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .mainmenu
    ul
    li
    ul
    li {
    background: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .mainmenu
    ul
    li
    ul
    li:hover {
    background: var(--qs-color-submenu-hover);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .mainmenu
    ul
    li
    ul
    li
    a:hover,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .mainmenu
    ul
    li
    ul
    li.item-selected {
    background: var(--qs-color-nav-hover);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .sidebar-menu-title
    h2 {
    background: var(--qs-color-nav-bg);
    border-bottom-color: var(--qs-color-gold);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .sidebar-menu
    ul
    li:hover
    a {
    background: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .top-menu
    ul
    li:hover {
    background: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .gold-txt,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .gold-hover:hover {
    color: var(--qs-color-gold);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    input[type='text']:focus,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    textarea:focus {
    outline-color: var(--qs-color-gold);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .bot-social
    p
    a:hover {
    color: var(--qs-color-gold);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .acion-button_gold,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .shoping-cart
    a
    span,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .search-box
    button,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .pos_description
    .pos-slideshow-readmore
    a,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .featured-button
    a.add-to-cart {
    background-color: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .acion-button_gold,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .shoping-cart
    a
    span,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .search-box
    button,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .pos_description
    .pos-slideshow-readmore
    a,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .featured-button
    a.add-to-cart,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .add-to-cart-product {
    border-bottom-color: var(--qs-color-gold);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .search-box
    button:hover,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .acion-button_grey:hover,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .cart-checkout
    a:hover {
    background: var(--qs-color-gold-light);
    border-color: var(--qs-color-gold);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .acion-button_gold:hover,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .pos_description
    .pos-slideshow-readmore
    a:hover {
    background: var(--qs-color-accent-hover);
    border-color: var(--qs-color-accent-hover-border);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .add-to-cart-product {
    border-top-color: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .cart-product-info
    a:hover,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .cart-product-info
    p
    a:hover {
    color: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .cart-checkout
    a {
    background: var(--qs-color-nav-bg);
    border-color: var(--qs-color-nav-bg);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    #scrollUp:hover {
    background-color: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .mean-container
    .mean-bar,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .mean-container
    .mean-nav {
    background: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .slider-area
    .nivo-directionNav
    a:hover {
    background-color: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-top {
    background: var(--qs-color-footer-top);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-top
    .col-sm-3::after {
    background: var(--qs-color-footer-divider);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-medil {
    background: var(--qs-color-footer-mid);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-copyright {
    background: var(--qs-color-footer-bottom);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .cookie-consent-banner {
    background: var(--qs-color-cookie-banner);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .cookie-consent-banner__text
    a {
    color: var(--qs-color-gold-light);
}

/* Вторичный текст футера — на тёмном фоне #555454 из template_styles нечитаем */
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-search-area
    small,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-search-area
    small
    a {
    color: rgba(255, 255, 255, 0.8);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-search-area
    small
    a:hover {
    color: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-copyright,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-copyright
    .h4,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-card
    .h4,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .copyright-text,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .copyright-text
    p,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .copyright-text
    p
    a,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .copyright-text
    small,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .copyright-text
    small
    a {
    color: rgba(255, 255, 255, 0.85);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .copyright-text
    p
    a:hover,
body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .copyright-text
    small
    a:hover {
    color: var(--qs-color-gold-light);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-search-area
    form
    .submitNew {
    background: var(--qs-color-gold-light);
    border-bottom-color: var(--qs-color-gold);
}

body:is(
        .theme-best,
        .theme-warm-light,
        .theme-slate,
        .theme-ivory,
        .theme-midnight,
        .theme-stone
    )
    .footer-search-area
    form
    .submitNew:hover {
    background: var(--qs-color-nav-hover);
    border-bottom-color: var(--qs-color-gold);
}

/* === Мобайл === */

@media (max-width: 991px) {
    body:is(.theme-best, .theme-warm-light, .theme-slate, .theme-midnight, .theme-stone)
        .mobile-action-bar {
        background: linear-gradient(
            180deg,
            var(--qs-color-mobile-bar-from, var(--qs-color-nav-hover)) 0%,
            var(--qs-color-mobile-bar-to, var(--qs-color-nav-bg)) 100%
        );
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    }

    body:is(.theme-ivory) .mobile-action-bar {
        background: linear-gradient(
            180deg,
            var(--qs-color-mobile-bar-from) 0%,
            var(--qs-color-mobile-bar-to) 100%
        );
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }

    body:is(.theme-ivory) .logo.logo--mobile .logo-full-img {
        filter: none;
    }

    body:is(.theme-ivory) .mobile-action-bar__menu,
    body:is(.theme-ivory) .mobile-action-bar__city,
    body:is(.theme-ivory) .mobile-action-bar__phone,
    body:is(.theme-ivory) .shoping-cart .cart-trigger {
        background: #fff;
        color: var(--qs-color-mobile-action-text, #5a5349);
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
    }

    body:is(
            .theme-best,
            .theme-warm-light,
            .theme-slate,
            .theme-ivory,
            .theme-midnight,
            .theme-stone
        )
        .header-sticky-bar
        .logo-and-search-area {
        background: var(--qs-color-bg-soft);
    }

    body:is(
            .theme-best,
            .theme-warm-light,
            .theme-slate,
            .theme-ivory,
            .theme-midnight,
            .theme-stone
        )
        .shoping-cart
        .cart-trigger__badge {
        background: var(--qs-color-gold);
        color: #fff;
        border-color: rgba(255, 255, 255, 0.25);
    }
}