/* Region-notify — вкладка «Уведомления» в ЛК (/lk/?mode=notify).
   Рескин 2026-08-11 (кластер 5): файл переведён с легаси-палитры `--pc-*` на
   брендовые токены `--c-*` напрямую. Карточку виджета обоим блокам даёт
   `.pc-widget` из cabinet.css — здесь только внутренности.

   Инвариант этого периметра: цвет НЕ наследуется. Тема красит каждый элемент
   правилом `*,p,li.div{color:…}`, поэтому неклассованным узлам и любому
   `stroke` иконки цвет задаётся явно — currentColor здесь не работает. */

/* ==========================================================================
   1. Рабочая секция (подписчик или активный триал)
   ========================================================================== */

.pc-notify__hint {
    margin: 0 0 16px;
    color: var(--c-text-muted);
}

.pc-notify__lead {
    margin: 0 0 12px;
    color: var(--c-text);
}

.pc-notify__widget {
    margin: 12px 0;
}

/* Статус привязки Telegram. Плашка появляется только вместе с модификатором:
   `podryadTgLink` в podryad-listing.js всегда перезаписывает className целиком
   (`pc-notify__status is-ok|is-error`), поэтому ключ на модификаторе точен, а
   `:empty` не нужен — та же развилка, что решалась на экране входа.
   `is-ok` намеренно информационный, а не зелёный: под этим модификатором
   выводятся и «Привязываем…», и «Переходим к подтверждению…» — сообщения
   процесса, для которых зелёный «готово» был бы неправдой. */
.pc-notify__status.is-ok,
.pc-notify__status.is-error {
    display: block;
    margin: 12px 0 0;
    padding: 8px 12px;
    border-radius: var(--r-md);
    font-size: 0.875rem;
    background: var(--c-badge-fresh-bg);
    color: var(--c-badge-fresh-fg);
}

.pc-notify__status.is-error {
    background: var(--c-badge-red-bg);
    color: var(--c-badge-red-fg);
}

/* Плашка триала — информационный тон вместо прежней серой заливки.
   Цвет текста задан на самом абзаце: до него цвет секции не доходит. */
.pc-notify__trial {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    margin: 0 0 16px;
    padding: 14px 16px;
    border-radius: var(--r-md);
    background: var(--c-badge-fresh-bg);
}

.pc-notify__trial-text {
    margin: 0;
    flex: 1 1 200px;
    font-weight: 600;
    color: var(--c-badge-fresh-fg);
}

/* ----- Пикер регионов ----- */

.pc-notify__regions {
    border: 0;
    margin: 0 0 16px;
    padding: 0;
}

.pc-notify__regions legend {
    padding: 0;
    margin-bottom: 12px;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--c-ink);
}

/* Поиск по регионам — язык полей продукта (эталон: экран входа).
   ⚠️ Тег в селекторе обязателен: JS создаёт поле как `type="text"`, а тема
   правилом `input[type="text"]{border-radius:0}` той же силы (0,1,1)
   печатается ПОЗЖЕ плагина. Один класс проиграл бы, и радиус молча пропадал
   бы в браузере, хотя в файле стоял бы. */
.pc-notify input.pc-notify__search {
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 12px;
    padding: 12px 14px;
    border: 1px solid var(--c-divider);
    border-radius: var(--r-sm);
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.4;
    color: var(--c-text);
    background: var(--c-surface);
}

.pc-notify input.pc-notify__search::placeholder {
    color: var(--c-text-faint);
}

.pc-notify input.pc-notify__search:focus-visible {
    outline: 2px solid var(--c-primary);
    outline-offset: 2px;
}

.pc-notify__chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0 0 12px;
}

.pc-notify__count {
    margin-right: 4px;
    font-size: 0.8125rem;
    color: var(--c-text-muted);
}

.pc-notify__chip {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 4px 4px 4px 12px;
    border-radius: var(--r-pill);
    font-size: 0.8125rem;
    background: var(--c-tag-bg);
    color: var(--c-tag-fg);
}

/* Крестик получает собственный габарит: прежние 15px без размеров давали
   тач-цель меньше пальца, а чипов на 390 бывает десяток. */
.pc-notify__chip-x {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: none;
    font: inherit;
    font-size: 1rem;
    line-height: 1;
    color: var(--c-tag-fg);
    cursor: pointer;
}

.pc-notify__chip-x:hover {
    background: var(--c-surface);
}

.pc-notify__chip-x:focus-visible {
    outline: 2px solid var(--c-primary);
    outline-offset: 1px;
}

/* Города федерального значения — подложка, а не ещё одна белая карточка:
   блок лежит внутри белого виджета, три светлых слоя подряд неразличимы. */
.pc-notify__federal {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin: 0 0 12px;
    padding: 12px 14px;
    border-radius: var(--r-md);
    background: var(--c-bg-tint);
}

/* ⚠️ Не --c-text-soft: на подложке --c-bg-tint эта пара даёт 4.15 при кегле
   12px (замер в браузере), то есть ниже AA. --c-text-muted на той же подложке
   даёт 6.88. Тон подписи на белом фоне и на подложке — разные задачи. */
.pc-notify__federal-label,
.pc-notify__group-label {
    display: block;
    margin: 0 0 4px;
    font-size: 0.75rem;
    color: var(--c-text-muted);
}

.pc-notify__federal-label {
    flex: 0 0 100%;
}

.pc-notify__list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px 14px;
    max-height: 440px;
    overflow-y: auto;
    padding: 12px 14px;
    border: 1px solid var(--c-border);
    border-radius: var(--r-md);
}

.pc-notify__region {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9375rem;
    font-weight: normal;
    color: var(--c-text);
    cursor: pointer;
}

/* Чекбокс — тот же, что у согласия на экране входа. */
.pc-notify__region input[type="checkbox"] {
    width: 18px;
    height: 18px;
    flex: none;
    margin: 0;
    accent-color: var(--c-primary);
    cursor: pointer;
}

.pc-notify__region.is-hidden {
    display: none;
}

.pc-notify__empty {
    margin: 8px 2px 0;
    font-size: 0.8125rem;
    color: var(--c-text-muted);
}

.pc-notify__test {
    margin-top: 12px;
}

/* Выпадающие списки и автозаполнение внутри секции не должны уезжать в
   тёмную схему ОС — та же грабля, что дала чёрный фон iframe Telegram. */
.pc-notify {
    color-scheme: only light;
}

/* На мобильном строка региона — палец, а не курсор: без этого шаг строки
   выходил 30px (20 текст + 10 зазор) и промахнуться было легче, чем попасть.
   Собственный зазор строк уменьшен, чтобы шаг остался ~44px, а не разъехался. */
@media (max-width: 600px) {
    .pc-notify__list {
        grid-template-columns: 1fr;
        gap: 4px 14px;
        max-height: 300px;
    }

    .pc-notify__region {
        min-height: 40px;
    }
}

/* ==========================================================================
   2. Тизер для не-подписчика

   Решение владельца 2026-08-11: тизер читается как обычная секция кабинета с
   закрытым содержимым, а не как реклама внутри кабинета. Отсюда монохромная
   иконка вместо цветной иллюстрации, брендовый янтарь у примечания и отказ
   от собственной ширины — тизер занимает колонку так же, как соседние виджеты.
   ========================================================================== */

/* Ширина тизера — по его содержимому, а не по полосе раздела (решение
   владельца 2026-08-20). 560 — ширина пейволльной модалки, чей питч тизер и
   переиспользует (`PaywallRenderer::renderTariffOnly`), то есть число из
   продукта, а не подобранное. Внутри остаётся 512 (паддинги 24+24), и все
   строки, кроме одной, помещаются в строку. ⚠️ Сноска «С подпиской вы получаете
   только свои объекты сразу после публикации» (498px текста) переносится на две
   строки: она идёт РЯДОМ С ИКОНКОЙ, и её колонка у́же 512 на иконку с зазором.
   Принято — сноска в две строки читается нормально; расширять карточку до
   естественных 601 ради одной строки не стали.

   ⚠️ До 2026-08-20 тизер шёл во всю полосу раздела, и с переходом на 1348
   кнопка «Оформить подписку» растянулась до 1298px. Естественная ширина
   содержимого карточки — 601 (замер `width: max-content`), то есть полосу ей
   занимать нечем. Кнопка внутри остаётся во всю ширину карточки (512): это тот
   же приём, что у карточки входа (`.pc-auth-card` 480, кнопка 414) и у панели
   контактов объявления.

   Модификатор `--cta` несёт нагрузку: у реального пикера регионов (section.php,
   класс без модификатора) сетка на 86 чекбоксов, и ей полоса НУЖНА — на 1348
   она даёт 7 колонок. Сузить оба узла одним правилом было бы ошибкой.

   Прижата влево, как вкладки над ней; медиа-запроса нет — ниже 560 полоса у́же
   потолка, и он не срабатывает. */
.pc-notify--cta {
    max-width: 560px;
}

/* Метка «Доступно по подписке» — бейдж утверждённой геометрии. */
.pc-notify-cta__lock {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 16px;
    padding: 4px 10px;
    border-radius: var(--r-pill);
    font-size: 0.75rem;
    font-weight: 600;
    background: var(--c-badge-dead-bg);
    color: var(--c-badge-dead-fg);
}

.pc-notify-cta__lock svg {
    width: 14px;
    height: 14px;
}

.pc-notify-cta__lock svg,
.pc-notify-cta__lock svg path,
.pc-notify-cta__lock svg rect {
    stroke: var(--c-badge-dead-fg);
}

.pc-notify-cta__hero {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 24px;
}

/* Иконка героя — та же плитка, что у блоков пользы ниже, только крупнее:
   один приём на весь тизер вместо разноцветной иллюстрации. */
.pc-notify-cta__bell {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 56px;
    height: 56px;
    border-radius: var(--r-lg);
    background: var(--c-badge-fresh-bg);
}

.pc-notify-cta__bell svg {
    width: 28px;
    height: 28px;
}

.pc-notify-cta__bell svg,
.pc-notify-cta__bell svg path {
    stroke: var(--c-primary);
}

.pc-notify-cta__title {
    margin: 0;
    font-size: 1.125rem;
    line-height: 1.25;
    font-weight: 600;
    color: var(--c-ink);
}

.pc-notify-cta__sub {
    margin: 4px 0 0;
    font-size: 0.875rem;
    color: var(--c-text-muted);
}

.pc-notify-cta__benefits {
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.pc-notify-cta__benefit {
    display: flex;
    gap: 12px;
}

.pc-notify-cta__benefit-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 38px;
    height: 38px;
    border-radius: var(--r-md);
    background: var(--c-badge-fresh-bg);
}

.pc-notify-cta__benefit-icon svg {
    width: 19px;
    height: 19px;
}

.pc-notify-cta__benefit-icon svg,
.pc-notify-cta__benefit-icon svg path,
.pc-notify-cta__benefit-icon svg circle {
    stroke: var(--c-primary);
}

.pc-notify-cta__benefit-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pc-notify-cta__benefit-title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--c-ink);
}

.pc-notify-cta__benefit-sub {
    font-size: 0.875rem;
    color: var(--c-text-muted);
}

/* Примечание — брендовый янтарь. Пара bg/fg взята целиком: её контраст
   выверен в источнике правды при заходе карточки объявления. */
.pc-notify-cta__note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0 0 24px;
    padding: 12px 14px;
    border-radius: var(--r-md);
    background: var(--c-badge-orange-bg);
}

.pc-notify-cta__note-icon {
    flex: none;
    line-height: 0;
}

.pc-notify-cta__note-icon svg {
    width: 17px;
    height: 17px;
}

.pc-notify-cta__note-icon svg,
.pc-notify-cta__note-icon svg path,
.pc-notify-cta__note-icon svg rect {
    stroke: var(--c-badge-orange-fg);
}

.pc-notify-cta__note-text {
    font-size: 0.875rem;
    color: var(--c-badge-orange-fg);
}

.pc-notify-cta__btn {
    width: 100%;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.pc-notify-cta__btn svg {
    width: 17px;
    height: 17px;
}

.pc-notify-cta__btn svg,
.pc-notify-cta__btn svg path,
.pc-notify-cta__btn svg rect {
    stroke: var(--c-on-navy);
}

/* --- Виды работ подписчика (2026-08-30) ------------------------------------
   Отдельный fieldset под регионами. Геометрия та же, что у списка регионов, —
   это соседние блоки одной формы, и разный шаг строк читался бы как сбой.

   ⚠️ Колонки заданы ЧИСЛОМ, а не auto-fit/minmax, в отличие от регионов: там
   позиций под сотню и трек пустым не остаётся, а видов работ сорок восемь, и
   при скрытии позиций владельцем список может стать коротким — auto-fit
   схлопнул бы пустой трек (грабля аудита ширин 2026-08-20). */
.pc-notify__work-types {
    border: 0;
    margin: 0 0 16px;
    padding: 0;
}

.pc-notify__work-types legend {
    padding: 0;
    margin-bottom: 6px;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--c-ink);
}

/* ⚠️ Не --c-text-soft: пара «приглушённый текст на тонированной подложке» в
   этом файле уже проваливала AA (см. .pc-notify__federal-label). Подсказка
   лежит на белой карточке виджета, поэтому muted здесь безопасен — но если
   блок когда-нибудь переедет на подложку, тон надо перемерить. */
.pc-notify__work-hint {
    margin: 0 0 12px;
    font-size: 0.875rem;
    color: var(--c-text-muted);
}

.pc-notify__work-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px 14px;
    max-height: 320px;
    overflow-y: auto;
}

@media (min-width: 600px) {
    .pc-notify__work-list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 900px) {
    .pc-notify__work-list {
        grid-template-columns: repeat(3, 1fr);
    }
}