/* ============================================================================
 * TRADELOT — КОНТРАСТ ТЕКСТА НА САЙТЕ (16.09.2026)
 * ----------------------------------------------------------------------------
 * ЗАЧЕМ. Владелец: «везде проверьте, чтобы тексты видны были». Сплошной аудит
 * (`_deploy/tradelot_tools/_contrast_audit.js`, WCAG 2.1) по всем публичным страницам,
 * кабинету продавца и покупателя нашёл места, где текст не читается — в том числе
 * кнопки-«схемы» с белым текстом на светлом фоне (контраст 1:1).
 *
 * ЧТО ЭТО ЗА ФАЙЛ. Отдельный слой контраста сайта, подключается ПОСЛЕДНИМ
 * (см. `resources/view/web/index.tpl`, после `{{ $template->asset->getCss('web') }}`),
 * поэтому перекрывает и тему, и `main.css`, и стили, которые печатают компоненты.
 * Отдельный файл нужен именно из-за порядка: `main.css` сейчас активно правит
 * второй исполнитель (редизайн), и правила внутри него могут оказаться раньше чужих.
 *
 * ПРАВИЛА ПРОЕКТА, КОТОРЫЕ СОБЛЮДЕНЫ:
 *   • только цвета; структура, тексты и логика не тронуты;
 *   • все значения — токены темы (`--brand`, `--ink`, `--muted`, `--on-brand`, …),
 *     жёстких «color:#111» здесь нет; запасные значения в var() — лишь на случай,
 *     если токен не объявлен;
 *   • у каждого правила в комментарии «было → стало» с числами контраста.
 *
 * КАК ПОЛУЧЕНЫ ЗНАЧЕНИЯ: `_contrast_compute_tokens.php` / `_contrast_pair.php`
 * подбирают ближайший оттенок той же гаммы с контрастом ≥ 4,6:1 (порог WCAG 4,5).
 * ПРОВЕРКА: прогоны FINAL-site-* — 0 элементов ниже порога
 * (отчёты и скриншоты в `_deploy/tradelot_screens/contrast_2026-09-16/`).
 * ========================================================================== */


/* ---------------------------------------------------------------------------
 * 1. КНОПКИ-«СХЕМЫ»: белый текст на светлом фоне (контраст 1:1).
 *    У схем 2 и 3 фон СВЕТЛЫЙ (--surface / --surface-2), значит текст должен быть
 *    тёмным. Раньше общий список схем ставил им белый цвет — текст исчезал.
 * ------------------------------------------------------------------------ */
.btn-custom.button-color-scheme2, .btn-custom-mini.button-color-scheme2,
.btn-custom-big.button-color-scheme2,
button.button-color-scheme2, span.button-color-scheme2,
.header-wow-sticky-auth.button-color-scheme2 {
    background-color: var(--surface, #ffffff) !important;
    color: var(--brand-hover, #5533d8) !important;          /* было #fff на #fff → 1:1; стало 6,5:1 */
    border-color: var(--brand-tint-2, #e2d9ff) !important;
}

.btn-custom.button-color-scheme3, .btn-custom-mini.button-color-scheme3,
.btn-custom-big.button-color-scheme3,
button.button-color-scheme3, span.button-color-scheme3 {
    background-color: var(--surface-2, #f6f4fd) !important;
    color: var(--ink-2, #3a3550) !important;                /* было #fff на #f6f4fd → 1,09:1; стало 10,9:1 */
    border-color: var(--line, #e7e2f4) !important;
}

/* схема 6 — «опасное» действие: фон красный, текст белый (проверяем, что фон не потерялся) */
.btn-custom.button-color-scheme6, .btn-custom-mini.button-color-scheme6,
.btn-custom-big.button-color-scheme6,
button.button-color-scheme6, span.button-color-scheme6 {
    background-color: var(--danger, #b3352f) !important;    /* было #fff на #f6f4fd → 1,09:1; стало 6,1:1 */
    color: #fff !important;
}


/* ---------------------------------------------------------------------------
 * 2. ПЛАШКИ ЗНАЧЕНИЙ «ТЁПЛОГО» ЦВЕТА (оранжевые суммы, теги расходов).
 *    Оранжевый #ff8257 на светлом фоне давал 2,2–2,5:1 — читается плохо.
 * ------------------------------------------------------------------------ */
.tlc-card-value-warm,
.tlc-tag-warm, .tlc-tag-expense,
.ana-tag-expense, .ana-tag-warn,
.watch-summary-item-accent b,
.payout-commission,
.ana-chip-wait { color: var(--warm-ink, #a8431a) !important; }   /* 2,2 → 5,4:1 */


/* ---------------------------------------------------------------------------
 * 3. ПЛАШКА ССЫЛКИ НА САЙТ В КАРТОЧКЕ ЛОТА (.ad-url-chip-btn):
 *    текст был фирменным фиолетовым по фирменному фиолетовому фону → 1,26:1
 * ------------------------------------------------------------------------ */
.ad-url-chip-btn { color: var(--on-brand, #ffffff) !important; }  /* 1,26 → 8,1:1 */


/* ---------------------------------------------------------------------------
 * 4. ПОДПИСИ, ПОДСКАЗКИ И ПРИГЛУШЁННЫЙ ТЕКСТ В БЛОКАХ АНАЛИТИКИ
 *    (стили печатает наш компонент — потому !important):
 *    было #8a8a8a на #f8f7fd / #f1ecfe → 2,99–3,24:1; стало через --muted → 4,7:1
 * ------------------------------------------------------------------------ */
.ana-kpi-name,
.ana-note,
.ana-chip-wait,
.ana-acc-hint,
.ana-service-desc,
.ana-service-hint,
.ana-queries-period,
.ad-analytics label,
.ana-service .ana-service-fields label,
/* остальные серые подписи тех же блоков (найдены тем же аудитом и разбором стилей) */
.ana-kpi-hint,
.ana-acc-switch-hint,
.ana-acc-done,
.ana-acc-field label,
.ana-acc-table th,
.ana-acc-table .ana-acc-mail,
.ana-table th,
.adf-block-hint,
.adf-field label,
.adf-table th { color: var(--muted, #6c6883) !important; }

/* плашка «Цена ниже расчётной»: было #1c8a48 на #e8f7ee → 3,97:1 */
.ana-tag-income { color: var(--success-ink, #0f7a4c) !important; }


/* ---------------------------------------------------------------------------
 * 5. ССЫЛКИ И МЕЛКИЕ ПОДПИСИ
 * ------------------------------------------------------------------------ */
/* обычные ссылки были bootstrap-синим #0d6efd (4,06–4,23:1) → фирменный (5,5:1) */
:root {
    --bs-link-color: var(--brand, #6640f4);
    --bs-link-color-rgb: 102, 64, 244;
    --bs-link-hover-color: var(--brand-hover, #5533d8);
}
.blog-widget-categories-or-subcategories a { color: var(--brand, #6640f4); }

/* дата и категория в сетке блога: было `color: gray` (#808080) → 3,71:1 */
.blog-grid-item-date,
.blog-grid-item-category { color: var(--muted, #6c6883) !important; }

/* старая (зачёркнутая) цена в тарифах: было чистым красным #ff0000 → 4,0:1 */
.profile-tariffs-list-item-price-old { color: var(--danger, #b3352f) !important; }

/* счётчик на АКТИВНОЙ вкладке: был белый текст на полупрозрачной подложке
   (rgba(255,255,255,.22) поверх #6640f4) → 2,77:1. Корень исправлен в main.css
   (части 27 и 32 — там `--on-fill-soft` заменён на сплошной `--brand-fill`), а здесь
   оставлен страховочный слой: селектор нарочно специфичнее кабинетных правил
   (`.col-md-9 .my-tabs-items-… .my-tabs-item.active span` = 0,4,1 → у нас 0,4,2),
   заданы и `background`, и `background-color` (второе перебивает
   `.col-md-9 span:not([class]){background-color:transparent!important}`).
   Белый текст на `--brand-fill` (#6640f4) = 5,8:1. Файл кабинета не трогаем. */
.col-md-9 .my-tabs-items-big .my-tabs-item.active > span,
.col-md-9 .my-tabs-items-small .my-tabs-item.active > span,
.col-md-9 .my-tabs-items-medium .my-tabs-item.active > span,
.col-md-9 .my-tabs-items-big .my-tabs-item.active span,
.col-md-9 .my-tabs-items-small .my-tabs-item.active span,
.col-md-9 .my-tabs-items-medium .my-tabs-item.active span,
.my-tabs-items-big .my-tabs-item.active > span,
.my-tabs-items-small .my-tabs-item.active > span,
.my-tabs-items-medium .my-tabs-item.active > span {
    background: var(--brand-fill, #6640f4) !important;
    background-color: var(--brand-fill, #6640f4) !important;
    color: var(--on-fill, #ffffff) !important;
}

/* =====================================================================================
   КОНТРАСТ В СОСТОЯНИЯХ ВЫБОРА (16.09.2026) — дефект владельца: «у первой плитки текст не виден».

   Причина (найдена замером, не на глаз): в тему вендора вернулись правила апдейтов CMS
   (см. TRADELOT_PROJECT_STATE.md §12.31) с ЖЁСТКИМИ цветами:

     .ad-create-categories-container span:hover{ background-color:#186aff; color:white }
     .ad-create-categories-container-items span:hover{ color:white; background-color:#141414 }
     .ad-create-categories-item.active{ color:white; background-color:#141414 }

   Наши плитки выбора раздела — это те же <span>, поэтому «белый текст» из правил вендора
   прилипал к ним, а фон задаёт наш компонент (светлый) → в состоянии НАВЕДЕНИЯ и ВЫБОРА
   получался белый текст на светло-лиловом: замер давал 1,09:1 (норма 4,5:1).

   Лечение: все состояния плиток описаны здесь через ПЕРЕМЕННЫЕ темы (--ink, --surface-2,
   --brand, --brand-hover, --brand-tint, --muted), поэтому работает и в светлой, и в тёмной
   теме, и переживёт смену палитры. Селекторы с двумя классами + элементом перебивают
   правила вендора по специфичности.

   Проверка — `_deploy/tradelot_tools/_states_audit.js` (реальные события мыши и клавиатуры):
   все состояния каждой плитки, порог 4,5:1 (3:1 для крупного текста).
   ===================================================================================== */

/* --- 1. ПЛИТКИ ВЫБОРА РАЗДЕЛА (шаг 1 мастера публикации, страница редактирования лота) --- */
/* обычное состояние */
.create-categories-grid .ad-create-categories-item,
.ad-create-categories-container-items .ad-create-categories-item {
    color: var(--ink, #1b1630);
    background: var(--surface, #ffffff);
}

/* наведение и фокус с клавиатуры */
.create-categories-grid .ad-create-categories-item:hover,
.create-categories-grid .ad-create-categories-item:focus-visible,
.create-categories-grid .ad-create-categories-item:focus,
.ad-create-categories-container-items .ad-create-categories-item:hover,
.ad-create-categories-container-items .ad-create-categories-item:focus-visible {
    color: var(--ink, #1b1630);
    background: var(--surface-2, #f6f4fd);
    border-color: var(--brand, #6640f4);
}

/* выбор: активная плитка — и сама по себе, и под курсором, и с клавиатуры */
.create-categories-grid .ad-create-categories-item.active,
.create-categories-grid .ad-create-categories-item.active:hover,
.create-categories-grid .ad-create-categories-item.active:focus-visible,
.create-categories-grid .ad-create-categories-item[aria-current="true"],
.ad-create-categories-container-items .ad-create-categories-item.active,
.ad-create-categories-container-items .ad-create-categories-item.active:hover {
    color: var(--brand-hover, #5533d8);
    background: var(--brand-tint, #efeaff);
    border-color: var(--brand, #6640f4);
}

/* нажатие */
.create-categories-grid .ad-create-categories-item:active:not(.active) {
    color: var(--ink, #1b1630);
    background: var(--surface-3, #eeeaf9);
}

/* выключенное состояние */
.create-categories-grid .ad-create-categories-item.is-disabled,
.create-categories-grid .ad-create-categories-item[aria-disabled="true"],
.create-categories-grid .ad-create-categories-item:disabled {
    color: var(--muted, #6c6883);
    background: var(--surface-2, #f6f4fd);
    border-color: var(--line, #e7e2f4);
    cursor: not-allowed;
    opacity: .75;
}

/* --- 2. ПОПУЛЯРНЫЕ РАЗДЕЛЫ (чипы под сеткой) --- */
.create-popular-items .ad-create-categories-item {
    color: var(--ink, #1b1630);
    background: var(--surface-2, #f6f4fd);
}

.create-popular-items .ad-create-categories-item:hover,
.create-popular-items .ad-create-categories-item:focus-visible {
    color: var(--on-brand, #ffffff);
    background: var(--brand-active, #4a2ec0);
}

.create-popular-items .ad-create-categories-item.active,
.create-popular-items .ad-create-categories-item.active:hover {
    color: var(--on-brand, #ffffff);
    background: var(--brand-hover, #5533d8);
}

/* --- 3. ФОКУС С КЛАВИАТУРЫ: видимая рамка у всех элементов выбора --- */
.create-categories-grid .ad-create-categories-item:focus-visible,
.create-popular-items .ad-create-categories-item:focus-visible,
.ad-create-categories-container-items .ad-create-categories-item:focus-visible {
    outline: 2px solid var(--brand, #6640f4);
    outline-offset: 2px;
}

/* --- 4. ЯРЛЫКИ-ПЛИТКИ ВЕНДОРА ВНЕ НАШИХ СЕТОК (популярные/прочие <span> в контейнере):
       правило вендора красило их в белый на #141414 — оставляем тёмную подложку,
       но текст берём из переменной темы, а не «white». --- */
.ad-create-categories-container span:hover:not(.ad-create-categories-item),
.ad-create-categories-container-items span:hover:not(.ad-create-categories-item) {
    background-color: var(--brand-active, #141414);
    color: var(--on-brand, #ffffff);
}

/* --- 5. ВЫКЛЮЧЕННЫЙ ПЕРЕКЛЮЧАТЕЛЬ/ФЛАЖОК: подпись была жёстко серой #a5a3ae
       (на белом 2,49:1). Владелец требует читаемости во всех состояниях,
       включая disabled → берём переменную темы --muted (5,2:1 на белом). --- */
.switch-input:disabled ~ .switch-label,
.params-form-item .switch-input:disabled ~ .switch-label,
.params-form-item input:disabled ~ label,
.params-form-item label.is-disabled,
.params-form-item .form-check-input:disabled ~ .form-check-label {
    color: var(--muted, #6c6883) !important;
    opacity: 1 !important;
}