/* ==========================================================================
   idbg — модул „shell“: новите правила на модула (docs/UI_STANDARD.md §11)

   Всеки селектор започва с [data-module="shell"] — layout слага data-module
   на <body> (App\Services\UiModule::forView()) и зарежда само файла на
   текущия модул, така че правило оттук не може да засегне чужда страница
   (php bin/ui-lint.php, правило 10).

   Литерали (hex цвят, font-size в px, box-shadow) не се пишат — само
   токените от brand-tokens.css (§1, правило 11). Общото за няколко модула
   е компонент в design-components.css (заявка в systest/ui/requests.md).
   Хедърът, футърът и модалът „Известия“ са на всяка страница — техните
   правила са в design-components.css (Header, Footer, Известия).

   Страниците на модула: вход и подобни (auth/*), нова фирма (onboarding),
   избор на фирма (switch), грешките (errors/*), известията (notifications).
   ========================================================================== */

/* == Вход и подобни (§3.10): една обвивка auth-section > auth-card ==
   Картата е с рамката, радиуса и отстъпите от токените (досегашният
   „cgbg“ блок в design-pages.css е с литерали — finalize). Полетата са
   _shared/field.phtml (етикет над полето, грешка под него); формите са
   .auth-fields, не .auth-form — старите правила за <label> с поле вътре
   не ги хващат. */
[data-module="shell"] .auth-section { padding: var(--space-12) var(--space-4); }
[data-module="shell"] .auth-card {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
}
[data-module="shell"] .auth-card h1 {
    font-size: var(--text-page);
    font-weight: 800;
    margin-bottom: var(--space-1);
}
[data-module="shell"] .auth-card .auth-sub {
    font-size: var(--text-small);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-6);
}
[data-module="shell"] .auth-card .alert { margin-bottom: var(--space-4); }
[data-module="shell"] .auth-fields {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin: 0;
}
[data-module="shell"] .auth-fields > .btn-block { margin-top: var(--space-1); }
[data-module="shell"] .auth-card .form-check {
    font-size: var(--text-small);
    color: var(--color-text-secondary);
}
[data-module="shell"] .auth-card .form-check > input { flex-shrink: 0; }
/* Отметката с връзките (Общите условия) — сива карта, както досега. */
[data-module="shell"] .auth-card .legal-check {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-3);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    font-size: var(--text-label);
    line-height: var(--leading-normal);
}
[data-module="shell"] .auth-card .form-field--check.has-error .legal-check { border-color: var(--color-danger); }
[data-module="shell"] .auth-card .auth-switch {
    margin: var(--space-4) 0 0;
    text-align: center;
    font-size: var(--text-small);
    color: var(--color-text-secondary);
}
[data-module="shell"] .auth-card .auth-switch + .auth-switch { margin-top: var(--space-2); }
[data-module="shell"] .auth-card .auth-switch--spaced { margin-top: var(--space-6); }
[data-module="shell"] .auth-card .auth-or { margin: var(--space-4) 0; }
/* „Вход · Нова парола“ до грешката „Този имейл вече има акаунт“. */
[data-module="shell"] .auth-hint-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: calc(var(--space-2) * -1);
}
/* Иконата над заглавието („Провери пощата си“) — вместо емоджи (§1.5). */
[data-module="shell"] .auth-icon {
    display: flex;
    justify-content: center;
    margin-bottom: var(--space-4);
    color: var(--brand-blue);
}
[data-module="shell"] .auth-icon--warning { color: var(--color-warning); }
[data-module="shell"] .auth-actions { margin-top: var(--space-4); }
[data-module="shell"] .auth-card.text-center .alert { text-align: left; }
/* „Не помня паролата“ — Disclosure (§5.10). */
[data-module="shell"] .auth-disclosure {
    margin-top: var(--space-6);
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-border);
}
@media (max-width: 560px) {
    [data-module="shell"] .auth-section { padding: var(--space-6) var(--space-4); }
    [data-module="shell"] .auth-card { padding: var(--space-6) var(--space-4); }
}

/* == Нова фирма и избор на фирма (§3.10) ==
   Същата auth-card като входа, по-широка — формата на фирмата е дълга. */
[data-module="shell"] .auth-card.onboarding-card,
[data-module="shell"] .auth-card.switch-card {
    max-width: 640px;
    margin: 0 auto;
    box-shadow: none;
}
[data-module="shell"] .onboarding-card h1,
[data-module="shell"] .switch-card h1 {
    font-size: var(--text-page);
    text-align: left;
}
[data-module="shell"] .onboarding-card .lead,
[data-module="shell"] .switch-card .lead {
    font-size: var(--text-small);
    color: var(--color-text-secondary);
    text-align: left;
    margin: 0 0 var(--space-6);
}
/* „(по избор)“ до етикета — нормален шрифт и сив, както в .app-form: тук
   `label > span:first-child` (design-base) го правеше удебелен (заявка към
   основата за .form-label-optional; тогава това е излишно). */
[data-module="shell"] .form-label > .form-label-optional { font-weight: 400; color: var(--color-text-muted); }
[data-module="shell"] .onboarding-card .alert,
[data-module="shell"] .switch-card .alert { margin-bottom: var(--space-4); }
[data-module="shell"] .onb-back { display: inline-flex; margin-bottom: var(--space-3); }
[data-module="shell"] .onb-form .form-grid-2 { margin: 0; }
[data-module="shell"] .onb-form .onb-note {
    margin: 0;
    text-align: center;
    font-size: var(--text-label);
    color: var(--color-text-secondary);
}
[data-module="shell"] .onb-actions { display: flex; flex-direction: column; gap: var(--space-3); }
/* Въпросът за ДДС (_shared/firm-fields): чиповете се пренасят на телефон. */
[data-module="shell"] .firm-vat .choice-chips { margin-top: var(--space-1); }
[data-module="shell"] .firm-vat-no { display: flex; flex-direction: column; gap: var(--space-4); }
[data-module="shell"] .firm-vat-no[hidden] { display: none; }
/* ЕИК на заличена фирма (и всяка друга грешка в полето): изречението стои
   веднъж — като грешката на полето. Бележката от справката в регистъра
   (auto-fill.js, .eik-hint) казваше същото още веднъж отдолу
   (functional-r1); щом полето има грешка (сървърна от FormState или от
   проверката в браузъра — app-ux.js, раздел 6), бележката се скрива. */
[data-module="shell"] .onb-form .form-field:has(.field-error) .eik-hint { display: none; }
/* Плочките на фирмите: Avatar в цвета на фирмата (§5.17). */
[data-module="shell"] .tenant-card .avatar { flex-shrink: 0; }
[data-module="shell"] .tenant-arrow { display: inline-flex; color: var(--color-text-muted); }
[data-module="shell"] .tenant-card.is-current { border-color: var(--brand-blue-border); }
[data-module="shell"] .switch-actions { margin-top: var(--space-4); }
[data-module="shell"] .onboarding-wrap .onb-logo { margin-left: auto; margin-right: auto; }

/* == Грешки и отказ (§3.11): icon 40 + H1 + изречение + действия == */
[data-module="shell"] .error-page .error-state { padding: 0; }
[data-module="shell"] .error-page .error-state .empty-state-title {
    font-size: var(--text-page);
    font-weight: 800;
}
[data-module="shell"] .error-page .error-state .empty-state-desc { font-size: var(--text-body); max-width: 46ch; }

/* == Известия (/notifications, §3.1) ==
   Списъкът е в .list-shell (рамката е нейната); редът е общият партиал
   notifications/_item.phtml. На телефон текстът е на цялата ширина, а
   бутоните — под него (същото правило за модала е заявено в компонента
   „Известия“ на design-components.css; щом е там, това отпада — finalize). */
[data-module="shell"] .list-shell > .notif-page-list {
    border: 0;
    border-radius: 0;
    background: transparent;
}
[data-module="shell"] .list-shell > .pagination { border-top: 1px solid var(--color-border); }
/* Табът „Непрочетени“ — видяното изчезва от него на място, както в модала
   (.notif-modal-list.is-unread-only) и както след презареждане. */
[data-module="shell"] .notif-page-list.is-unread-only .notif-item:not(.is-unread) { display: none; }
@media (max-width: 560px) {
    [data-module="shell"] .notif-page-list .notif-item {
        flex-direction: column;
        align-items: stretch;
        gap: var(--space-2);
        padding: var(--space-3) var(--space-4);
    }
    [data-module="shell"] .notif-page-list .notif-item-actions {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
    }
}