/* ============================================================
   AccountingOS — Глобални стилове на приложението
   ------------------------------------------------------------
   Това е единственото място за глобални промени по типографията,
   формите, бутоните и таблиците в платформата.

   • Включва се от _sidebar.php през <link rel="stylesheet">
   • Кеш-busting чрез ?v= параметър (модификационно време на файла)
   • Модул-специфични стилове остават в съответния .php файл

   История:
   2026-05-21  Първа версия — пренесени font-size правила от _sidebar.php
   2026-07-01  Каноничен :root + body.theme-light преместени тук (бяха
               copy-paste-нати inline в ~40 модула, на места дрейфнали —
               виж docs/AccountingOS_External_Analysis.md, раздел 5)
   ============================================================ */


/* ─── Канонична палитра (тъмна тема по подразбиране) ────────────
   19.09.2026 — ГАМАТА НА ПОРТАЛА (решение на Хазарос след сравнение):
   един акцент тюркоаз (линкове, табове, активен пункт, плътен бутон),
   оранжево вместо жълто за „внимание", по-наситено зелено за „наред",
   червено за грешка/триене; категорийните цветове се свеждат до същите
   четири + сиво. Фонът е тъмносин като портала. Служител и клиент виждат
   един продукт и логото.
   Единствен източник на истината. Модулите вече НЕ трябва да
   дефинират собствен :root — наследяват директно оттук.
   ──────────────────────────────────────────────────────────── */
:root {
  /* Глобален мащаб на шрифтовете: 1 = стълбата по дизайн-правилото.
     Механизмът остава за спешни случаи, но правилото е РАЗМЕРИТЕ ДА СА
     ВЕРНИ ПО СТЪЛБАТА, не да се множат. */
  --fs: 1;
  /* ═══ ДИЗАЙН-ПРАВИЛО (10.08.2026, еталон: мострата „Постъпили документи",
     одобрена от Хазарос; пълният еталон: docs/AOS_dizain_pravilo.html) ═══
     ТЪМНА ТЕМА — по-тъмни, неутрални фонове (дълбочина) + текст ≥15:1,
     вторичен ≥7:1, цветните акценти ≥6.5:1 ВЪРХУ КАРТА (#12151d).
     Никога цветен текст върху цветен фон.

     ПЛЪТЕН БУТОН (09.09.2026 — поправка на самото правило). Дотук пишеше
     „цвят + тъмен текст" и това беше вярно само за тъмната тема: там
     запълването е светло (--accent е #7aa2ff), затова текстът е тъмен.
     В светлата тема запълването е ТЪМНО (--accent става #1d4ed8) и същият
     тъмен текст става нечетим. Затова текстът върху плътен бутон вече не се
     пише на ръка, а идва от --on-fill, който се сменя с темата.
     Открито от Картата: 25 места с color:#06101f върху background:var(--accent). */
  --bg: #0f172a;
  --bg2: #1e293b;
  --bg3: #334155;
  --border: #3b4760;
  --text: #f1f5f9;   /* 15.3:1 */
  --muted: #a8b3c5;  /* 7.2:1 на карта — вторичен текст, НИКОГА под това */
  --accent: #3dc4c2; /* 7.3:1 (старият #4f9cf9 беше 6.0) */
  --green: #22c55e;  /* 9.5:1 */
  --red: #f87171;    /* 6.6:1 */
  --yellow: #f59e0b; /* 10.9:1 */
  --orange: #f59e0b;
  --purple: #94a3b8;
  /* КАТЕГОРИЙНИ ЦВЕТОВЕ (12.09.2026). Статусните палитри в модулите бяха
     записани като готов hex в PHP масиви (`'color'=>'#34d399'`) — тоест
     цветовете на ТЪМНАТА тема, изписани на ръка. Те не се сменят с темата и
     на светъл фон падаха до 1.9:1 („Работеща" в Клиенти). Шестте променливи
     отдолу допълват --green/--red/--yellow/--orange/--purple/--accent, за да
     има достатъчно различими цвята за легенда, без нито един да е зазидан. */
  --c-teal: #3dc4c2;
  --c-pink: #f59e0b;
  --c-lime: #22c55e;
  --c-slate: #8b93a7;
  /* Текстът ВЪРХУ плътен цветен бутон. В тъмната тема запълването е светло —
     значи текстът е почти черен. */
  --on-fill: #06101f;
  /* Рамката на ОЧЕРТАН БУТОН. Дотук се ползваше --border, но той е цвят за
     разделителна черта: в светлата тема #d9e0ea дава 1.25:1 върху бяло и
     бутонът просто изчезваше. Бутонът трябва да се вижда като бутон. */
  --btn-line: #4b5a72;
  /* ДВАТА ПЛЪТНИ БУТОНА (11.09.2026, решение на Хазарос): един син и един
     зелен, надписът бял. Цветовете са ЕДНИ И СЪЩИ в двете теми — нарочно.
     var(--accent) се сменя с темата и в тъмната е светло синьо (#7aa2ff);
     бял текст върху него е 1.8:1, тоест нечетим. Фиксирано синьо/зелено
     държи белия надпис над 4.9:1 навсякъде. */
  --btn-blue: #2aacaa;   /* тюркоаз, тъмен надпис (--on-fill): 8:1 */
  --btn-blue-h: #3dc4c2; /* при посочване — по-светъл, като в портала */
  --btn-green: #15803d;  /* бяло върху него: 5.0:1 */
  --btn-green-h: #166534;
}

/* ─── Светла тема (превключва се чрез body.theme-light) ─────────
   Преместено от _sidebar.php — единствен light override в цялото
   приложение. Компоненти, които ползват var(--bg) и т.н., ще се
   преоцветят автоматично; hardcoded hex стойности няма да реагират
   (отделен, по-голям проблем — виж раздел 5 в анализа).
   ──────────────────────────────────────────────────────────── */
body.theme-light {
  /* СВЕТЛА ТЕМА по дизайн-правилото (10.08.2026): старите цветове бяха
     под нормата — акцент 3.7:1, зелено 3.3:1, жълто 3.2:1 (затова „бледо").
     Ново: текст ≥15:1, вторичен ≥6.5:1, цветните акценти ≥5:1 върху бяло. */
  /* Сивото е ЕДНО И СЪЩО с портала (12.09.2026) — служителят и клиентът
     гледат един и същ фон, независимо от коя страна са. */
  --bg: #e0e8f1;
  --bg2: #ffffff;
  --bg3: #d6dfeb;
  --border: #d9e0ea;
  --text: #1a2433;   /* 15.6:1 */
  --muted: #4d5c73;  /* 6.8:1 */
  --accent: #0f7a78; /* тюркоаз, 5.3:1 върху бяло — като в портала */
  --green: #15803d;  /* 5.0:1 (беше 3.3) */
  --red: #b91c1c;    /* 6.5:1 */
  --yellow: #9a4a06; /* оранжево вместо жълто, 6:1 */
  --orange: #9a4a06;
  --purple: #4d5c73;
  --c-teal: #0f7a78;
  --c-pink: #9a4a06;
  --c-lime: #15803d;
  --c-slate: #4d5c73;
  /* Тук запълването е тъмно — значи текстът върху него е бял. Това е цялата
     причина променливата да съществува. */
  --on-fill: #ffffff;
  --btn-line: #8fa0b8;  /* 2.9:1 върху бяло — линия, която се вижда */
  --btn-blue: #0f7a78;
  --btn-blue-h: #0c6260;
  --btn-green: #15803d;
  --btn-green-h: #166534;
}


/* ─── Споделени компоненти (бутони, карти, заглавен ред) ─────────
   Премахнати ~30 идентични/дрейфнали копия от модулите (2026-07-01).
   Canonical стил = "solid" вариантът, който вече доминираше (10+
   модула). Модулите с outline/filled-accent .btn по подразбиране
   вече изглеждат като всички останали — това е нарочна визуална
   унификация, не no-op като при палитрата.
   ──────────────────────────────────────────────────────────── */
/* БАЗОВИЯТ БУТОН ИМА ВИД (18.09.2026, обиколката). Дотук голият .btn беше
   без рамка и без фон — видът идваше само от модификатор. Около 200 бутона в
   ~35 файла са с class="btn" без модификатор и в модулите без собствен .btn
   (Внос на продажби, Регистър по ДДС, Отработено време, партиалите на
   Кантората, Задължения, Пари…) излизаха като гол текст. Осемте нови модула
   вече описваха .btn еднакво: рамка --btn-line + фон --bg3. Това е канонът
   и живее тук; локалните копия могат да отпаднат без промяна на вида. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;min-height:38px;padding:0 18px;line-height:1.2;border-radius:9px;font-family:inherit;font-size:calc(15px * var(--fs, 1));font-weight:500;cursor:pointer;transition:.15s;border:1px solid var(--btn-line);background:var(--bg3);color:var(--text);white-space:nowrap;text-decoration:none}
.btn:hover{border-color:var(--accent);color:var(--accent)}
/* СИНИЯТ — главното действие на екрана. .btn-primary е старото име. */
.btn-pr,.btn-primary,a.btn-pr,a.btn-primary{background:var(--btn-blue);border:1px solid var(--btn-blue);color:var(--on-fill);font-weight:600}
.btn-pr:hover,.btn-primary:hover{background:var(--btn-blue-h);border-color:var(--btn-blue-h);color:var(--on-fill)}
/* ЗЕЛЕНИЯТ БУТОН ОТПАДНА (01.10.2026, Хазарос: „не махнахме ли този зелен цвят"). Потвърждаване и
   завършване са главното действие на екрана и носят същия тюркоаз като .btn-pr; класовете .btn-g /
   .btn-success остават в кода, за да не се пипат 25 места, но рисуват синьо. Зеленото е само за
   състояние (точка, чип, текст), не за бутон. */
.btn-g,.btn-success,a.btn-g,a.btn-success{background:var(--btn-blue);border:1px solid var(--btn-blue);color:var(--on-fill);font-weight:600}
.btn-g:hover,.btn-success:hover{background:var(--btn-blue-h);border-color:var(--btn-blue-h);color:var(--on-fill)}
.btn-secondary{background:transparent;border:1px solid var(--btn-line);color:var(--text)}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent)}
.btn-ghost{background:var(--bg3);color:var(--text);border:1px solid var(--btn-line)}
.btn-danger{background:transparent;border:1px solid var(--btn-line);color:var(--muted)}
.btn-danger:hover{border-color:var(--red);color:var(--red)}
.btn-sm{min-height:30px;padding:0 13px;font-size:calc(13.5px * var(--fs, 1))}

/* Радиусът е 12px — толкова ползват осемте нови модула (Кантората, Пари,
   Контрол, Задължения, Система…), а тук стоеше 10px. Един и същ клас с два
   радиуса значи карти с различно заоблени ъгли според екрана. (12.09.2026) */
.card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:20px;margin-bottom:16px}

/* ─── Ленти за съобщение (12.09.2026) ──────────────────────────────────
   Дотук .alert изобщо я нямаше тук, а всеки модул си я описваше сам — ЧЕТИРИ
   различни размера и ШЕСТ изписвания за едно и също: „alert ok", „alert err",
   „alert alert-success", „alert alert-error", „alert alert-ok", „alert-err".
   Канонът е тук и покрива всички изписвания, за да не се пипа разметката. */
.alert, .alert-ok, .alert-err, .alert-error, .alert-success, .alert-info {
  padding:11px 16px; border-radius:9px; margin-bottom:14px;
  font-size:calc(15px * var(--fs, 1)); border:1px solid transparent;
}
.alert.ok, .alert-ok, .alert.alert-ok, .alert-success, .alert.alert-success {
  border-color:var(--green); color:var(--green); background:rgba(52,211,153,.08);
}
.alert.err, .alert-err, .alert.alert-err, .alert-error, .alert.alert-error {
  border-color:var(--red); color:var(--red); background:rgba(248,113,113,.08);
}
.alert-info, .alert.info {
  border-color:var(--accent); color:var(--accent); background:color-mix(in srgb, var(--accent) 8%, transparent);
}

.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:12px}
.page-header h1{font-size:calc(20px * var(--fs, 1));font-weight:600}

/* ─── Канонична таблица .tbl (+ .tbl-wrap) ───────────────────────
   Централизирано 2026-07-06 — премахнати локалните дефиниции по
   модулите (бяха ±1px копия на този стил). Модулни екстри (напр.
   .tbl tr.cur) остават локални. .tbl-wrap дава рамка + хоризонтален
   scroll на тесен екран; вътре .tbl е без собствена рамка.       */
.tbl-wrap{background:var(--bg2);border:1px solid var(--border);border-radius:10px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl{width:100%;border-collapse:collapse;background:var(--bg2);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.tbl-wrap .tbl{border:none;border-radius:0}
.tbl th{text-align:left;font-size:calc(13.5px * var(--fs, 1));text-transform:uppercase;letter-spacing:.4px;color:var(--muted);padding:11px 14px;border-bottom:1px solid var(--border);font-weight:600;background:var(--bg3);white-space:nowrap}
.tbl td{padding:11px 14px;border-bottom:1px solid var(--border);font-size:calc(16px * var(--fs, 1));vertical-align:middle}
.tbl tr:last-child td{border-bottom:none}
.tbl tbody tr:hover td{background:color-mix(in srgb, var(--accent) 5%, transparent)}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:768px){
  .tbl th,.tbl td{padding:8px 10px;font-size:calc(13.5px * var(--fs, 1));white-space:nowrap}
  /* Мобилно: 32px странични отстъпи са разточителни на 390px екран (07.07.2026).
     !important, защото модулните <style> блокове идват СЛЕД app.css и иначе
     печелят. Модули със собствен !important (m_inbox, m_ai) пак надделяват —
     техните правила са още по-късни в каскадата. */
  .main{padding:14px 14px 20px!important}
}


/* ─── Базова типография ─────────────────────────────────────── */
/* Паритет с клиентския портал (29.07.2026, по искане на Хазарос):
   менюто и работният текст да НЕ са по-дребни от порталните. */
body {
  /* 10.08.2026: 15.5 -> 16px — основата на мострата (еталон) */
  font-size:calc(16px * var(--fs, 1));
  line-height: 1.55;
  /* 21.09.2026: шрифтът беше в стила на всеки модул поотделно; 12 модула го нямаха
     (Справки, Разплащания, Формуляри…) и Safari ги показваше със серифен шрифт. */
  font-family:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
}
input, select, textarea, button { font-family: inherit; }

/* ─── Лява навигация (sidebar) ──────────────────────────────── */
.sidebar .nav-item        { font-size:calc(16px * var(--fs, 1)) !important; padding: 11px 20px !important; }
.sidebar-brand            { font-size:calc(18px * var(--fs, 1)) !important; }
/* 04.09.2026, Хазарос: „странно е, че подразделите са по-едри от заглавието
   на раздела". Измерено: пунктовете са 16px, а заглавията 12.5px (а новите
   групи дори 11px). Една стълбица за целия сайдбар:
     пункт 16 · заглавие на раздел 13.5 ВЕРСАЛИ 700 · обяснение 11.5
   Заглавието остава по-дребно на кегел, но версалите и теглото го правят
   по-тежко от пункта — иначе етикетът би се четял като още един пункт. */
.sidebar-section          { font-size:calc(13.5px * var(--fs, 1)) !important; font-weight:700 !important; }
.sidebar-user             { font-size:calc(15px * var(--fs, 1)) !important; }
.sidebar-user .urole      { font-size:calc(12.5px * var(--fs, 1)) !important; }

/* ─── Главни заглавия в страниците ──────────────────────────── */
.main h1,
.page-head h1,
.page-header h1           { font-size:calc(24px * var(--fs, 1)) !important; }
.main h2                  { font-size:calc(20px * var(--fs, 1)); }
.main h3                  { font-size:calc(18px * var(--fs, 1)); }

/* ─── Таблици (общ pattern) ────────────────────────────────── */
/* Вдигнати 29.07.2026 (критерий: работен текст ≥15px, етикети ≥13px) */
.main table th            { font-size:calc(13.5px * var(--fs, 1)); letter-spacing: 0.3px; }
.main table td            { font-size:calc(16px * var(--fs, 1)); }

/* ─── Форми (input/textarea/select) ─────────────────────────── */
.main input[type="text"],
.main input[type="number"],
.main input[type="email"],
.main input[type="search"],
.main input[type="password"],
.main input[type="date"],
.main input[type="tel"],
.main input[type="url"],
.main textarea,
.main select              { font-size:calc(16px * var(--fs, 1)); }

/* ─── ТИПОГРАФСКА СТЪЛБА — десет степени (12.09.2026) ────────────
   Преди този ден в платформата живееха 45 различни размера на текста в
   3107 декларации. Половин пиксел разлика не се вижда от никого: 14 и
   14.5 бяха 798 декларации, тоест едно решение, взето по два пъти. А
   деветте „странни" размера (14.7, 15.4, 16.1, 16.8, 18.2 …) бяха следа
   от еднократно умножаване на цял файл по 1.05.

   Степените, и за какво служи всяка:
     11.5  минимумът на екран — по-малко няма
     12.5  заглавие на колона, значка, чип
     13.5  вторичен текст, малък бутон
     15    основен текст: редове в таблица, бутони
     16    поле за въвеждане — под 16px телефонът увеличава страницата
           при фокус, затова тази степен е техническа, не естетическа
     18    заглавие на карта
     20    заглавие на екран
     24    число-акцент
     30    голям показател
     40    най-едрото

   ПРАВИЛОТО ПРИ СПОР: между два съседни размера се избира по-големият.
   ИЗКЛЮЧЕНИЕ: под 11.5px се слиза само в документ за ПЕЧАТ (invoice_pdf.php,
   касовата бележка в m06_invoices, ocr_export.php), където 9–11px е
   нормална типография за хартия. На екран — не.

   Пълното правило с примери: docs/AOS_dizain_pravilo.html
   ──────────────────────────────────────────────────────────────── */

/* ─── Бутони ───────────────────────────────────────────────── */
.main .btn,
.main button.btn,
.main .tpl-btn,
.main button[type="submit"]   { font-size:calc(15px * var(--fs, 1)); }
/* ПОПРАВКА 12.09.2026: горната група носи `.main button.btn` (0,2,1), а малката
   беше само с класове (0,2,0) — затова всеки <button class="btn btn-sm"> вземаше
   едрия кегел, а <a class="btn btn-sm"> — дребния. Един и същ бутон изглеждаше
   различно според това с какъв таг е написан. */
.main .btn-sm,
.main button.btn-sm,
.main a.btn-sm,
.main .tpl-btn-icon           { font-size:calc(13.5px * var(--fs, 1)); }

/* ПОПРАВКА 12.09.2026 (втора част): кеглите вече бяха изравнени тук, но
   ВИСОЧИНАТА не беше. Девет модула (Задължения, Контрол, Кантората, Пари,
   Система, Обратна връзка, Започване, Документи, Сканиране) предефинират
   .btn в собствения си <style>; той идва след app.css и с еднаква тежест,
   затова padding:9px 16px побеждаваше min-height:38px и бутоните на тези
   екрани бяха по-ниски от бутоните навсякъде другаде. Групата отдолу е с
   тежест (0,2,0)/(0,2,1) и връща канона, без да пипаме деветте файла. */
.main .btn,
.main a.btn,
.main button.btn {
  display:inline-flex; align-items:center; justify-content:center;
  box-sizing:border-box; min-height:38px; padding:0 18px; line-height:1.2;
}
.main .btn-sm,
.main a.btn-sm,
.main button.btn-sm { min-height:30px; padding:0 13px; }

/* ─── Карти „детайли" — често ползвани класове ─────────────── */
.detail-grid .lbl,
.meta-card .k             { font-size:calc(12.5px * var(--fs, 1)); }
.detail-grid .val,
.meta-card .v             { font-size:calc(15px * var(--fs, 1)); }

/* ─── Малки описания / muted bodies ────────────────────────── */
.step-desc,
.ctx-line,
.tpl-code                 { font-size:calc(15px * var(--fs, 1)); }


/* ─── Mobile / малки екрани ────────────────────────────────── */
@media (max-width: 760px) {
  body { font-size:calc(15px * var(--fs, 1)); }
  .main h1, .page-head h1, .page-header h1 { font-size:calc(24px * var(--fs, 1)) !important; }
}

/* ── Канонично поле за избор на клиент (20.08.2026, фийдбек на Хазарос:
   „всяко от полетата за избор на клиент е различно") ─────────────────
   Едно правило за всички екрани: тъмно, едро, четимо. Прилага се чрез
   class="ss-search" на <select>/<input> (или .cli-ac за autocomplete);
   локалните екрани override-ват само ширина при нужда. */
select.ss-search, input.ss-search, input.cli-ac {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 14px;
  color: var(--text);
  font-size: calc(16px * var(--fs, 1));
  font-family: inherit;
  min-width: 280px;
}
select.ss-search:focus, input.ss-search:focus, input.cli-ac:focus {
  border-color: var(--accent);
  outline: none;
}

/* ── Кликаемост (31.08.2026) ─────────────────────────────────────────
   Правило: щом нещо е кликаемо, трябва да си личи БЕЗ да го посочваш.
   · инлайн линк в изречение → подчертан
   · бутон, карта, таб, чип, пункт от меню → има кутия и реакция при hover,
     затова НЕ се подчертава (иначе е шум)
   Селекторът е нарочно тесен: подчертават се само голите <a href> без клас. */
a:not([class]){text-decoration:underline;text-underline-offset:.18em;text-decoration-thickness:1px}
a:not([class]):hover{text-decoration-thickness:2px}
.btn,a.btn,button{cursor:pointer}

/* ── Изключенията (31.08.2026, намерено в браузъра) ───────────────────
   app.css се зарежда СЛЕД <style> блока на модула (линкът идва от
   _sidebar.php, тоест по-надолу в документа). Затова правило от рода на
   `.of2 a{text-decoration:none}` в модула губи от `a:not([class])` тук —
   еднаква специфичност, печели последният. Резултатът беше подчертани
   табове ту на един екран, ту на друг, според това дали някой е сложил
   клас на анкера.

   Вместо всеки модул да помни да слага клас, изключенията се изброяват
   ТУК веднъж. Два класа = по-висока специфичност = навигацията печели.
   Правилото остава същото: подчертава се инлайн линк в изречение, не
   таб, меню, заглавен ред на таблица или троха. */
.of1 a:not([class]),
.of2 a:not([class]),
.sidebar a:not([class]),
.topbar a:not([class]),
.page-tb-crumb a:not([class]),
thead a:not([class]),
.tabs a:not([class]),
.filter-bar a:not([class]){text-decoration:none}

/* ═══ КОЕ СЕ НАТИСКА (08.09.2026 — правило на Хазарос) ═══════════════
   Казано много пъти: „не се разбира кое е за натискане и кое е просто
   текст". Дотук всеки екран решаваше сам и се получаваше различно.
   Правилото е ЕДНО и живее тук:

   1. Натискаемото има cursor:pointer — без изключения.
   2. Натискаемо, което НЕ е бутон (текст, ред в списък, заглавие на
      свито меню, етикет), носи СИНЬО ПОДЧЕРТАВАНЕ. Бутонът се познава
      по рамката си; текстът няма как, освен ако не му го кажем.
   3. Изключеният бутон изглежда ИЗКЛЮЧЕН — блед, с пунктирана рамка и
      забранен курсор. Дотук изгасналият бутон приличаше на надпис и
      човек го натискаше, без да разбира защо не става нищо.
   ═══════════════════════════════════════════════════════════════════ */
.btn, button, [role="button"], summary, .tag,
label.check-item, .cname, .rname, .pk-btn, .st-go,
[onclick]:not(input):not(select):not(textarea) { cursor: pointer; }

/* ПОПРАВКА (11.09.2026, Хазарос: „исках да намалим бутоните, да увеличим
   подчертания текст като в ДЕКСТ. Няма логика и бутон и подчертан текст").
   Версията от 08.09 подчертаваше и бутоните — и понеже рамката им беше
   невидима, подчертаването остана единственият знак и бутонът четеше като
   линк. Канонът е ТРИ вида натискаемо и те НЕ се смесват:

     1. ПЛЪТЕН бутон (.btn-primary) — едно главно действие на екран.
     2. ОЧЕРТАН бутон (.btn-secondary/.btn-ghost/.btn-danger) — има рамка
        (var(--btn-line)) и реакция при hover.
     3. ПОДЧЕРТАН ТЕКСТ (.tlink, .cname, .rname, .st-go, гол <a>) — няма
        кутия, затова носи подчертаване.

   Бутон + подчертаване = двоен знак за едно и също. Второстепенните
   действия не стават бутони, а .tlink. */
.cname, .rname, .st-go, .clickable, .tlink {
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}
.cname:hover, .rname:hover, .st-go:hover, .clickable:hover, .tlink:hover {
  text-decoration-thickness: 2px;
}
/* Бутонът се познава по кутията си — никога не се подчертава. */
.btn, a.btn, button, [role="button"], .tag {
  text-decoration: none;
}
.btn:hover, a.btn:hover, button:hover, [role="button"]:hover { text-decoration: none; }

/* .tlink — действие, написано като текст. Ползва се и върху <button>, за да
   не се налага действието да е линк само заради вида си. */
.tlink {
  background: none; border: 0; padding: 0; margin: 0;
  font: inherit; color: var(--accent); cursor: pointer;
}
.tlink:hover { color: var(--accent); opacity: .85; }
.tlink:disabled, .tlink[aria-disabled="true"] { opacity: .45; cursor: not-allowed; text-decoration: none; }

/* Заглавието на свито меню: стрелката е знакът, подчертаването е втори. */
summary { text-underline-offset: .2em; }
summary:hover { text-decoration: underline; text-decoration-color: var(--accent); }

/* Изтриващият бутон се различава по цвят (08.09.2026). Класът .btn-dn се
   ползваше на три места, но никъде не беше описан — изглеждаше като всеки
   друг бутон, а действието му е необратимо. */
.btn-dn { color: var(--red); border-color: rgba(248,113,113,.45); }
.btn-dn:hover:not(:disabled) { border-color: var(--red); color: var(--red); background: rgba(248,113,113,.10); }

/* Изключен бутон — не е текст, а бутон, който в момента не може. */
.btn:disabled, button:disabled, .btn[disabled], [role="button"][aria-disabled="true"] {
  opacity: .45;
  cursor: not-allowed;
  border-style: dashed;
  text-decoration: none;
}

/* ═══ СКРИТОТО Е СКРИТО (08.09.2026) ═════════════════════════════════
   Атрибутът hidden е правило на браузъра с НАЙ-НИСЪК приоритет: всеки наш
   клас с display го надвива. Така .btn{display:inline-flex} показваше
   бутони, които кодът е скрил — на екрана на Хазарос излязоха бутоните за
   страници върху едностраничен документ. Казано веднъж, тук. */
[hidden] { display: none !important; }

/* ═══ ДИАЛОЗИ (08.09.2026) ═══════════════════════════════════════════
   Диалогът излизаше в горния ляв ъгъл, върху менюто. Браузърът центрира
   <dialog> сам само докато никой не е пипал margin — а нашият нулиран
   margin в основния лист го е пипнал. Казваме го изрично, тук, веднъж. */
dialog { position: fixed; inset: 0; margin: auto; max-height: 86vh; overflow: auto; }
dialog::backdrop { background: rgba(5,7,12,.72); }

/* ═══ ИЗБОР НА КЛИЕНТ — наш списък, не браузърният ═══════════════════
   <datalist> се рисува от браузъра: Safari го дава сив с черен текст върху
   тъмен екран и НЕ се поддава на стилове. Затова списъкът е наш. */
.pickwrap { position: relative; display: inline-block; min-width: 0; }
/* Размерите на полето живеят при лентата, която го носи (виж _topbar.php).
   Тук само гарантираме, че полето не излиза извън обвивката си - иначе
   стара min-width върху input-а го изкарва върху текста до него. */
.pickwrap .pick { width: 100%; box-sizing: border-box; min-width: 0; max-width: none; }
.pickdd {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 60;
  max-height: 320px; overflow-y: auto;
  background: var(--bg2); border: 1px solid var(--border); border-radius: 10px;
  box-shadow: 0 12px 30px rgba(0,0,0,.45);
}
.pickdd .pi {
  padding: 9px 13px; cursor: pointer; font-size: calc(15px * var(--fs, 1));
  border-bottom: 1px solid var(--border); color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pickdd .pi:last-child { border-bottom: none; }
.pickdd .pi:hover, .pickdd .pi.on { background: color-mix(in srgb, var(--accent) 14%, transparent); }
.pickdd .pi.none { color: var(--muted); cursor: default; font-size: calc(13.5px * var(--fs, 1)); }
.pickdd .pi.none:hover { background: none; }

/* ═══ ТАБОВЕ — ЕДИН КАНОН (18.09.2026, обиколката) ═══════════════════════
   Дотук имаше пет стила за едно и също: .vtabs, .tp-tabs, .tpl-filter-bar,
   .tabs, .dn3, .opchip и .of1/.of2. Канонът е двете нива от Управление,
   копирани дословно от m_office.php (Кантората, Задължения, Пари, Контрол,
   Система вече ги носят еднакви). Ниво 1 = раздел на модула (рамкиран таб),
   ниво 2 = екраните в раздела (чипове). Модулите могат да махнат своите. */
.of1{display:flex;align-items:center;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--border);margin-bottom:4px}
.of1 a{padding:11px 18px;border-radius:10px 10px 0 0;font-size:calc(15px * var(--fs, 1));font-weight:600;
  color:var(--muted);border:1px solid transparent;border-bottom:none;position:relative;top:1px;text-decoration:none}
.of1 a:hover{color:var(--text)}
.of1 a.on{background:var(--bg2);border-color:var(--border);color:var(--text)}
.of1 .sub{display:block;font-size:calc(12.5px * var(--fs, 1));font-weight:400;color:var(--muted);margin-top:1px}
.of2{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0 18px}
.of2 a,.of2 span.on{padding:7px 14px;border-radius:9px;font-size:calc(15px * var(--fs, 1));
  border:1px solid var(--border);background:var(--bg2);color:var(--muted);text-decoration:none}
.of2 a:hover{border-color:var(--accent);color:var(--accent)}
.of2 span.on{background:var(--bg3);color:var(--text);font-weight:600}

/* ═══ КАРТА С ГЛАВА И ТЯЛО + ЗНАЧКА (18.09.2026) ══════════════════════════
   Документи ползва .card-h (описан локално там), .card-b (описан НИКЪДЕ —
   три диалога без отстъп) и .badge (описан НИКЪДЕ — значките излизаха като
   гол текст на шест места). Трите са общи парчета и живеят тук. */
.card-h{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.card-h .t{font-size:calc(18px * var(--fs, 1));font-weight:700}
.card-h .c{font-size:calc(15px * var(--fs, 1));color:var(--muted)}
.card-b{padding:14px 18px}
.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:999px;border:1px solid var(--border);
  background:var(--bg3);color:var(--muted);font-size:calc(12.5px * var(--fs, 1));font-weight:600;line-height:1.5;white-space:nowrap;text-decoration:none}
a.badge:hover{border-color:var(--accent);color:var(--accent)}

/* ═══ ЕДНО ПОВЕДЕНИЕ ПРИ ПОСОЧВАНЕ (18.09.2026, Хазарос: „като минеш през някои се
   оцветяват, през други се осветяват, през трети нищо не става") ═══════════════
   Три вида натискаемо — три реакции, и нищо друго:
     1. текст-линк, таб, чип, пункт в меню, заглавие на свито меню → текстът става син;
     2. очертан бутон → рамката и текстът стават сини; плътният само потъмнява;
        изтриващият става червен;
     3. кликаем ред в таблица → лек син воал.
   Правилата са с .main отпред, за да надделеят над локалните :hover в модулите,
   които дотук решаваха всеки по своему. */
.main a:hover, .main .tlink:hover, .main .of1 a:hover, .main .of2 a:hover, .main .tabs a:hover,
.main .dn3 a:hover, .main .q:hover, .main .cname:hover, .main .rname:hover, .main .st-go:hover,
.main .clickable:hover, .main summary:hover { color: var(--accent) !important; }
/* Защо !important (18.09.2026, втора част): стотици линкове носят цвета си в самия
   таг (style="color:var(--muted)"), а вграденият стил бие всяко правило от файл.
   И: много „линкове" не са <a>, а надписи с onclick — и те трябва да реагират. */
.main a:hover { color: var(--accent) !important; text-decoration-thickness: 2px; }
.main span[onclick]:hover, .main b[onclick]:hover, .main label[onclick]:hover, .main [role="link"]:hover,
.main .rowact:hover, .main a.badge:hover, .main .sb-todo:hover { color: var(--accent) !important; cursor: pointer; }
/* кликаем блок (ред-карта, елемент от списък) → лек син воал, не син текст */
.main div[onclick]:not(.card):not(.btn):hover, .main li[onclick]:hover { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.main .btn:hover:not(.btn-pr):not(.btn-primary):not(.btn-g):not(.btn-success):not(.btn-dn):not(:disabled) {
  border-color: var(--accent); color: var(--accent); background: var(--bg3); }
.main .btn-dn:hover:not(:disabled) { color: var(--red); border-color: var(--red); background: color-mix(in srgb, var(--red) 10%, transparent); }
.main .btn-pr:hover:not(:disabled), .main .btn-primary:hover:not(:disabled) { background: var(--btn-blue-h); border-color: var(--btn-blue-h); color: var(--on-fill); }
.main .btn-g:hover:not(:disabled), .main .btn-success:hover:not(:disabled) { background: var(--btn-blue-h); border-color: var(--btn-blue-h); color: var(--on-fill); }
.main tr[onclick]:hover td, .main tr.clickable-row:hover td, .main li[onclick]:hover { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.sidebar .nav-item:hover, .sidebar a.sb-grp:hover { color: var(--accent); }