/* ═══════════════════════════════════════════════════════════════
   Усі екрани в мові панелей старту + логотип ERadius (постанова 11.10.2026, restyle-all).
   Еталон: .start-panel / .sp-row (refine.css) і бічне меню (sidebar-panels.css).
   Правила: лише токени теми (без нових кольорів), без зміни логіки й структури екранів.
   Підключається ПІСЛЯ sidebar-panels.css, тож перебиває старі правила; спільне — спільними класами.
   Радіуси не чіпаємо: геометрію (0, кола лише в аватарів) тримає carbon.css, так само як у панелях старту.
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. Логотип ERadius: головний синій інтерфейсу + нейтральні сірі з токенів ──
   Форма знака (SVG у index.html) не змінилась, змінились лише заливки: вони читаються з токенів теми,
   тож брендування закладу (--accent) перефарбовує знак разом з інтерфейсом, а логотип закладу
   (img#sidebarBrandLogo) і далі ховає знак через атрибут hidden (branding.js). */
.brand-mark .bm-off{fill:var(--border-strong)}
.brand-mark .bm-on{fill:var(--accent)}
.brand-mark-light .bm-a1{fill:var(--accent)}
.brand-mark-light .bm-a2{fill:color-mix(in srgb,var(--accent) 62%,var(--bg-surface))}
.brand-mark-light .bm-a3{fill:color-mix(in srgb,var(--accent) 32%,var(--bg-surface))}
/* темний варіант: градація дуги інвертована (правило README бренду) */
.brand-mark-dark .bm-a1{fill:color-mix(in srgb,var(--accent) 62%,var(--text-primary))}
.brand-mark-dark .bm-a2{fill:var(--accent)}
.brand-mark-dark .bm-a3{fill:color-mix(in srgb,var(--accent) 62%,var(--bg-surface))}

/* ── 2. Токени читабельності (WCAG AA ≥ 4,5 на реальному фоні) ──
   «Не внесено» / приглушений текст був 4,2–4,3 на напівпрозорій панелі над мапою й на картках;
   статусні кольори світлої теми на власних «тихих» підкладках були 4,1–4,3. Підсилено мінімально. */
html[data-theme="light"]{--text-muted:#5F6B7C;--success:#0E7350;--warning:#865800;--danger:#B3202A;
  /* 12.10: на м'якому тлі синій #0F62FE як ТЕКСТ дає 4,30:1 (<4,5). Текстовий акцент — Carbon Blue 70 (≥5,3:1 на всіх
     варіантах світлої теми); заливка кнопок (--accent-solid) лишається Blue 60. */
  --accent-text:#0043CE;--accent:#0043CE;--blue:#0043CE;--copper:#0043CE;--accent-hover:#002D9C;
  --paper:#FFFFFF;--paper-ink:#172033;--paper-ink-soft:#47525F;--paper-line:#C9D2DE}
html[data-theme="dark"]{--text-muted:#8E99AA;
  --paper:#FFFFFF;--paper-ink:#172033;--paper-ink-soft:#47525F;--paper-line:#C9D2DE}

/* ── 2а. Світла тема — «Холодний туман» (власник 12.10 обрав із варіантів; 11.10 було чисто біле): тло ледь блакитне,
   поверхні світліші за тло, межі помітні. Друк (--paper) лишається білим. ── */
html[data-theme="light"]{--cds-background:#E1E7EE;--bg-base:#E1E7EE;--bg:#E1E7EE;--bg-soft:#E8EDF3;--bg-surface:#ECF0F5;--bg-raised:#F2F5F8;
  --bg-sunken:#D8E0E9;--bg-hover:#DEE5ED;--bg-active:#D1DAE5;--border-subtle:#CCD6E2;--text-muted:#4C596F;--cds-layer:#ECF0F5}
html[data-theme="light"] .summary-row{background:var(--bg-raised)}

/* ── 3. Поверхня = панель старту: той самий фон, межа й типографіка ── */
html[data-theme] :is(.panel,.metric-card,.person-card,.task-card,.table-panel,.roster-drawer,.coverage-panel,.org-chart-wrap,.card){
  background:var(--bg-surface);color:var(--text-primary);
  border:1px solid color-mix(in srgb,var(--border-strong) 70%,transparent);box-shadow:none}
html[data-theme] .panel-footer{border-top:1px solid color-mix(in srgb,var(--border-subtle) 85%,transparent);color:var(--text-secondary);font-size:var(--fs-caption)}
html[data-theme] .section-heading h2,
html[data-theme] .panel-heading h2,
html[data-theme] .panel > h2,
html[data-theme] .panel h3,
html[data-theme] .dialog-head :is(h2,h3),
html[data-theme] dialog :is(h2,h3){
  font-size:var(--fs-title);font-weight:var(--fw-semibold);letter-spacing:0;color:var(--text-primary);line-height:1.3}
html[data-theme] .eyebrow{font-size:var(--fs-micro);font-weight:var(--fw-medium);letter-spacing:.02em;text-transform:none;color:var(--text-secondary)}
html[data-theme] :is(.muted,small){color:var(--text-secondary);font-size:var(--fs-caption);letter-spacing:0}
html[data-theme] :is(.muted,small) :is(.muted,small){font-size:inherit}
html[data-theme] :is(.section-heading,.panel-heading) .muted{font-size:var(--fs-caption)}

/* ── 4. Таблиці = рядки панелі: тихі межі, заголовок-підпис, підсвітка при наведенні ── */
html[data-theme] .main-content table:not(.print-schedule-table):not(.coverage-report-table){border-collapse:collapse}
html[data-theme] .main-content thead th,
html[data-theme] .main-content th{
  background:transparent;color:var(--text-secondary);font-size:var(--fs-caption);font-weight:var(--fw-medium);
  letter-spacing:0;text-transform:none;border-bottom:1px solid color-mix(in srgb,var(--border-strong) 70%,transparent)}
html[data-theme] .main-content td{border-bottom:1px solid color-mix(in srgb,var(--border-subtle) 85%,transparent);font-size:var(--fs-body)}
html[data-theme] .main-content td small{font-size:var(--fs-caption)}
html[data-theme] .main-content tbody tr:hover > td{background:color-mix(in srgb,var(--bg-hover) 85%,transparent)}
html[data-theme] .th-sort{font-weight:var(--fw-medium);font-size:var(--fs-caption)}
html[data-theme] .th-sort.sorted{color:var(--accent)}

/* ── 5. Кнопки: тиха контурна, основна — суцільний акцент ── */
html[data-theme] .button{
  min-height:var(--control-h);padding:0 var(--space-3);font-size:var(--fs-body);font-weight:var(--fw-medium);
  background:transparent;color:var(--text-primary);box-shadow:none;
  border:1px solid color-mix(in srgb,var(--border-strong) 70%,transparent);transition:background 120ms ease,border-color 120ms ease}
html[data-theme] .button:hover:not(:disabled){background:color-mix(in srgb,var(--bg-hover) 85%,transparent)}
html[data-theme] .button:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
html[data-theme] .button.primary{background:var(--accent-solid);border-color:var(--accent-solid);color:var(--on-copper)}
html[data-theme] .button.primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}
html[data-theme] .button:is(.danger,.danger-outline){color:var(--danger)}
html[data-theme] .button:disabled{opacity:.55}
html[data-theme] .icon-button:hover:not(:disabled){background:color-mix(in srgb,var(--bg-hover) 85%,transparent);color:var(--text-primary)}
html[data-theme] .text-button.danger-text{color:var(--danger)}
html[data-theme] .text-button{color:var(--accent-text,var(--accent));font-weight:var(--fw-medium);font-size:var(--fs-caption)}

/* вкладки/перемикачі: як пункт меню — прозорий рядок, активний з акцентною смугою */
html[data-theme] .segmented{background:transparent;padding:0;border:1px solid color-mix(in srgb,var(--border-strong) 70%,transparent)}
html[data-theme] .segmented button{background:transparent;color:var(--text-secondary);font-size:var(--fs-body);font-weight:var(--fw-regular);box-shadow:none;transition:background 120ms ease}
html[data-theme] .segmented button:hover{background:color-mix(in srgb,var(--bg-hover) 85%,transparent);color:var(--text-primary)}
html[data-theme] .segmented button.selected{background:var(--bg-hover);color:var(--text-primary);font-weight:var(--fw-semibold);box-shadow:inset 0 -2px 0 var(--accent)}
/* FullCalendar живе на власних змінних --fc-button-*: перевизначаємо змінні, а не селектори вендора */
html[data-theme] .absence-calendar{
  --fc-button-text-color:var(--text-primary);--fc-button-bg-color:transparent;
  --fc-button-border-color:color-mix(in srgb,var(--border-strong) 70%,transparent);
  --fc-button-hover-bg-color:color-mix(in srgb,var(--bg-hover) 85%,transparent);--fc-button-hover-border-color:color-mix(in srgb,var(--border-strong) 70%,transparent);
  --fc-button-active-bg-color:var(--bg-hover);--fc-button-active-border-color:color-mix(in srgb,var(--border-strong) 70%,transparent)}
html[data-theme] .absence-calendar .fc .fc-button-primary:not(:disabled).fc-button-active,
html[data-theme] .absence-calendar .fc .fc-button-primary:not(:disabled):active{color:var(--text-primary);box-shadow:inset 0 -2px 0 var(--accent)}

/* ── 6. Поля вводу ── */
html[data-theme] :is(input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=file]):not([type=range]),select,textarea),
html[data-theme] .search{
  background:var(--bg-surface);color:var(--text-primary);font-size:var(--fs-body);font-weight:var(--fw-regular);
  border:1px solid color-mix(in srgb,var(--border-strong) 70%,transparent);box-shadow:none}
html[data-theme] :is(input,select,textarea):focus-visible,html[data-theme] .search:focus{
  outline:2px solid var(--border-focus);outline-offset:-1px;box-shadow:none;border-color:var(--border-focus)}
html[data-theme] ::placeholder{color:var(--text-muted);opacity:1}
html[data-theme] dialog label,html[data-theme] .table-toolbar label{color:var(--text-secondary);font-size:var(--fs-caption);font-weight:var(--fw-medium)}
html[data-theme] dialog label :is(input,select,textarea){font-weight:var(--fw-regular)}
html[data-theme] .select-wrap{color:var(--text-secondary);font-size:var(--fs-caption);font-weight:var(--fw-medium)}

/* ── 7. Діалоги ── */
html[data-theme] dialog{
  background:var(--bg-surface);color:var(--text-primary);
  border:1px solid color-mix(in srgb,var(--border-strong) 70%,transparent);box-shadow:var(--shadow-modal)}
html[data-theme] .dialog-head{padding:var(--space-3) var(--space-4);border-bottom:1px solid color-mix(in srgb,var(--border-subtle) 85%,transparent)}
html[data-theme] .dialog-actions{gap:var(--space-2)}
html[data-theme] fieldset.competency-set{border:1px solid color-mix(in srgb,var(--border-subtle) 85%,transparent)}
html[data-theme] fieldset.competency-set legend{color:var(--text-secondary);font-size:var(--fs-caption);font-weight:var(--fw-medium)}
html[data-theme] .more-menu{background:var(--bg-surface);border:1px solid color-mix(in srgb,var(--border-strong) 70%,transparent);box-shadow:var(--shadow-popover)}
html[data-theme] .more-menu button{color:var(--text-primary);font-size:var(--fs-body)}
html[data-theme] .more-menu button:hover{background:color-mix(in srgb,var(--bg-hover) 85%,transparent)}

/* ── 8. Словник станів: один набір, колір — лише з токенів ──
   норма → success, увага → warning, прогалина/помилка → danger, нейтральне → secondary.
   Раніше кожен екран мав власні hex (світло-зелений на білому тощо) і дрібні 9–10px. */
html[data-theme] :is(.chips span,.pl-chip,.chip,.action-pill,.state-pill,.loc-badge,.availability,.task-status,.score-badge,
    .sync-status,.week-status,.sp-pill,.duty-chip,.summary-badge,.eq-src,[data-int-node-state]){
  font-size:var(--fs-micro) !important;font-weight:var(--fw-medium) !important;letter-spacing:0;line-height:1.35}
html[data-theme] :is(.chips span,.pl-chip,.chip,.action-pill,.task-status.planned,.task-status.progress,.loc-badge.none,.eq-src,[data-int-node-state="pending"]){
  color:var(--text-secondary) !important;background:var(--bg-hover) !important;border:1px solid color-mix(in srgb,var(--border-subtle) 85%,transparent)}
html[data-theme] .pl-chip.pl-more{background:transparent !important;border-style:dashed}
html[data-theme] :is(.state-pill:not(.warn),.loc-badge.ok,.available,.sync-status.saved,.week-status.is-confirmed,.sp-pill.is-confirmed,
    .summary-badge.is-ok,.score-badge,[data-int-node-state="ready"],.avail-cell.ok,.eq-cell.eq-work,.shift.filled,.eq-status.is-ok){
  color:var(--success) !important;background:var(--success-quiet) !important;border-color:color-mix(in srgb,var(--success) 40%,transparent)}
html[data-theme] :is(.state-pill.warn,.sync-status.saving,.week-status.is-draft,.sp-pill.is-draft,.duty-chip.partial,.eq-cell.eq-service,
    .shift.warning-cell,[data-int-node-state="warning"],.task-status.due){
  color:var(--warning) !important;background:var(--warning-quiet) !important;border-color:color-mix(in srgb,var(--warning) 40%,transparent)}
html[data-theme] :is(.loc-badge.gap,.sync-status.local,.duty-chip.gap,.eq-cell.eq-repair,.absent,[data-int-node-state="error"],
    .summary-stat-status.has-deficit,.avail-cell.absent){
  color:var(--danger) !important;background:var(--danger-quiet) !important;border-color:color-mix(in srgb,var(--danger) 40%,transparent)}
html[data-theme] .duty-chip{color:var(--text-primary) !important;background:var(--accent-quiet) !important}
html[data-theme] :is(.duty-chip.partial,.duty-chip.gap){font-weight:var(--fw-semibold) !important}
html[data-theme] .avail-cell{font-size:var(--fs-caption)}
html[data-theme] :is(.eq-cell.eq-work,.eq-cell.eq-service,.eq-cell.eq-repair,.avail-cell.ok,.avail-cell.absent,.shift.filled,.shift.warning-cell){border-color:transparent}
html[data-theme] .eq-cell.eq-off{color:var(--text-secondary);background:var(--bg-hover)}
html[data-theme] .eq-cell{font-weight:var(--fw-medium)}
html[data-theme] :is(.duty-gaps,.summary-stat-status.has-deficit){color:var(--danger);font-weight:var(--fw-semibold)}
html[data-theme] .summary-stat-status.is-ok{color:var(--success)}
html[data-theme] :is(.summary-stat-status,.summary-stat-count){font-size:var(--fs-caption)}
html[data-theme] .duty-row .shift-label{color:var(--danger)}
html[data-theme] .shift-label{font-size:var(--fs-caption);font-weight:var(--fw-medium)}
html[data-theme] .shift-label small{font-size:var(--fs-micro)}
html[data-theme] .shift.empty{color:var(--text-secondary)}
html[data-theme] .eq-status.is-attention{color:var(--warning)}
html[data-theme] .eq-note{opacity:1;font-size:var(--fs-micro);color:var(--text-secondary)}
html[data-theme] [data-int-node-state]{padding:1px var(--space-2)}

/* ── 9. Дрібний текст: не менше --fs-micro (11px), вага не вище --fw-semibold ── */
html[data-theme] :is(.slots-axis-cell,.cert-valid,.cert-confirm,.cert-valid input,.cert-confirm input,.legend,.panel-footer *,.coverage-summary span,
    .person-card-head p,.person-meta,.roster-person span,.roster-person em,.task-card small,.task-card p){font-size:var(--fs-micro)}
html[data-theme] :is(.slots-axis-cell.hour,.cert-valid,.cert-confirm){font-weight:var(--fw-medium)}
html[data-theme] :is(.cert-valid,.cert-confirm){color:var(--text-secondary)}
html[data-theme] .slots-axis-cell{color:var(--text-secondary)}
html[data-theme] .slots-axis-cell.hour{color:var(--text-primary)}
html[data-theme] :is(.avatar,.avatar__initials,.brand-name,.sidebar .brand-name,.ll-head,.chip-label,.person-meta b,.alert-box strong){font-weight:var(--fw-semibold)}
html[data-theme] .brand-sub{font-size:var(--fs-micro);color:var(--text-secondary)}
html[data-theme] .sidebar-footer span:not(.avatar){font-size:var(--fs-micro);color:var(--text-secondary)}
html[data-theme] .main-content :is(.pl-head,.ll-head,.calendar-head) :is(span,b){font-size:var(--fs-micro);font-weight:var(--fw-medium)}
html[data-theme] .main-content :is(.pl-head,.ll-head){font-weight:var(--fw-medium);color:var(--text-secondary)}
html[data-theme] .main-content .calendar-head .today,html[data-theme] .main-content .calendar-head .today b{color:var(--accent);font-weight:var(--fw-semibold)}
html[data-theme] .main-content .shift.empty b{font-size:var(--fs-micro);font-weight:var(--fw-medium)}
html[data-theme] .date-range{font-weight:var(--fw-semibold);font-size:var(--fs-body)}
html[data-theme] .gcal-controls label,html[data-theme] .chip-label{font-size:var(--fs-caption);font-weight:var(--fw-medium)}
html[data-theme] .main-content .button{font-weight:var(--fw-medium) !important}
html[data-theme] .main-content .button.active{font-weight:var(--fw-semibold) !important}
html[data-theme] .main-content summary{font-weight:var(--fw-semibold) !important}
html[data-theme] .button.compact{min-height:var(--row-h-default)}
html[data-theme] .avatar{box-shadow:none}
html[data-theme] .main-content :is(b,strong){font-weight:var(--fw-semibold)}
html[data-theme] .main-content b{font-size:inherit}
html[data-theme] .loc-status-title,html[data-theme] .coverage-report-table thead th{text-transform:none;letter-spacing:0;font-size:var(--fs-caption)}
html[data-theme] .slot-lane{background-image:linear-gradient(to right,color-mix(in srgb,var(--border-subtle) 85%,transparent) 1px,transparent 1px)}
html[data-theme] .slot-lane:hover{background-color:var(--bg-hover)}

/* ── 10. Верхня панель: заголовок, статус збереження, кнопки ── */
html[data-theme] .topbar h1{font-size:var(--fs-display);letter-spacing:0}
html[data-theme] .top-actions{gap:var(--space-2)}
html[data-theme] .sync-status{padding:3px var(--space-2);border:1px solid transparent}
html[data-theme] .sync-status::before{width:6px;height:6px}
html[data-theme] .segmented button small{color:var(--text-secondary)}
html[data-theme] .era-banner{background:var(--bg-sunken);color:var(--text-secondary);border-bottom:1px solid color-mix(in srgb,var(--border-subtle) 85%,transparent)}
html[data-theme] .era-banner a{color:var(--text-primary);text-decoration:underline}
/* підпис під мапою на старті: власна напівпрозора підкладка, щоб не залежати від кадру мапи під ним */
html[data-theme] body[data-route="overview"] .map3d-site-section .map3d-toolbar .map3d-note{
  display:inline-block;padding:2px var(--space-2);color:var(--text-secondary);background:color-mix(in srgb,var(--bg-surface) 76%,transparent)}
html[data-theme] .main-content a:not(.button):not(.nav-item){color:var(--accent)}

/* ── 11. Аркуш друку: це «папір», він білий в обох темах (не колір теми) ── */
html[data-theme] .main-content .print-sheet,html[data-theme] .main-content .print-sheet *{color:var(--paper-ink)}
html[data-theme] .print-sheet{background:var(--paper);border-color:var(--paper-line)}
html[data-theme] .main-content .print-sheet :is(th,td){border-color:var(--paper-line)}
html[data-theme] .main-content .print-sheet :is(small,em,.muted,p){color:var(--paper-ink-soft)}
