/* ============================================================
   ЦЕНТР ПРАВОСУДИЯ — CP-TWO / ТЕМА SOFT-DARK (тема по умолчанию)
   Акцент: приглушённое шампанское золото #ceb68f
   ------------------------------------------------------------
   Правила палитры:
   — золото как цвет текста/ссылок живёт ТОЛЬКО на тёмном фоне;
   — текст на золотом фоне — всегда тёмный ink #101a28 (8.8:1);
   — голубые остатки (#8fb7ff / #9fcbff / #cfe0ff / #dbe7ff /
     #a9c8ff) полностью удалены, свечения и ховеры — золотые.
   ============================================================ */

:root,
[data-theme="soft-dark"],
html[data-theme="soft-dark"] {
    /* Базовые темные тона фона */
    --color-dark: #223059;
    --color-dark-2: #283761;
    --color-dark-3: #31426f;
    --color-dark-5: rgba(34, 48, 89, 0.05);
    --color-dark-8: rgba(34, 48, 89, 0.08);
    --color-dark-10: rgba(34, 48, 89, 0.10);
    --color-dark-14: rgba(34, 48, 89, 0.14);
    --color-dark-20: rgba(34, 48, 89, 0.20);

    /* Серые оттенки для текстов и вспомогательных элементов */
    --color-grey: #9ba8c3;
    --color-grey-light: #bcc6da;
    --color-grey-faint: #7888aa;

    /* АКЦЕНТ: приглушенное шампанское / золото (RGB: 206, 182, 143) */
    --color-accent: #ceb68f;
    --color-accent-hover: #e2cca6;
    --color-accent-5: rgba(206, 182, 143, 0.05);
    --color-accent-10: rgba(206, 182, 143, 0.10);
    --color-accent-16: rgba(206, 182, 143, 0.16);
    --color-accent-22: rgba(206, 182, 143, 0.22);

    /* Светлые базовые */
    --color-light: #eef3fb;
    --color-light-2: #e4ebf7;
    --color-light-3: #d8e2f2;
    --color-white: #f8fbff;

    /* Семантические цвета */
    --color-success: #76a06a;
    --color-warning: #c3904f;
    --color-error: #c16863;

    /* Поверхности */
    --color-bg: #1b2747;
    --color-surface: #223059;
    --color-surface-soft: #283761;
    --color-surface-strong: #31426f;
    --color-surface-contrast: #26345d;

    /* Текст.
       faint поднят с #8897b3 (4.36:1 на surface) до #9aa9c4:
       6.2:1 на bg, 5.4:1 на surface — AA для мелкого текста. */
    --color-text: #f4f7fd;
    --color-text-muted: #b2bdd2;
    --color-text-faint: #9aa9c4;
    --color-text-inverse: #121a30;

    /* Основные кнопки и экшены (привязаны к акценту) */
    --color-primary: #ceb68f;
    --color-primary-hover: #e2cca6;
    --color-primary-soft: rgba(206, 182, 143, 0.16);
    --color-primary-soft-2: rgba(206, 182, 143, 0.22);

    /* Семантический слой кнопок:
       на золоте текст всегда тёмный (контраст 8.8:1 / 11:1) */
    --btn-primary-bg: #ceb68f;
    --btn-primary-bg-hover: #e2cca6;
    --btn-primary-text: #101a28;

    /* Бордеры и тени */
    --color-border: rgba(255, 255, 255, 0.09);
    --color-border-strong: rgba(255, 255, 255, 0.16);
    --color-divider: rgba(255, 255, 255, 0.07);
    --shadow-xs: 0 2px 10px rgba(8, 12, 24, 0.20);
    --shadow-sm: 0 6px 18px rgba(8, 12, 24, 0.28);
    --shadow-md: 0 16px 36px rgba(8, 12, 24, 0.34);
    --shadow-lg: 0 24px 56px rgba(8, 12, 24, 0.42);
    --shadow-xl: 0 40px 92px rgba(8, 12, 24, 0.52);

    /* Hero секция (hero тёмный в обеих темах) */
    --hero-bg: #223059;
    --hero-text: #ffffff;
    --hero-muted: rgba(255, 255, 255, 0.72);
    --hero-faint: rgba(255, 255, 255, 0.36);
    --hero-desc: rgba(255, 255, 255, 0.84);
    --hero-link-hover: #e2cca6;
    --hero-badge-bg: rgba(206, 182, 143, 0.08);
    --hero-badge-border: rgba(206, 182, 143, 0.15);
    --hero-badge-text: #ceb68f;
    --hero-ghost-bg: rgba(255, 255, 255, 0.05);
    --hero-ghost-border: rgba(255, 255, 255, 0.16);
    --hero-ghost-hover: rgba(255, 255, 255, 0.12);

    /* Оверлеи */
    --hero-overlay-strong: rgba(19, 28, 52, 0.96);
    --hero-overlay-mid: rgba(19, 28, 52, 0.90);
    --hero-overlay-soft: rgba(19, 28, 52, 0.74);
    --hero-overlay-fade: rgba(19, 28, 52, 0.24);
    --hero-overlay-bottom: rgba(19, 28, 52, 0.78);
    --hero-overlay-tablet: rgba(19, 28, 52, 0.74);

    /* Свечение и градиенты под золото */
    --hero-glow-1: rgba(206, 182, 143, 0.12);
    --hero-glow-2: rgba(206, 182, 143, 0.06);
    --hero-mobile-overlay-top: rgba(19, 28, 52, 0.34);
    --hero-mobile-overlay-bottom: rgba(19, 28, 52, 0.84);

    /* Hero: scroll-hint и note-плашка */
    --hero-scroll-color: rgba(255, 255, 255, 0.5);
    --hero-scroll-line: rgba(255, 255, 255, 0.5);
    --hero-note-bg: rgba(255, 255, 255, 0.06);
    --hero-note-border: rgba(255, 255, 255, 0.1);

    /* Scroll-top (единственное определение, золотая схема).
       Текст #ceb68f на подложке surface: 6.5:1. */
    --scroll-top-bg: color-mix(in srgb, var(--color-surface) 82%, rgba(0, 0, 0, 0.16));
    --scroll-top-bg-hover: #ceb68f;
    --scroll-top-text: #ceb68f;
    --scroll-top-text-hover: #101a28;
    --scroll-top-border: color-mix(in srgb, #ceb68f 26%, var(--color-border));
    --scroll-top-shadow: 0 12px 30px rgba(0, 0, 0, 0.34);

    /* Весы Фемиды — тёплое золотое свечение чаши */
    --scale-glow: rgba(206, 182, 143, 0.44);

    /* Градиент фона с мягким золотым бликом в углу */
    --gradient-bg: radial-gradient(circle at top right, rgba(206, 182, 143, 0.08), transparent 34%),
    linear-gradient(180deg, #283761 0%, #1b2747 100%);
}
/* ============================================================
   HEADER / GLASS
   ============================================================ */
[data-theme="soft-dark"] .glass-header,
html[data-theme="soft-dark"] .glass-header {
    background: color-mix(in srgb, var(--color-bg) 64%, transparent) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--color-border) 44%, transparent) !important;
}
[data-theme="soft-dark"] .glass-header.is-scrolled,
html[data-theme="soft-dark"] .glass-header.is-scrolled {
    background: color-mix(in srgb, var(--color-bg) 78%, transparent) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--color-border) 58%, transparent) !important;
    box-shadow: 0 12px 32px rgba(4, 10, 18, 0.26) !important;
}
/* ============================================================
   ЛОГОТИП
   ============================================================ */
[data-theme="soft-dark"] .aq-dynamic-logo,
html[data-theme="soft-dark"] .aq-dynamic-logo {
    filter: none !important;
    color: var(--color-accent) !important;
    transition: color var(--cp-transition), opacity var(--cp-transition), filter var(--cp-transition) !important;
    transform: none !important;
}
[data-theme="soft-dark"] .aq-dynamic-logo:hover,
html[data-theme="soft-dark"] .aq-dynamic-logo:hover {
    color: var(--color-accent-hover) !important;
    filter: none !important;
    transform: none !important;
}
[data-theme="soft-dark"] .brand-logo-mark,
html[data-theme="soft-dark"] .brand-logo-mark {
    color: var(--color-accent) !important;
    fill: currentColor;
    filter: none !important;
}
[data-theme="soft-dark"] .brand-logo-title,
html[data-theme="soft-dark"] .brand-logo-title {
    color: #f4f7fd !important;
}
[data-theme="soft-dark"] .brand-logo-subtitle,
html[data-theme="soft-dark"] .brand-logo-subtitle {
    color: #b2bdd2 !important;
}
[data-theme="soft-dark"] .logo-link:hover .brand-logo-mark,
html[data-theme="soft-dark"] .logo-link:hover .brand-logo-mark {
    color: var(--color-accent-hover) !important;
}
[data-theme="soft-dark"] .logo-link:hover .brand-logo-title,
html[data-theme="soft-dark"] .logo-link:hover .brand-logo-title {
    color: #ffffff !important;
}
[data-theme="soft-dark"] .logo-link:hover .brand-logo-subtitle,
html[data-theme="soft-dark"] .logo-link:hover .brand-logo-subtitle {
    color: #c8d2e6 !important;
}
/* ============================================================
   КНОПКА «КОНСУЛЬТАЦИЯ» В ХЕДЕРЕ
   Золотой градиент + тёмный ink-текст (было: голубой градиент)
   ============================================================ */
[data-theme="soft-dark"] .header-consultation-btn,
html[data-theme="soft-dark"] .header-consultation-btn {
    background: linear-gradient(180deg, #e2cca6 0%, #c9ad83 100%) !important;
    color: #101a28 !important;
    border-color: rgba(206, 182, 143, 0.22) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.26),
        0 14px 30px rgba(8, 12, 24, 0.30) !important;
}
[data-theme="soft-dark"] .header-consultation-btn:hover,
html[data-theme="soft-dark"] .header-consultation-btn:hover {
    background: linear-gradient(180deg, #f0dcb8 0%, #d7bd93 100%) !important;
    color: #101a28 !important;
}
/* ============================================================
   МОБИЛЬНОЕ МЕНЮ
   ============================================================ */
[data-theme="soft-dark"] #mobile-menu,
html[data-theme="soft-dark"] #mobile-menu {
    background: rgba(15, 27, 43, 0.97) !important;
}
/* Активные пункты навигации / иконки-кнопки:
   золотая заливка + тёмный текст, золотое свечение (было голубое) */
[data-theme="soft-dark"] .mobile-nav-link.is-active,
html[data-theme="soft-dark"] .mobile-nav-link.is-active,
[data-theme="soft-dark"] .aqara-icon-btn.is-active,
html[data-theme="soft-dark"] .aqara-icon-btn.is-active {
    background-color: var(--color-primary) !important;
    color: #101a28 !important;
    border-color: var(--color-primary) !important;
    box-shadow: 0 8px 20px rgba(206, 182, 143, 0.25) !important;
}
/* ============================================================
   SCROLL-TOP — через токены (единственное определение)
   ============================================================ */
[data-theme="soft-dark"] .scroll-top,
[data-theme="soft-dark"] .scrollToTop,
[data-theme="soft-dark"] .aq-scroll-top,
html[data-theme="soft-dark"] .scroll-top,
html[data-theme="soft-dark"] .scrollToTop,
html[data-theme="soft-dark"] .aq-scroll-top {
    background: var(--scroll-top-bg) !important;
    color: var(--scroll-top-text) !important;
    border: 1px solid var(--scroll-top-border) !important;
    box-shadow: var(--scroll-top-shadow) !important;
    backdrop-filter: blur(14px) saturate(145%);
    -webkit-backdrop-filter: blur(14px) saturate(145%);
}
[data-theme="soft-dark"] .scroll-top:hover,
[data-theme="soft-dark"] .scrollToTop:hover,
[data-theme="soft-dark"] .aq-scroll-top:hover,
html[data-theme="soft-dark"] .scroll-top:hover,
html[data-theme="soft-dark"] .scrollToTop:hover,
html[data-theme="soft-dark"] .aq-scroll-top:hover {
    background: var(--scroll-top-bg-hover) !important;
    color: var(--scroll-top-text-hover) !important;
    border-color: var(--scroll-top-bg-hover) !important;
}
/* ============================================================
   ФОРМЫ И КАРТОЧКИ
   ============================================================ */
[data-theme="soft-dark"] .ms2_form,
[data-theme="soft-dark"] .ms2_products .product-wrapper,
html[data-theme="soft-dark"] .ms2_form,
html[data-theme="soft-dark"] .ms2_products .product-wrapper {
    background-color: var(--color-surface-soft) !important;
    border: 1px solid var(--color-border) !important;
    box-shadow: none !important;
}
/* ============================================================
   ИЗОБРАЖЕНИЯ
   ============================================================ */
[data-theme="soft-dark"] .aq-img-container img,
[data-theme="soft-dark"] .pg-gallery__slide img,
[data-theme="soft-dark"] .pg-thumb img,
html[data-theme="soft-dark"] .aq-img-container img,
html[data-theme="soft-dark"] .pg-gallery__slide img,
html[data-theme="soft-dark"] .pg-thumb img {
    mix-blend-mode: plus-lighter;
}
