/* Переменные темы «multi-4-blue». Все цвета собраны здесь: правка значения меняет цвет по всему сайту. Файл дополняет палитру шаблона — переменные, которых тема не касается, остаются как были. Почему !important на переменных: CMS печатает свою палитру ИНЛАЙНОМ в , то есть ПОСЛЕ этого файла. Оба объявления обычные — выигрывал инлайн, и тема не применялась (замер: --primary-color отдавал синий #0B57FF вместо красного). Инлайн-палитра идёт без !important, поэтому пометка снимает вопрос порядка. */ :root { /* --- палитра шаблона --- */ /* bg main color — значение задаёт тема */ --bg-main-color: #f4f4f9 !important; /* bg header top — значение задаёт тема */ --bg-header-top: #F5F5FB !important; /* main text color — значение задаёт тема */ --main-text-color: #191a1e !important; /* Текст на нашей тёмной панели (приз в розыгрыше). Отдельная переменная нужна потому, что --btn-primary-color на тёмных темах чёрный: он про текст НА СВЕТЛОМ АКЦЕНТЕ, а не на тёмной плите. */ --text-on-dark-panel: #FFFFFF !important; /* primary color — значение задаёт тема */ --primary-color: #5A54F0 !important; /* bg card — значение задаёт тема */ --bg-card: linear-gradient(135deg, #FFFFFF 16.83%, #EDECF4 100%) !important; /* btn outline color — значение задаёт тема */ --btn-outline-color: #5A54F0 !important; /* btn outline hover color — значение шаблона, тема не меняет */ --btn-outline-hover-color: #fff !important; /* btn outline bg — значение шаблона, тема не меняет */ --btn-outline-bg: #ffffff00 !important; /* btn primary color — значение задаёт тема */ --btn-primary-color: #FFFFFF !important; /* btn primary bg hover — значение шаблона, тема не меняет */ --btn-primary-bg-hover: #fff !important; /* secondary text color — значение шаблона, тема не меняет */ --secondary-text-color: #292c31 !important; /* bg car card — значение шаблона, тема не меняет */ --bg-car-card: #fff !important; /* bg input — значение шаблона, тема не меняет */ --bg-input: #fff !important; /* bg form wrapper — значение задаёт тема */ --bg-form-wrapper: #EFEFF4 !important; /* mark color — значение задаёт тема */ --mark-color: #6A6A6A !important; /* mark color count — значение задаёт тема */ --mark-color-count: #6A6A6A !important; /* breadscrumb last text color — значение задаёт тема */ --breadscrumb-last-text-color: #E4E4E4 !important; /* --- цвета темы --- */ /* background для .hero-carousel__content */ --hero-carousel-content-bg: #1f1d3d !important; /* background для .hero-carousel__content */ --hero-carousel-content-bg-2: #06060f !important; /* Фон страницы */ --theme-bg: #ffffff !important; /* Акцент темы. Кнопки, активные состояния, акцентные цифры */ --accent: #5a54f0 !important; /* акцент как ТЕКСТ на светлых плитах — затемнён до читаемости */ --stock-date-share-text: #4E48E2 !important; /* текст на светлой плите формы — выбран по контрасту к ней */ --text-on-form: #141414 !important; /* текст поверх акцентной заливки — выбран по контрасту, не по привычке */ --text-on-accent: #FFFFFF !important; /* Для крупного текста и значков НА акценте (норма 3.0). Белый ставим только там, где он её набирает: контраст белого к #5A54F0 здесь 5.30. */ --text-on-accent-large: #FFFFFF !important; /* акцент для наведения — темнее основного; подобран так, чтобы текст на кнопке оставался читаемым (>=4.5) и оттенок отличался заметно (>=1.18x) */ --accent-hover: #4E48E2 !important; /* background для .deal-timer__count */ --deal-timer-count-bg: rgba(15,15,18,.55) !important; /* text-shadow для .deal-timer__text */ --deal-timer-text-text-shadow: rgba(0,0,0,.7) !important; /* box-shadow для .header */ --header-shadow: rgba(20,20,25,0.12) !important; /* border-bottom для .header__top */ --header-top-border-bottom: #cfcedb !important; /* color для .popup-preset .main-form-checkbox__text */ --popup-preset-main-form-checkbox-text-text: rgba(255,255,255,.9) !important; /* background для .popup__close */ --popup-close-bg: rgba(18,18,20,.62) !important; /* box-shadow для .popup__close */ --popup-close-shadow: rgba(0,0,0,.4) !important; /* box-shadow для .modal-megasave .modal__form .btn */ --modal-megasave-modal-form-btn-shadow: rgba(0,0,0,.5) !important; /* background для .service-card__content */ --service-card-content-bg: rgba(0,0,0,.80) !important; /* background для .service-card__content */ --service-card-content-bg-2: rgba(0,0,0,.42) !important; /* background для .service-card__content */ --service-card-content-bg-3: rgba(0,0,0,0) !important; /* color для .service-card__content .btn */ --service-card-content-btn-text: #938ff5 !important; /* color для .modal-megasave .modal__form .main-form-checkbox__text a */ --modal-megasave-modal-form-main-form-checkbox-t-text: #5650e4 !important; /* border для .credit-calc__form .app-input */ --credit-calc-form-app-input-border: rgba(25, 26, 30, .18) !important; /* color для .car-card__price-old */ --car-card-price-old-text: #6A6A6A !important; /* background для .faq__button:hover */ --faq-button-hover-bg: #f4f4f4 !important; /* background для .modal .modal__offer__badge */ --modal-modal-offer-badge-bg: #292838 !important; /* color для .modal .modal__offer__badge */ --modal-modal-offer-badge-text: #eef0f3 !important; /* background для .btn_primary:hover — ЗАТЕМНЁННЫЙ акцент. Был осветлённый, и белые буквы на нём проваливали норму: замер живым ховером дал 3.77…4.13 при 4.5. Затемнение на 16% от базовой заливки: ховер заметен и держит 6.4…6.9. */ --btn_primary-hover-bg: #4c47ca !important; /* Текст на основной кнопке; подобран под заливку по контрасту */ --btn-text: #141414 !important; /* Тёмный нейтральный: текст и заливки на СВЕТЛОЙ поверхности (панель формы в модалке, «таблетка» таймера). Тёмным темам нужен тот же цвет: светлые плиты у них те же, а без переменной правила с var(--ink) молча не применялись. */ --ink: #141414 !important; /* --- связки переменных шаблона --- */ /* btn outline border color — задаёт тема */ --btn-outline-border-color: #5A54F0 !important; }