/* Вид приложения — как у оригинала (D-0056; AccountingAI.APP: Tailwind + Nuxt UI): тёмная боковая панель с разделами, белая шапка,
   серый фон рабочей области, белые карточки и таблицы, основной цвет #2ED38A, шрифт Inter (иврит — Noto Sans Hebrew). */
:root {
  --primary: #2ed38a;
  --primary-dark: #20b874;
  --fg: #111827;          /* gray-900 */
  --text: #374151;        /* gray-700 */
  --muted: #6b7280;       /* gray-500 */
  --line: #e5e7eb;        /* gray-200 */
  --line-strong: #d1d5db; /* gray-300 */
  --field-line: #cad5e2;  /* ring-accented Nuxt UI оригинала (slate-300): рамка полей и вторичных кнопок */
  --text-default: #314158; /* text-default Nuxt UI (slate-700): вторичные кнопки, заголовки карточек */
  --bg: #ffffff;
  --surface: #ffffff;   /* карточки, таблицы, шапка */
  --canvas: #f9fafb;      /* gray-50 */
  --panel: #f3f4f6;       /* gray-100 */
  --accent: #059669;      /* ссылки: зелёный темнее основного — читается на белом */
  --danger: #dc2626;
  --ok: #16a34a;
  --warn: #d97706;
  --hover: #fcfcfd;
  --soft-line: #f3f4f6;
  --radius: .5rem;
  --shadow: 0 1px 2px rgba(0, 0, 0, .05);
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: var(--fg);
  background: var(--bg);
  -webkit-text-size-adjust: 100%;
}
[dir='rtl'] { font-family: 'Noto Sans Hebrew', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; letter-spacing: .02em; }

body { margin: 0; background: var(--canvas); min-height: 100vh; }
[x-cloak] { display: none !important; }
a { color: var(--accent); }
.icon { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }

/* ---- Раскладка как layouts/default.vue оригинала (D-0056, D-0105): на странице бизнеса (/t/<slug>/…) — боковая панель на всю высоту окна
   слева (в RTL — справа), 16rem или значками 4rem (свёрнута); шапка 3.5rem прилипает сверху, заголовок страницы стоит в ней ---- */
:root { --sidebar-w: 16rem; }
html.sidebar-collapsed { --sidebar-w: 4rem; }
.sidebar, .sidebar-toggle { display: none; }
html.in-tenant body { padding-inline-start: var(--sidebar-w); }
html.in-tenant .sidebar {
  display: flex; flex-direction: column; position: fixed; inset-block: 0; inset-inline-start: 0; width: var(--sidebar-w); z-index: 40;
  overflow: hidden; transition: width .3s;
  background: linear-gradient(180deg, #1f2937 0%, #111827 50%, #000 100%); color: #fff;
  border-inline-end: 1px solid #4b5563; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
}
.sidebar .logo { display: flex; flex: none; align-items: center; gap: .75rem; padding: 1rem 1.5rem; color: #fff; font-weight: 700; text-decoration: none; }
.sidebar .logo .logo-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.25rem; }
.sidebar .logo .logo-business { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .75rem; font-weight: 500; color: #90a1b9; }
.sidebar nav { display: flex; flex: 1; min-height: 0; overflow-x: hidden; overflow-y: auto; flex-direction: column; gap: .5rem; padding: 0 .75rem .5rem; }
/* overflow-x: hidden обязателен: при overflow-y: auto вторая ось вычисляется как auto, и длинный пункт даёт полосу прокрутки вбок */
.sidebar nav a, .sidebar summary {
  display: flex; align-items: center; gap: .75rem; padding: .5rem .75rem; border-radius: var(--radius);
  color: #fff; text-decoration: none; font-size: .875rem; font-weight: 500; line-height: 1.5rem; cursor: pointer; list-style: none; white-space: nowrap;
}
.sidebar nav .icon { width: 1.5rem; height: 1.5rem; padding: .125rem; box-sizing: border-box; }
/* подписка требует действия: в меню только «Billing» (isAppAccessBlocked оригинала, J3) */
.sidebar nav.billing-locked > :not([data-nav="billing"]) { display: none !important; }
.sidebar summary::-webkit-details-marker { display: none; }
.sidebar nav a:hover, .sidebar summary:hover { background: rgba(75, 85, 99, .2); }
.sidebar nav a[aria-current='page'] { background: rgba(75, 85, 99, .3); border-inline-start: 4px solid #9ca3af; margin-inline-start: -.25rem; }
/* пункт группы (SidebarSubmenu оригинала): рамка 2px без сдвига — текст не уезжает влево; группа текущего пункта подсвечена, как у оригинала */
.sidebar details > a[aria-current='page'] { border-inline-start-width: 2px; margin-inline-start: 1.5rem; padding-inline-start: calc(.75rem - 2px); }
.sidebar details:has(a[aria-current='page']) > summary { background: rgba(75, 85, 99, .3); color: #fff; border-inline-start: 4px solid #9ca3af; margin-inline-start: -.25rem; }
/* длинное название пункта группы переносится на две строки, как у оригинала («Profit and Loss Statement», «Document Number Report») */
.sidebar details > a { margin-inline-start: 1.5rem; margin-top: .25rem; font-weight: 400; color: #e5e7eb; white-space: normal; }
.sidebar details > a .icon { width: 1.25rem; height: 1.25rem; }
.sidebar summary .chevron { width: 1rem; height: 1rem; padding: 0; margin-inline-start: auto; transition: transform .2s; }
.sidebar details[open] > summary .chevron { transform: rotate(180deg); }
/* свёрнута: только значки, подписи — для чтения экрана; пункты групп не видны, как у оригинала */
html.sidebar-collapsed .sidebar .logo { justify-content: center; padding: .75rem 0; }
html.sidebar-collapsed .sidebar .logo span, html.sidebar-collapsed .sidebar nav a span, html.sidebar-collapsed .sidebar summary span {
  position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
html.sidebar-collapsed .sidebar summary .chevron, html.sidebar-collapsed .sidebar details > a { display: none; }
html.in-tenant .sidebar-toggle {
  display: flex; align-items: center; justify-content: center; position: fixed; bottom: 1.25rem; inset-inline-start: calc(var(--sidebar-w) - .75rem); z-index: 50;
  width: 1.75rem; height: 1.75rem; padding: 0; border-radius: 50%; border: 1px solid #4b5563; background: rgba(17, 24, 39, .9); color: #d1d5db; transition: inset-inline-start .3s;
}
html.in-tenant .sidebar-toggle:hover { background: #374151; color: #fff; }
.sidebar-toggle .icon { width: 1rem; height: 1rem; }
html.sidebar-collapsed .sidebar-toggle .icon, [dir='rtl'] .sidebar-toggle .icon { transform: scaleX(-1); }
html.sidebar-collapsed[dir='rtl'] .sidebar-toggle .icon { transform: none; }

header.top {
  display: flex; align-items: center; gap: 1rem; height: 3.5rem; padding: 0 1rem; box-sizing: border-box;
  background: var(--surface); border-bottom: 1px solid var(--line);
}
html.in-tenant header.top { position: sticky; top: 0; z-index: 39; }
header.top .brand { display: flex; align-items: center; gap: .5rem; font-weight: 700; color: var(--fg); text-decoration: none; }
html.in-tenant header.top .brand { display: none; }
header.top .menu-toggle { display: none; background: none; border: 0; padding: .5rem; color: var(--muted); }
header.top .who { margin-inline-start: auto; color: var(--muted); display: flex; gap: 0; align-items: center; }
select.lang { min-width: 7.5rem; }
/* заголовок страницы — в шапке, как h1 AppHeader оригинала (text-xl, font-semibold), рядом число строк списка */
html.in-tenant main > .title-row, html.in-tenant main > h1:first-child {
  position: fixed; top: 0; inset-inline-start: calc(var(--sidebar-w) + 1rem); z-index: 41; height: 3.5rem; margin: 0;
  display: flex; align-items: center; gap: .5rem; max-width: calc(100vw - var(--sidebar-w) - 20rem); transition: inset-inline-start .3s;
}
html.in-tenant main > .title-row h1, html.in-tenant main > h1:first-child {
  margin: 0; font-size: 1.25rem; font-weight: 600; line-height: 1.375; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.title-back { display: inline-flex; align-items: center; padding: .375rem; color: var(--muted); }
.title-back:hover { color: var(--fg); }
html.dark .title-back { color: rgba(255, 255, 255, .8); }
html.dark .title-back:hover { color: #fff; }
.title-back .icon { width: 1.25rem; height: 1.25rem; }

/* ---- Узкий экран: панель — поверх страницы по кнопке меню ---- */
@media (max-width: 767px) {
  html.in-tenant body { padding-inline-start: 0; }
  html.in-tenant .sidebar, html.in-tenant .sidebar-toggle { display: none; }
  html.in-tenant body.menu-open .sidebar { display: flex; inset: 0; z-index: 60; width: 100vw; }
  html.in-tenant header.top .menu-toggle { display: inline-flex; }
  html.in-tenant main > .title-row, html.in-tenant main > h1:first-child { inset-inline-start: 3.5rem; max-width: calc(100vw - 14rem); }
}

/* ---- Содержимое ---- */
main { max-width: 64rem; margin: 0 auto; padding: 1.5rem 1rem 1rem; box-sizing: border-box; width: 100%; }
main.wide-page { max-width: 80rem; }
/* отступ снизу — как сбоку и сверху (владелец 2026-11-04) */
html.in-tenant main { padding: 1rem; }
html.in-tenant main.wide-page { max-width: none; }
h1 { font-size: 1.5rem; line-height: 1.3; font-weight: 600; margin: 0 0 1.25rem; color: var(--fg); }
h2 { font-size: 1rem; font-weight: 600; margin: 1.75rem 0 .75rem; color: var(--fg); }
p { color: var(--text); }

.toolbar { display: flex; gap: .75rem; align-items: end; flex-wrap: wrap; margin-bottom: 1rem; }
.toolbar .toolbar { margin-bottom: 0; }
.field { display: flex; flex-direction: column; gap: .5rem; } /* подпись — mb-2 оригинала */
label { font-size: .875rem; line-height: 1.25rem; color: var(--text); font-weight: 500; }
input, select, textarea {
  /* поле Nuxt UI оригинала (UInput / USelect / UTextarea, size md): 36px, px-3 py-2, text-sm/5, ring-1 accented, rounded-md; фокус — ring-2 primary */
  font: inherit; font-size: .875rem; line-height: 1.25rem; padding: .4375rem .75rem; border: 1px solid var(--field-line); border-radius: .375rem;
  background: var(--surface); color: var(--fg); min-width: 10rem; box-sizing: border-box;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
select { height: 2.25rem; } /* line-height у select браузер не применяет — высота поля как у UInput (36px) */
input:not([type='checkbox']):not([type='radio']):not([type='file']):not([type='range']) { min-height: 2.25rem; }
h3 { line-height: 1.5rem; } /* text-lg leading-6 заголовков карточек оригинала */
input[type='checkbox'], input[type='radio'] { min-width: 0; width: 1rem; height: 1rem; margin: 0; accent-color: var(--primary); }
button {
  /* кнопка Nuxt UI оригинала (UButton md): 36px, px-3 py-2, text-sm/5, rounded-md; вторичная — ring accented, text-default */
  font: inherit; font-size: .875rem; font-weight: 500; line-height: 1.25rem; padding: .4375rem .75rem; border: 1px solid var(--field-line); border-radius: .375rem;
  background: var(--surface); color: var(--text-default); cursor: pointer; transition: background-color .15s, border-color .15s;
}
button:hover { background: var(--canvas); }
button.primary, form button[type='submit'] { background: var(--primary); border-color: var(--primary); color: #fff; }
button.primary:hover, form button[type='submit']:hover { background: rgba(46, 211, 138, .75); border-color: transparent; } /* hover:bg-primary/75 */
button.small { padding: .25rem .6rem; font-size: .8rem; }
/* UButton size="xl" оригинала (кнопки форм отчётов расходов, доходов, прибылей и убытков): text-base/6, px-3 py-2 — 40px */
button.xl { font-size: 1rem; line-height: 1.5rem; padding: .4375rem .75rem; }
/* UInput size="xl" оригинала (адреса письма отчёта о доходах): text-base, px-3 py-2 — 40px */
input.xl { font-size: 1rem; line-height: 1.5rem; padding: .4375rem .75rem; }
button:disabled { opacity: .5; cursor: not-allowed; }
.button { display: inline-block; padding: .45rem .9rem; border: 1px solid var(--primary); border-radius: .375rem; background: var(--primary); color: #fff; text-decoration: none; font-size: .875rem; font-weight: 500; }

/* таблицы — белой карточкой, как списки оригинала */
table { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
th, td { text-align: start; padding: .65rem .75rem; border-bottom: 1px solid var(--soft-line); vertical-align: middle; font-size: .875rem; }
th { font-size: .75rem; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: .03em; background: var(--canvas); border-bottom-color: var(--line); }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover td { background: var(--hover); }
td.actions button { margin-block: 0 .2rem; margin-inline: 0 .4rem; }
td.num, th.num { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
tr.total td { font-weight: 600; border-top: 2px solid var(--line); }
tr.sub td:first-child { padding-inline-start: 1.5rem; }
tr.off td { color: var(--muted); }

.badge { display: inline-block; padding: .1rem .55rem; border-radius: 1rem; font-size: .75rem; font-weight: 600; background: var(--panel); color: var(--text); }
.badge.done { background: #dcfce7; color: #166534; }
.badge.ok { background: #dcfce7; color: #166534; }
.badge.warn { background: #fef3c7; color: #92400e; }
.badge.bad { background: #fee2e2; color: #991b1b; }
tr.break td { background: #fef3c7; }
.error { color: var(--danger); margin: .25rem 0; }
.ok { color: var(--ok); }
.muted { color: var(--muted); }
.result { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: .9rem 1.1rem; margin-top: 1rem; box-shadow: var(--shadow); }
.form { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .75rem; align-items: end; }
fieldset.form { border: 0; padding: 0; margin: 0; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.25rem; margin-bottom: .75rem; display: flex; gap: 1rem; align-items: center; box-shadow: var(--shadow); }
.card .meta { color: var(--muted); font-size: .875rem; }
.card .go { margin-inline-start: auto; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.25rem; margin-bottom: 1rem; display: flex; flex-direction: column; gap: .6rem; max-width: 32rem; box-shadow: var(--shadow); }
.panel.editor { max-width: none; }
.panel.editor h2 { margin-top: 0; }
.login { max-width: 24rem; margin: 4rem auto; display: flex; flex-direction: column; gap: .75rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.75rem; box-shadow: var(--shadow); }
.codes { background: var(--canvas); border: 1px solid var(--line); border-radius: var(--radius); padding: .75rem 1rem; font-size: 1rem; }
.secret { word-break: break-all; font-size: .8rem; }
.business-head { display: flex; gap: .75rem; align-items: baseline; flex-wrap: wrap; }
.facts { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1.25rem; margin: 1rem 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.25rem; box-shadow: var(--shadow); }
.facts dt { color: var(--muted); font-size: .875rem; }
.doc-footer { white-space: pre-line; color: var(--muted); margin-top: 1rem; }
.doc-text { white-space: pre-line; margin-top: .75rem; }
.facts dd { margin: 0; font-size: .875rem; }
.facts > div { display: contents; }
.wide { grid-column: 1 / -1; }

/* учёт: проводки карточками, строки проводки — мелкой таблицей */
.entry { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: .75rem 1rem; margin-bottom: .75rem; box-shadow: var(--shadow); }
.entry header { display: flex; gap: .75rem; align-items: baseline; flex-wrap: wrap; }
.entry header .go { margin-inline-start: auto; }
.entry table { margin-top: .4rem; box-shadow: none; }
.entry table td, .entry table th { padding: .3rem .45rem; }
.lines input, .lines select { min-width: 6rem; width: 100%; }
.diff { color: var(--danger); font-weight: 600; }
.file-link { margin-inline-end: 1rem; }
.faq dt { font-weight: 600; margin-top: .75rem; }
.faq dd { margin: .25rem 0 0; }
/* подпись документа (D-0039): текст документа как есть, холст рисунка подписи */
.document-text { white-space: pre-wrap; border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.25rem; background: var(--surface); max-height: 32rem; overflow: auto; }
.signature-pad { border: 1px dashed var(--line-strong); border-radius: .375rem; background: var(--surface); touch-action: none; width: 100%; max-width: 32rem; height: 10rem; display: block; }

/* главная — блоки, как на дашборде оригинала (DashboardBlock): белая карточка, шапка с значком и счётчиком */
.dashboard { display: flex; flex-direction: column; gap: 1rem; }
.dashboard .row { display: grid; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); gap: 1rem; align-items: stretch; }
.block { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); display: flex; flex-direction: column; }
.block > header { display: flex; align-items: center; gap: .5rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--soft-line); }
.block > header h2 { margin: 0; font-size: 1rem; }
.block > header .icon { color: var(--primary); }
.block > header .count { min-width: 1.5rem; height: 1.5rem; padding: 0 .5rem; border-radius: 1rem; background: var(--primary); color: #fff; font-size: .75rem; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.block > header .go { margin-inline-start: auto; font-size: .875rem; }
.block > .body { padding: 1rem 1.25rem; flex: 1; }
.block > .body table { border: 0; box-shadow: none; border-radius: 0; }
.block .empty { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 1.5rem 0; color: var(--muted); font-size: .875rem; text-align: center; }
.block .empty .icon { width: 2rem; height: 2rem; color: #d1d5db; }
progress.bar { flex: 0 0 6rem; width: 6rem; height: .4rem; border: 0; border-radius: 1rem; background: var(--soft-line); overflow: hidden; appearance: none; }
progress.bar.wide { display: block; width: 100%; margin: .5rem 0; }
progress.bar::-webkit-progress-bar { background: var(--soft-line); }
progress.bar::-webkit-progress-value { background: var(--primary); }
progress.bar::-moz-progress-bar { background: var(--primary); }
.skeleton { height: .9rem; margin: .6rem 0; border-radius: .25rem; background: linear-gradient(90deg, var(--soft-line), var(--line), var(--soft-line)); background-size: 200% 100%; animation: skeleton 1.2s linear infinite; }
@keyframes skeleton { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .skeleton { animation: none; } }
.block-error { display: flex; align-items: center; gap: .75rem; color: var(--danger, #b91c1c); font-size: .875rem; }
.badge.late { background: #fee2e2; color: #991b1b; }
.late { color: var(--danger, #b91c1c); font-size: .8125rem; font-weight: 500; }
.block ul.steps li .icon { flex: 0 0 auto; color: var(--muted); }
.block ul.steps li.done .icon { color: #16a34a; }
.block ul.steps li .step-text { flex: 1; }
.block ul.list { list-style: none; margin: 0; padding: 0; }
.block ul.list li { display: flex; gap: .75rem; align-items: center; padding: .6rem 0; border-bottom: 1px solid var(--soft-line); font-size: .875rem; }
.block ul.list li:last-child { border-bottom: 0; }
.block ul.list li .amount { margin-inline-start: auto; font-variant-numeric: tabular-nums; font-weight: 500; }
.severity { font-size: .75rem; font-weight: 600; padding: .1rem .45rem; border-radius: .25rem; }
.severity.blocker { background: #fee2e2; color: #991b1b; }
.severity.warning { background: #fef3c7; color: #92400e; }
.severity.info { background: #dbeafe; color: #1e40af; }
.business-title { display: flex; align-items: center; gap: .75rem; }
.business-title h1 { margin: 0; }

/* шапка: кнопки-значки (p-2, значок 20px, без фона), счётчик вопросов, аватар с меню (как AppHeader оригинала) */
.icon-button { position: relative; display: inline-flex; align-items: center; justify-content: center; padding: .5rem;
  border: 0; border-radius: 0; background: transparent; color: var(--muted); text-decoration: none; transition: color .15s; }
.icon-button:hover { background: transparent; color: #374151; }
html.dark .icon-button { color: rgba(255, 255, 255, .8); background: transparent; }
html.dark .icon-button:hover { color: #fff; }
.icon-button .dot { position: absolute; bottom: .15rem; inset-inline-end: .1rem; min-width: 1rem; height: 1rem; padding: 0 .2rem; box-sizing: border-box; border-radius: 1rem;
  background: var(--primary); color: #111827; font-size: .625rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.theme-toggle .sun, html.dark .theme-toggle .moon { display: none; }
html.dark .theme-toggle .sun { display: block; }
.avatar { width: 2rem; height: 2rem; border-radius: 50%; background: var(--primary); color: #111827; font-size: .875rem; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center; text-decoration: none; cursor: pointer; list-style: none; }
.avatar::-webkit-details-marker { display: none; }
.profile-menu { position: relative; margin-inline-start: .5rem; }
.profile-panel { position: absolute; z-index: 50; top: calc(100% + .5rem); inset-inline-end: 0; width: 15rem; padding: .25rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: .375rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1); }
.profile-panel .profile-name { margin: 0; padding: .5rem .625rem; font-size: .875rem; font-weight: 600; color: var(--fg); border-bottom: 1px solid var(--line); overflow: hidden; text-overflow: ellipsis; }
.profile-panel .field { padding: .375rem .625rem; }
.profile-panel select { width: 100%; min-width: 0; }
.profile-panel .profile-item { display: flex; align-items: center; gap: .5rem; width: 100%; padding: .375rem .625rem; border: 0; border-radius: .375rem;
  background: none; color: var(--text); font-size: .875rem; text-decoration: none; text-align: start; }
.profile-panel .profile-item:hover { background: var(--panel); }
.profile-panel .profile-item .icon { width: 1.25rem; height: 1.25rem; color: var(--muted); }

/* тёмная тема (dark: оригинала — gray-900 / gray-800) */
html.dark {
  /* тёмная тема — токены Nuxt UI оригинала (slate): фон и карточки — bg slate-900, рамка карточек — border slate-800, полей — accented slate-700 */
  --field-line: #314158; --text-default: #e2e8f0;
  /* карточки — с фоном, как карточки «Dashboard» (#1d293d), а не рамкой на фоне страницы; линии — #314158, иначе сливаются с карточкой
     (владелец 2026-11-09: «бордер с бэкграундом на всех страницах»); поля внутри остаются тёмными (#0f172b) */
  --fg: #f8fafc; --text: #cad5e2; --muted: #90a1b9; --line: #314158; --line-strong: #45556c; --surface: #1d293d; --canvas: #0f172b;
  --panel: #314158; --hover: #1d293d; --soft-line: #1d293d; --accent: #34d399; color: var(--fg); background: var(--canvas);
}
html.dark header.top { background: linear-gradient(90deg, #1d293d, #0f172b 50%, #000); border-color: #45556c; }
html.dark input, html.dark select, html.dark textarea { background: #0f172b; color: var(--fg); border-color: var(--line-strong); }
html.dark button:where(:not(.primary):not(.icon-button):not([type='submit'])) { background: #1d293d; color: var(--text); border-color: var(--line-strong); }
html.dark th { background: #18212f; }
html.dark .badge { background: #314158; color: #e2e8f0; }
html.dark .badge.done { background: #14532d; color: #bbf7d0; }
html.dark .badge.ok { background: #14532d; color: #bbf7d0; }
html.dark .badge.warn { background: #78350f; color: #fde68a; }
html.dark .badge.bad { background: #7f1d1d; color: #fecaca; }
html.dark tr.break td { background: #422006; }

/* общий список (D-0057), вид — table-layout.vue и TabulatorTable оригинала (D-0105): панель одной карточкой, фильтры карточкой, таблица
   с шапкой 2px, строки через одну (светлая: gray-100 / gray-50, тёмная: gray-900 / gray-800), текст обрезается многоточием */
.list-view { display: flex; flex-direction: column; }
.list-toolbar { display: flex; gap: .75rem; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-bottom: 1rem; padding: .5rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: .5rem; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1); }
.list-left, .list-tools, .list-filter-buttons { display: flex; align-items: center; flex-wrap: wrap; }
.list-left { gap: .75rem; }
.list-tools { gap: .5rem; margin-inline-start: auto; }
.list-filter-buttons { gap: .5rem; }
.list-search { position: relative; }
.list-search .icon { position: absolute; top: 50%; inset-inline-start: .75rem; width: 1rem; height: 1rem; transform: translateY(-50%); color: #9ca3af; pointer-events: none; }
.list-search input { width: 12rem; min-width: 0; padding: .5rem 3rem .5rem 2.5rem; border: 1px solid transparent; border-radius: .5rem;
  background: #f3f4f6; color: #111827; font-size: .875rem; line-height: 1.25rem; }
.list-search input::placeholder { color: #9ca3af; }
html.dark .list-search input { background: #314158; color: #f1f5f9; border-color: transparent; }
.list-tool { display: inline-flex; align-items: center; gap: .375rem; padding: .5rem .75rem; border: 0; border-radius: .25rem; background: transparent;
  color: #111827; font-size: .875rem; font-weight: 500; line-height: 1.25rem; text-decoration: none; white-space: nowrap; cursor: pointer; transition: all .2s; }
.list-tool:hover { background: var(--primary); color: #fff; }
html.dark .list-tool, html.dark button.list-tool:not(.primary) { background: transparent; color: #f8fafc; }
html.dark .list-tool:hover, html.dark button.list-tool:not(.primary):hover { background: var(--primary); color: #fff; }
.list-tool .icon { width: 1rem; height: 1rem; }
.list-tool .list-chevron { margin-inline-start: .125rem; }
.list-tool .list-clear-x { width: .75rem; height: .75rem; margin-inline-start: -.95rem; margin-top: .55rem; }
.list-tool .list-clear-x + span { margin-inline-start: .2rem; }
.list-tool.list-tool-icon { padding-inline: .5rem; }
.list-count { padding: .125rem .375rem; border-radius: 9999px; background: var(--primary); color: #fff; font-size: .75rem; font-weight: 700; line-height: 1rem; }
html.dark .list-count { color: #000; }
.list-count:empty { display: none; }
.list-menu { position: relative; }
.list-panel { position: absolute; z-index: 30; top: calc(100% + .25rem); inset-inline-start: 0; min-width: 14rem; max-height: 22rem; overflow-y: auto;
  background: var(--surface); border: 1px solid var(--line); border-radius: .375rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);
  padding: .25rem; display: flex; flex-direction: column; gap: 0; }
html.dark .list-panel { background: #1d293d; border-color: #314158; }
.list-panel[hidden] { display: none; }
.list-panel .check { display: flex; gap: .5rem; align-items: center; padding: .375rem .5rem; border-radius: .25rem; font-weight: 400; color: var(--text); cursor: pointer; }
.list-panel .check:hover { background: var(--panel); }
.list-panel a, .list-panel > button { display: block; text-align: start; padding: .4rem .6rem; border: 0; background: none; color: var(--text); text-decoration: none; border-radius: .375rem; }
.list-panel a:hover, .list-panel > button:hover { background: var(--panel); }
.list-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; padding: 1rem; margin-bottom: .5rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: .5rem; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05); }
.list-filters[hidden] { display: none; }
.list-filters .field { gap: .5rem; }
.list-filters label { color: #111827; }
html.dark .list-filters label { color: #f1f5f9; }
.list-filters select, .list-filters input { width: 100%; min-width: 0; padding: .55rem .75rem; }
@media (max-width: 767px) { .list-filters { grid-template-columns: 1fr; } }
.list-table-wrap { background: var(--surface); border: 1px solid var(--line); border-radius: .5rem; box-shadow: 0 2px 4px rgba(0, 0, 0, .05); }
.list-table-wrap[hidden] { display: none; }
table.list-table { table-layout: fixed; border: 0; border-radius: .5rem; box-shadow: none; background: transparent; overflow: visible; }
/* таблица страницы без list.js — ширина по содержимому (владелец 2026-11-09, /forecast): числа, даты, значки — по ширине значения
   в одну строку, колонка .grow (Description) — всё остальное место */
table.list-table.fit { table-layout: auto; width: 100%; }
table.list-table.fit th, table.list-table.fit td { width: 1%; white-space: nowrap; }
table.list-table.fit th.grow, table.list-table.fit td.grow { width: auto; min-width: 12rem; white-space: normal; overflow-wrap: anywhere; }
.list-table th { padding: .6875rem .375rem; /* шапка Tabulator оригинала — 45px */ background: var(--surface); color: #111827; font-size: .875rem; font-weight: 600; line-height: 1.3125rem;
  text-transform: none; letter-spacing: normal; border-bottom: 2px solid var(--line); border-inline-end: 1px solid var(--line);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: start; }
.list-table th:first-child { border-start-start-radius: .5rem; }
.list-table th:last-child { border-start-end-radius: .5rem; border-inline-end: 0; }
.list-table th.sortable:hover, .list-table th[aria-sort='ascending'], .list-table th[aria-sort='descending'] { background: #f3f4f6; }
html.dark .list-table th { background: #1d293d; color: #cad5e2; }
html.dark .list-table th.sortable:hover, html.dark .list-table th[aria-sort='ascending'], html.dark .list-table th[aria-sort='descending'] {
  background: #374151; color: #f3f4f6; box-shadow: inset 0 -2px 0 #6b7280; }
.list-sort { display: flex; align-items: center; justify-content: space-between; gap: .5rem; width: 100%; border: 0; background: none; padding: 0;
  font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; cursor: pointer; text-align: start; overflow: hidden; }
html.dark .list-table .list-sort, html.dark .list-table .list-sort:hover { background: none; color: inherit; border: 0; }
.list-arrow { flex: 0 0 auto; width: 0; height: 0; margin-inline-end: .375rem; border-inline: 6px solid transparent; border-bottom: 6px solid #9ca3af; }
html.dark .list-arrow { border-bottom-color: #62748e; }
th[aria-sort='ascending'] .list-arrow { border-bottom-color: #374151; }
th[aria-sort='descending'] .list-arrow { border-bottom: 0; border-top: 6px solid #374151; }
html.dark th[aria-sort='ascending'] .list-arrow { border-bottom-color: #cad5e2; }
html.dark th[aria-sort='descending'] .list-arrow { border-top-color: #cad5e2; }
.list-table td { padding: .5625rem .375rem; /* строка Tabulator оригинала — 40px */ color: #111827; font-size: .875rem; line-height: 1.3125rem; border-bottom: 1px solid var(--line);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.list-table tbody tr.row-odd td { background: #f3f4f6; }
.list-table tbody tr.row-even td { background: #f9fafb; }
.list-table tbody tr:hover td { background: #f3f4f6; }
html.dark .list-table td { color: #cad5e2; }
html.dark .list-table tbody tr.row-odd td { background: #0f172b; }
html.dark .list-table tbody tr.row-even td { background: #1d293d; }
/* таблицы страниц без list.js (строки из x-for) — те же полосы через одну, что у общего списка (владелец 2026-11-09) */
.list-table tbody tr:not(.row-odd):not(.row-even):nth-of-type(odd) td { background: #f3f4f6; }
.list-table tbody tr:not(.row-odd):not(.row-even):nth-of-type(even) td { background: #f9fafb; }
html.dark .list-table tbody tr:not(.row-odd):not(.row-even):nth-of-type(odd) td { background: #0f172b; }
html.dark .list-table tbody tr:not(.row-odd):not(.row-even):nth-of-type(even) td { background: #1d293d; }
.list-table tbody tr:not(.row-odd):not(.row-even):nth-of-type(n):hover td { background: #e5e7eb; }
html.dark .list-table tbody tr:not(.row-odd):not(.row-even):nth-of-type(n):hover td { background: #314158; }
html.dark .list-table tbody tr:hover td { background: #314158; }
.list-table tbody tr:last-child td { border-bottom: 0; }
.list-table tbody tr:last-child td:first-child { border-end-start-radius: .5rem; }
.list-table tbody tr:last-child td:last-child { border-end-end-radius: .5rem; }
.list-table tr.linked { cursor: pointer; }
.list-table td a { color: inherit; text-decoration: none; }
.list-table td a:hover { text-decoration: underline; }
/* ссылки колонок, как форматтеры оригинала: клиент и документ в транзакциях — text-primary; клиент в регулярных — синяя подчёркнутая */
.list-table td a.link-primary { color: var(--primary); }
.list-table td a.link-blue { color: #155dfc; text-decoration: underline; }
.list-table td a.link-blue:hover { opacity: .8; }
html.dark .list-table td a.link-blue { color: #51a2ff; }
.list-table button.link { border: 0; background: none; padding: 0; font: inherit; color: var(--accent); cursor: pointer; }
.list-table .badge { padding: .125rem .625rem; font-size: .75rem; font-weight: 500; line-height: 1rem; }
.money-pos { color: #16a34a; }
.money-neg { color: #dc2626; }
html.dark .money-pos { color: #4ade80; }
html.dark .money-neg { color: #f87171; }
.entry-panel { max-width: none; }
.entry-panel header { display: flex; gap: .75rem; align-items: baseline; flex-wrap: wrap; }
.entry-panel header button { margin-inline-start: auto; }
.entry-panel table { box-shadow: none; }
tr.list-group td { background: var(--canvas); font-weight: 600; font-size: .8rem; color: var(--muted); }
td.list-actions, th.list-actions { width: 2.5rem; padding-inline: 0; text-align: center; overflow: visible; }
.list-table td.list-actions { overflow: visible; padding-block: 0; }
.list-dots { display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; padding: 0; border: 0; border-radius: .25rem;
  background: none; color: inherit; font-size: .875rem; font-weight: 600; line-height: 1; letter-spacing: 0; }
.list-dots:hover { background: rgba(15, 23, 42, .06); }
/* «•••» — без фона везде, не только в таблице (владелец 2026-11-09: шапка карточки, сохранённые карты, строки выписки счёта) */
html.dark .list-dots { background: none; color: #fff; border: 0; box-shadow: none; }
html.dark .list-dots:hover { background: rgba(255, 255, 255, .08); }
.list-panel.list-panel-end { inset-inline-start: auto; inset-inline-end: 0; min-width: 10rem; padding: .25rem 0; border-radius: .375rem; }
html.dark .list-panel.list-panel-end { background: #314158; border-color: #45556c; }
.list-panel.list-panel-end a, .list-panel.list-panel-end > button { padding: .5rem .75rem; border-radius: 0; font-size: .875rem; line-height: 1.25rem; color: #374151; }
.list-panel.list-panel-end a:hover, .list-panel.list-panel-end > button:hover { background: #f3f4f6; }
html.dark .list-panel.list-panel-end a, html.dark .list-panel.list-panel-end > button { color: #cad5e2; background: none; border: 0; }
html.dark .list-panel.list-panel-end a:hover, html.dark .list-panel.list-panel-end > button:hover { background: #45556c; }
.list-footer { display: flex; justify-content: center; margin-top: .75rem; }
.list-footer:empty { display: none; }
.title-row { display: flex; align-items: center; gap: .6rem; }
.title-row h1 { margin: 0; }
.title-count { padding: .25rem .5rem; border-radius: 9999px; background: var(--primary); color: #fff; font-size: .75rem; font-weight: 700; line-height: .75rem; }
html.dark .title-count { color: #000; }
.title-count:empty { display: none; }

/* вкладки карточки (D-0059): как вкладки карточек оригинала — подчёркнутая текущая */
.tabs { display: flex; gap: .25rem; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin: .5rem 0 1.25rem; }
.tabs .tab { border: 0; border-bottom: 2px solid transparent; background: none; border-radius: 0; padding: .55rem .9rem; color: var(--muted); font-weight: 500; cursor: pointer; }
.tabs .tab:hover { color: var(--fg); }
a.tab { text-decoration: none; }
.tabs .tab.current { color: var(--fg); border-bottom-color: var(--primary); }
.chips { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin: .5rem 0 1rem; }
.chips li { display: inline-flex; align-items: center; gap: .35rem; background: var(--panel); border-radius: 999px; padding: .2rem .35rem .2rem .75rem; }

/* профиль бизнеса: логотип и подпись (D-0073) */
.image-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1rem; }
.image-slot { border: 1px solid var(--line-strong); border-radius: .5rem; padding: .75rem; }
.business-image { display: block; max-width: 100%; max-height: 8rem; margin-bottom: .5rem; }
.signature-pad { display: block; width: 100%; max-width: 400px; aspect-ratio: 5 / 2; border: 1px dashed var(--muted); border-radius: .375rem; background: #fff; touch-action: none; cursor: crosshair; margin-bottom: .5rem; }
/* «Add document» — выбор вида документа (D-0094) */
.add-menu { position: relative; margin-inline-start: auto; }
.add-menu summary { list-style: none; cursor: pointer; }
.add-menu summary::-webkit-details-marker { display: none; }
.add-menu ul { position: absolute; inset-inline-end: 0; z-index: 20; margin: .25rem 0 0; padding: .25rem 0; list-style: none; min-width: 14rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.add-menu li a { display: block; padding: .4rem .9rem; color: inherit; text-decoration: none; }
.add-menu li a:hover, .add-menu li a:focus { background: var(--line); }
tr.subtotal td { font-weight: 600; border-top: 1px solid var(--line); }
.password-toggle { margin-top: .25rem; }
/* Вход как у оригинала (D-0101): страница без шапки, логотип над карточкой, широкие кнопки */
body.auth-body { background: var(--canvas); }
.auth-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 3rem 1rem; }
.auth-wrap { width: 100%; max-width: 28rem; display: flex; flex-direction: column; gap: 1.5rem; }
.auth-brand { display: flex; align-items: center; justify-content: center; gap: .75rem; color: var(--fg); font-size: 1.875rem; font-weight: 700; text-decoration: none; }
.auth-page .login { max-width: none; margin: 0; padding: 2rem; border-radius: .75rem; border: 0; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25); gap: 1rem; }
.auth-page .login h1 { text-align: center; font-size: 1.5rem; margin: 0 0 1rem; }
.auth-page .login input { width: 100%; padding: .7rem .85rem; font-size: 1rem; }
.auth-page .wide-button { width: 100%; justify-content: center; padding: .7rem 1rem; font-size: 1rem; margin-top: .5rem; }
.auth-links { text-align: center; color: var(--muted); display: flex; flex-direction: column; gap: .5rem; }
.auth-links p { margin: 0; }
.auth-links a { color: var(--accent); text-decoration: underline; }
.auth-notice { border: 1px solid #fde68a; background: #fffbeb; color: #78350f; border-radius: .5rem; padding: .75rem 1rem; font-size: .875rem; }
.auth-notice p { margin: 0; }
.auth-notice p + p { margin-top: .25rem; }
.auth-lang { display: flex; justify-content: center; }
.auth-error { text-align: center; }
/* подсказка про письмо подтверждения под ошибкой входа (login.verify_hint) */
.auth-hint { text-align: center; color: var(--muted); font-size: .875rem; margin: -.25rem 0 0; }
html.dark .auth-notice { border-color: rgba(146, 64, 14, .6); background: rgba(69, 26, 3, .4); color: #fef3c7; }
.auth-page .field { position: relative; }
.auth-page .password-toggle { position: absolute; inset-inline-end: .5rem; bottom: .55rem; margin: 0; padding: .15rem .4rem; border: 0; background: none; color: var(--accent); font-size: .8rem; box-shadow: none; }
.auth-page input[type="password"], .auth-page input[data-toggle] { padding-inline-end: 7.5rem; }
.auth-page .login h1 + p { text-align: center; }
.auth-inline-links { text-align: center; color: var(--muted); margin: .5rem 0 0; }
.auth-inline-links a { color: var(--accent); text-decoration: underline; }
/* итог страниц входа (письмо отправлено, почта подтверждена, ошибка ссылки) — как register-success / register-confirm оригинала:
   значок, заголовок и текст по центру, главное действие — кнопкой на всю ширину, подсказки — мелко серым (владелец 2026-11-12) */
.auth-page .login.auth-result { text-align: center; gap: .75rem; }
.auth-result .auth-result-icon { width: 4rem; height: 4rem; margin: 0 auto .25rem; color: var(--primary); }
.auth-result .auth-result-icon.ok { color: #22c55e; }
.auth-result .auth-result-icon.bad { color: #ef4444; }
.auth-page .login.auth-result h1 { margin: 0; }
.auth-result p { margin: 0; color: var(--muted); }
.auth-result .auth-result-note { font-size: .875rem; }
.auth-result .auth-error-text { color: #ef4444; }
.auth-result a.button.primary { display: block; box-sizing: border-box; width: 100%; text-align: center; padding: .7rem 1rem; font-size: 1rem; margin-top: .5rem; }
/* согласие с условиями на регистрации (register.vue оригинала: галочка и две ссылки на сайт варианта) */
.auth-terms { display: flex; align-items: flex-start; gap: .6rem; font-size: .875rem; color: var(--fg); cursor: pointer; }
.auth-page .auth-terms input[type="checkbox"] { width: 1rem; height: 1rem; padding: 0; margin: .15rem 0 0; flex: none; }
.auth-terms a { color: var(--accent); text-decoration: underline; }
/* «Новый бизнес» после регистрации — форма по центру страницы, а не у левого края (владелец 2026-11-12) */
main.center-page > .panel { margin-inline: auto; width: 100%; }
/* форма поверх списка — карточкой (окна Import / Create оригинала, D-0105) */
.sheet { background: var(--surface); border: 1px solid var(--line); border-radius: .5rem; padding: 1rem 1.25rem; margin-bottom: 1rem;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1); }
.sheet > h2:first-child { margin-top: 0; }
/* карточка контрагента как ClientInfoForm и ClientTabs оригинала (D-0105): белая / gray-800 карточка, вкладки h-14 со значками,
   текущая — зелёная жирная с чертой 2px; форма — сетка в четыре колонки, разделы — заголовками 18px; «Active» — переключатель */
.party-card { background: var(--surface); border: 1px solid var(--line); border-radius: .5rem; }
/* карточка — до низа окна и при пустой вкладке, как у оригинала (h-full) */
.party-card { display: flex; flex-direction: column; min-height: calc(100vh - 6.5rem); box-sizing: border-box; }
.party-card > .party-body { flex: 1; }
/* вкладка-список карточки тянется на всю высоту карточки, пустой список — текст по центру высоты (владелец 2026-11-09, «во всех гридах»);
   x-show скрытой вкладки ставит display: none в style — он сильнее этих правил */
.party-card > .party-body { display: flex; flex-direction: column; }
.party-body > section.flush { flex: 1; display: flex; flex-direction: column; }
.party-body > section.flush > div:has(> .list-view), .party-body > section.flush > .list-view,
.party-body > section.flush > div > .list-view { flex: 1; display: flex; flex-direction: column; }
.party-body > section.flush .list-view > .list-table-wrap { flex: 1; }
html.dark .party-card { border-color: #45556c; }
.party-tabs { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; min-height: 3.5rem; border-bottom: 1px solid var(--line); }
/* вкладки на компьютере — переносом, видны все (владелец 2026-11-09: «оставить перенос, но красиво и удобно»): у каждой строки вкладок
   своя линия снизу во всю ширину, текущая вкладка подчёркнута на своей строке; «•••» и переключатель — справа от первой строки */
.party-tabs .tabs { display: flex; flex-wrap: wrap; flex: 1 1 auto; min-width: 0; gap: 0; margin: 0 0 -1px; border: 0;
  background-image: repeating-linear-gradient(to bottom, transparent 0 calc(3.5rem - 1px), var(--line) calc(3.5rem - 1px) 3.5rem); }
.party-tabs .tabs .tab { flex-shrink: 0; }
.party-tabs .tabs .tab { display: flex; align-items: center; gap: .25rem; box-sizing: border-box; height: 3.5rem; margin-bottom: 0; padding: 1rem; border: 0; border-bottom: 2px solid transparent;
  border-radius: 0; background: none; color: #6b7280; font-size: .875rem; font-weight: 500; line-height: 1.25rem; white-space: nowrap; }
html.dark .party-tabs .tabs .tab { background: none; border: 0; border-bottom: 2px solid transparent; color: #62748e; }
.party-tabs .tabs .tab:hover { color: #374151; border-bottom-color: #d1d5db; }
html.dark .party-tabs .tabs .tab:hover { color: #cad5e2; border-bottom-color: #45556c; }
.party-tabs .tabs .tab.current, html.dark .party-tabs .tabs .tab.current { color: var(--primary); font-weight: 700; border-bottom-color: var(--primary); }
.party-tabs .tabs .tab .icon { width: 1rem; height: 1rem; }
.party-body { padding: 1rem; }
.party-body > section > h2:first-child { margin-top: 0; }
.party-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; align-items: end; }
.party-form .wide, .party-form .section-title { grid-column: 1 / -1; }
.party-form .row-start { grid-column-start: 1; }
.party-form .bank-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.party-body .section-title { margin: .5rem 0 0; font-size: 1.125rem; font-weight: 600; line-height: 1.75rem; color: #111827; }
.party-body .party-form > .section-title:first-child { margin-top: 0; }
html.dark .party-body .section-title { color: #f8fafc; }
.party-body .section-title label { font: inherit; color: inherit; }
.party-body > section > .section-title { margin-top: 1.25rem; }
.party-body .field { gap: 0; }
.party-body .field label { margin-bottom: .25rem; color: #374151; font-size: .875rem; font-weight: 500; line-height: 1.3125rem; }
html.dark .party-body .field label { color: #cad5e2; }
.party-body input:not([type='checkbox']):not([type='radio']):not([type='file']), .party-body select, .party-body textarea {
  width: 100%; min-width: 0; height: 2.25rem; padding: .5rem .75rem; border: 1px solid #d1d5db; border-radius: .375rem;
  background: #fff; color: #111827; font-size: .875rem; line-height: 1.25rem; }
html.dark .party-body input:not([type='checkbox']):not([type='radio']):not([type='file']), html.dark .party-body select, html.dark .party-body textarea {
  background: #0f172a; color: #fff; border-color: #314158; }
.party-body input:disabled { opacity: .75; cursor: not-allowed; }
.party-body textarea.party-notes { display: block; height: 6.25rem; margin-top: .5rem; resize: vertical; }
.party-actions { display: flex; align-items: center; gap: .75rem; margin-top: 1.5rem; }
.party-actions button, .party-actions .button { display: inline-flex; align-items: center; justify-content: center; height: 2.375rem; min-width: 7.5rem; padding: .5rem 1rem; border-radius: .375rem; font-size: .875rem; font-weight: 500; text-align: center; box-sizing: border-box; }
.party-actions button.primary { background: var(--primary); border: 0; color: #fff; }
html.dark .party-actions button.primary { color: #0f172a; }
.button.secondary { background: #fff; border: 1px solid #d1d5db; color: #374151; }
.button.secondary:hover { background: #f9fafb; }
html.dark .button.secondary { background: #314158; border-color: #45556c; color: #cad5e2; }
html.dark .button.secondary:hover { background: #45556c; }
/* переключатель «Active» (USwitch оригинала): дорожка 44×24, зелёная, когда включено */
.switch { display: inline-flex; align-items: center; gap: .5rem; margin-inline-end: 1rem; font-size: .875rem; font-weight: 500; color: var(--fg); cursor: pointer; white-space: nowrap; }
.switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.switch-track { position: relative; width: 2.75rem; height: 1.5rem; border-radius: 9999px; background: #d1d5db; transition: background .2s; flex: 0 0 auto; }
html.dark .switch-track { background: #45556c; }
.switch-track::after { content: ''; position: absolute; top: .125rem; inset-inline-start: .125rem; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: #fff; transition: transform .2s; }
.switch input:checked + .switch-track { background: var(--primary); }
.switch input:checked + .switch-track::after { transform: translateX(1.25rem); }
[dir='rtl'] .switch input:checked + .switch-track::after { transform: translateX(-1.25rem); }
.switch input:focus-visible + .switch-track { outline: 2px solid var(--primary); outline-offset: 2px; }
@media (max-width: 767px) {
  .party-form { grid-template-columns: 1fr; }
  .party-form .bank-row { grid-template-columns: 1fr; }
}
/* вкладки карточки (docs/notes/original-client-card.md, D-0105): справа — переключатель, сальдо выписки и «•••» вкладки */
.tab-side { display: flex; align-items: center; gap: 1rem; min-height: 3.5rem; margin-inline: auto 1rem; }
.tab-side .switch { margin-inline-end: 0; }
.tab-balance { color: #6b7280; font-size: .875rem; white-space: nowrap; }
.tab-balance strong { color: var(--fg); font-weight: 700; }
.tab-balance { display: inline-flex; align-items: center; gap: .5rem; } /* «Balance: ? сумма» — с промежутками, как у оригинала (владелец 2026-11-09) */
.list-panel .menu-item { display: flex; align-items: center; gap: .5rem; width: 100%; padding: .5rem .75rem; border: 0; border-radius: 0; background: none;
  color: #374151; font-size: .875rem; line-height: 1.25rem; text-align: start; text-decoration: none; white-space: nowrap; cursor: pointer; }
.list-panel .menu-item:hover { background: #f3f4f6; }
html.dark .list-panel .menu-item { color: #cad5e2; background: none; border: 0; }
html.dark .list-panel .menu-item:hover { background: #45556c; }
.list-panel .menu-item .icon { width: 1rem; height: 1rem; }
.list-panel .danger-item, html.dark .list-panel .danger-item { color: #dc2626; }
html.dark .list-panel .danger-item { color: #f87171; }
/* таблицы вкладок — во всю ширину карточки, без своей рамки */
.party-body > section.flush { margin: -1rem; }
.party-body > section.flush .list-table-wrap { border: 0; border-radius: 0 0 .5rem .5rem; box-shadow: none; }
.party-body > section.flush .list-table th:first-child, .party-body > section.flush .list-table th:last-child { border-radius: 0; }
.party-body > section.flush .list-empty, .party-body > section.flush .list-footer .muted { padding: 3rem 1rem; text-align: center; font-weight: 600; color: var(--muted); }
.list-table .col-id { width: 5rem; }
.list-table button.link.plain { color: inherit; text-decoration: none; }
.list-table tr.list-group td { background: #f3f4f6; border-bottom: 2px solid #e5e7eb; padding: .5rem; font-size: .875rem; font-weight: 600; color: var(--fg); }
html.dark .list-table tr.list-group td { background: #0f172b; border-bottom-color: #314158; color: #cad5e2; }
/* статусы документов (IncomeListPage) и подписей — бейджи оригинала: 100 / 800, тёмная 900/20 / 300 */
.list-table .badge { min-height: 1.375rem; box-sizing: border-box; display: inline-flex; align-items: center; }
.badge.st-draft { background: #fef9c3; color: #854d0e; } html.dark .badge.st-draft { background: rgba(113, 63, 18, .2); color: #fde047; }
.badge.st-open { background: #dcfce7; color: #166534; } html.dark .badge.st-open { background: rgba(20, 83, 45, .2); color: #86efac; }
.badge.st-closed { background: #f1f5f9; color: #1d293d; } html.dark .badge.st-closed { background: #1d293d; color: #e2e8f0; }
.badge.st-invoiced { background: #dbeafe; color: #1e40af; } html.dark .badge.st-invoiced { background: rgba(30, 58, 138, .2); color: #93c5fd; }
.badge.st-manually_closed { background: #fee2e2; color: #991b1b; } html.dark .badge.st-manually_closed { background: rgba(127, 29, 29, .2); color: #fca5a5; }
.badge.st-wait_payment { background: #ffedd5; color: #9a3412; } html.dark .badge.st-wait_payment { background: rgba(124, 45, 18, .2); color: #fdba74; }
.badge.es-draft { background: #f1f5f9; color: #314158; } html.dark .badge.es-draft { background: #314158; color: #e2e8f0; }
.badge.es-sent { background: #dbeafe; color: #1e40af; } html.dark .badge.es-sent { background: rgba(30, 58, 138, .2); color: #93c5fd; }
.badge.es-viewed { background: #f3e8ff; color: #6b21a8; } html.dark .badge.es-viewed { background: rgba(88, 28, 135, .2); color: #d8b4fe; }
.badge.es-signed { background: #ccfbf1; color: #115e59; } html.dark .badge.es-signed { background: rgba(19, 78, 74, .2); color: #5eead4; }
.badge.es-expired { background: #fee2e2; color: #991b1b; } html.dark .badge.es-expired { background: rgba(127, 29, 29, .2); color: #fca5a5; }
.badge.es-cancelled { background: #e2e8f0; color: #314158; } html.dark .badge.es-cancelled { background: #314158; color: #cad5e2; }
/* «Recurring & Cards»: разделы рамкой, карты плитками (SavedCardsList, ClientRecurringList, SavedCardItem) */
.recurring-tab { display: flex; flex-direction: column; gap: 2rem; margin: 0 .5rem; }
.box { border: 1px solid #e5e7eb; border-radius: .5rem; padding: 1rem 1.25rem; background: #fff; }
html.dark .box { border-color: #45556c; background: #1d293d; }
.box-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.box-head h3 { margin: 0; font-size: 1.125rem; font-weight: 600; color: var(--fg); }
.box-buttons { display: flex; gap: .5rem; }
.box-buttons .button, .box-buttons button { display: inline-flex; align-items: center; gap: .375rem; padding: .375rem .625rem; border-radius: .375rem; font-size: .875rem; font-weight: 500; }
.box-buttons .button { background: var(--primary); border-color: var(--primary); color: #111827; }
button.soft, html.dark button.soft { background: #f1f5f9; border: 1px solid #cad5e2; color: #314158; }
button.soft:hover { background: #e5e7eb; }
html.dark button.soft { background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .1); color: rgba(255, 255, 255, .9); }
.box-empty { margin: 1rem 0 0; padding: 1.5rem; border: 0; background: none; text-align: center; font-weight: 500; color: var(--muted); } /* пусто — без рамки и фона, как у оригинала (владелец 2026-11-09) */
.box .list-view { margin-top: 1rem; }
.box .list-table-wrap { box-shadow: none; }
/* простая таблица вкладки (ClientRecurringList оригинала, D-0105): без сетки и полос — шапка с чертой снизу, строки разделены тонкой линией */
.list-plain { border: 0; border-radius: 0; background: transparent; }
html .list-plain .list-table th { border-inline-end: 0; border-bottom: 1px solid rgba(107, 114, 128, .2); background: transparent; font-weight: 500; }
html .list-plain .list-table tbody tr:nth-child(n) td { background: transparent; border-bottom: 1px solid rgba(107, 114, 128, .1); }
html .list-plain .list-table tbody tr:nth-child(n):hover td { background: rgba(107, 114, 128, .05); }
.box .list-footer .muted { margin: 0; padding: 1.5rem; width: 100%; border: 0; background: none; text-align: center; font-weight: 500; color: var(--muted); }
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); gap: 1rem; padding: 1rem 0 0; }
.saved-card { display: flex; flex-direction: column; gap: 1rem; padding: 1.25rem; border: 1px solid #e5e7eb; border-radius: .75rem; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
html.dark .saved-card { border-color: rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); }
.saved-card.off { opacity: .6; }
.saved-card-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; min-height: 2rem; }
.saved-card-used { flex: 1; min-width: 0; font-size: .875rem; color: #6b7280; white-space: nowrap; overflow: visible; }
html.dark .saved-card-used { color: rgba(255, 255, 255, .4); }
.saved-card-used.failed, html.dark .saved-card-used.failed { color: #dc2626; }
.saved-card-used.failed .help-tip { background: #fee2e2; color: #dc2626; }
html.dark .saved-card-used.failed .help-tip { background: rgba(127, 29, 29, .4); color: #f87171; }
.saved-card .list-menu { position: relative; }
/* размеры SavedCardItem оригинала: номер text-base (sm: text-lg) tracking-wide, подписи text-sm uppercase font-medium, значения text-sm */
.saved-card-number { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 1rem; letter-spacing: .025em; color: #111827; }
html.dark .saved-card-number { color: rgba(255, 255, 255, .9); }
@media (min-width: 640px) { .saved-card-number { font-size: 1.125rem; } }
@media (min-width: 768px) { .saved-card { padding: 1.5rem; } }
.saved-card-number small { font-family: inherit; font-size: .875rem; font-weight: 600; color: #6b7280; }
.saved-card-foot { display: flex; justify-content: space-between; gap: 1rem; }
.saved-card-foot small { display: block; font-size: .875rem; font-weight: 500; letter-spacing: .025em; text-transform: uppercase; color: #6b7280; }
html.dark .saved-card-foot small { color: rgba(255, 255, 255, .4); }
.saved-card-foot strong { font-size: .875rem; font-weight: 600; color: #1f2937; }
html.dark .saved-card-foot strong { color: rgba(255, 255, 255, .8); }
.saved-card-foot > div:last-child strong { font-weight: 700; }
/* «•••» карточки — прозрачная кнопка 32px (size-8), серая; подсветка только при наведении */
.saved-card .list-dots, html.dark .saved-card .list-dots { width: 2rem; height: 2rem; border: 0; background: none; color: #6b7280; }
html.dark .saved-card .list-dots { color: rgba(255, 255, 255, .6); }
.saved-card .list-dots:hover { background: #f3f4f6; color: #374151; }
html.dark .saved-card .list-dots:hover { background: rgba(255, 255, 255, .1); color: #fff; }
/* «Client name» — к концу карточки, одной строкой с многоточием, ссылка без подчёркивания (SavedCardItem оригинала) */
.saved-card-foot > div:last-child { min-width: 0; text-align: end; }
.saved-card-foot > div:last-child strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* окна — основа UModal Nuxt UI: по центру, 512px, шапка / тело / подвал с линиями, крестик справа */
.modal-backdrop { position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center; padding: 1rem; background: rgba(243, 244, 246, .75); }
html.dark .modal-backdrop { background: rgba(30, 41, 59, .75); }
.modal { width: 100%; max-width: 30.375rem; /* UModal оригинала — 486px */ max-height: calc(100vh - 2rem); overflow-y: auto; background: #fff; border-radius: .5rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1), 0 0 0 1px #e2e8f0; display: flex; flex-direction: column; }
html.dark .modal { background: #0f172a; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .4), 0 0 0 1px #1d293d; }
.modal-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 4rem; padding: .75rem 1rem; box-sizing: border-box; border-bottom: 1px solid #e2e8f0; }
html.dark .modal-head { border-color: #1d293d; }
.modal-head h2 { margin: 0; font-size: 1.125rem; line-height: 1.75rem; font-weight: 600; color: var(--text-default); /* text-lg font-semibold text-default */ display: flex; align-items: center; gap: .5rem; }
.modal-head .danger-title { font-size: 1.125rem; color: #ef4444; }
.modal-head .danger-title .icon { width: 1.25rem; height: 1.25rem; }
.modal-desc { margin: .25rem 0 0; font-size: .875rem; color: #64748b; }
/* пояснение окна — в теле, первой строкой, а не в шапке (владелец 2026-11-09: длинный текст раздувал шапку) */
.modal-intro { margin: 0 0 1rem; font-size: .875rem; line-height: 1.4; color: var(--muted); }
.portal-modal .modal-body { display: flex; flex-direction: column; gap: 1rem; }
.portal-modal .modal-body > * { margin: 0; }
.portal-modal .field input { width: 100%; }
.portal-block { display: flex; flex-direction: column; gap: .625rem; padding: 1rem; border: 1px solid var(--line); border-radius: .5rem; }
.portal-block h3 { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: .9375rem; font-weight: 600; }
.portal-block h3 .icon { width: 1.125rem; height: 1.125rem; color: var(--primary); }
.portal-block .field { margin: 0; }
.portal-block .hint, .portal-block .ok { margin: 0; font-size: .875rem; }
.portal-block-foot { display: flex; justify-content: flex-end; }
.portal-block-foot button { display: inline-flex; align-items: center; gap: .375rem; }
.portal-foot { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.portal-foot-main { display: flex; gap: .5rem; margin-inline-start: auto; }
.portal-foot .ghost-danger { display: inline-flex; align-items: center; gap: .375rem; }
.modal-close, html.dark .modal-close { display: inline-flex; padding: .375rem; border: 0; border-radius: .375rem; background: none; color: #64748b; }
.modal-close:hover { background: #f1f5f9; }
.modal-body { padding: 1rem; display: flex; flex-direction: column; gap: 1rem; }
.modal-body p { margin: 0; }
.modal-body .field input:not([type='checkbox']):not([type='file']), .modal-body .field select { width: 100%; }
.modal-foot { display: flex; justify-content: flex-end; gap: .75rem; padding: .75rem 1rem; border-top: 1px solid #e2e8f0; }
html.dark .modal-foot { border-color: #1d293d; }
.modal-foot button { padding: .3125rem .625rem; line-height: 1.125rem; border-radius: .375rem; font-size: .875rem; font-weight: 500; } /* UButton sm окон оригинала — 30px */
.modal-foot button.primary { color: #fff; }
/* окно подтверждения как у оригинала: две кнопки поровну на всю ширину */
.modal-foot.split > button { flex: 1; justify-content: center; padding: .5rem .75rem; line-height: 1.25rem; }
/* поля окон — size sm Nuxt UI оригинала (30px, px-2.5 py-1.5) */
.modal .modal-body input:not([type='checkbox']):not([type='radio']):not([type='file']), .modal .modal-body textarea { padding: .3125rem .625rem;  line-height: 1.125rem; min-height: 1.875rem; }
.modal .modal-body select { height: 1.875rem; padding-block: 0; }
button.ghost, html.dark button.ghost { background: none; border-color: transparent; color: var(--text); }
button.ghost:hover { background: #f1f5f9; }
button.outline, html.dark button.outline { background: none; border: 1px solid var(--field-line); color: var(--text-default); }
html.dark button.outline { border-color: #314158; }
button.danger, html.dark button.danger { background: #ef4444; border-color: #ef4444; color: #fff; }
button.danger:hover { background: #dc2626; }
.dropzone { position: relative; display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 1.5rem; border: 2px dashed #d1d5db; border-radius: .5rem;
  background: #f9fafb; color: #4b5563; font-size: .875rem; font-weight: 400; text-align: center; cursor: pointer; }
.dropzone:hover { border-color: var(--primary); }
html.dark .dropzone { border-color: #45556c; background: #1d293d; color: #cad5e2; }
.dropzone .icon { width: 3rem; height: 3rem; color: #9ca3af; }
.dropzone b { color: var(--primary); font-weight: 600; }
.dropzone small { font-size: .75rem; color: #6b7280; }
.dropzone input[type='file'] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.modal.modal-md { max-width: 28rem; }
/* оплата счёта (International): px-2 py-0.5 rounded text-xs — Open серый, Partially paid amber, Paid зелёный */
.list-table .badge.pay-paid, .list-table .badge.pay-partially_paid, .list-table .badge.pay-open { min-height: 0; padding: .125rem .5rem; border-radius: .25rem; }
.badge.pay-paid { background: #dcfce7; color: #166534; } html.dark .badge.pay-paid { background: rgba(20, 83, 45, .4); color: #86efac; }
.badge.pay-partially_paid { background: #fef3c7; color: #92400e; } html.dark .badge.pay-partially_paid { background: rgba(120, 53, 15, .4); color: #fcd34d; }
.badge.pay-open { background: #f1f5f9; color: #314158; } html.dark .badge.pay-open { background: #314158; color: #e2e8f0; }
.list-table .badge.pay-none { display: none; }
/* статус транзакции — бейдж оригинала (px-2 py-1 text-xs font-semibold), крупнее бейджей списков документов */
.list-table .badge.tx-status { padding: .25rem .5rem; font-weight: 600; line-height: 1rem; }
/* разделитель и опасные пункты меню строки (UDropdownMenu оригинала: separator, color error) */
.list-panel .menu-divider { margin: .25rem 0; border: 0; border-top: 1px solid #e2e8f0; } html.dark .list-panel .menu-divider { border-color: #45556c; }
.list-panel.list-panel-end > button.danger-item { color: #dc2626; } html.dark .list-panel.list-panel-end > button.danger-item { color: #f87171; }
/* окна регулярного счёта и отправки: поля сеткой в две колонки, подвал слева (Save, Cancel), сумма с валютой одной строкой */
.modal-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.modal-grid .wide { grid-column: 1 / -1; }
@media (max-width: 640px) { .modal-grid { grid-template-columns: 1fr; } }
.modal-foot.modal-foot-start { justify-content: flex-start; }
.input-pair { display: flex; gap: .5rem; }
.modal-body .field .input-pair input:first-child { flex: 1; min-width: 0; }
.modal-body .field .input-pair input.input-currency { width: 5rem; flex: 0 0 5rem; }
.modal-body .field textarea { width: 100%; box-sizing: border-box; min-height: 9rem; resize: vertical; }
.field .hint { font-size: .75rem; color: #62748e; } html.dark .field .hint { color: #90a1b9; }
/* боковая панель документа (UDrawer оригинала w-[640px], справа; в RTL — слева) */
.drawer-backdrop { position: fixed; inset: 0; z-index: 70; display: flex; justify-content: flex-end; background: rgba(243, 244, 246, .75); }
html.dark .drawer-backdrop { background: rgba(30, 41, 59, .75); }
.drawer { width: 640px; max-width: 100%; height: 100%; overflow-y: auto; background: #fff; box-shadow: -10px 0 15px -3px rgba(0, 0, 0, .1); display: flex; flex-direction: column; }
html.dark .drawer { background: #0f172a; }
[dir='rtl'] .drawer { box-shadow: 10px 0 15px -3px rgba(0, 0, 0, .1); } /* иврит: панель у левого края (flex-end в RTL), тень — справа от неё */
.drawer-head { display: flex; align-items: center; gap: .75rem; padding: 1rem; border-bottom: 1px solid #e2e8f0; }
html.dark .drawer-head { border-color: #1d293d; }
.drawer-head h2 { margin: 0; font-size: 1rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.drawer-head .drawer-open { margin-inline-start: auto; padding: .375rem .75rem; font-size: .875rem; }
.drawer-tabs { padding-inline: .5rem; }
.drawer-body { padding: 1rem 1.5rem 2rem; display: flex; flex-direction: column; gap: 1.25rem; font-size: .875rem; }
.drawer-facts { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 0; }
.drawer-facts div { display: flex; gap: .375rem; }
.drawer-facts dt { color: #6b7280; } .drawer-facts dt::after { content: ':'; }
.drawer-facts dd { margin: 0; font-weight: 500; }
.drawer-client { flex-direction: column; padding: 1rem; border: 1px solid #e5e7eb; border-radius: .5rem; background: #f9fafb; }
html.dark .drawer-client { border-color: #314158; background: #1d293d; }
.drawer-description { margin: 0; font-weight: 500; }
.drawer-lines td { white-space: normal; overflow: visible; }
.drawer-lines td small { display: block; }
.drawer-summary { display: flex; flex-direction: column; align-items: flex-end; gap: .375rem; margin: 0; }
.drawer-summary div { display: flex; gap: 1.5rem; min-width: 16rem; justify-content: space-between; }
.drawer-summary dd { margin: 0; }
.drawer-summary .drawer-total { padding-top: .5rem; border-top: 1px solid #e5e7eb; font-weight: 600; font-size: 1rem; }
/* «Additional client name» оригинала: поле max-w 24rem, чипы bg-primary/15, рамка primary/50, текст primary */
.alias-box { display: flex; flex-direction: column; gap: .5rem; max-width: 24rem; }
.alias-field { position: relative; }
.alias-field input { width: 100%; box-sizing: border-box; padding: 7px 2.25rem 7px 12px; border: 1px solid #d1d5db; border-radius: 6px; font-size: .875rem; }
[dir='rtl'] .alias-field input { padding: 7px 12px 7px 2.25rem; }
.alias-field input::placeholder { color: #9ca3af; }
.alias-field input:focus { outline: none; border-color: rgb(74 222 128); box-shadow: 0 0 0 2px rgba(74, 222, 128, .35); }
html.dark .alias-field input { background: #314158; border-color: #45556c; color: #f8fafc; }
.alias-field .alias-add, html.dark .alias-field .alias-add { position: absolute; top: 50%; inset-inline-end: .375rem; transform: translateY(-50%); display: inline-flex; padding: .125rem;
  border: 0; border-radius: .25rem; background: none; color: #9ca3af; }
.alias-field .alias-add:hover { color: var(--primary); }
.alias-chips { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; }
.alias-chips li { display: inline-flex; align-items: center; gap: .375rem; padding: .25rem .75rem; border-radius: 9999px; font-size: .875rem;
  background: rgba(46, 211, 138, .15); border: 1px solid rgba(46, 211, 138, .5); color: var(--primary); }
.alias-chips button, html.dark .alias-chips button { display: inline-flex; padding: 0; border: 0; background: none; color: inherit; }
.alias-chips .icon { width: .75rem; height: .75rem; }
/* импорт контрагентов (/client/import оригинала): зелёная плашка шаблона rounded-lg border-green-200 bg-green-50/70 p-4, карточка с файлом */
.import-tip { margin-bottom: 1rem; padding: 1rem; border: 1px solid #bbf7d0; border-radius: .5rem; background: rgba(240, 253, 244, .7); font-size: .875rem; }
html.dark .import-tip { border-color: #166534; background: rgba(20, 83, 45, .2); }
.import-tip-head { display: flex; align-items: center; gap: .5rem; }
.import-tip-head .icon { width: 1.25rem; height: 1.25rem; color: var(--primary); }
.import-tip-head .button { margin-inline-start: auto; display: inline-flex; align-items: center; gap: .375rem; padding: .375rem .75rem; border-radius: .375rem;
  background: rgba(46, 211, 138, .12); color: #15803d; text-decoration: none; font-weight: 500; }
html.dark .import-tip-head .button { color: #4ade80; }
.import-tip p { margin: .5rem 0 0; color: #314158; } html.dark .import-tip p { color: #cad5e2; }
.import-card { padding: 1rem; display: flex; flex-direction: column; gap: 1rem; }
.party-card.import-card { min-height: 0; } /* страница импорта — по содержимому, без прокрутки пустоты (владелец 2026-11-09) */
.import-mapping { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: .75rem; }
.import-actions { display: flex; justify-content: flex-end; gap: .75rem; }
.import-actions .button { padding: .5rem 1rem; border-radius: .375rem; font-size: .875rem; font-weight: 500; text-decoration: none; }
/* адреса чипами в окнах (SelectedChips оригинала): чипы и поле ввода в одной рамке */
.email-chips { display: flex; flex-wrap: wrap; align-items: center; gap: .375rem; padding: .25rem .5rem; border: 1px solid #d1d5db; border-radius: .375rem; background: #fff; }
html.dark .email-chips { background: #314158; border-color: #45556c; }
.email-chips:focus-within { border-color: rgb(74 222 128); box-shadow: 0 0 0 2px rgba(74, 222, 128, .35); }
.modal-body .field .email-chips input { flex: 1; min-width: 10rem; width: auto; border: 0; padding: .25rem 0; background: none; box-shadow: none; outline: none; }
.email-chip { display: inline-flex; align-items: center; gap: .25rem; padding: .125rem .5rem; border-radius: 9999px; font-size: .8125rem;
  background: rgba(46, 211, 138, .15); border: 1px solid rgba(46, 211, 138, .5); color: var(--primary); }
.email-chip button, html.dark .email-chip button { display: inline-flex; padding: 0; border: 0; background: none; color: inherit; }
.email-chip .icon { width: .75rem; height: .75rem; }
/* выбор адресов (RequestCardModal оригинала): поле со стрелкой, список адресов клиента с галочкой, выбранные — чипами под полем */
.email-pick { position: relative; }
.email-pick-box { display: flex; align-items: center; border: 1px solid #d1d5db; border-radius: .375rem; background: #fff; }
html.dark .email-pick-box { background: #314158; border-color: #45556c; }
.email-pick-box:focus-within { border-color: rgb(74 222 128); box-shadow: 0 0 0 2px rgba(74, 222, 128, .35); }
.modal-body .field .email-pick-box input { flex: 1; min-width: 0; border: 0; background: none; box-shadow: none; outline: none; }
.email-pick-toggle, html.dark .email-pick-toggle { display: inline-flex; padding: 0 .5rem; border: 0; background: none; color: #90a1b9; }
.email-pick-list { position: absolute; z-index: 50; top: calc(100% + .25rem); inset-inline: 0; max-height: 15rem; overflow: auto; padding: .25rem 0;
  border: 1px solid #d1d5db; border-radius: .375rem; background: #fff; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1); }
html.dark .email-pick-list { background: #314158; border-color: #45556c; }
.email-pick-list button, html.dark .email-pick-list button { display: flex; align-items: center; justify-content: space-between; gap: .5rem; width: 100%;
  padding: .5rem .75rem; border: 0; border-radius: 0; background: none; color: var(--fg); font-size: .875rem; text-align: start; }
.email-pick-list button:hover { background: #f3f4f6; }
html.dark .email-pick-list button:hover { background: #45556c; }
.email-pick-list .icon { width: 1rem; height: 1rem; color: var(--primary); }
.email-chips-below { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.toast { position: fixed; z-index: 100; bottom: 1.5rem; right: 1.5rem; margin: 0; padding: .625rem 1rem; border-radius: .5rem; max-width: min(24rem, calc(100vw - 2rem));
  background: #111827; color: #fff; font-size: .875rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .2); }
html.dark .toast { background: #f1f5f9; color: #0f172b; }
.box-buttons .list-menu .list-panel button { width: 100%; justify-content: flex-start; }
.modal-fields { display: flex; flex-direction: column; gap: 1rem; }
.ok-note { padding: .625rem .875rem; border-radius: .5rem; background: #f0fdf4; border: 1px solid #bbf7d0; color: #166534; }
html.dark .ok-note { background: rgba(20, 83, 45, .2); border-color: #166534; color: #86efac; }
/* вкладка Book боковой панели: проводка — ссылка с датой и таблица строк */
.drawer-tabs .tabs .tab { background: none; }
.book-entry { display: flex; flex-direction: column; gap: .5rem; }
.book-entry-head { display: flex; justify-content: space-between; gap: 1rem; font-weight: 500; }
/* ImportStatistics оригинала: плитки Total / Valid (зелёная) / Error (красная), число 2xl */
.import-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.import-stats div { display: flex; flex-direction: column; gap: .25rem; padding: 1rem; border: 1px solid var(--line); border-radius: .5rem; }
.import-stats small { font-size: .875rem; color: #6b7280; }
.import-stats strong { font-size: 1.5rem; font-weight: 600; }
.import-stats .ok-tile strong { color: #16a34a; } .import-stats .bad-tile strong { color: #dc2626; }
/* телефон с кодом страны (CountryPhoneInput оригинала): кнопка флаг + код, список стран с поиском, поле номера */
.phone-input { display: flex; gap: .5rem; }
.phone-input > input { flex: 1; min-width: 0; }
.phone-code { position: relative; flex: 0 0 auto; }
.phone-code-btn, html.dark .phone-code-btn { display: inline-flex; align-items: center; gap: .5rem; height: 100%; min-width: 7.5rem; padding: .5rem .75rem;
  border: 1px solid var(--line); border-radius: .375rem; background: var(--input-bg, #fff); color: var(--fg); font-weight: 400; }
html.dark .phone-code-btn { background: #0f172b; border-color: #314158; }
.phone-code-btn .icon { width: 1rem; height: 1rem; margin-inline-start: auto; color: #9ca3af; }
.phone-code .fi, .phone-list .fi { width: 1.25rem; height: .9375rem; border-radius: 2px; flex: 0 0 auto; }
.phone-list { position: absolute; z-index: 40; top: calc(100% + .25rem); inset-inline-start: 0; width: 18rem; max-height: 18rem; overflow-y: auto; padding: .25rem;
  background: #fff; border: 1px solid #e5e7eb; border-radius: .375rem; box-shadow: 0 10px 15px -3px rgba(15, 23, 42, .15); }
html.dark .phone-list { background: #1d293d; border-color: #314158; }
.phone-list input[type='search'] { width: 100%; box-sizing: border-box; margin-bottom: .25rem; }
.phone-list button, html.dark .phone-list button { display: flex; align-items: center; gap: .5rem; width: 100%; padding: .375rem .5rem; border: 0; border-radius: .25rem;
  background: none; color: var(--fg); text-align: start; font-weight: 400; }
.phone-list button:hover { background: #f1f5f9; } html.dark .phone-list button:hover { background: #314158; }
.phone-list-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* подсказка «?» у подписи (UTooltip оригинала): кружок, текст — по наведению и фокусу */
.help-tip { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 1rem; height: 1rem; margin-inline-start: .25rem;
  border: 1px solid #9ca3af; border-radius: 50%; font-size: .625rem; font-weight: 600; color: #9ca3af; cursor: help; vertical-align: middle; }
.help-tip:hover::after, .help-tip:focus::after { content: attr(data-tip); position: absolute; z-index: 50; bottom: calc(100% + .375rem); inset-inline-start: -1rem; width: 20rem;
  padding: .5rem .625rem; border-radius: .375rem; background: #111827; color: #f9fafb; font-size: .75rem; font-weight: 400; line-height: 1.1rem; white-space: normal;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2); }
/* тёмная тема — тёмная подсказка с рамкой; у правого края экрана подсказка раскрывается влево (класс flip ставит app.js) */
html.dark .help-tip:hover::after, html.dark .help-tip:focus::after { background: #1d293d; color: #f1f5f9; border: 1px solid #314158; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .5); }
.help-tip:hover::after, .help-tip:focus::after { max-width: min(20rem, calc(100vw - 2rem)); }
.help-tip.flip:hover::after, .help-tip.flip:focus::after { inset-inline-start: auto; inset-inline-end: -1rem; }
.check-field { justify-content: flex-end; padding-bottom: .5rem; }
/* строки реквизитов по валюте (BankDetailsBlock): «Fields for EUR» и Add field (primary outline), поле — значение — ✕ */
.bank-fields { display: flex; flex-direction: column; gap: .75rem; }
.bank-fields-head { display: flex; align-items: center; justify-content: space-between; }
.bank-fields-head h4 { margin: 0; font-size: 1.125rem; font-weight: 600; }
button.outline-primary, html.dark button.outline-primary { padding: .5rem .75rem; border: 1px solid var(--primary); border-radius: .375rem; background: none; color: var(--primary); font-weight: 500; }
button.outline-primary:hover { background: rgba(46, 211, 138, .1); }
.bank-field-row { display: grid; grid-template-columns: 1fr 1fr 2rem; gap: 1rem; align-items: end; }
.bank-field-remove, html.dark .bank-field-remove { display: inline-flex; justify-content: center; padding: .5rem 0; border: 0; background: none; color: #ef4444; }
/* суммы в таблицах — цветом (formatMoneyWithColor оригинала): у ячеек списка свой цвет текста, поэтому — с таблицей */
.list-table td.money-pos { color: #16a34a; } .list-table td.money-neg { color: #dc2626; }
html.dark .list-table td.money-pos { color: #4ade80; } html.dark .list-table td.money-neg { color: #f87171; }

/* боковая панель документа как IncomePreviewModal оригинала: даты строкой, клиент «подпись — значение» по краям, строки и итоги карточками */
.drawer-head .drawer-copy, html.dark .drawer-head .drawer-copy { display: inline-flex; padding: .25rem; border: 0; background: none; color: #90a1b9; }
.drawer-head .drawer-copy .icon.ok { color: var(--primary); }
.drawer-head .drawer-menu { margin-inline-start: auto; }
.drawer-dates { margin: 0; }
.drawer-dates b { font-weight: 500; margin-inline-end: .5rem; }
.pdf-error { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 2rem 1rem; text-align: center; }
.pdf-error > .icon { width: 2rem; height: 2rem; color: var(--danger, #e7000b); }
.related-modal { max-width: 28rem; }
.related-options { display: flex; flex-direction: column; gap: .5rem; margin-top: .75rem; }
.related-option { display: flex; align-items: center; gap: .5rem; padding: .5rem 1rem; border: 1px solid var(--line); border-radius: 6px; color: var(--text-default); text-decoration: none; }
.related-option:hover { background: var(--hover, #f8fafc); }
.related-option .chevron { margin-inline-start: auto; color: var(--muted); }
[dir="rtl"] .related-option .chevron { transform: scaleX(-1); }
.drawer-refs { margin: .5rem 0 0; font-size: .875rem; }
.drawer-refs a + a, .drawer-refs span + a { margin-inline-start: .5rem; }
dl.drawer-client { display: flex; flex-direction: column; gap: .375rem; margin: 0; padding: 0; border: 0; background: none; }
html.dark dl.drawer-client { background: none; }
.drawer-client div { display: flex; justify-content: space-between; gap: 1rem; }
.drawer-client dt { color: inherit; } .drawer-client dd { margin: 0; text-align: end; }
.drawer-card { padding: 1rem 1.5rem; border-radius: .75rem; background: #f3f4f6; }
html.dark .drawer-card { background: #314158; }
table.drawer-lines { width: 100%; border-collapse: collapse; }
.drawer-lines th, .drawer-lines td { padding: .625rem 0; text-align: start; white-space: normal; }
.drawer-lines th.num, .drawer-lines td.num { text-align: end; }
.drawer-lines thead th { border-bottom: 2px solid #9ca3af; font-weight: 600; }
.drawer-lines tbody td { border-bottom: 2px solid #9ca3af; }
.drawer-lines tfoot th { padding-top: .875rem; font-weight: 600; }
.drawer-summary { display: flex; flex-direction: column; gap: 0; align-items: stretch; }
.drawer-summary h4 { margin: 0 0 .5rem; font-size: .875rem; font-weight: 400; color: #9ca3af; }
.drawer-summary > div { display: flex; justify-content: space-between; padding: .625rem 0; border-bottom: 1px solid rgba(156, 163, 175, .3); min-width: 0; }
.drawer-summary > div.drawer-total { border-bottom: 0; border-top: 2px solid #9ca3af; font-weight: 600; font-size: .875rem; margin-top: .25rem; }
.drawer-history { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.drawer-history li { display: flex; flex-wrap: wrap; gap: .5rem 1rem; padding: .5rem 0; border-bottom: 1px solid var(--line); }
.drawer-history-when { color: #9ca3af; min-width: 8rem; } .drawer-history-what { font-weight: 500; }
/* документ дохода как IncomeForm оригинала: карточки UCard (белая, рамка gray-200, radius 8, заголовок 18px), промежуток 24px */
.income-form { display: flex; flex-direction: column; gap: 1.5rem; }
.income-card { padding: 1.5rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); display: flex; flex-direction: column; gap: 1rem; }
html.dark .income-card { border-color: var(--line); }
/* шапка UCard: отдельной полосой 16px 24px с линией снизу, тело — 24px */
.income-card > h3 { margin: -1.5rem -1.5rem .5rem; padding: 1rem 1.5rem; border-bottom: 1px solid var(--line); font-size: 1.125rem; line-height: 1.5rem; font-weight: 500; color: var(--text-default); }
html.dark .income-card > h3 { color: #e2e8f0; }
/* как IncomeDetails оригинала: grid-cols-1, sm:grid-cols-2, lg — 5 (International) или 6 (Израиль) колонок; поля — на всю колонку */
.income-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
@container (min-width: 32rem) { .income-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.income-grid .field > input, .income-grid .field > select, .income-grid .field > .sel-wrap, .income-grid .field > .dp-wrap { width: 100%; }
/* лучше оригинала (владелец 2026-11-04): скрытое поле срока у сметы место не держит — без «дыр» на узком и среднем экране */
.income-grid .hidden-keep { display: none; }
.income-desc textarea { width: 100%; box-sizing: border-box; resize: vertical; }
table.income-lines { width: 100%; border-collapse: collapse; }
.income-lines th { padding: .75rem 1rem; background: #f9fafb; font-size: .75rem; font-weight: 500; color: #6b7280; text-transform: uppercase; text-align: start; }
html.dark .income-lines th { background: #1d293d; color: #90a1b9; }
.income-lines td { padding: .5rem 1rem; border-bottom: 1px solid var(--line); }
.income-lines th.num, .income-lines td.num { text-align: end; }
.income-lines td input:not([type='checkbox']), .income-lines td select { width: 100%; box-sizing: border-box; }
.income-lines td.num input { text-align: end; }
.line-remove, html.dark .line-remove { display: inline-flex; padding: .25rem; border: 0; background: none; color: #ef4444; }
.income-empty { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 2rem 1rem; text-align: center; }
.income-empty > .icon { width: 2.5rem; height: 2.5rem; color: #9ca3af; }
.income-empty button, .income-under button, .income-actions button { display: inline-flex; align-items: center; gap: .375rem; }
.income-under { display: flex; justify-content: space-between; align-items: flex-start; gap: 2rem; flex-wrap: wrap; }
.income-totals { display: flex; flex-direction: column; gap: .5rem; margin: 0; min-width: 22rem; }
.income-totals > div { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.income-totals dd { margin: 0; text-align: end; }
.income-discount { display: flex; gap: .5rem; align-items: center; }
.income-discount select { width: 9rem; } .income-discount input { width: 6rem; }
.income-totals .income-total { padding-top: .5rem; border-top: 1px solid var(--line); font-weight: 700; font-size: 1rem; }
.income-actions { display: flex; justify-content: space-between; gap: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.income-actions > div { display: flex; gap: .75rem; }
.issue-warning { padding: .75rem 1rem; border-radius: .5rem; background: #fef3c7; color: #92400e; font-size: .875rem; }
html.dark .issue-warning { background: rgba(120, 53, 15, .3); color: #fcd34d; }
.issue-facts { display: flex; flex-direction: column; gap: .5rem; margin: 0; }
.issue-facts > div { display: flex; justify-content: space-between; gap: 1rem; } .issue-facts dd { margin: 0; font-weight: 600; }

/* Payment Options и подвал документа (IncomeFooter оригинала): две колонки — Additional Information и Email Settings */
.income-note { margin: 0; padding: .625rem .875rem; border-radius: .375rem; background: #f3f4f6; color: #4b5563; font-size: .875rem; }
html.dark .income-note { background: #1d293d; color: #90a1b9; }
.income-transfer { max-width: 24rem; }
.income-footer { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; }
.income-footer > div { display: flex; flex-direction: column; gap: 1rem; }
.income-footer h3 { margin: 0; font-size: 1.125rem; font-weight: 500; }
.income-footer textarea, .income-footer input:not([type='file']) { width: 100%; box-sizing: border-box; }
.income-attachment { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
@media (max-width: 900px) { .income-footer { grid-template-columns: minmax(0, 1fr); } }

.check-row { display: flex; align-items: center; gap: .375rem; }

/* строки документа: ✓ применить (зелёная), ✎ править (синяя), 🗑 убрать (красная) — ghost xs оригинала; поиск по каталогу — выпадающим списком */
.line-actions { white-space: nowrap; }
.line-actions button { background: none; border: 0; padding: .25rem; border-radius: .375rem; cursor: pointer; }
.line-actions .line-apply { color: #16a34a; }
.line-actions .line-edit { color: #2563eb; }
.line-actions .line-remove { color: #dc2626; }
.line-actions button:hover { background: rgba(0, 0, 0, .05); }
html.dark .line-actions button:hover { background: rgba(255, 255, 255, .08); }
.combo { position: relative; }
.combo-list { position: absolute; z-index: 30; inset-inline: 0; top: 100%; margin: .25rem 0 0; padding: .25rem 0; list-style: none; max-height: 15rem; overflow-y: auto;
  background: #fff; border: 1px solid #e5e7eb; border-radius: .375rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1); }
html.dark .combo-list { background: #1d293d; border-color: #314158; }
.combo-list li { font-size: .875rem; }
.combo-list li.muted { padding: .5rem .75rem; }
/* адреса письма метками (IncomeFooter оригинала): шеврон в поле, подсказки — строками, метки с крестиком */
.combo-chevron { position: absolute; inset-inline-end: .75rem; top: 50%; transform: translateY(-50%); width: 1rem; height: 1rem; color: #9ca3af; pointer-events: none; }
.email-chips .combo input { padding-inline-end: 2.5rem; }
.email-chips .combo-list li[role=option] { padding: .5rem .75rem; cursor: pointer; }
.email-chips .combo-list li[role=option]:hover { background: #f3f4f6; }
html.dark .email-chips .combo-list li[role=option]:hover { background: #45556c; }
.email-chips .chips { margin: .5rem 0 0; }
.email-chips .chips li { font-size: .875rem; }
.chip-remove { display: inline-flex; padding: 0; border: 0; background: none; color: inherit; cursor: pointer; }
.chip-remove .icon { width: .875rem; height: .875rem; }
.combo-list li button { display: flex; width: 100%; justify-content: space-between; gap: 1rem; padding: .5rem .75rem; background: none; border: 0; color: inherit; font: inherit; text-align: start; cursor: pointer; }
.combo-list li button:hover { background: #f3f4f6; }
html.dark .combo-list li button:hover { background: #314158; }
.field-error { display: block; color: #dc2626; font-size: .75rem; margin-top: .25rem; }

/* окно после выпуска: три плитки действий, как у оригинала */
.issued-modal { max-width: 34rem; }
.issued-modal .modal-head p { margin: .125rem 0 0; font-size: .875rem; }
.issued-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: 1rem; }
.issued-tiles button { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 1rem .5rem; border: 1px solid #e5e7eb; border-radius: .5rem;
  background: #fff; color: #374151; font: inherit; font-size: .875rem; cursor: pointer; }
.issued-tiles button .icon { width: 1.75rem; height: 1.75rem; color: #2563eb; }
.issued-tiles button:hover { background: #eff6ff; border-color: #bfdbfe; }
html.dark .issued-tiles button { background: #0f172b; border-color: #314158; color: #cad5e2; }
html.dark .issued-tiles button:hover { background: #1d293d; }
.issued-soon { margin: 0 0 .75rem; padding: .5rem .75rem; border-radius: .375rem; background: #eff6ff; color: #1d4ed8; font-size: .875rem; }
html.dark .issued-soon { background: #1d293d; color: #93c5fd; }
@media (max-width: 480px) { .issued-tiles { grid-template-columns: 1fr; } }
/* печать документа: только сам документ — без боковой панели, шапки, кнопок и окон */
@media print {
  .sidebar, header.top, .title-back, .no-print, .income-actions, .chat-panel, .drawer-actions { display: none !important; }
  body, main { background: #fff !important; color: #000 !important; }
  main { margin: 0 !important; padding: 0 !important; }
  .income-card { box-shadow: none !important; border: 1px solid #ddd !important; break-inside: avoid; }
}

/* скрепка вложения у номера в списке документов и ссылка на вложение в панели */
.num-clip { display: inline-flex; align-items: center; gap: .25rem; }
.num-clip .icon { width: 1rem; height: 1rem; color: #6b7280; }
.drawer-attachment button { display: inline-flex; align-items: center; gap: .375rem; }
.drawer-attachment .icon { width: 1rem; height: 1rem; }

/* кабинет: свои данные клиента; карточка — заметка «Details updated by the client via the portal on …» (blue-50 / 200 / 800) */
.portal-profile { display: flex; flex-direction: column; gap: .75rem; max-width: 48rem; }
.portal-profile h3 { margin: .75rem 0 0; font-size: 1rem; font-weight: 600; }
.portal-profile input[readonly] { background: #f3f4f6; color: #6b7280; }
html.dark .portal-profile input[readonly] { background: #1d293d; color: #90a1b9; }
.portal-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .75rem; }
.portal-actions { display: flex; gap: .75rem; margin-top: .5rem; }
.portal-note { margin: 0 0 1rem; padding: 10px 14px; border-radius: 8px; background: #eff6ff; border: 1px solid #bfdbfe; color: #1e40af; font-size: .875rem; }
html.dark .portal-note { background: rgba(30, 64, 175, .15); border-color: #1e3a8a; color: #bfdbfe; }

/* вкладка Salary сотрудника */
.salary-tab { display: flex; flex-direction: column; gap: .75rem; }
.salary-tab input[type='number'] { width: 6rem; }
.salary-own input:not([type]), .salary-own select { min-width: 8rem; }
/* телефон: таблицы строк документа и листа прокручиваются внутри карточки, страница не шире экрана */
@media (max-width: 900px) {
  /* таблицы документа на телефоне — переносом (сетка в @container ниже), не прокруткой */
  table.lines, .salary-tab .list-table { display: block; overflow-x: auto; max-width: 100%; }
}
@media (max-width: 640px) {
  .income-under > * { flex: 1 1 100%; }
  .income-totals { min-width: 0; width: 100%; }
  .income-totals > div { flex-wrap: wrap; }
  .income-discount { flex-wrap: wrap; }
  .income-discount select { width: 8rem; } .income-discount input { width: 5rem !important; }
}

/* окно налогов строки (Additional taxes, max-w-3xl оригинала) */
.tax-modal { max-width: 48rem; }
.tax-row { display: grid; grid-template-columns: 1fr 8rem 1fr auto; gap: .75rem; align-items: end; margin-bottom: .5rem; }
.line-taxes { display: block; font-size: .8125rem; color: #6b7280; }
@media (max-width: 640px) { .tax-row { grid-template-columns: 1fr 1fr; } }

/* «Charge card on file» и исход списания в окне после выпуска */
.income-charge { display: flex; flex-direction: column; gap: .5rem; align-items: flex-start; }
.income-charge button { display: inline-flex; align-items: center; gap: .375rem; }
.issued-charge { display: flex; flex-direction: column; gap: .25rem; margin: 0 0 .75rem; padding: .625rem .75rem; border-radius: .375rem; font-size: .875rem; }
.issued-charge.ok { background: #ecfdf5; color: #065f46; }
.issued-charge.bad { background: #fef2f2; color: #991b1b; }
html.dark .issued-charge.ok { background: rgba(6, 95, 70, .25); color: #a7f3d0; }
html.dark .issued-charge.bad { background: rgba(153, 27, 27, .25); color: #fecaca; }
/* «Charge card on file» (498 оригинала, CardOnFilePicker): кнопка рядом с «Add First Payment», панель во всю ширину блока оплат,
   на телефоне — нижняя шторка; строка списания с пометкой; окна списания (сверка с app.keebooks.com 2026-11-05) */
.income-empty-actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
.income-under .income-empty-actions { justify-content: flex-start; }
button.cof-open { color: var(--accent); border-color: color-mix(in srgb, var(--primary) 60%, transparent); }
.cof-panel { margin-top: 1rem; padding: 1rem; border: 1px solid #a7f3d0; border-radius: var(--radius); background: var(--surface); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .08); }
.cof-head { display: flex; justify-content: space-between; align-items: flex-start; gap: .75rem; }
.cof-title { display: flex; align-items: center; gap: .5rem; font-weight: 600; color: var(--fg); }
.cof-title .icon { width: 1rem; height: 1rem; }
.cof-sub { margin-top: .125rem; font-size: .75rem; color: var(--muted); }
.cof-body { margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--line); }
.cof-skeleton { height: 3rem; margin-bottom: .5rem; border-radius: .375rem; background: var(--panel); animation: cof-pulse 1.2s ease-in-out infinite; }
@keyframes cof-pulse { 50% { opacity: .5; } }
.cof-loading p { font-size: .75rem; margin: 0; }
.cof-alert { display: flex; flex-direction: column; gap: .125rem; padding: .625rem .75rem; border-radius: .375rem; border: 1px solid; font-size: .75rem; }
.cof-alert b { font-size: .875rem; font-weight: 500; }
.cof-alert.warn { background: #fffbeb; border-color: #fde68a; color: #78350f; }
.cof-alert.bad { background: #fef2f2; border-color: #fecaca; color: #991b1b; margin-bottom: .75rem; }
.cof-cards { display: flex; flex-direction: column; gap: .5rem; margin-top: .75rem; }
.cof-card { display: flex; align-items: center; gap: .75rem; padding: .625rem .75rem; border: 1px solid var(--line); border-radius: .375rem; cursor: pointer; }
.cof-card:hover { background: var(--hover); }
.cof-card.on { border-color: var(--primary-dark); box-shadow: 0 0 0 1px var(--primary-dark); background: color-mix(in srgb, var(--primary) 6%, transparent); }
.cof-card.off { cursor: not-allowed; opacity: .7; background: var(--canvas); }
.cof-card-icon { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 1.5rem; border: 1px solid var(--line-strong); border-radius: .25rem; color: var(--muted); }
.cof-card-icon .icon { width: 1rem; height: 1rem; }
.cof-card-main { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.cof-card-name { display: flex; align-items: center; gap: .5rem; font-size: .875rem; font-weight: 500; color: var(--fg); white-space: nowrap; }
.cof-card-meta { font-size: .75rem; color: var(--muted); }
.cof-badge { padding: .0625rem .375rem; border: 1px solid var(--line); border-radius: .25rem; background: var(--panel); font-size: .6875rem; font-weight: 500; color: var(--text); }
.cof-reason { font-size: .75rem; color: #b91c1c; text-align: end; max-width: 11rem; }
.cof-amount { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem .75rem; align-items: end; margin-top: .75rem; }
.cof-amount .field { margin: 0; }
.cof-amount .field-error { grid-column: 1 / -1; }
.cof-money { display: flex; }
.cof-money span { display: inline-flex; align-items: center; padding: 0 .5rem; border: 1px solid var(--field-line); border-inline-end: 0; border-radius: .375rem 0 0 .375rem; background: var(--canvas); font-size: .875rem; color: var(--muted); }
.cof-money input { flex: 1; border-radius: 0 .375rem .375rem 0; }
.cof-money input.invalid { border-color: var(--danger); }
.cof-balance { font-size: .75rem; color: var(--muted); padding-bottom: .5rem; }
.cof-balance strong { margin-inline-start: .25rem; color: var(--fg); }
.cof-manage { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--line); }
button.cof-small { display: inline-flex; align-items: center; gap: .25rem; padding: .25rem .5rem; font-size: .75rem; }
button.cof-small .icon { width: .875rem; height: .875rem; }
button.link.cof-small { border: 0; background: none; color: var(--muted); }
.cof-foot { display: flex; justify-content: flex-end; gap: .5rem; margin-top: 1rem; }
.cof-note { margin: .75rem 0 0; padding: .5rem .75rem; border-radius: .375rem; background: #fffbeb; color: #78350f; font-size: .8125rem; }
.cof-line { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .375rem; }
.cof-row .pt-details small { display: block; font-size: .75rem; }
.cof-b-on_issue, .cof-b-charged { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }
.cof-b-declined, .cof-b-not_charged { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }
.cof-b-unknown, .cof-b-needs_support { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.cof-confirm { margin: .75rem 0; }
.cof-confirm p { margin: 0 0 .5rem; }
.cof-confirm-line { display: flex; justify-content: space-between; gap: .75rem; padding: .5rem .75rem; border: 1px solid var(--line); border-radius: .375rem; font-size: .875rem; }
.cof-confirm-line + .cof-confirm-line { margin-top: .375rem; }
.cof-confirm-line > span { display: inline-flex; align-items: center; gap: .375rem; }
.cof-confirm-line .icon { width: 1rem; height: 1rem; color: var(--muted); }
.modal.cof-result { max-width: 28rem; }
.cof-charging { padding: 2rem 1.25rem; text-align: center; }
.cof-charging p { margin: .25rem 0; }
.cof-charging .cof-charging-title { margin-top: 1rem; font-weight: 500; color: var(--fg); }
.cof-spinner { width: 2.5rem; height: 2.5rem; margin: 0 auto; border: 4px solid var(--line); border-top-color: var(--primary-dark); border-radius: 50%; animation: cof-spin 1s linear infinite; }
@keyframes cof-spin { to { transform: rotate(360deg); } }
.cof-outcome { display: flex; gap: .75rem; }
.cof-outcome h2 { margin: 0; font-size: 1rem; font-weight: 600; }
.cof-outcome p { margin: .25rem 0 0; font-size: .875rem; color: var(--text); }
.cof-outcome .cof-hint { margin-top: .5rem; font-weight: 500; }
.cof-outcome-mark { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; font-weight: 700; }
.cof-outcome.bad h2 { color: #b91c1c; }
.cof-outcome.bad .cof-outcome-mark { background: #fee2e2; color: #b91c1c; }
.cof-outcome.warn h2 { color: #92400e; }
.cof-outcome.warn .cof-outcome-mark { background: #fef3c7; color: #92400e; }
.cof-outcomes { margin-top: 1rem; border: 1px solid var(--line); border-radius: .375rem; font-size: .875rem; }
.cof-outcomes > div { display: flex; justify-content: space-between; gap: .75rem; padding: .375rem .75rem; }
.cof-outcomes > .muted { border-bottom: 1px solid var(--line); font-size: .75rem; }
.cof-k-charged { color: #15803d; }
.cof-k-unknown { color: #b45309; }
.cof-k-declined, .cof-k-rejected, .cof-k-blocked { color: #b91c1c; }
.cof-result-foot { margin: 1.25rem -1.25rem -1.25rem; }
.cof-result-foot button { display: inline-flex; align-items: center; gap: .375rem; }
.cof-sent { color: var(--ok); font-size: .875rem; }
.cof-modal { max-width: 40rem; padding: 0; }
.cof-modal .cof-panel { margin: 0; border: 0; box-shadow: none; }
.cof-backdrop { display: none; }
html.dark .cof-panel { border-color: #065f46; }
html.dark .cof-alert.warn { background: rgba(120, 53, 15, .3); border-color: #92400e; color: #fde68a; }
html.dark .cof-alert.bad { background: rgba(127, 29, 29, .3); border-color: #991b1b; color: #fecaca; }
html.dark .cof-reason { color: #fca5a5; }
html.dark .cof-b-on_issue, html.dark .cof-b-charged { background: rgba(6, 95, 70, .3); border-color: #065f46; color: #6ee7b7; }
html.dark .cof-b-declined, html.dark .cof-b-not_charged { background: rgba(127, 29, 29, .3); border-color: #991b1b; color: #fecaca; }
html.dark .cof-b-unknown, html.dark .cof-b-needs_support { background: rgba(120, 53, 15, .3); border-color: #92400e; color: #fde68a; }
html.dark .cof-note { background: rgba(120, 53, 15, .3); color: #fde68a; }
html.dark .cof-outcome.bad .cof-outcome-mark { background: rgba(127, 29, 29, .4); color: #fecaca; }
html.dark .cof-outcome.warn .cof-outcome-mark { background: rgba(120, 53, 15, .4); color: #fde68a; }
@media (max-width: 639px) {
  .cof-backdrop { display: block; position: fixed; inset: 0; z-index: 59; background: rgba(0, 0, 0, .4); }
  .cof-modal .cof-backdrop { display: none; }
  .cof-modal .cof-panel { position: static; max-height: none; border-radius: 0; box-shadow: none; }
  .cof-panel { position: fixed; inset: auto 0 0 0; z-index: 60; max-height: 85vh; overflow-y: auto; margin: 0; border-radius: 1rem 1rem 0 0; box-shadow: 0 -10px 30px rgba(0, 0, 0, .25); }
  .cof-amount { grid-template-columns: 1fr; }
  .cof-foot { display: grid; grid-template-columns: 1fr 1fr; }
  .cof-card { flex-wrap: wrap; }
  .cof-reason { width: 100%; max-width: none; padding-inline-start: 1.75rem; text-align: start; }
}

/* «Add Card» окном (G-063) */
.card-modal { max-width: 40rem; width: 100%; }
.card-modal-frame { width: 100%; height: min(70vh, 44rem); border: 0; }
/* окно правки карты как у оригинала (max-w-2xl, sm:grid-cols-2 gap-4): две колонки, страна на всю ширину с подсказкой под ней */
.edit-card-modal { max-width: 42rem; }
.form.edit-card-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 40rem) { .form.edit-card-grid { grid-template-columns: 1fr 1fr; } }
.form.edit-card-grid > .field { grid-column: auto; min-width: 0; }
.form.edit-card-grid > .field.span-2 { grid-column: 1 / -1; }
.edit-card-grid .field-hint { margin: .25rem 0 0; font-size: .875rem; }
.card-checkout { min-height: 24rem; }
.card-frame { width: 100%; height: 32rem; border: 0; }

/* окно слияния контрагентов */
.merge-modal { max-width: 40rem; width: 100%; }
.merge-modal .modal-head p { margin: .375rem 0 0; font-size: .9375rem; }
.merge-modal .modal-foot .primary { background: #059669; border-color: #059669; }

/* поле только для чтения (валюта сохранённого контрагента) — серым, как у оригинала */
.party-form select:disabled, .party-form input:disabled, .party-form input[readonly] { background: #f3f4f6; color: #6b7280; opacity: 1; cursor: not-allowed; }
html.dark .party-form select:disabled, html.dark .party-form input:disabled, html.dark .party-form input[readonly] { background: #1d293d; color: #90a1b9; border-color: #314158; }

/* меню «•••» — без прокрутки (короткие списки действий); выпадающие списки — без горизонтальной прокрутки */
.list-panel { overflow-x: hidden; }
.list-panel.list-panel-end { max-height: none; overflow: visible; }
/* список раздела — во всю высоту окна, даже когда строк мало (table-layout оригинала) */
html.in-tenant main.wide-page > div > .list-view > .list-table-wrap,
html.in-tenant main.wide-page > .list-view > .list-table-wrap { min-height: calc(100vh - 10.125rem); }
html.in-tenant main.wide-page:has(> .list-view, > div > .list-view) { padding-bottom: .5rem; }
/* счета подписки — таблица во всю высоту карточки раздела, как у оригинала */
#billing-invoices-list .list-table-wrap { min-height: calc(100vh - 12rem); }

/* панель документа как у оригинала: таблицы карточек без шапки списков (обычный регистр, без фона), Book и History */
/* сверка 2026-11-04: карточка bg-gray-50 / dark:bg-gray-700, p-4, mb-6; таблица прямо на карточке (без своей рамки, фона, тени);
   шапка 14/600 с линией 2px, строки py-2 с линией 1px, итог — линия 2px сверху; суммы и шапка не переносятся */
.drawer-card { padding: 1rem; border-radius: .5rem; background: #f9fafb; }
html.dark .drawer-card { background: #374151; color: #f3f4f6; }
.drawer-card table.drawer-lines { border: 0; border-radius: 0; background: none; box-shadow: none; }
.drawer-card table.drawer-lines th, .drawer-card table.drawer-lines td { background: none; text-transform: none; letter-spacing: normal; font-size: .875rem;
  color: inherit; padding: .5rem 0; border-bottom: 1px solid #e5e7eb; }
.drawer-card table.drawer-lines th + th, .drawer-card table.drawer-lines td + td { padding-inline-start: .75rem; }
.drawer-card table.drawer-lines thead th { padding-top: 0; font-weight: 600; color: #374151; border-bottom: 2px solid #d1d5db; white-space: nowrap; }
.drawer-card table.drawer-lines td.num, .drawer-card table.drawer-lines th.num { white-space: nowrap; }
.drawer-card table.drawer-lines tfoot th { border-bottom: 0; border-top: 2px solid #9ca3af; padding-top: 1rem; padding-bottom: 0; font-weight: 700; white-space: nowrap; }
html.dark .drawer-card table.drawer-lines thead th { color: #e5e7eb; border-bottom-color: #6b7280; }
html.dark .drawer-card table.drawer-lines td { border-bottom-color: #4b5563; }
html.dark .drawer-card table.drawer-lines tfoot th { border-top-color: #6b7280; }
.drawer-summary > div { padding: .5rem 0; border-bottom: 1px solid #e5e7eb; white-space: nowrap; }
html.dark .drawer-summary > div { border-bottom-color: #4b5563; }
.drawer-summary > div.drawer-total { border-top: 2px solid #9ca3af; border-bottom: 0; padding-top: 1rem; margin-top: 0; font-weight: 700; }
.drawer-summary > div.drawer-total + div.drawer-total { border-top: 0; padding-top: .5rem; }
html.dark .drawer-summary > div.drawer-total { border-top-color: #6b7280; }
.drawer-summary h4 { margin: 0 0 .5rem; color: #6b7280; } html.dark .drawer-summary h4 { color: #9ca3af; }
.drawer-body > .drawer-card { margin: 0; }
dl.drawer-client { gap: .5rem; }
.drawer-client dt { color: #4b5563; } html.dark .drawer-client dt { color: #d1d5db; }
.drawer-client dd { font-weight: 500; }
.book-section { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1.5rem; align-items: flex-start; }
.book-head { margin: 0 0 .25rem; font-size: .9375rem; font-weight: 600; }
.money-ok { color: #16a34a; white-space: nowrap; } .money-warn { color: #d97706; white-space: nowrap; }
html.dark .money-ok { color: #4ade80; } html.dark .money-warn { color: #fbbf24; }
.book-settle { display: flex; align-items: center; gap: .25rem; width: 100%; }
.book-settle-row { display: flex; align-items: center; gap: .5rem; width: 100%; padding: .5rem .75rem; border: 0; border-radius: .375rem; background: #f9fafb;
  color: inherit; font: inherit; font-size: .875rem; text-align: start; text-decoration: none; cursor: pointer; }
.book-settle-row .num { margin-inline-start: auto; font-variant-numeric: tabular-nums; }
.book-settle-row:hover { background: #f3f4f6; }
html.dark .book-settle-row { background: rgba(31, 41, 55, .5); } html.dark .book-settle-row:hover { background: #1d293d; }
.struck { text-decoration: line-through; color: #9ca3af; }
.danger-text { color: #dc2626; }
.book-picker { display: flex; flex-direction: column; gap: .25rem; width: 100%; }
.book-entry { width: 100%; border: 1px solid #e5e7eb; border-radius: .375rem; margin-bottom: .75rem; }
html.dark .book-entry { border-color: #314158; }
.book-entry-head { display: flex; align-items: center; gap: .5rem; padding: .5rem .75rem; color: inherit; text-decoration: none; }
.book-entry-head:hover { background: #f8fafc; } html.dark .book-entry-head:hover { background: #1d293d; }
.book-entry-no { font-weight: 500; }
.book-entry-total { margin-inline-start: auto; }
table.book-lines { width: 100%; border-collapse: collapse; font-size: .875rem; }
table.book-lines th { background: none; text-transform: none; letter-spacing: normal; font-size: .75rem; font-weight: 400; color: #6b7280; padding: .25rem .75rem; border-bottom: 1px solid #e5e7eb; }
table.book-lines td { padding: .5rem .75rem; border-bottom: 1px solid #f3f4f6; }
table.book-lines tr:last-child td { border-bottom: 0; }
table.book-lines .num { text-align: end; white-space: nowrap; }
html.dark table.book-lines th { color: #90a1b9; border-bottom-color: #314158; } html.dark table.book-lines td { border-bottom-color: #1d293d; }
.history-card { padding: .875rem 1rem; margin-bottom: .75rem; border: 1px solid #e5e7eb; border-radius: .5rem; background: #f9fafb; }
.history-card p { margin: .5rem 0 0; color: #374151; }
html.dark .history-card { background: #1d293d; border-color: #314158; } html.dark .history-card p { color: #cad5e2; }
.history-end { display: flex; justify-content: center; margin-top: .5rem; }
.history-end span { padding: .25rem .75rem; border-radius: 999px; background: #f3f4f6; color: #374151; font-size: .875rem; font-weight: 500; }
html.dark .history-end span { background: #f1f5f9; color: #0f172b; }

/* окно Preview PDF (IncomePDFPreview оригинала, D-0105): широкое окно, инструменты в шапке по центру, страница на сером поле */
.modal.pdf-modal { max-width: min(72rem, 95vw); width: 95vw; height: calc(100vh - 2rem); overflow: hidden; }
.pdf-head { position: relative; }
.pdf-head h2 { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.pdf-head h2 .icon { flex-shrink: 0; width: 1.5rem; height: 1.5rem; color: var(--primary); }
.pdf-tools { display: flex; align-items: center; gap: .25rem; }
.pdf-tools button, html.dark .pdf-tools button { display: inline-flex; align-items: center; padding: .25rem; border: 0; border-radius: .25rem; background: none; color: #45556c; }
html.dark .pdf-tools button { color: #90a1b9; }
.pdf-tools button:hover:not(:disabled) { color: var(--fg); background: rgba(107, 114, 128, .1); }
.pdf-tools button:disabled { opacity: .4; }
.pdf-tools .icon { width: 1rem; height: 1rem; }
.pdf-tools .pdf-zoom { padding: .25rem .5rem; font-size: .75rem; }
.pdf-pages { display: inline-flex; align-items: center; gap: .25rem; font-size: .75rem; color: #4b5563; }
html.dark .pdf-pages { color: #90a1b9; }
.pdf-stage { flex: 1; min-height: 0; overflow: auto; padding: 1rem; background: #e5e7eb; text-align: center; }
html.dark .pdf-stage { background: #0f172b; }
.pdf-stage canvas { display: inline-block; background: #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .15); }
@media (min-width: 64rem) { .pdf-tools { position: absolute; left: 50%; transform: translateX(-50%); } }
#pdf-print { display: none; }
@media print {
  html.printing-pdf body > *:not(#pdf-print) { display: none !important; }
  html.printing-pdf #pdf-print { display: block; }
  #pdf-print img { display: block; width: 100%; break-after: page; }
}

/* колонка импорта, сопоставленная моделью (ИИ-сопоставление оригинала) */
.import-map-head { display: flex; align-items: center; gap: .25rem; }
.ai-badge { margin-inline-start: .25rem; padding: 0 .375rem; border-radius: 9999px; background: #ede9fe; color: #6d28d9; font-size: .6875rem; font-weight: 600; vertical-align: middle; }
html.dark .ai-badge { background: rgba(139, 92, 246, .2); color: #c4b5fd; }

/* обязательное поле — звёздочка после подписи (RequestCardModal оригинала: «Email To *»); не в тексте подписи — поле находится по ней */
.required-mark::after { content: ' *'; }

/* меню «Add Document» на панели списка; на узком экране кнопки панели — только значки (IncomeListPage оригинала: mobile-icon-btn) */
.list-add .list-panel { min-width: 16rem; }
.list-add .list-panel .menu-item { display: flex; align-items: center; gap: .5rem; padding: .5rem .75rem; border-radius: .375rem; color: inherit; font-size: .875rem; text-decoration: none; }
.list-add .list-panel .menu-item .icon { width: 1rem; height: 1rem; }
@media (max-width: 767px) { .list-tools .list-tool > span, .list-tools button > span:not(.list-count), .list-filter-buttons button > span:not(.list-count) { display: none; } }

/* кнопки панели, скрытые атрибутом hidden (Clear без фильтров) */
.list-toolbar [hidden] { display: none !important; }

/* ссылка в ячейке без цвета ссылки (колонка Type списка документов — у оригинала простой текст) */
.list-table a.plain-link, html.dark .list-table a.plain-link { color: inherit; text-decoration: none; }

/* главная как у оригинала (DashboardBlock и блоки dashboard/*.vue, D-0105; docs/notes/original-dashboard.md) */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.db { display: flex; flex-direction: column; gap: 1rem; }
.db-row { display: grid; grid-template-columns: 1fr; gap: 1rem; align-items: stretch; }
@media (min-width: 64rem) { .db-row { grid-template-columns: 1fr 1fr; } }
.db-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #e5e7eb; border-radius: .5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1); min-width: 0; }
html.dark .db-card { background: #1d293d; border-color: #314158; }
.db-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: 1rem 1.25rem; border-bottom: 1px solid #f3f4f6; }
html.dark .db-head { border-color: #314158; }
.db-head.collapsed { border-bottom: 0; }
.db-title { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.db-title .icon { flex-shrink: 0; width: 1.25rem; height: 1.25rem; color: var(--primary); }
.db-title h2 { margin: 0; font-size: 1rem; line-height: 1.5rem; font-weight: 600; color: #111827; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.dark .db-title h2 { color: #fff; }
.db-actions { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.db-count { font-size: .875rem; font-weight: 600; color: #4b5563; font-variant-numeric: tabular-nums; }
html.dark .db-count { color: #90a1b9; }
.db-badge-count { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; padding: 0 .5rem; border-radius: 9999px;
  background: var(--primary); color: #fff; font-size: .75rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.db-body { flex: 1; padding: 1rem 1.25rem; font-size: .875rem; }
.db-tall { min-height: 14rem; }
.db-body .skeleton { height: 1.25rem; margin-bottom: .75rem; }
.db-error { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; }
.db-error > span { display: flex; align-items: center; gap: .5rem; color: #dc2626; }
.db-error .icon { width: 1.25rem; height: 1.25rem; }
.db-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; padding: 1.5rem 0; text-align: center; color: #6b7280; }
.db-empty .icon { width: 2rem; height: 2rem; color: #d1d5db; }
html.dark .db-empty .icon { color: #45556c; }
.db-hint { margin: 0; font-size: .75rem; line-height: 1rem; color: #6b7280; }
html.dark .db-hint { color: #90a1b9; }
/* кнопки xs Nuxt UI: primary, outline, soft, ghost */
.db-primary, .db-outline, .db-soft, .db-ghost { display: inline-flex; align-items: center; gap: .25rem; padding: .25rem .5rem; border-radius: .375rem; font-size: .75rem;
  line-height: 1rem; font-weight: 500; white-space: nowrap; text-decoration: none; cursor: pointer; border: 1px solid transparent; }
.db-primary .icon, .db-outline .icon, .db-soft .icon, .db-ghost .icon { width: 1rem; height: 1rem; }
.db-primary, html.dark .db-primary { background: var(--primary); color: #fff; }
.db-primary:hover { filter: brightness(.95); }
.db-outline, html.dark .db-outline { background: transparent; color: var(--fg); border-color: #cad5e2; }
html.dark .db-outline { border-color: #45556c; }
.db-outline:hover { background: rgba(107, 114, 128, .08); }
.db-soft, html.dark .db-soft { background: rgba(74, 222, 128, .12); color: var(--primary); }
.db-soft.ghost, html.dark .db-soft.ghost, .db-ghost, html.dark .db-ghost { background: transparent; color: #45556c; border-color: transparent; }
html.dark .db-soft.ghost, html.dark .db-ghost { color: #cad5e2; }
.db-ghost:hover, .db-soft.ghost:hover { background: rgba(107, 114, 128, .1); }
.db-primary:disabled, .db-outline:disabled { opacity: .5; cursor: default; }
/* Getting started */
.db-done-strip { display: flex; align-items: center; gap: .5rem; padding: .75rem 1.25rem; font-size: .875rem; }
.db-done-strip .icon.ok { width: 1.25rem; height: 1.25rem; color: #22c55e; }
.db-done-strip .db-count { margin-inline-start: auto; }
.db-steps { list-style: none; margin: 0; padding: 0; }
.db-steps li { display: flex; align-items: center; gap: .75rem; padding: .75rem 0; border-top: 1px solid #f3f4f6; }
.db-steps li:first-child { border-top: 0; }
html.dark .db-steps li { border-color: #314158; }
.db-num { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 9999px;
  background: #f3f4f6; color: #4b5563; font-size: .75rem; font-weight: 600; }
html.dark .db-num { background: #314158; color: #cad5e2; }
.db-num.ok { background: #dcfce7; color: #15803d; }
html.dark .db-num.ok { background: rgba(20, 83, 45, .4); color: #86efac; }
.db-num .icon { width: 1rem; height: 1rem; }
.db-step-text { flex: 1; min-width: 0; }
.db-step-title { font-size: .875rem; color: #111827; }
html.dark .db-step-title { color: #f1f5f9; }
.db-steps li.done .db-step-title { text-decoration: line-through; color: #9ca3af; }
.db-step-text .db-hint { margin-top: .125rem; }
.db-pill { display: inline-block; padding: .125rem .5rem; border-radius: 9999px; background: #f3f4f6; color: #6b7280; font-size: .75rem; line-height: 1rem; }
html.dark .db-pill { background: #314158; color: #90a1b9; }
.db-step-buttons { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
/* Month close */
.db-month-body { display: flex; flex-direction: column; gap: .75rem; height: 100%; }
.db-month-name { margin: 0; font-size: 1.125rem; line-height: 1.75rem; font-weight: 700; color: var(--fg); }
.db-month-lines { display: flex; flex-direction: column; gap: .75rem; }
.db-line { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.db-late { color: #b91c1c; font-weight: 600; }
.db-soon { color: #b45309; font-weight: 600; }
html.dark .db-late { color: #f87171; }
html.dark .db-soon { color: #fbbf24; }
.db-progress { display: block; width: 100%; height: 6px; border: 0; border-radius: 9999px; background: #e5e7eb; overflow: hidden; appearance: none; }
html.dark .db-progress { background: #314158; }
.db-progress::-webkit-progress-bar { background: transparent; }
.db-progress::-webkit-progress-value { background: var(--primary); border-radius: 9999px; }
.db-progress::-moz-progress-bar { background: var(--primary); border-radius: 9999px; }
.db-blocker { margin: 0; padding: .5rem .75rem; border-radius: .5rem; background: #fef2f2; color: #b91c1c; font-size: .75rem; }
html.dark .db-blocker { background: rgba(127, 29, 29, .3); color: #fca5a5; }
.db-buttons { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: auto; }
.db-badge, .db-state { display: inline-flex; align-items: center; padding: .125rem .5rem; border-radius: .375rem; font-size: .75rem; line-height: 1rem; font-weight: 500; }
.db-badge.success, .db-state.s-closed, .db-state.s-done { background: #dcfce7; color: #15803d; }
.db-badge.error, .db-state.s-overdue { background: #fee2e2; color: #b91c1c; }
.db-badge.warning, .db-state.s-open { background: #fef3c7; color: #b45309; }
.db-state.s-ready_to_close { background: #dbeafe; color: #1d4ed8; }
.db-state.s-preparing { background: #ede9fe; color: #6d28d9; }
html.dark .db-badge.success, html.dark .db-state.s-closed, html.dark .db-state.s-done { background: rgba(20, 83, 45, .4); color: #86efac; }
html.dark .db-badge.error, html.dark .db-state.s-overdue { background: rgba(127, 29, 29, .4); color: #fca5a5; }
html.dark .db-badge.warning, html.dark .db-state.s-open { background: rgba(120, 53, 15, .4); color: #fcd34d; }
html.dark .db-state.s-ready_to_close { background: rgba(30, 58, 138, .4); color: #93c5fd; }
html.dark .db-state.s-preparing { background: rgba(76, 29, 149, .4); color: #c4b5fd; }
/* Payments, Problems, Unpaid */
.db-list { list-style: none; margin: 0; padding: 0; }
/* черта под каждой строкой, и под последней тоже — как у оригинала (Андрей 2026-11-10: «change border to bottom») */
.db-list > li { border-bottom: 1px solid #f3f4f6; }
html.dark .db-list > li { border-bottom-color: #314158; }
.db-pay, .db-problem { display: flex; align-items: center; gap: .75rem; padding: .5rem 0; }
.db-problem { padding: .75rem 0; }
.db-pay-text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.db-pay-title { font-size: .875rem; color: var(--fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.db-pay-note { flex-shrink: 0; font-size: .75rem; font-weight: 500; }
.db-pay-note.late { color: #dc2626; }
.db-pay-note.soon { color: #d97706; }
.db-pay-note.muted { color: #6b7280; }
.db-sev { flex-shrink: 0; padding: .125rem .5rem; border-radius: .25rem; font-size: .75rem; font-weight: 600; }
.db-sev.high { background: #fef2f2; color: #b91c1c; }
.db-sev.medium { background: #fffbeb; color: #b45309; }
.db-sev.low { background: #f3f4f6; color: #4b5563; }
html.dark .db-sev.high { background: rgba(127, 29, 29, .4); color: #fca5a5; }
html.dark .db-sev.medium { background: rgba(120, 53, 15, .4); color: #fcd34d; }
html.dark .db-sev.low { background: #314158; color: #cad5e2; }
.db-summary { display: flex; align-items: baseline; gap: .5rem; margin: 0 0 .5rem; }
.db-summary strong { font-size: 1.5rem; line-height: 2rem; font-weight: 700; color: var(--fg); }
.db-summary span:not(.muted) { font-size: .875rem; font-weight: 500; color: #374151; }
html.dark .db-summary span:not(.muted) { color: #cad5e2; }
.db-unpaid { display: flex; align-items: center; gap: .75rem; padding: .5rem 0; color: inherit; text-decoration: none; }
.db-unpaid:hover .db-pay-title { color: var(--primary); }
.db-amount { flex-shrink: 0; font-size: .875rem; font-weight: 500; color: var(--fg); }
.db-amount.late { color: #dc2626; }
/* окно Payments configuration */
.modal.db-config { max-width: 42rem; }
.db-config-row { display: flex; align-items: center; gap: .5rem; margin-bottom: .5rem; }
.db-config-row.off { opacity: .6; }
.db-config-row input[type=text] { flex: 1; min-width: 12rem; }
.db-config-row input[type=date] { width: 10rem; }
.db-trash, html.dark .db-trash { display: inline-flex; padding: .25rem; border: 0; background: none; color: #dc2626; }
.db-trash .icon { width: 1rem; height: 1rem; }
@media (max-width: 640px) { .db-steps li { flex-wrap: wrap; } .db-step-buttons { width: 100%; justify-content: flex-end; } }

/* список: фильтры с несколькими значениями и чипы, выбор строк и плавающая панель (лиды оригинала, D-0105) */
.list-filters-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
/* пять фильтров одной строкой (журнал: From, To, Source и два флажка — как у оригинала, владелец 2026-11-09) */
.list-filters-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1099px) { .list-filters-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) { .list-filters-5 { grid-template-columns: 1fr; } }
@media (max-width: 1023px) { .list-filters-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .list-filters-4 { grid-template-columns: 1fr; } }
.list-filter-label { display: flex; align-items: center; gap: .375rem; }
.list-hint { display: inline-flex; align-items: center; justify-content: center; width: 1rem; height: 1rem; border-radius: 9999px; background: #e5e7eb;
  color: #4b5563; font-size: .6875rem; font-weight: 600; cursor: help; }
html.dark .list-hint { background: #314158; color: #cad5e2; }
.list-multi { width: 100%; }
.list-multi-button { display: flex; align-items: center; justify-content: space-between; gap: .5rem; width: 100%; padding: .55rem .75rem; border: 1px solid var(--line);
  border-radius: .375rem; background: var(--surface); color: var(--text); font: inherit; font-size: .875rem; text-align: start; cursor: pointer; }
.list-multi-text { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.list-multi .list-panel { width: 100%; }
.list-chips { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .5rem; }
.list-chip { display: inline-flex; align-items: center; gap: .25rem; padding: .125rem .25rem .125rem .625rem; border-radius: 9999px; background: #f3f4f6;
  color: #374151; font-size: .75rem; font-weight: 500; }
html.dark .list-chip { background: #314158; color: #e2e8f0; }
.list-chip-x { display: inline-flex; padding: .125rem; border: 0; border-radius: 9999px; background: none; color: inherit; cursor: pointer; }
.list-chip-x:hover { background: rgba(0, 0, 0, .08); }
.list-chip-x .icon { width: .75rem; height: .75rem; }
.list-notice { margin: 0 0 .5rem; }
.list-notice:empty { display: none; }
.list-table th.list-check, .list-table td.list-check { width: 44px; text-align: center; padding-inline: 0; }
.list-table td.list-check input { margin: 0; cursor: pointer; }
.list-selection { position: fixed; z-index: 40; bottom: 1.5rem; inset-inline-start: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: .5rem;
  padding: .5rem 1rem; border: 1px solid var(--line); border-radius: 9999px; background: var(--surface);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1); }
[dir="rtl"] .list-selection { transform: translateX(50%); }
.list-selection[hidden] { display: none; }
.list-sel-count { font-size: .875rem; font-weight: 500; white-space: nowrap; }
.list-sel-divider { width: 1px; height: 1.25rem; background: var(--line); }
.list-sel-remove, .list-sel-remove:hover { color: #dc2626; }
.list-sel-remove:hover { background: #fef2f2; }
.list-sel-clear { display: inline-flex; padding: .375rem; border: 0; border-radius: 9999px; background: none; color: #6b7280; cursor: pointer; }
.list-sel-clear:hover { background: #f3f4f6; }
.list-sel-clear .icon { width: 1rem; height: 1rem; }
.list-panel-up { top: auto; bottom: calc(100% + .25rem); }
@media (max-width: 767px) { .list-selection { flex-wrap: wrap; border-radius: .75rem; width: calc(100% - 2rem); justify-content: center; } .list-selection .list-tool span { display: none; } }
/* плашка статуса лида: фон — цвет статуса с прозрачностью 10% ({color}1A), текст — цвет, точка */
.lead-pill { display: inline-flex; align-items: center; gap: .375rem; padding: .125rem .625rem; border-radius: 9999px; font-size: .75rem; font-weight: 500; line-height: 1rem; }
.lead-pill-dot { width: .375rem; height: .375rem; border-radius: 9999px; background: currentColor; }
.lead-channel-code { display: block; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .75rem; color: #6b7280; }
.lead-no-channel { color: #b45309; }
.list-table td .lead-channel { white-space: normal; line-height: 1.1rem; }

/* карточка лида как pages/leads/[id] оригинала (D-0105): коробка rounded-lg border bg-white, строка вкладок h-14 со счётчиками,
   справа Status / Assigned to (sm) и •••; Details — две колонки gap-x-8, разделы text-lg/600; журнал — таблица; файлы — зона и таблица */
.lead-name { font-weight: 500; color: var(--primary) !important; }
.lead-box { background: var(--surface); border: 1px solid var(--line); border-radius: .5rem; }
.lead-top { display: flex; justify-content: space-between; align-items: center; gap: .5rem; flex-wrap: wrap; min-height: 3.5rem; padding-inline-end: 1rem;
  border-bottom: 1px solid var(--line); }
.lead-tabs { display: flex; flex-wrap: wrap; }
.lead-tab { display: inline-flex; align-items: center; gap: .375rem; height: 3.5rem; padding: 0 1rem; margin-bottom: -1px; box-sizing: border-box;
  border-bottom: 2px solid transparent; color: var(--text); font-size: .875rem; text-decoration: none; white-space: nowrap; }
.lead-tab:hover { border-bottom-color: #d1d5db; }
.lead-tab.current { border-bottom-color: var(--primary); color: var(--primary); font-weight: 700; }
.lead-tab .icon { width: 1.25rem; height: 1.25rem; }
.lead-tab-count { margin-inline-start: .25rem; padding: 0 .375rem; border-radius: 9999px; background: #f3f4f6; color: #374151; font-size: .75rem; font-weight: 500; }
html.dark .lead-tab-count { background: #314158; color: #e2e8f0; }
.lead-top-tools { display: flex; align-items: center; gap: .5rem; }
.lead-sm { padding: .375rem .625rem; font-size: .875rem; }
.lead-status { min-width: 10rem; }
.lead-assignee { min-width: 11rem; }
.lead-details, .lead-pane { padding: 1.25rem; }
.lead-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2rem; row-gap: 1rem; }
.lead-cols section { display: flex; flex-direction: column; gap: 1rem; }
@media (max-width: 767px) { .lead-cols { grid-template-columns: 1fr; } }
.lead-section { margin: 0; font-size: 1.125rem; font-weight: 600; }
.lead-required { margin: 0 0 1rem; }
.lead-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.lead-contact-row { display: flex; align-items: center; gap: .5rem; margin-bottom: .375rem; }
.lead-contact-row input { flex: 1; min-width: 0; }
.lead-primary { font-size: .75rem; color: #6b7280; white-space: nowrap; }
.lead-x { display: inline-flex; padding: .25rem; border: 0; border-radius: .25rem; background: none; color: #6b7280; cursor: pointer; }
.lead-x:hover { background: #f3f4f6; color: #dc2626; }
.lead-x .icon { width: 1rem; height: 1rem; }
.lead-add { align-self: flex-start; }
.lead-channel-hint { margin: .375rem 0 0; font-size: .75rem; color: #b45309; }
.lead-facts { display: grid; gap: .5rem; margin: 0; font-size: .875rem; }
.lead-facts div { display: grid; grid-template-columns: 140px 1fr; gap: .5rem; }
.lead-facts dt { color: #6b7280; }
.lead-facts dd { margin: 0; overflow-wrap: anywhere; }
.lead-foot { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.lead-unsaved { color: #b45309; font-size: .875rem; }
.lead-note-form { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1rem; }
.lead-note-actions { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.lead-note-edit { display: flex; flex-direction: column; gap: .5rem; }
.lead-note-edit .lead-note-actions { justify-content: flex-end; }
.lead-note { padding: .75rem 1rem; margin-bottom: .75rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); }
.lead-note header { display: flex; align-items: center; gap: .5rem; margin-bottom: .375rem; font-size: .875rem; }
.lead-note-menu { margin-inline-start: auto; }
.lead-note p { margin: 0; font-size: .875rem; }
.lead-agent { padding: 0 .375rem; border-radius: 9999px; background: #ede9fe; color: #6d28d9; font-size: .75rem; font-weight: 500; }
.lead-empty { margin: .5rem 0; }
table.lead-log { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: .875rem; }
.lead-log th { padding: .5rem; text-align: start; font-weight: 600; border-bottom: 2px solid var(--line); }
.lead-log td { padding: .5rem; border-bottom: 1px solid var(--line); vertical-align: top; overflow-wrap: anywhere; }
.lead-log th.lead-when { width: 150px; }
.lead-log th.lead-mail { width: 220px; }
.lead-log th.lead-market { width: 180px; }
.lead-log th.list-actions { width: 40px; }
.lead-log tr.linked { cursor: pointer; }
.lead-log tr.linked:hover td { background: #f9fafb; }
html.dark .lead-log tr.linked:hover td { background: #314158; }
.lead-dir { display: inline-block; padding: 0 .5rem; border-radius: 9999px; font-size: .75rem; font-weight: 500; }
.lead-dir.incoming { background: #d1fae5; color: #047857; }
.lead-dir.outgoing { background: #e0f2fe; color: #0369a1; }
.lead-detail { display: block; font-size: .75rem; color: #6b7280; }
code.lead-detail { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.lead-ext { display: inline-block; padding: 0 .375rem; border-radius: .25rem; background: #f3f4f6; color: #374151; font-size: .6875rem; font-weight: 600; }
html.dark .lead-ext { background: #314158; color: #e2e8f0; }
.import-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.import-page-size { display: flex; align-items: center; gap: .5rem; font-size: .875rem; }
.field-label { font-size: .875rem; font-weight: 500; }
.pre { white-space: pre-wrap; }
.lead-details input, .lead-details select, .lead-details textarea, .lead-pane textarea { width: 100%; min-width: 0; }
.lead-contact-row input { width: auto; }
html.dark .list-sel-clear:hover, html.dark .lead-x:hover { background: #314158; }
html.dark .list-sel-remove:hover { background: rgba(220, 38, 38, .15); }
html.dark .lead-dir.incoming { background: rgba(16, 185, 129, .2); color: #6ee7b7; }
html.dark .lead-dir.outgoing { background: rgba(14, 165, 233, .2); color: #7dd3fc; }
html.dark .lead-agent { background: rgba(139, 92, 246, .25); color: #c4b5fd; }
@media (max-width: 479px) { .lead-pair { grid-template-columns: 1fr; } .lead-top-tools { flex-wrap: wrap; padding-inline-start: 1rem; padding-bottom: .5rem; } }

/* депозиты как pages/deposit/* оригинала (D-0105): сетка номиналов в 3 колонки, итог справа, кнопки окна по краям; лист печати */
.cash-notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.cash-notes input { width: 100%; min-width: 0; }
@media (max-width: 767px) { .cash-notes { grid-template-columns: 1fr; } }
.cash-empty { margin: 0; text-align: center; }
.cash-total { margin: 0; text-align: end; font-size: 1.125rem; font-weight: 600; }
.modal-body > .modal-foot { margin: 0 -1rem -1rem; }
.modal-foot-split { justify-content: space-between; }
.list-range { display: flex; align-items: center; gap: .5rem; }
.list-range input { flex: 1; min-width: 0; }
.deposit-party { color: var(--primary) !important; text-decoration: underline !important; }
.list-table td input.deposit-done { width: 1.25rem; height: 1.25rem; margin: 0; accent-color: var(--primary); cursor: pointer; }
#deposit-print { display: none; }
@media print {
  html.printing-deposit body * { visibility: hidden; }
  html.printing-deposit #deposit-print, html.printing-deposit #deposit-print * { visibility: visible; }
  html.printing-deposit #deposit-print { display: block; position: absolute; inset: 0; padding: 1rem; background: #fff; color: #000; }
}
/* звёздочка обязательного поля — рядом с подписью, а не в ней: подпись остаётся именем поля (⌨️ сценариев, экранные чтецы) */
.label-row { display: flex; align-items: baseline; gap: .25rem; }
.req-star { color: #ef4444; font-size: .875rem; }

/* счета как pages/accounts/[view] оригинала (D-0105): ключ моноширинным, доля < 100 — жирным, «Active» — плашка */
.acc-key { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .75rem; }
.acc-pct-low { font-weight: 600; }
.acc-active { display: inline-block; padding: .125rem .625rem; border-radius: 9999px; font-size: .75rem; font-weight: 500; }
.acc-active.yes { background: #dcfce7; color: #166534; }
.acc-active.no { background: #fee2e2; color: #991b1b; }
html.dark .acc-active.yes { background: rgba(34, 197, 94, .2); color: #86efac; }
html.dark .acc-active.no { background: rgba(239, 68, 68, .2); color: #fca5a5; }
.list-check-field { justify-content: flex-end; }
.list-check-filter { align-self: flex-start; display: flex; align-items: center; gap: .5rem; min-height: 2.625rem; /* высота поля фильтра */ }
/* зелёная кнопка (color="success" Nuxt UI): «Create Document» при создании сметы и проформы */
button.success { background: #22c55e; border-color: #22c55e; color: #fff; }
button.success:hover { background: #16a34a; border-color: #16a34a; }

/* Quick Pay: окно New / Edit Payment Link (QuickPayLinkModal оригинала) — сумма и валюта в строку 2:1, регулярная — блок полей; окно документов шире */
.modal.modal-wide { max-width: 48rem; }
.qp-amount-row { display: grid; gap: 0 1rem; }
@media (min-width: 640px) { .qp-amount-row { grid-template-columns: minmax(0, 2fr) minmax(8rem, 1fr); } }
/* окно ссылки — одна колонка, как QuickPayLinkModal оригинала (max-w-md); сумма и валюта — одной строкой 2:1 */
.form.qp-modal-form { grid-template-columns: minmax(0, 1fr); align-items: stretch; min-width: min(26rem, 100%); }
.qp-recurring { display: grid; gap: 0; }
.qp-taxes { display: grid; gap: .25rem; }
.qp-taxes .label-text { font-weight: 600; font-size: .875rem; }
.qp-tax-line { display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-size: .875rem; }

/* Подписи (D-0105): карточка документа и редактор шаблона как pages/e-signature оригинала — полоса «только просмотр», шапка фактов
   в 6 колонок, вкладки с иконками, узкие формы вкладок, журнал событий с полосой слева, кнопки действий в ряд */
.esign-card { padding: 0; overflow: hidden; max-width: none; gap: 0; }
.esign-card > .tabs, .esign-card > .form, .esign-card > .esign-actions, .esign-card > .error { margin-left: 1.5rem; margin-right: 1.5rem; }
.esign-card > .form { padding: 0; }
.esign-card > .esign-actions { margin-bottom: 1.5rem; }
.esign-body { padding: 1rem; display: grid; gap: 1rem; }
.esign-readonly { padding: .75rem 1rem; border-bottom: 1px solid var(--line); font-size: .875rem; color: var(--muted); }
.esign-facts { display: grid; grid-template-columns: 1fr; gap: 1rem; font-size: .875rem; margin: 0; }
@media (min-width: 640px) { .esign-facts { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px) { .esign-facts { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .esign-facts { grid-template-columns: repeat(6, 1fr); } }
.esign-facts dt { color: var(--muted); margin-bottom: .25rem; }
.esign-facts dd { margin: 0; overflow-wrap: anywhere; }
.esign-card .tabs .tab { display: inline-flex; align-items: center; gap: .5rem; }
.esign-card .tabs .tab .icon { width: 1.25rem; height: 1.25rem; }
.esign-narrow { max-width: 42rem; display: grid; gap: .25rem; }
/* вкладка Settings — max-w-xl и space-y-4 оригинала */
.esign-narrow.esign-settings { max-width: 36rem; gap: 1rem; }
.esign-grid-2 { display: grid; gap: 0 1rem; }
@media (min-width: 640px) { .esign-grid-2 { grid-template-columns: 1fr 1fr; } }
.esign-ttl { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: .5rem; }
.esign-ttl input { width: 8rem; }
.esign-text { max-height: none; }
.esign-events-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.esign-events { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.esign-events li { font-size: .875rem; border-inline-start: 2px solid var(--line); padding-inline-start: .75rem; }
.esign-event-meta { color: var(--muted); font-size: .75rem; }
.esign-event-details { margin: .25rem 0 0; font-size: .75rem; color: var(--muted); display: grid; gap: .1rem; }
.esign-event-details div { display: flex; gap: .35rem; }
.esign-event-details dt::after { content: ':'; }
.esign-event-details dd { margin: 0; overflow-wrap: anywhere; }
.esign-cancelled { border: 1px solid var(--line); background: var(--panel); border-radius: .25rem; padding: .75rem; font-size: .875rem; display: grid; gap: .25rem; }
.esign-actions { display: flex; flex-direction: column; flex-wrap: wrap; gap: .75rem; padding-top: 1.5rem; }
@media (min-width: 640px) { .esign-actions { flex-direction: row; } }
.esign-actions button { min-width: 120px; justify-content: center; }
.esign-actions button.danger-text { color: #dc2626; background: #fef2f2; border-color: #fecaca; }
html.dark .esign-actions button.danger-text { color: #fca5a5; background: rgba(127, 29, 29, .2); border-color: rgba(127, 29, 29, .5); }

/* Details лида — своя карточка с рамкой внутри карточки вкладок (LeadInfoPanel оригинала); телефон — страна с флагом и номер */
.lead-info-box { border: 1px solid var(--line); border-radius: 8px; background: var(--surface); padding: 1rem; }
.lead-contact-row .phone-input { flex: 1; min-width: 0; }
/* шестерёнка Report configuration в шапке Month close (кнопка-значок оригинала: ghost, 28px) */
.db-icon { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; padding: 0; border: 0; border-radius: 6px;
  background: none; color: var(--muted); cursor: pointer; }
.db-icon:hover { background: rgba(0, 0, 0, .05); color: var(--fg); }
html.dark .db-icon:hover { background: rgba(255, 255, 255, .08); }
.db-icon .icon { width: 1.25rem; height: 1.25rem; }

/* карточка лида как у оригинала: Details — своя рамка с отступом внутри карточки вкладок; «+ Add» — зелёная ссылка; Remove — красный
   текст со значком корзины (UButton error ghost) */
.lead-box > .lead-info-box { margin: 1rem; }
.lead-add, .lead-add:hover { border: 0; background: none; padding: 0; color: var(--primary); font-size: .875rem; }
.lead-add:hover { text-decoration: underline; }
button.ghost-danger { display: inline-flex; align-items: center; gap: .375rem; border: 0; background: none; color: #dc2626; padding: .375rem .625rem; border-radius: 6px; }
button.ghost-danger:hover { background: #fef2f2; }
html.dark button.ghost-danger { color: #f87171; }
html.dark button.ghost-danger:hover { background: rgba(127, 29, 29, .25); }
button.ghost-danger .icon { width: 1rem; height: 1rem; }
/* Conversation как у оригинала: поле ввода — в своей рамке, «пусто» — по центру серым; Cancel формы — без рамки (ghost) */
.lead-note-form { border: 1px solid var(--line); border-radius: 8px; padding: .5rem; background: var(--surface); }
.lead-note-form .lead-note-actions small, .lead-note-form .hint { font-size: .75rem; color: var(--muted); }
.lead-pane .lead-empty { margin: 1.5rem 0; text-align: center; color: var(--muted); font-size: .875rem; }
.lead-foot button.outline { border-color: transparent; background: none; }
.lead-foot button.outline:hover:not(:disabled) { background: rgba(0, 0, 0, .04); }
html.dark .lead-foot button.outline:hover:not(:disabled) { background: rgba(255, 255, 255, .06); }
/* Calls / Emails / B2B — грид от края до края карточки (isGridTab оригинала): шапка всегда, карточка во всю высоту, пусто — по центру */
.lead-pane.lead-grid-pane { padding: 0; min-height: calc(100vh - 9.5rem); display: flex; flex-direction: column; }
.lead-grid-pane .lead-log th { padding: .5rem .375rem; border-inline-end: 1px solid var(--line); }
.lead-grid-pane .lead-log th:last-child { border-inline-end: 0; }
.lead-grid-empty { flex: 1; display: flex; align-items: center; justify-content: center; margin: 0; color: #9ca3af; font-size: 1.125rem; font-weight: 600; }
.lead-grid-pane .lead-log th { text-transform: none; letter-spacing: normal; font-size: .875rem; font-weight: 600; color: var(--fg); background: var(--surface); }
.lead-pane.lead-grid-pane { min-height: calc(100vh - 10.75rem); }
html .lead-details button.lead-add, html .lead-details button.lead-add:hover, html .lead-details button.lead-add:focus-visible,
html.dark .lead-details button.lead-add, html.dark .lead-details button.lead-add:hover {
  display: inline-block; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; color: var(--primary); font-size: .875rem; line-height: 1.25rem; }
html .lead-details button.lead-add:hover { text-decoration: underline; }
/* пустой список: шапка таблицы остаётся, текст — по центру оставшейся высоты (как грид оригинала) */
.list-table-wrap { display: flex; flex-direction: column; }
.list-wrap-empty { flex: 1; display: flex; align-items: center; justify-content: center; margin: 0; padding: 2rem 1rem; color: #ccc;
  font-size: 1.25rem; font-weight: 700; line-height: 1.875rem; text-align: center; } /* .tabulator-placeholder оригинала: 20px, bold, #ccc в обеих темах */
/* текст документа подписи — Markdown (prose оригинала) */
.esign-md { white-space: normal; line-height: 1.6; }
.esign-md h1 { font-size: 1.5rem; margin: .5rem 0 1rem; } .esign-md h2 { font-size: 1.25rem; margin: 1.25rem 0 .5rem; } .esign-md h3 { font-size: 1.05rem; margin: 1rem 0 .5rem; }
.esign-md p { margin: .5rem 0; } .esign-md ul, .esign-md ol { margin: .5rem 0; padding-inline-start: 1.5rem; } .esign-md hr { border: 0; border-top: 1px solid var(--line); margin: 1rem 0; }
.esign-md table { border-collapse: collapse; margin: .5rem 0; } .esign-md th, .esign-md td { border: 1px solid var(--line); padding: .25rem .5rem; }
.esign-md th { text-transform: none; letter-spacing: normal; background: var(--canvas); color: inherit; font-weight: 600; }
.esign-md blockquote { border-inline-start: 3px solid var(--line-strong); padding-inline-start: .75rem; color: var(--muted); margin: .5rem 0; }
.esign-md pre { background: var(--panel); padding: .5rem .75rem; border-radius: .375rem; overflow: auto; }
/* «Payment after signing» (NextStepConfigForm оригинала, D-0125): строки услуг и графика, итоги, скидка */
.esign-step .esign-lines { display: flex; flex-direction: column; gap: .5rem; }
.esign-step .esign-line-row { display: flex; align-items: center; gap: .5rem; }
.esign-step .esign-line-name { flex: 1 1 auto; min-width: 0; }
.esign-step .esign-line-qty { flex: 0 0 4.5rem; }
.esign-step .esign-line-price { flex: 0 0 7.5rem; }
.esign-step .esign-line-date { flex: 0 0 9.5rem; }
/* поля строки сжимаются до своих колонок (у числовых полей общий min-width 160px), календарь — обёрткой .dp-wrap */
.esign-step .esign-line-row > input { min-width: 0; }
.esign-step .esign-line-row > .dp-wrap { flex: 0 0 9.5rem; min-width: 0; }
.esign-step .esign-line-row > .dp-wrap input { width: 100%; min-width: 0; }
.esign-step .esign-line-taxes { display: flex; align-items: center; gap: .5rem; margin: .25rem 0 0; font-size: .75rem; }
.esign-step, .esign-step > div:not(.field) { display: flex; flex-direction: column; gap: 1rem; } /* обёртки x-if; у .field своя раскладка — «?» рядом с подписью */
.esign-step .field { margin: 0; }
.esign-step .esign-add { align-self: flex-start; display: inline-flex; align-items: center; gap: .375rem; padding: .25rem .75rem; border: 0; background: none; color: var(--primary-dark); font-size: .875rem; font-weight: 500; min-height: 0; }
.esign-step .esign-add:hover { text-decoration: underline; background: none; }
html.dark .esign-step .esign-add { background: none; color: #05df72; }
.esign-step label.check { display: flex; align-items: center; gap: .5rem; margin: 0; }
.esign-step .esign-total, .esign-step .esign-next-charge { margin: .5rem 0; font-size: .875rem; display: flex; gap: .25rem; }
.esign-step .esign-discount { display: grid; grid-template-columns: minmax(0, 1fr) 7.5rem; gap: .5rem; }
.esign-step .esign-discount input { width: 100%; min-width: 0; }
@media (max-width: 640px) {
  .esign-step .esign-line-row { flex-wrap: wrap; }
  .esign-step .esign-line-name { flex-basis: 100%; }
}
/* редактор текста подписи (MarkdownEditor оригинала, md-editor.js, D-0121): рамка, тулбар, поле и предпросмотр, переключатель под полем */
.md-editor .md-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .125rem; padding: .375rem .5rem; border-bottom: 1px solid var(--line); background: var(--canvas); }
.md-editor .md-toolbar[hidden] { display: none; }
.md-editor .md-tool { display: inline-flex; align-items: center; justify-content: center; width: 1.875rem; height: 1.875rem; padding: 0; border: 1px solid transparent; border-radius: .25rem; background: transparent; color: var(--text); min-height: 0; }
.md-editor .md-tool:hover, .md-editor .md-tool.active { background: var(--panel); border-color: var(--line-strong); }
.md-editor .md-icon { width: 1.1rem; height: 1.1rem; }
.md-editor .md-sep { width: 1px; height: 1.25rem; background: var(--line-strong); margin: 0 .375rem; }
.md-editor .md-markdown, .md-editor .md-rich { border: 1px solid var(--line); border-radius: .375rem; overflow: hidden; background: var(--surface); }
.md-editor .md-markdown[hidden], .md-editor .md-rich[hidden] { display: none; }
.md-editor .md-split { display: grid; grid-template-columns: 1fr; min-height: 26.25rem; }
.md-editor .md-split--side { grid-template-columns: 1fr 1fr; }
.md-editor .md-textarea { border: 0; border-radius: 0; resize: vertical; min-height: 26.25rem; padding: .5rem .75rem; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .875rem; box-shadow: none; background: transparent; }
.md-editor .md-textarea:focus { outline: none; box-shadow: none; }
.md-editor .md-preview { display: none; padding: .5rem .75rem; overflow: auto; max-height: 70vh; border-inline-start: 1px solid var(--line); }
.md-editor .md-split--side .md-preview { display: block; }
.md-editor .md-split--preview .md-textarea { display: none; }
.md-editor .md-split--preview .md-preview { display: block; border: 0; }
.md-editor--readonly .md-split .md-textarea { display: none; }
.md-editor--readonly .md-split .md-preview { display: block; border: 0; }
.md-editor--readonly .md-markdown, .md-editor--readonly .md-rich { background: var(--canvas); }
.md-editor--fullscreen .md-markdown { position: fixed; inset: 0; z-index: 60; border-radius: 0; display: flex; flex-direction: column; }
.md-editor--fullscreen .md-split { flex: 1; }
.md-editor--fullscreen .md-preview { max-height: none; }
.md-editor .md-rich-content { max-height: 70vh; overflow-y: auto; }
.md-editor .md-rich-input { min-height: 26.25rem; padding: .5rem .75rem; outline: none; }
.md-editor .md-rich-input > * + * { margin-top: .75rem; }
.md-editor .md-rich-input p.is-editor-empty:first-child::before { content: attr(data-placeholder); color: var(--muted); float: inline-start; height: 0; pointer-events: none; }
.md-editor .md-rich-input .selectedCell { background: color-mix(in srgb, var(--primary) 15%, transparent); }
.md-editor .md-modes { margin-top: .375rem; }
.md-editor .md-modes[hidden] { display: none; }
.md-editor .md-mode-toggle { display: inline-flex; align-items: center; gap: .375rem; padding: 0; border: 0; background: none; color: var(--muted); font-size: .8125rem; min-height: 0; cursor: pointer; }
.md-editor .md-mode-toggle:hover { color: var(--fg); }
.md-editor .md-mode-toggle .md-icon { width: 1rem; height: 1rem; }
html.dark .md-editor .md-toolbar { background: #1d293d; border-color: #314158; }
html.dark .md-editor .md-markdown, html.dark .md-editor .md-rich { background: #0f172b; border-color: #314158; }
html.dark .md-editor .md-tool, html.dark .md-editor .md-mode-toggle { background: transparent; color: #e2e8f0; border-color: transparent; }
html.dark .md-editor .md-tool:hover, html.dark .md-editor .md-tool.active { background: #314158; border-color: #45556c; }
html.dark .md-editor .md-mode-toggle { color: #90a1b9; }
html.dark .md-editor .md-preview { border-color: #314158; }
html.dark .md-editor--readonly .md-markdown, html.dark .md-editor--readonly .md-rich { background: #1d293d; }
/* обязательные стили ProseMirror (TipTap вставлял бы их <style>-тегом — CSP страниц его запрещает, поэтому injectCSS: false) */
.ProseMirror { position: relative; word-wrap: break-word; white-space: pre-wrap; white-space: break-spaces; font-variant-ligatures: none; font-feature-settings: "liga" 0; }
.ProseMirror [contenteditable="false"] { white-space: normal; }
.ProseMirror [contenteditable="false"] [contenteditable="true"] { white-space: pre-wrap; }
.ProseMirror pre { white-space: pre-wrap; }
img.ProseMirror-separator { display: inline !important; border: none !important; margin: 0 !important; width: 0 !important; height: 0 !important; }
.ProseMirror-gapcursor { display: none; pointer-events: none; position: absolute; margin: 0; }
.ProseMirror-gapcursor:after { content: ""; display: block; position: absolute; top: -2px; width: 20px; border-top: 1px solid currentColor; animation: ProseMirror-cursor-blink 1.1s steps(2, start) infinite; }
@keyframes ProseMirror-cursor-blink { to { visibility: hidden; } }
.ProseMirror-hideselection *::selection { background: transparent; }
.ProseMirror-hideselection * { caret-color: transparent; }
.ProseMirror-focused .ProseMirror-gapcursor { display: block; }

/* тёмная тема как у оригинала (Nuxt UI, slate; сверка 2026-11-04, docs/notes/compare/part-01-estimate-form.md): поля — фон slate-900 и
   рамка slate-700, белый текст; кнопки — primary и success с тёмным текстом (text-inverted), вторичные — фон slate-900, рамка slate-700 */
html.dark input, html.dark select, html.dark textarea { background: #0f172b; border-color: #314158; color: #fff; }
html.dark button:where(:not(.primary):not(.icon-button):not([type='submit']):not(.success)) { background: #0f172b; border-color: #314158; color: #e2e8f0; }
html.dark button.primary, html.dark form button[type='submit'] { color: #0f172b; }
html.dark button.success { background: #05df72; border-color: #05df72; color: #0f172b; }
html.dark button.success:hover { background: #00c758; border-color: #00c758; }
html.dark button.outline { background: #0f172b; border-color: #314158; color: #e2e8f0; }
/* «Select file» вложения — как у оригинала (серые кнопки FilePicker): 14px, 6px 12px */
.income-attachment button { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; padding: .375rem .75rem; background: #fff; border: 1px solid #d1d5db; color: #374151; }
html.dark .income-attachment button { background: #1f2937; border-color: #4b5563; color: #e5e7eb; }

/* список выбора (select.js) — как USelectMenu / RtlSelect оригинала: кнопка с выбранным, × и шеврон; окно — «Search...» и пункты.
   Исходное <select> — под кнопкой, прозрачное (x-model и ⌨️ сценариев работают с ним) */
.sel-wrap { position: relative; display: block; min-width: 0; }
.sel-flag { width: 1.25rem; height: .9375rem; margin-inline-end: .5rem; border-radius: .125rem; vertical-align: -.125rem; flex-shrink: 0; }
.sel-native { position: absolute !important; inset: 0; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 100% !important; opacity: 0 !important; pointer-events: none !important; margin: 0 !important; }
.sel-trigger { display: flex; align-items: center; width: 100%; min-height: 2.25rem; padding: .4375rem 2.25rem .4375rem .75rem !important; text-align: start;
  font: inherit; font-weight: 400 !important; font-size: .875rem; border-radius: .375rem; background: var(--bg) !important; border: 1px solid var(--field-line) !important;
  color: var(--fg) !important; cursor: pointer; box-shadow: none !important; }
[dir=rtl] .sel-trigger { padding: .4375rem .75rem .4375rem 2.25rem !important; }
html.dark .sel-trigger { background: #0f172b !important; border-color: #314158 !important; color: #fff !important; }
.sel-trigger:focus-visible { outline: 2px solid var(--primary); outline-offset: -1px; }
.sel-trigger:disabled { opacity: .5; cursor: not-allowed; }
.sel-wrap.invalid .sel-trigger { border-color: var(--danger) !important; }
.sel-text { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sel-text.placeholder { color: #90a1b9; }
.sel-chevron { position: absolute; inset-inline-end: .625rem; top: 1.125rem; transform: translateY(-50%); width: 1.25rem; height: 1.25rem; color: #90a1b9; pointer-events: none; }
.sel-clear { position: absolute; inset-inline-end: .75rem; top: 1.125rem; transform: translateY(-50%); display: inline-flex; padding: .125rem !important; border: 0 !important; background: none !important; color: #90a1b9 !important; cursor: pointer; }
.sel-clear .icon { width: 1rem; height: 1rem; }
.sel-clear[hidden], .dp-clear[hidden] { display: none !important; }
.sel-wrap.has-clear .sel-chevron { display: none; }
.select-list button { display: flex !important; align-items: center; gap: .5rem; }
.sel-item { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sel-check { flex: none; width: 1rem; height: 1rem; color: var(--primary); }
.select-pop { position: absolute; z-index: 80; inset-inline: 0; max-width: 22rem; top: calc(100% + .25rem); border-radius: .375rem; overflow: hidden;
  background: #fff; box-shadow: 0 0 0 1px #e2e8f0, 0 10px 15px -3px rgba(0, 0, 0, .1); }
html.dark .select-pop { background: #0f172b; box-shadow: 0 0 0 1px #314158, 0 10px 15px -3px rgba(0, 0, 0, .4); }
.select-search { width: 100%; border: 0 !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; padding: .5rem .75rem !important; font-size: .875rem; background: transparent !important; outline: none; }
.select-list { max-height: 15rem; overflow-y: auto; padding: .25rem; outline: none; }
.select-list button { display: block; width: 100%; padding: .375rem .5rem !important; border: 0 !important; border-radius: .25rem; background: none !important; color: inherit !important;
  font: inherit; font-size: .875rem; font-weight: 400 !important; text-align: start; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; min-height: 0; }
.select-list button.active { background: #f1f5f9 !important; }
html.dark .select-list button.active { background: #1d293d !important; }
.select-list button.selected { font-weight: 500 !important; }
.select-list button:disabled { opacity: .45; cursor: default; }
.select-list .muted { margin: 0; padding: .375rem .5rem; font-size: .875rem; }

/* календарь дат (datepicker.js) — как VueDatepicker оригинала: поле с датой в формате бизнеса, значок календаря, ×, окно с месяцем */
.dp-wrap { position: relative; display: block; }
.dp-native { position: absolute !important; top: 0; inset-inline-start: 0; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0 !important; opacity: 0; pointer-events: none; }
.dp-input { width: 100%; padding-inline-end: 2rem !important; }
.dp-clear { position: absolute; top: 50%; transform: translateY(-50%); display: inline-flex; padding: .125rem; border: 0 !important; background: none !important; color: #90a1b9 !important; cursor: pointer; }
.dp-clear { inset-inline-end: .5rem; }
.dp-clear .icon { width: 1rem; height: 1rem; }
.dp-pop { position: absolute; z-index: 80; top: calc(100% + .25rem); inset-inline-start: 0; width: 17.5rem; padding: .75rem; border-radius: .5rem;
  background: #fff; box-shadow: 0 0 0 1px #e2e8f0, 0 10px 15px -3px rgba(0, 0, 0, .12); font-size: .875rem; }
html.dark .dp-pop { background: #0f172b; box-shadow: 0 0 0 1px #314158, 0 10px 15px -3px rgba(0, 0, 0, .45); }
.dp-head { display: flex; align-items: center; gap: .25rem; margin-bottom: .5rem; }
.dp-title { padding: .25rem .5rem !important; border: 0 !important; border-radius: .375rem; background: none !important; color: inherit !important; font-weight: 600 !important; font-size: .875rem; cursor: pointer; }
.dp-title:hover { background: #f1f5f9 !important; }
html.dark .dp-title:hover { background: #1d293d !important; }
.dp-head .dp-month { margin-inline-start: auto; } .dp-head .dp-year { margin-inline-end: auto; }
.dp-grid.dp-pick { grid-template-columns: repeat(3, 1fr); gap: .375rem; }
.dp-cell { padding: .625rem 0 !important; border: 0 !important; border-radius: .375rem; background: none !important; color: inherit !important; font-size: .8125rem; cursor: pointer; }
.dp-cell:hover:not(:disabled):not(.selected) { background: #f1f5f9 !important; }
html.dark .dp-cell:hover:not(:disabled):not(.selected) { background: #1d293d !important; }
.dp-cell.selected { background: var(--primary) !important; color: #fff !important; font-weight: 600; }
html.dark .dp-cell.selected { color: #0f172b !important; }
.dp-cell:disabled { opacity: .35; cursor: default; }
.dp-nav { display: inline-flex; padding: .25rem !important; border: 0 !important; background: none !important; color: inherit; cursor: pointer; }
.dp-nav .icon { width: 1rem; height: 1rem; }
[dir=rtl] .dp-nav .icon { transform: scaleX(-1); }
.dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: .125rem; text-align: center; }
.dp-wd { font-size: .75rem; color: #90a1b9; padding: .25rem 0; }
.dp-day { padding: .375rem 0 !important; border: 0 !important; border-radius: .375rem; background: none !important; color: inherit; cursor: pointer; font-size: .8125rem; }
.dp-day:hover:not(:disabled):not(.selected) { background: #f1f5f9 !important; }
html.dark .dp-day:hover:not(:disabled):not(.selected) { background: #1d293d !important; }
.dp-wrap.invalid .dp-input { border-color: var(--danger) !important; }
.dp-day.today { box-shadow: inset 0 0 0 1px var(--primary); }
.dp-day.selected { background: var(--primary) !important; color: #fff; font-weight: 600; }
html.dark .dp-day.selected { color: #0f172b; }
.dp-day:disabled { opacity: .35; cursor: default; }
.dp-foot { display: flex; justify-content: flex-end; margin-top: .5rem; }
.dp-today { padding: .25rem .625rem; font-size: .8125rem; }
/* «Document Details» — одной строкой, как IncomeDetails оригинала: lg:grid-cols-5 (International) / lg:grid-cols-6 (Израиль) */
/* одной строкой — когда сама карточка шире 60rem (контейнер, не окно: боковая панель съедает ширину); клиент вдвое шире, имя видно */
.income-card { container-type: inline-size; }
@container (min-width: 60rem) {
  .income-grid.cols-4 { grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); } .income-grid.cols-5 { grid-template-columns: minmax(0, 2fr) repeat(4, minmax(0, 1fr)); }
  .income-grid.cols-6 { grid-template-columns: minmax(0, 2fr) repeat(5, minmax(0, 1fr)); } .income-grid.cols-7 { grid-template-columns: minmax(0, 2fr) repeat(6, minmax(0, 1fr)); }
}

/* поле даты у оригинала (замер 2026-11-04, форма счёта): dark — bg gray-800, рамка gray-700, текст gray-300 (светлее прочих полей) */
html.dark .dp-input { background: #1f2937; border-color: #374151; color: #d1d5db; }

/* несколько значений (select.js, <select multiple>): выбранное — метками под полем, как адреса письма у оригинала */
.sel-chips { display: flex; flex-wrap: wrap; gap: .375rem; margin-top: .5rem; }
.sel-chips[hidden] { display: none; }
.sel-chip { display: inline-flex; align-items: center; gap: .375rem; max-width: 100%; padding: .25rem .5rem .25rem .75rem; border-radius: 9999px; font-size: .875rem;
  color: #059669; background: rgba(46, 211, 138, .1); border: 1px solid rgba(46, 211, 138, .45); }
html.dark .sel-chip { color: #4ade80; background: rgba(46, 211, 138, .12); border-color: rgba(46, 211, 138, .4); }
.sel-chip span { overflow-wrap: anywhere; }
.sel-chip button { display: inline-flex; padding: 0 !important; border: 0 !important; background: none !important; color: inherit !important; cursor: pointer; min-height: 0; }
.sel-chip .icon { width: .875rem; height: .875rem; }
.sel-error { display: block; margin-top: .25rem; }

/* поле поиска с подсказками (search.js) — как поиск товара оригинала: лупа слева, × справа, список по ширине поля */
.srch-wrap { position: relative; display: block; }
.srch-input { width: 100%; padding-inline-start: 2.25rem !important; padding-inline-end: 2rem !important; }
.srch-icon { position: absolute; inset-inline-start: .75rem; top: 50%; transform: translateY(-50%); width: 1rem; height: 1rem; color: #90a1b9; pointer-events: none; }
.srch-clear { position: absolute; inset-inline-end: .5rem; top: 50%; transform: translateY(-50%); display: inline-flex; padding: .125rem !important; border: 0 !important; background: none !important; color: #90a1b9 !important; cursor: pointer; min-height: 0; }
.srch-clear[hidden], .srch-pop[hidden] { display: none !important; }
.srch-clear .icon { width: 1rem; height: 1rem; }
.srch-pop { position: absolute; z-index: 80; inset-inline: 0; top: calc(100% + .25rem); max-height: 15rem; overflow-y: auto; padding: .25rem; border-radius: .375rem;
  background: #fff; box-shadow: 0 0 0 1px #e2e8f0, 0 10px 15px -3px rgba(0, 0, 0, .1); text-align: start; }
html.dark .srch-pop { background: #0f172b; box-shadow: 0 0 0 1px #314158, 0 10px 15px -3px rgba(0, 0, 0, .4); }
.srch-pop button { display: flex; width: 100%; gap: 1rem; justify-content: space-between; padding: .375rem .5rem !important; border: 0 !important; border-radius: .25rem;
  background: none !important; color: inherit !important; font: inherit; font-size: .875rem; font-weight: 400 !important; text-align: start; cursor: pointer; min-height: 0; }
.srch-pop button.active, .srch-pop button:hover { background: #f1f5f9 !important; }
html.dark .srch-pop button.active, html.dark .srch-pop button:hover { background: #1d293d !important; }
.srch-label { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.srch-hint { flex: none; color: #90a1b9; }
.srch-empty { margin: 0; padding: .375rem .5rem; font-size: .875rem; color: #90a1b9; }

/* строки документа (владелец 2026-11-04): количество и цена — узкие (до 6 цифр), описание — широкое */
table.income-lines .col-qty, table.income-lines .col-price { width: 6.5rem; }
table.income-lines .col-tax { width: 8rem; }
table.income-lines .col-desc { min-width: 10rem; }
/* узкий экран: таблица прокручивается внутри карточки, страница — нет */
.lines-scroll { overflow-x: auto; max-width: 100%; }
table.income-lines td input { width: 100%; }
/* ячейка налога как у оригинала: сумма налога, названия со ставкой мелко, ссылка «Add taxes» / «Edit taxes» */
.line-tax-cell { vertical-align: middle; }
.line-tax-amount { display: block; }
.line-tax-cell .line-taxes { display: block; font-size: .75rem; color: #90a1b9; }
.line-tax-link { padding: 0 .125rem !important; border: 0 !important; background: none !important; color: var(--primary) !important; font-size: .875rem; font-weight: 500 !important;
  cursor: pointer; min-height: 0; border-radius: .25rem; }
.line-tax-link:hover { text-decoration: underline; }
.line-tax-link:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
/* окно «Additional taxes» как у оригинала: галочка, ставка 5rem, название и номер поровну, корзина; строки через линию */
.tax-modal { max-width: 48rem; width: 100%; }
.tax-row { display: flex; align-items: flex-end; gap: .75rem; padding-bottom: .75rem; margin-bottom: .75rem; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.tax-row .field { margin: 0; gap: .25rem; max-width: none; }
.tax-row label { font-size: .75rem; font-weight: 500; }
.tax-on { display: flex; align-items: center; height: 2.25rem; flex: none; }
.tax-on input { width: 1.125rem; height: 1.125rem; }
.tax-rate { flex: 0 0 5rem; }
.tax-name, .tax-number { flex: 1 1 10rem; min-width: 0; }
.tax-row input:not([type=checkbox]) { width: 100%; }
.tax-remove { flex: 0 0 2rem; display: flex; align-items: center; justify-content: center; height: 2.25rem; }
.tax-remove .line-remove { color: #dc2626; padding: .25rem !important; border: 0 !important; background: none !important; }
button.soft-primary { display: flex; width: 100%; justify-content: center; align-items: center; gap: .5rem; padding: .5rem .75rem !important;
  background: rgba(46, 211, 138, .1) !important; border: 0 !important; color: #059669 !important; font-weight: 500 !important; }
html.dark button.soft-primary { color: #4ade80 !important; background: rgba(46, 211, 138, .12) !important; }
button.soft-primary:hover { background: rgba(46, 211, 138, .18) !important; }
.tax-foot { display: grid !important; grid-template-columns: 1fr 1fr; gap: .75rem; }
.tax-foot button { width: 100%; justify-content: center; }
/* итоги как у оригинала: каждая строка — плашка; «Total including VAT» — зелёная рамка и фон */
.income-totals { gap: .75rem; }
.income-totals > div { padding: .75rem 1rem; border-radius: .5rem; background: #f8fafc; }
html.dark .income-totals > div { background: #1d293d; }
.income-totals dt { font-weight: 500; }
.income-totals dd { font-weight: 600; }
.income-totals .income-total { border: 2px solid var(--primary) !important; background: rgba(46, 211, 138, .1) !important; color: #059669; padding: .875rem 1rem; font-size: 1.125rem; }
html.dark .income-totals .income-total { color: #4ade80; background: rgba(46, 211, 138, .12) !important; }

/* детали строки оплаты (IncomeReceiptLines оригинала, раскладка лучше): поля переносятся по ширине ячейки, короткие — уже */
.pay-details { padding-top: 0 !important; }
.pay-group tr:first-child td { border-bottom: 0; }
.pay-fields { display: flex; flex-wrap: wrap; gap: .5rem; }
/* обычные поля — по два в ряд, короткие (отделение, 4 цифры, число платежей) — узкие */
/* ширина — по содержимому: xs — 3–4 цифры (отделение, 4 цифры карты, число платежей), s — номер счёта и чека, m — вид карты и
   сделки, l — банк и примечание (растягиваются). Списки выбора обёрнуты select.js — класс поля переходит на обёртку */
.pay-fields > input, .pay-fields > .sel-wrap { width: auto; min-width: 0; }
.pay-fields > .pay-w-xs, .pay-fields > .sel-wrap:has(> .pay-w-xs) { flex: 0 0 6rem; }
.pay-fields input[type=number] { -moz-appearance: textfield; appearance: textfield; }
.pay-fields input[type=number]::-webkit-inner-spin-button, .pay-fields input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.pay-fields > .pay-w-s, .pay-fields > .sel-wrap:has(> .pay-w-s) { flex: 0 0 8.5rem; }
.pay-fields > .pay-w-m, .pay-fields > .sel-wrap:has(> .pay-w-m) { flex: 0 0 11rem; }
.pay-fields > .pay-w-l, .pay-fields > .sel-wrap:has(> .pay-w-l) { flex: 1 1 12rem; }
/* скрытые сообщения компонентов не занимают места (display у .field-error перебивал hidden) */
.sel-error[hidden], .dp-error[hidden] { display: none !important; }

/* таблицы строк и оплат — в рамке со скруглением (владелец 2026-11-04): шапка и строки — один блок; последняя строка без линии */
.lines-scroll { border: 1px solid var(--line); border-radius: .5rem; overflow: hidden; }
.lines-scroll > table.income-lines { border: 0; border-radius: 0; box-shadow: none; margin: 0; }
.lines-scroll > table.income-lines > tbody > tr:last-child > td { border-bottom: 0; }
.pay-group > tr.pay-row-details > td { border-bottom: 1px solid var(--line); }
.pay-group:last-child > tr.pay-row-details > td { border-bottom: 0; }

/* узкая карточка — перенос вместо прокрутки (владелец 2026-11-04): шапки нет, у полей маленькие подписи, значения — по низу.
   Строка товара: описание на всю ширину; ниже количество | цена | НДС / налоги | сумма | действия (телефон — по два в ряд).
   Оплата: вид | дата | сумма | действия (телефон — вид | дата, сумма | действия); детали — ниже на всю ширину */
@container (max-width: 50rem) {
  table.items-table, table.items-table tbody, table.pay-table { display: block; }
  table.items-table thead, table.pay-table thead { display: none; }
  table.items-table td, table.pay-table td { display: block; border: 0 !important; padding: 0 !important; background: none !important; }
  table.items-table td[data-label]::before, table.pay-table td[data-label]::before { content: attr(data-label); display: block; margin-bottom: .25rem;
    font-size: .75rem; color: #90a1b9; text-align: start; }
  table.items-table td.num[data-label]::before, table.pay-table td.num[data-label]::before { text-align: end; }
  table.items-table tbody tr { display: grid; gap: .5rem .75rem; align-items: end; padding: .75rem 1rem; border-bottom: 1px solid var(--line);
    grid-template-columns: 6.5rem 6.5rem auto minmax(0, 1fr) auto;
    grid-template-areas: "desc desc desc desc desc" "qty price tax total act"; }
  table.items-table tbody tr:last-child { border-bottom: 0; }
  table.items-table td.it-desc { grid-area: desc; } table.items-table td.it-qty { grid-area: qty; } table.items-table td.it-price { grid-area: price; }
  table.items-table td.it-vat, table.items-table td.it-tax { grid-area: tax; } table.items-table td.it-total { grid-area: total; }
  table.items-table td.it-actions { grid-area: act; }
  table.pay-table tbody.pay-group { display: block; padding: .75rem 1rem; border-bottom: 1px solid var(--line); }
  table.pay-table tbody.pay-group:last-child { border-bottom: 0; }
  table.pay-table tbody.pay-group > tr:first-child { display: grid; gap: .5rem .75rem; align-items: end;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) auto; grid-template-areas: "type date amount act"; }
  table.pay-table td.pt-type { grid-area: type; } table.pay-table td.pt-date { grid-area: date; } table.pay-table td.pt-amount { grid-area: amount; }
  table.pay-table td.pt-actions { grid-area: act; }
  table.pay-table tbody.pay-group > tr.pay-row-details { display: block; margin-top: .5rem; }
  table.pay-table tbody.pay-group > tr.pay-row-details > td:last-child { display: none; }
}
@container (max-width: 30rem) {
  table.items-table tbody tr { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "desc desc" "qty price" "tax total" "act act"; }
  table.items-table td.it-actions { justify-self: end; }
  table.pay-table tbody.pay-group > tr:first-child { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "type date" "amount act"; }
}
/* поля карточек документа не шире своего места (на телефоне textarea и поля в сетке вылезали за край) */
.income-card input, .income-card textarea, .income-card select, .income-card .sel-wrap, .income-card .dp-wrap, .income-card .srch-wrap { max-width: 100%; min-width: 0; box-sizing: border-box; }
.income-card textarea { width: 100%; }
/* нижние кнопки документа на телефоне переносятся, а не вылезают за край */
.income-actions, .income-actions > div { flex-wrap: wrap; }
/* свёрнутое меню — значки по центру (владелец 2026-11-04): пункт без отступа подписи, метка текущего — тенью, а не рамкой со сдвигом;
   полоса прокрутки меню не съедает ширину */
html.sidebar-collapsed .sidebar nav { padding-inline: .5rem; }
html.sidebar-collapsed .sidebar nav a, html.sidebar-collapsed .sidebar summary { justify-content: center; gap: 0; padding-inline: 0; }
html.sidebar-collapsed .sidebar nav a[aria-current='page'], html.sidebar-collapsed .sidebar details:has(a[aria-current='page']) > summary {
  border-inline-start: 0; margin-inline-start: 0; box-shadow: inset 3px 0 0 #9ca3af; }
html.sidebar-collapsed[dir='rtl'] .sidebar nav a[aria-current='page'], html.sidebar-collapsed[dir='rtl'] .sidebar details:has(a[aria-current='page']) > summary { box-shadow: inset -3px 0 0 #9ca3af; }
html.sidebar-collapsed .sidebar nav { scrollbar-width: none; }
html.sidebar-collapsed .sidebar nav::-webkit-scrollbar { display: none; }
.issue-business { margin: 0 0 .5rem; text-align: center; font-weight: 600; }
/* показ пароля — значком в поле справа, как у оригинала (Nuxt UI: eye / eye-slash, серый, поверх поля) */
.password-toggle { display: inline-flex; align-items: center; justify-content: center; }
.password-toggle .icon { width: 1.25rem; height: 1.25rem; }
.auth-page .password-toggle { top: auto; bottom: .45rem; padding: .25rem !important; color: #90a1b9 !important; }
.auth-page .password-toggle:hover { color: var(--fg) !important; }
.auth-page input[type=password], .auth-page input[data-toggle] { padding-inline-end: 2.5rem; }
/* значок пароля — внутри поля на всех страницах (вход, регистрация, сброс, профиль), а не отдельной строкой под полем */
*:has(> .password-toggle) { position: relative; }
.password-toggle { position: absolute; inset-inline-end: .5rem; bottom: .45rem; margin: 0 !important; padding: .25rem !important; border: 0 !important;
  background: none !important; box-shadow: none !important; color: #90a1b9 !important; min-height: 0; }
.password-toggle:hover { color: var(--fg) !important; }
input[data-toggle] { padding-inline-end: 2.5rem !important; }

/* окно Send оригинала: кнопки внизу крупнее (py-2 px-6, высота 38), Cancel — серая плашка в тёмной теме (сверка 2026-11-04) */
.send-foot > button { padding: .5rem 1.5rem; font-weight: 500; }
html.dark .send-foot > button.outline { background: #4b5563; border-color: transparent; color: #fff; }

/* окно Linked Documents оригинала: max-w-3xl, таблица 14px со шапкой всегда, пусто — по центру в таблице, Close — по центру внизу */
.linked-modal { width: 48rem; max-width: calc(100vw - 2rem); }
.linked-scroll { overflow-x: auto; }
table.linked-table { width: 100%; border-collapse: collapse; font-size: .875rem; border: 0; box-shadow: none; background: none; }
.linked-table th { text-align: start; padding: .5rem 1rem .5rem 0; font-weight: 600; color: #4b5563; background: none; text-transform: none; letter-spacing: normal; font-size: .875rem; border-bottom: 1px solid #e5e7eb; }
.linked-table td { padding: .5rem 1rem .5rem 0; border-bottom: 1px solid #f3f4f6; }
html.dark .linked-table th { color: #d1d5db; border-bottom-color: #374151; } html.dark .linked-table td { border-bottom-color: #374151; }
.linked-table td.nowrap { white-space: nowrap; }
.linked-actions { display: flex; justify-content: center; gap: .25rem; padding-inline-end: 0 !important; }
.linked-table td.linked-empty { padding: 1.5rem 0; text-align: center; color: #6b7280; border-bottom: 0; }
.linked-foot { justify-content: center; }
.linked-table thead, .linked-table thead tr, html.dark .linked-table thead tr { background: none; }

/* окно подтверждения (CancelConfirmModal оригинала): узкое, две равные кнопки во всю ширину */
.confirm-modal { width: 32rem; max-width: calc(100vw - 2rem); }
.confirm-foot { display: flex; gap: .75rem; }
.confirm-foot > button { flex: 1; justify-content: center; padding: .5rem 1rem; }
.modal-head-bare { justify-content: space-between; }
.leave-text { margin: 0; font-weight: 500; }

/* окна выпуска и «после выпуска» как у оригинала (сверка на проде 2026-11-04): название бизнеса по центру, предупреждение и сообщение —
   зелёной рамкой, факты — тремя колонками по центру, значки действий без рамок, «Back to edit» / «Close» — серой плашкой справа */
.issue-modal, .issued-modal { width: 32rem; max-width: calc(100vw - 2rem); }
.issue-modal .issue-business, .issued-modal .issue-business { margin: 0 0 1rem; text-align: center; font-weight: 600; font-size: 1rem; }
.issue-warning, .issue-note { margin: 0; padding: .625rem .75rem; border: 1px solid #86efac; border-radius: .375rem; background: #f0fdf4; color: #15803d; font-size: .875rem; }
html.dark .issue-warning, html.dark .issue-note { border-color: rgba(74, 222, 128, .4); background: rgba(34, 197, 94, .08); color: #4ade80; }
.issue-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: 1.5rem 0; text-align: center; }
.issue-facts > div { display: flex; flex-direction: column; gap: .375rem; }
.issue-facts dt { font-size: .75rem; color: #6b7280; } html.dark .issue-facts dt { color: #9ca3af; }
.issue-facts dd { margin: 0; font-weight: 600; font-size: 1rem; }
.issue-no-email { margin: 1rem 0 0; font-size: .875rem; }
.issue-foot { justify-content: space-between; }
.issue-foot > button, .issue-foot > a.button { padding: .5rem 1rem; }
button.gray { background: #e5e7eb; border: 0; color: #374151; } html.dark button.gray { background: #4b5563; color: #fff; }
button.gray:hover { background: #d1d5db; } html.dark button.gray:hover { background: #6b7280; }
.issue-foot > .issue-close { min-width: 9rem; justify-content: center; }
.issued-tiles button, html.dark .issued-tiles button { border: 0; background: none; color: #9ca3af; font-size: .75rem; }
.issued-tiles button .icon { color: #22c55e; width: 1.5rem; height: 1.5rem; }
.issued-tiles button:hover, html.dark .issued-tiles button:hover { background: rgba(34, 197, 94, .08); }
.issued-modal .issue-note { margin-top: 1rem; }

/* итоги формы — размеры оригинала (замер 2026-11-04, владелец: «фон слишком большой»): плашки 14px, py-3 px-4, фон gray-800/50, промежуток
   12px; «Total including VAT» — 14px/600, рамка 1.7px primary, фон primary/20 */
.income-totals { font-size: .875rem; gap: .75rem; }
.income-totals > div { padding: .75rem 1rem; }
html.dark .income-totals > div { background: rgba(31, 41, 55, .5); }
.income-totals dt { font-weight: 500; color: #4b5563; } html.dark .income-totals dt { color: #d1d5db; }
.income-totals dd { font-weight: 600; }
.income-totals .income-total { font-size: .875rem; padding: .75rem 1rem; border-width: 1.5px !important; }
html.dark .income-totals .income-total { background: rgba(46, 211, 138, .2) !important; }
.income-totals .income-total dt { color: inherit; font-weight: 600; }
/* количество и цена строки — по центру поля (владелец 2026-11-04); стрелки числа не мешают тексту */
table.items-table td.it-qty input, table.items-table td.it-price input { text-align: center; }
table.items-table td.it-qty input::-webkit-inner-spin-button, table.items-table td.it-qty input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
table.items-table td.it-qty input { -moz-appearance: textfield; appearance: textfield; }
/* галочки — цвет приложения, в тёмной теме тёмные (у оригинала Round Total — тёмная клетка, отмеченная — зелёная; был белый квадрат).
   Рисуем сами, а не accent-color: браузер подбирает цвет самой галочки по контрасту и на зелёном ставит тёмную, а нужна белая
   (владелец 2026-11-06). Форма и размер прежние: клетка 1rem со скруглением, отмеченная — зелёная */
input[type=checkbox] {
  appearance: none; -webkit-appearance: none;
  /* padding общего правила полей (7px 12px) с appearance:none вступает в силу и растягивает клетку в прямоугольник */
  box-sizing: border-box; width: 1rem; height: 1rem; padding: 0; flex: none;
  border: 1px solid var(--field-line); border-radius: .25rem;
  background: var(--surface); display: inline-grid; place-content: center; cursor: pointer;
}
input[type=checkbox]:checked { background: var(--primary); border-color: var(--primary); }
input[type=checkbox]:checked::before {
  content: ""; width: .25rem; height: .5rem; margin-top: -.0625rem;
  border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
input[type=checkbox]:disabled { cursor: default; opacity: .6; }
/* родные части полей (стрелки числа, календарь, прокрутка) — тёмные в тёмной теме, а не белые (владелец 2026-11-09) */
html.dark input, html.dark select, html.dark textarea { color-scheme: dark; }
html.dark input[type=checkbox] { color-scheme: dark; background: var(--panel); border-color: var(--line-strong); }
html.dark input[type=checkbox]:checked { background: var(--primary); border-color: var(--primary); }
/* переключатели рисуем сами, как и флажки: у оригинала отмеченный — зелёный круг с белой точкой внутри */
input[type=radio] {
  appearance: none; -webkit-appearance: none;
  box-sizing: border-box; width: 1rem; height: 1rem; padding: 0; flex: none;
  border: 1px solid var(--field-line); border-radius: 50%; background: var(--surface);
  display: inline-grid; place-content: center; cursor: pointer;
}
input[type=radio]:checked { background: var(--primary); border-color: var(--primary); }
input[type=radio]:checked::before { content: ""; width: .375rem; height: .375rem; border-radius: 50%; background: #fff; }
input[type=radio]:disabled { cursor: default; opacity: .6; }
html.dark input[type=radio] { color-scheme: dark; background: var(--panel); border-color: var(--line-strong); }
html.dark input[type=radio]:checked { background: var(--primary); border-color: var(--primary); }
/* строки оплат: дата и сумма — узкими полями по содержимому (владелец 2026-11-04: «не надо такие широкие»), без стрелок числа */
table.pay-table td.pt-date .dp-wrap { width: 9.5rem; max-width: 100%; }
table.pay-table td.pt-amount input { width: 8rem; max-width: 100%; }
table.pay-table td.pt-amount input::-webkit-inner-spin-button, table.pay-table td.pt-amount input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
table.pay-table td.pt-amount input { appearance: textfield; -moz-appearance: textfield; }

/* строки оплат (владелец 2026-11-04): помещается в одну строку — одна строка с шапкой; не помещается — шапки нет, подписи над полями,
   детали под видом / датой / суммой. Дата и сумма — узкие в обоих видах */
table.pay-table th.pt-h-details { display: none; }
@container (min-width: 64rem) {
  table.pay-table, table.pay-table thead, table.pay-table tbody { display: block; }
  table.pay-table thead tr, table.pay-table tbody.pay-group { display: grid; grid-template-columns: 11rem 9.5rem 8rem minmax(0, 1fr) 4.5rem;
    column-gap: .75rem; align-items: start; padding: .625rem 1rem; }
  table.pay-table thead th { padding: 0; } table.pay-table th.pt-h-details { display: block; }
  table.pay-table tbody.pay-group { border-bottom: 1px solid var(--line); }
  table.pay-table tbody.pay-group:last-child { border-bottom: 0; }
  table.pay-table tbody.pay-group > tr { display: contents; }
  table.pay-table td { padding: 0 !important; border: 0 !important; background: none !important; grid-row: 1; }
  table.pay-table td.pt-type { grid-column: 1; } table.pay-table td.pt-date { grid-column: 2; } table.pay-table td.pt-amount { grid-column: 3; }
  table.pay-table td.pay-details { grid-column: 4; } table.pay-table td.pt-actions { grid-column: 5; justify-self: end; }
  table.pay-table tbody.pay-group > tr.pay-row-details > td:last-child { display: none; }
  table.pay-table td.pt-date .dp-wrap, table.pay-table td.pt-amount input { width: 100%; }
}
@container (max-width: 63.99rem) {
  table.pay-table { display: block; }
  table.pay-table thead { display: none; }
  table.pay-table td { display: block; border: 0 !important; padding: 0 !important; background: none !important; }
  table.pay-table td[data-label]::before { content: attr(data-label); display: block; margin-bottom: .25rem; font-size: .75rem; color: #90a1b9; text-align: start; }
  table.pay-table tbody.pay-group { display: block; padding: .75rem 1rem; border-bottom: 1px solid var(--line); }
  table.pay-table tbody.pay-group:last-child { border-bottom: 0; }
  table.pay-table tbody.pay-group > tr:first-child { display: grid; gap: .5rem .75rem; align-items: end;
    grid-template-columns: minmax(7rem, 11rem) 9.5rem 8rem 1fr; grid-template-areas: "type date amount act"; }
  table.pay-table td.pt-type { grid-area: type; } table.pay-table td.pt-date { grid-area: date; } table.pay-table td.pt-amount { grid-area: amount; }
  table.pay-table td.pt-actions { grid-area: act; justify-self: end; }
  table.pay-table tbody.pay-group > tr.pay-row-details { display: block; margin-top: .5rem; }
  table.pay-table tbody.pay-group > tr.pay-row-details > td:last-child { display: none; }
}
@container (max-width: 30rem) {
  table.pay-table tbody.pay-group > tr:first-child { grid-template-columns: 1fr 1fr; grid-template-areas: "type date" "amount act"; }
  table.pay-table td.pt-date .dp-wrap, table.pay-table td.pt-amount input { width: 100%; }
}
/* примечание оплаты — не во всю строку: узким полем рядом с реквизитами, чтобы строка помещалась (владелец 2026-11-04) */
.pay-fields > .pay-w-note { flex: 1 1 10rem; max-width: 16rem; }
.drawer-footer-note { margin: 0; white-space: pre-wrap; }
/* правка строки — зелёным, как прочие действия (владелец 2026-11-04: синий выглядит странно); подпись суммы — вправо, как сама сумма */
.line-actions .line-edit { color: #22c55e; }
table.pay-table td.num[data-label]::before, table.items-table td.num[data-label]::before { text-align: end; }
/* окно выпуска: дата и сумма — по содержимому, имя клиента — остальная ширина и переносится (владелец 2026-11-04) */
.issue-facts { grid-template-columns: max-content minmax(0, 1fr) max-content; column-gap: 1.5rem; }
.issue-facts dd { overflow-wrap: anywhere; }
.pdf-stage { cursor: grab; user-select: none; } .pdf-stage.panning { cursor: grabbing; }
/* окно «Link other transaction» (UModal max-w-2xl оригинала): строки плашками, своя прокрутка, «Link» — мягкой зелёной кнопкой */
.pick-money-modal { width: 42rem; max-width: calc(100vw - 2rem); }
.pick-money-list { display: flex; flex-direction: column; gap: 2px; max-height: 60vh; overflow-y: auto; padding-inline-end: .25rem; }
.pick-money-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .5rem .75rem; border-radius: .375rem; font-size: .875rem; background: #f9fafb; }
html.dark .pick-money-row { background: rgba(31, 41, 55, .5); } .pick-money-row:hover { background: #f3f4f6; } html.dark .pick-money-row:hover { background: #1f2937; }
.pick-money-what { display: flex; align-items: center; gap: .5rem; min-width: 0; } .pick-money-what > * { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pick-money-account { flex-shrink: 1; } .pick-money-end { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
button.soft-primary { background: rgba(46, 211, 138, .12); color: #16a34a; border: 0; } html.dark button.soft-primary { color: #4ade80; }
/* свёрнутое меню: список подпунктов рядом с пунктом */
.nav-flyout { position: fixed; z-index: 90; min-width: 13rem; padding: .375rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface, #fff);
  box-shadow: 0 10px 25px rgba(0, 0, 0, .25); display: flex; flex-direction: column; gap: 2px; }
.nav-flyout-head { padding: .375rem .625rem; font-size: .75rem; font-weight: 600; color: #6b7280; text-transform: uppercase; letter-spacing: .04em; }
.nav-flyout a { display: flex; align-items: center; gap: .5rem; padding: .4rem .625rem; border-radius: .375rem; color: inherit; text-decoration: none; font-size: .875rem; }
.nav-flyout a span { display: inline !important; }
.nav-flyout a:hover, .nav-flyout a[aria-current='page'] { background: rgba(46, 211, 138, .12); }
/* вкладка Book — плотнее, как у оригинала (владелец 2026-11-04: «слишком большие пейдинги»): отступы 6–8px, кнопка — маленькая мягкая */
.book-section { gap: .375rem; margin-bottom: 1rem; }
.book-section > p { margin: 0; }
.book-section > button.outline-primary { padding: .25rem .5rem; font-size: .875rem; border-radius: .375rem; border-color: rgba(46, 211, 138, .5);
  background: rgba(46, 211, 138, .1); color: #16a34a; }
html.dark .book-section > button.outline-primary { color: #4ade80; }
/* кнопки формы документа на телефоне — во всю ширину, по одной в строке (владелец 2026-11-04) */
@media (max-width: 767px) {
  .income-actions { flex-direction: column; gap: .75rem; }
  .income-actions > div { flex-direction: column; gap: .75rem; }
  .income-actions button { width: 100%; justify-content: center; }
  .issue-foot { flex-direction: column; }
  .issue-foot > button, .issue-foot > a.button { width: 100%; justify-content: center; }
}
/* список шире места — прокрутка вбок, колонка «•••» прилипает к краю (frozen right Tabulator оригинала; владелец 2026-11-04) */
.list-table-wrap { overflow-x: auto; }
.list-table th.list-actions, .list-table td.list-actions { position: sticky; inset-inline-end: 0; z-index: 1; }
.list-table td.list-actions { border-inline-start: 1px solid var(--line); }
html .list-plain .list-table tbody tr:nth-child(n) td.list-actions { background: var(--surface); }
.list-panel.list-panel-float { position: fixed; inset: auto; z-index: 60; }
.list-table tr.list-group td { overflow: visible; }
.list-group-label { position: sticky; inset-inline-start: .5rem; display: inline-block; }
/* список раздела прокручивается внутри грида, как Tabulator оригинала (владелец 2026-11-04): высота — окно, шапка прилипает сверху,
   полоса прокрутки вбок — внизу грида, а не после бесконечной подгрузки */
@media (min-width: 768px) {
  html.in-tenant main.wide-page > div > .list-view > .list-table-wrap,
  html.in-tenant main.wide-page > .list-view > .list-table-wrap { height: calc(100vh - 10.125rem); min-height: 12rem; overflow: auto; }
  .list-table-wrap .list-table thead th { position: sticky; top: 0; z-index: 2; }
  .list-table-wrap .list-table thead th.list-actions { z-index: 3; }
}
/* телефон (владелец 2026-11-04): в шапке — только меню, название и профиль (без «?», ИИ, полного экрана и темы);
   меню выезжает слева панелью с подписями поверх затемнения */
@media (max-width: 767px) {
  header.top .phone-hide { display: none !important; }
  html.in-tenant main > .title-row, html.in-tenant main > h1:first-child { max-width: calc(100vw - 7.5rem); }
  html.in-tenant body.menu-open .sidebar { inset: 0 auto 0 0; width: min(18rem, 85vw); box-shadow: 0 0 2rem rgba(0, 0, 0, .4); }
  [dir='rtl'] html.in-tenant body.menu-open .sidebar, html[dir='rtl'].in-tenant body.menu-open .sidebar { inset: 0 0 0 auto; }
  html.in-tenant body.menu-open::before { content: ''; position: fixed; inset: 0; z-index: 59; background: rgba(0, 0, 0, .5); }
}
/* телефон: панель списка — поиск во всю ширину, ниже в одну строку значки (Columns, Filters, Export, Add) без подписей;
   строки — карточками, как rowFormatterMobile оригинала (заголовок — первая колонка 16px, ниже «Название: значение» 14px),
   «•••» — в углу карточки (владелец 2026-11-04) */
@media (max-width: 767px) {
  .list-toolbar { gap: .5rem; }
  .list-toolbar > .list-left { display: contents; }
  .list-toolbar .list-search { flex: 1 1 100%; }
  .list-toolbar .list-search input { width: 100%; }
  .list-toolbar button.list-tool > span:not(.list-count), .list-toolbar a.list-tool > span:not(.list-count) { display: none; }
  .list-toolbar .list-tools { margin-inline-start: auto; }
  html.in-tenant main.wide-page .list-view > .list-table-wrap { min-height: 0; }
  .list-table-wrap { overflow: visible; }
  table.list-table { display: block; min-width: 0 !important; }
  .list-table thead { display: none; }
  .list-table tbody { display: block; }
  .list-table tbody tr { display: block; position: relative; border-bottom: 1px solid var(--line); }
  .list-table tbody tr:last-child { border-bottom: 0; }
  .list-table tbody td { display: block; width: auto !important; border: 0; padding: 0 3rem 0 1rem; margin: 0; font-size: .875rem; line-height: 1.5;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .list-table tbody tr:not(.list-group) > td:not(.list-first):not(.list-actions):not(.list-check)::before { content: attr(data-label) ': '; font-weight: 600; }
  .list-table tbody td.list-first { padding-top: .75rem; padding-bottom: .5rem; font-size: 1rem; font-weight: 600; }
  .list-table tbody tr:not(.list-group) { padding-bottom: .75rem; }
  .list-table tbody tr:not(.list-group) > td { background: transparent !important; }
  .list-table tbody tr.row-odd { background: #f3f4f6; } .list-table tbody tr.row-even { background: #f9fafb; }
  html.dark .list-table tbody tr.row-odd { background: #0f172b; } html.dark .list-table tbody tr.row-even { background: #1d293d; }
  .list-table tbody tr.row-odd:hover, .list-table tbody tr.row-even:hover { background: #e5e7eb; }
  html.dark .list-table tbody tr.row-odd:hover, html.dark .list-table tbody tr.row-even:hover { background: #314158; }
  .list-table tbody td.list-blank { display: none; }
  .list-table tbody td.num { text-align: start; }
  .list-table tbody td.list-check { position: absolute; top: .75rem; inset-inline-start: .25rem; width: auto; padding: 0; background: none; }
  .list-table tbody tr:has(td.list-check) > td:not(.list-check):not(.list-actions) { padding-inline-start: 2.25rem; }
  .list-table tbody td.list-actions { position: absolute; top: .5rem; inset-inline-end: .5rem; width: auto; padding: 0; border: 0; background: none !important; overflow: visible; }
  .list-table tr.list-group td { padding: .5rem 1rem; }
}
/* открытое меню «•••» — над соседними строками и их «•••» (у ячейки действий свой слой) */
.list-table td.list-actions:has(.list-panel:not([hidden])) { z-index: 50; }
/* полосы прокрутки грида — как .tabulator-tableholder оригинала: 8px, скруглённые, без дорожки (владелец 2026-11-04) */
.list-table-wrap::-webkit-scrollbar { width: 8px; height: 8px; }
.list-table-wrap::-webkit-scrollbar-track, .list-table-wrap::-webkit-scrollbar-corner { background: transparent; }
.list-table-wrap::-webkit-scrollbar-thumb { background: rgb(222 224 230); border-radius: 8px; }
.list-table-wrap::-webkit-scrollbar-thumb:hover { background: rgb(199 201 207); }
html.dark .list-table-wrap::-webkit-scrollbar-thumb { background: rgb(75 85 99); }
html.dark .list-table-wrap::-webkit-scrollbar-thumb:hover { background: rgb(107 114 128); }
/* полосы прокрутки страницы и всех прокручиваемых областей (меню, списки, боковой чат) — как у таблиц: тонкие, ползунок со скруглением,
   без белой дорожки в тёмной теме (владелец 2026-11-10: «design this scroll») */
html.dark { color-scheme: dark; }
html.brand-pending header.top .brand, html.brand-pending .auth-brand, html.brand-pending [x-text="$store.app.brand"] { visibility: hidden; }  /* до загрузки (theme.js) */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner { background: transparent; }
::-webkit-scrollbar-thumb { background: rgb(209 213 219); border-radius: 8px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: rgb(156 163 175); background-clip: padding-box; }
::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
html.dark ::-webkit-scrollbar-thumb { background: rgb(69 85 108); background-clip: padding-box; }
html.dark ::-webkit-scrollbar-thumb:hover { background: rgb(98 116 142); background-clip: padding-box; }
@supports not selector(::-webkit-scrollbar) {
  html { scrollbar-width: thin; scrollbar-color: rgb(209 213 219) transparent; }
  html.dark { scrollbar-color: rgb(69 85 108) transparent; }
}
@supports not selector(::-webkit-scrollbar) {
  .list-table-wrap { scrollbar-width: thin; scrollbar-color: rgb(222 224 230) transparent; }
  html.dark .list-table-wrap { scrollbar-color: rgb(75 85 99) transparent; }
}

/* ---- страница документа по ссылке — страница оплаты оригинала (D-0107, part-02-spec.md §2): только светлая, фон slate-50,
   контейнер max-w-5xl, зелёный #3fb116, карточки белые; превью — шаблон PDF в shadow DOM ---- */
html.pay-light, html.pay-light body.pay-page { background: #f8fafc; color: #0f172a; color-scheme: light; }
body.pay-page { padding: 0; }
.pay { max-width: 64rem; margin: 0 auto; padding: 0 1rem 2rem; box-sizing: border-box; }
.pay-full { min-height: 70vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem; text-align: center; }
.pay-full h1 { margin: 0; font-size: 1.5rem; color: #0f172a; }
.pay-full p { margin: 0; color: #475569; max-width: 32rem; }
.pay-full-icon { font-size: 3.75rem; line-height: 1; }
.pay-full-icon.fail { color: #dc2626; }
.pay-full-icon.ok { color: #16a34a; }
.pay-full-lock { width: 4rem; height: 4rem; color: #d97706; }
.pay-spinner { width: 2.5rem; height: 2.5rem; border: 3px solid #e2e8f0; border-top-color: #3fb116; border-radius: 50%; animation: pay-spin 1s linear infinite; }
@keyframes pay-spin { to { transform: rotate(360deg); } }
.pay-btn { padding: .5rem 1.25rem; border: 0; border-radius: .5rem; background: #3fb116; color: #fff; font-weight: 600; cursor: pointer; }
.pay-banner { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: .5rem; padding: .75rem 1rem;
  border-radius: 0 0 .5rem .5rem; font-weight: 500; }
.pay-banner .icon { width: 1.25rem; height: 1.25rem; flex: none; }
.pay-banner.paid { background: #dcfce7; color: #166534; }
.pay-banner.overdue { background: #fee2e2; color: #991b1b; }
.pay-dismiss { margin-inline-start: auto; border: 0; background: none; color: inherit; font-weight: 600; text-transform: uppercase; cursor: pointer; }
.pay-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; padding: 2rem 0 1rem; }
.pay-title h1 { margin: 0; font-size: 1.5rem; line-height: 2rem; font-weight: 700; color: #0f172a; }
.pay-title p { margin: .25rem 0 0; color: #475569; }
.pay-top-actions, .pay-foot-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.pay-pill { display: inline-flex; align-items: center; gap: .375rem; padding: .5rem 1rem; border: 1px solid #e2e8f0; border-radius: 9999px;
  background: #fff; color: #0f172a; font-size: .875rem; font-weight: 500; cursor: pointer; }
.pay-pill:hover { background: #f1f5f9; }
.pay-pill .icon { width: 1rem; height: 1rem; }
/* «Download PDF» и «View History» — как у оригинала (владелец 2026-11-09): крупнее, серая заливка, тёмный полужирный текст, значок 1.5rem */
.pay-top-actions .pay-pill, .pay-foot-actions .pay-pill { gap: .625rem; padding: .75rem 1.5rem; border-color: #cbd5e1; background: #f1f5f9; color: #1e293b; font-size: 1.0625rem; font-weight: 600; }
.pay-top-actions .pay-pill:hover, .pay-foot-actions .pay-pill:hover { background: #e2e8f0; }
.pay-top-actions .pay-pill .icon, .pay-foot-actions .pay-pill .icon { width: 1.5rem; height: 1.5rem; }
.pay-toast { margin: 0 0 .75rem; padding: .5rem .75rem; border-radius: .5rem; background: #ecfdf5; color: #166534; font-size: .875rem; }
.pay-attachment { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .75rem 1rem; border: 1px solid #e2e8f0; border-radius: .75rem; background: #fff; }
.pay-attachment .icon { width: 1.125rem; height: 1.125rem; color: #64748b; }
.pay-attachment-name { min-width: 0; max-width: 20rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.pay-link { border: 0; background: none; color: #3fb116; font-weight: 600; cursor: pointer; margin-inline-start: auto; }
.pay-card { margin-top: 1.5rem; background: #fff; border: 1px solid #e2e8f0; border-radius: .75rem; box-shadow: 0 1px 2px rgba(15, 23, 42, .05); }
.pay-card-head { display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 2rem; border-bottom: 1px solid #e2e8f0; }
.pay-card-head h2 { display: flex; align-items: center; gap: .75rem; margin: 0; font-size: 1.125rem; font-weight: 600; }
.pay-history .pay-card-head h2::before { content: ''; width: 1.5rem; height: 1.5rem; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23475569'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z'/%3E%3C/svg%3E") center / contain no-repeat; }
.pay-count { min-width: 2rem; padding: .25rem .625rem; border-radius: 9999px; background: #f1f5f9; font-size: .875rem; font-weight: 600; text-align: center; }
.pay-history { max-height: min(75vh, 900px); overflow: auto; }
.pay-history-empty, .pay-history-end { padding: 1rem; margin: 0; text-align: center; }
.pay-timeline { list-style: none; margin: 0; padding: 1.5rem 2rem .25rem; }
.pay-event { position: relative; min-height: 2.75rem; padding: 0 0 1.25rem 4rem; }
[dir='rtl'] .pay-event { padding: 0 4rem 1.25rem 0; }
/* история документа — как у оригинала (владелец 2026-11-09): круглый значок события вместо линии времени, название крупно, дата справа */
.pay-event::before { content: ''; position: absolute; inset-inline-start: 0; top: 0; width: 2.75rem; height: 2.75rem; box-sizing: border-box; border: 1px solid #e2e8f0; border-radius: 50%;
  background: #f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%2364748b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m3.75 9v6m3-3H9m1.5-12H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9Z'/%3E%3C/svg%3E") center / 1.25rem no-repeat; }
.pay-event.success::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%2316a34a'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z'/%3E%3C/svg%3E"); } .pay-event.failed::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23dc2626'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z'/%3E%3C/svg%3E"); }
.pay-event-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding-top: .25rem; }
.pay-event-head b { font-size: 1.125rem; font-weight: 600; color: #0f172a; }
.pay-event-head .muted { flex: none; color: #64748b; }
.pay-event p { margin: .375rem 0 0; color: #334155; font-size: 1rem; }
/* блок способов оплаты — как у оригинала (владелец 2026-11-09): поля с отступом от края карточки, вкладки над чертой */
.pay-card.pay-methods { padding: .75rem 2.25rem 2rem; }
.pay-tabs { display: flex; border-bottom: 1px solid #e2e8f0; }
/* вкладки способов оплаты — как у оригинала (владелец 2026-11-09): крупнее, по ширине текста слева, без скругления; выбранная — тёмная
   полужирная с зелёной чертой, остальные — серые обычные */
.pay-tab { flex: 0 0 auto; padding: 1rem 1.25rem; border: 0; border-radius: 0; border-bottom: 2px solid transparent; background: none; color: #64748b;
  font-size: 1.125rem; font-weight: 400; cursor: pointer; }
.pay-tab[aria-selected='true'] { border-bottom-color: #3fb116; color: #0f172a; font-weight: 600; }
.pay-tab:disabled { cursor: not-allowed; opacity: .6; }
.pay-method { padding: 1.5rem 0 0; }
.pay-transfer-missing { margin: 0; padding: .75rem 1rem; border-radius: .5rem; background: #f1f5f9; color: #475569; }
.pay-transfer-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.pay-transfer-head p { margin: 0; }
.pay-transfer { margin: 1rem 0 0; }
.pay-transfer-row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid #f1f5f9; }
.pay-transfer-row dt { font-weight: 700; }
.pay-transfer-row dd { margin: 0; display: flex; align-items: center; gap: .5rem; text-align: end; word-break: break-all; }
.pay-copy { display: inline-flex; padding: .25rem; border: 0; border-radius: .375rem; background: none; color: #64748b; cursor: pointer; }
.pay-copy:hover { background: #f1f5f9; }
.pay-copy[data-copied='true'] { color: #16a34a; }
.pay-copy .icon { width: 1rem; height: 1rem; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.pay-reference { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: 1rem; padding: .75rem 1rem; border-radius: .5rem; background: #fefce8; }
.pay-reference p { margin: 0; flex: 1 1 18rem; }
.pay-preview { margin: 2.5rem 0 1.5rem; border: 1px solid #e2e8f0; border-radius: .75rem; overflow: hidden; background: #fff; box-shadow: 0 1px 3px rgba(15, 23, 42, .08); }
.pay-foot { display: flex; flex-direction: column; align-items: center; gap: .75rem; padding: 1.5rem 0; color: #64748b; font-size: .875rem; }
.pay-foot a { color: #475569; }
.pay-legal, .pay-created { margin: 0; }
@media (max-width: 767px) {
  .pay-top { flex-direction: column-reverse; padding-top: 1rem; }
  .pay-top-actions { width: 100%; }
  .pay-top-actions .pay-pill { flex: 1; justify-content: center; }
  .pay-transfer-row { flex-direction: column; align-items: flex-start; }
  .pay-transfer-row dd { text-align: start; }
  .pay-preview { overflow-x: auto; }
}
/* оплата картой Stripe Elements на странице документа (D-0107): поле карты и «Pay Now» в строку, на телефоне — кнопка на всю ширину */
.pay-stripe-row { display: flex; gap: .75rem; align-items: stretch; }
.pay-stripe-card { flex: 1; min-width: 0; padding: 1.125rem 1rem; border: 1px solid #cbd5e1; border-radius: .5rem; background: #fff; }
/* «Pay Now» — светло-серая кнопка, как у оригинала (владелец 2026-11-09) */
.pay-stripe-pay { align-self: center; min-height: 3.25rem; padding: 0 2rem; border: 1px solid #cbd5e1; border-radius: .5rem; background: #f1f5f9; color: #0f172a; font-size: 1rem; font-weight: 600; cursor: pointer; }
.pay-stripe-pay:hover:not(:disabled) { background: #e2e8f0; }
.pay-stripe-pay:disabled { opacity: .6; cursor: not-allowed; }
.pay-stripe-loading { margin: .5rem 0 0; }
.pay-tax { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem 1.25rem; margin-bottom: 1.25rem; }
.pay-tax .field { margin: 0; }
.pay-tax label { font-size: .875rem; font-weight: 500; color: #334155; }
.pay-tax input, .pay-tax .sel-trigger { height: 3.25rem; padding: 0 1rem; border-radius: .5rem; font-size: 1rem; }
.pay-tax .error { grid-column: 1 / -1; margin: 0; }
.pay-tax input, .pay-tax select { width: 100%; box-sizing: border-box; background: #fff; color: #0f172a; border: 1px solid #cbd5e1; }
.pay-result { padding: .75rem 1rem; border-radius: .5rem; background: #dcfce7; color: #166534; }
.pay-result p { margin: 0; }
.pay-result-title { font-weight: 700; }
@media (max-width: 767px) {
  .pay-stripe-row { flex-direction: column; }
  .pay-tax { grid-template-columns: 1fr; }
  .pay-card.pay-methods { padding: .5rem 1rem 1.5rem; }
  .pay-tab { padding: .875rem .75rem; font-size: 1rem; }
  .pay-stripe-pay { align-self: stretch; }
}
.pay-tranzila-host iframe, .pay-tranzila-frame { width: 100%; min-height: 400px; height: 500px; border: 0; }

/* Отчёт «Обзор периода» /reports/overview (часть 9, D-0036) — раскладка оригинала (pages/reports/overview.vue): карточка фильтров
   с двумя датами и флажком НДС, три плашки итогов, график доходов и расходов, две кольцевые диаграммы с подписями.
   Графики — Chart.js своей копией (D-0111): строгий CSP чужих скриптов не пускает, библиотека лежит у нас. */
/* страницы отчётов: между соседними блоками — 1rem; у .db-card своих отступов нет, и две карточки подряд слипались
   (кольцевые диаграммы под графиком, пояснения над фильтрами — владелец 2026-11-06) */
.rep-page > * + * { margin-top: 1rem; }
/* заголовок страницы уезжает в шапку (position), в потоке его нет — первому блоку отступ сверху не нужен */
.rep-page > h1 + * { margin-top: 0; }
/* окна поверх страницы (боковая панель документа, модальные, уведомление) стоят fixed: отступ ритма сдвинул бы их с места */
.rep-page > .drawer-backdrop, .rep-page > .modal-backdrop, .rep-page > .toast { margin-top: 0; }
.rep-filters { margin-bottom: 1rem; }
.rep-filter-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; align-items: center; }
.rep-filter-row .field { flex-direction: row; align-items: center; gap: .75rem; }
.rep-filter-row .field label { white-space: nowrap; }
.rep-filter-row .field input { flex: 1; min-width: 0; }
/* поле даты обёрнуто календарём, а список выбора — своей обёрткой: тянуть надо их, сам input внутри уже во всю ширину
   (владелец 2026-11-06: на узком экране поле должно доходить до правого края) */
.rep-filter-row .field > .dp-wrap, .rep-filter-row .field > .sel-wrap { flex: 1; min-width: 0; }
/* строка «две даты и переключатель» (обзор, НДС, аванс налога): даты стоят рядом, остальное уходит вправо — как у оригинала */
@media (min-width: 901px) { .rep-filter-dates { grid-template-columns: auto auto 1fr; gap: 1rem 1.25rem; } }
.rep-filter-row .check { justify-self: end; display: flex; align-items: center; gap: .5rem; font-size: .875rem; }
.rep-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.rep-stat { display: flex; flex-direction: column; gap: .5rem; }
.rep-stat-label { display: flex; align-items: center; gap: .5rem; color: var(--muted); font-size: .875rem; font-weight: 500; }
.rep-stat-label .icon { width: 1rem; height: 1rem; color: var(--primary); }
.rep-stat-label .icon.up, .rep-stat-value.up { color: #16a34a; }
.rep-stat-label .icon.down, .rep-stat-value.down { color: #dc2626; }
html.dark .rep-stat-label .icon.up, html.dark .rep-stat-value.up { color: #4ade80; }
html.dark .rep-stat-label .icon.down, html.dark .rep-stat-value.down { color: #f87171; }
.rep-stat-value { font-size: 1.25rem; font-weight: 700; line-height: 1.75rem; }
/* графики — Chart.js на canvas: высоту задаёт обёртка, сам холст тянется (responsive + maintainAspectRatio: false) */
/* подписи графика — своей разметкой: отступ от кружка до текста и выравнивание по середине строки (владелец 2026-11-06) */
/* легенда графика — как стандартная легенда Chart.js у оригинала: прямоугольник 40×12 с обводкой линии 3px и её бледной заливкой,
   шрифт 12px #666, промежуток 10px (стенд QA и израильский оригинал, 2026-11-10) */
/* подпись поля с двоеточием, как у оригинала («From Date:»): двоеточие — оформлением, в тексте подписи его нет — шаги ⌨️ ищут поле по ней */
.rep-colon::after { content: ":"; }
.rep-legend { display: flex; justify-content: center; gap: 10px; margin: 0 0 .75rem; font-size: 12px; color: #666; }
.rep-legend-item { display: inline-flex; align-items: center; gap: 5px; line-height: 1; }
.rep-legend-dot { width: 40px; height: 12px; box-sizing: border-box; border: 3px solid currentColor; }
.rep-legend-dot.inc { color: #22c55e; background: rgba(34, 197, 94, .1); }
.rep-legend-dot.exp { color: #ef4444; background: rgba(239, 68, 68, .1); }
html.dark .rep-legend { color: #9ca3af; }
.rep-line { position: relative; width: 100%; height: 16rem; }
.rep-dot { width: .625rem; height: .625rem; flex: none; border-radius: 50%; display: inline-block; }
.rep-dot.up, .rep-dot.inc0 { background: #22c55e; }
.rep-dot.down, .rep-dot.exp0 { background: #ef4444; }
/* цвета долей — классами: атрибут style запрещён политикой страниц (style-src 'self') */
.rep-dot.inc1 { background: #3b82f6; }
.rep-dot.inc2 { background: #a855f7; }
.rep-dot.inc3 { background: #fb923c; }
.rep-dot.inc4 { background: #ec4899; }
.rep-dot.inc5 { background: #6b7280; }
.rep-dot.exp1 { background: #f87171; }
.rep-dot.exp2 { background: #dc2626; }
.rep-dot.exp3 { background: #fb923c; }
.rep-dot.exp4 { background: #f472b6; }
.rep-dot.exp5 { background: #6b7280; }
.rep-charts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.rep-pie-body { display: flex; gap: 1.25rem; align-items: center; flex-wrap: wrap; }
/* кружок по центру, когда список ушёл под него (телефон, узкая карточка); рядом со списком свободного места нет — стоит слева */
.rep-pie { position: relative; width: 11rem; height: 11rem; flex: none; margin-inline: auto; }
.rep-keys { flex: 1; min-width: 12rem; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .375rem; font-size: .875rem; }
.rep-keys li { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.rep-key-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rep-key-sum { margin-inline-start: auto; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rep-key-share { width: 3.5rem; text-align: end; color: var(--muted); font-variant-numeric: tabular-nums; }
@media (max-width: 900px) {
  .rep-filter-row, .rep-stats, .rep-charts { grid-template-columns: 1fr; }
  .rep-filter-row .check { justify-self: start; }
}

/* Таблицы и фильтры отчётов части 9 (сбор долгов и дальше): вид оригинала — группы строк с итогом, бейдж вида документа */
/* фильтры прижаты к верху: когда под полем появляются метки выбранных значений, карточка растёт вниз,
   а подписи и поля соседних фильтров остаются на месте (владелец 2026-11-06) */
.rep-filter-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; }
.rep-filter-4 .field { flex-direction: column; align-items: stretch; gap: .5rem; }
/* на широком экране подпись стоит перед полем в одну строку, как у оригинала (владелец 2026-11-06); метки выбранных значений
   и сообщение об ошибке переносятся под поле — им отдана вся ширина */
@media (min-width: 1280px) {
  .rep-filter-4 .field { flex-direction: row; align-items: center; flex-wrap: wrap; gap: .5rem .625rem; }
  .rep-filter-4 .field > label { white-space: nowrap; }
  .rep-filter-4 .field > .sel-wrap, .rep-filter-4 .field > .rep-tabs { flex: 1; min-width: 0; }
  .rep-filter-4 .field > .sel-chips, .rep-filter-4 .field > .sel-error { flex-basis: 100%; }
}
.rep-tabs { display: inline-flex; padding: .125rem; border: 1px solid var(--line); border-radius: .375rem; background: var(--surface-2, transparent); }
.rep-tabs button { flex: 1; padding: .3125rem .75rem; border: 0; border-radius: .25rem; background: none; color: var(--muted); font-size: .8125rem; font-weight: 500; }
.rep-tabs button.on { background: var(--primary); color: #0b1220; }
.rep-stat-row { flex-direction: row; align-items: center; justify-content: space-between; gap: 1rem; }
.rep-stat-value.warn { color: #d97706; }
html.dark .rep-stat-value.warn { color: #fbbf24; }
.rep-table-body { padding: 0; overflow-x: auto; }
.rep-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.rep-table th { padding: .75rem 1.25rem; text-align: start; font-size: .75rem; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); border-bottom: 1px solid var(--line); white-space: nowrap; }
.rep-table td { padding: .75rem 1.25rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.rep-table .num { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rep-table tr.rep-group td { padding: .625rem 1.25rem; font-weight: 600; background: rgba(148, 163, 184, .12); }
.rep-table tr.rep-subtotal td { font-weight: 600; background: rgba(148, 163, 184, .06); }
/* подпись итога группы стоит вплотную к сумме, а не через два полных отступа ячеек (владелец 2026-11-06) */
.rep-table tr.rep-subtotal td:first-child { padding-inline-end: .5rem; }
.rep-table tr.rep-subtotal td + td { padding-inline-start: .5rem; }
/* подпись итога — физически справа, как text-right оригинала: в LTR вплотную к сумме, в иврите — в начале строки */
.rep-table tr.rep-subtotal td:first-child { text-align: right; }
/* ссылки отчёта — цвет primary без подчёркивания, как text-primary hover:underline оригинала */
.rep-table a { color: var(--primary); text-decoration: none; }
.rep-table a:hover { text-decoration: underline; }
.rep-badge { display: inline-flex; align-items: center; padding: .125rem .5rem; border-radius: 1rem; background: rgba(148, 163, 184, .18); color: var(--text); font-size: .75rem; font-weight: 500; white-space: nowrap; }
.rep-cut { max-width: 14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* сбор долгов уже 1024px — карточки документов вместо таблицы (lg:hidden оригинала): плашка группы gray-100, карточка p-4 с рамкой,
   подписи мелкими прописными, внизу через черту остаток; итог группы — плашка gray-50 */
.rep-mob { display: none; }
@media (max-width: 1023px) {
  .rep-desk { display: none; }
  .rep-mob { display: flex; flex-direction: column; gap: 1rem; }
}
.rep-mgroup { display: flex; flex-direction: column; gap: 1rem; }
.rep-mhead { margin: 0; padding: .75rem 1rem; border-radius: .5rem; background: #f3f4f6; color: var(--fg); font-size: 1.125rem; font-weight: 600; }
.rep-mlist { display: flex; flex-direction: column; gap: .75rem; }
.rep-mcard { padding: 1rem; background: #fff; border: 1px solid #e5e7eb; border-radius: .5rem; box-shadow: var(--shadow); }
.rep-mcard p { margin: 0; font-size: .875rem; color: var(--fg); overflow-wrap: anywhere; }
.rep-mcard a { color: var(--primary); text-decoration: none; }
.rep-mcard a:hover { text-decoration: underline; }
.rep-mtop { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; margin-bottom: .75rem; }
.rep-mwho { flex: 1; min-width: 0; }
.rep-mwho h4 { margin: 0; font-size: 1.125rem; font-weight: 600; }
.rep-mwho p { color: #4b5563; }
.rep-mpair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-bottom: .75rem; }
.rep-mdesc { margin-bottom: .75rem; }
.rep-mdesc .rep-mlabel { margin-bottom: .25rem; }
.rep-mcard .rep-mlabel { font-size: .75rem; font-weight: 500; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.rep-mfoot { padding-top: .75rem; border-top: 1px solid #e5e7eb; }
.rep-mtotal { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem; border-radius: .5rem; background: #f9fafb;
  color: var(--fg); font-size: .875rem; }
.rep-mtotal span:first-child { font-weight: 600; }
html.dark .rep-mhead { background: rgba(17, 24, 39, .4); color: #fff; }
html.dark .rep-mcard { background: #1d293d; border-color: #314158; }
html.dark .rep-mcard p, html.dark .rep-mtotal { color: #fff; }
html.dark .rep-mcard .rep-mlabel, html.dark .rep-mwho p { color: #9ca3af; }
html.dark .rep-mfoot { border-color: #4b5563; }
html.dark .rep-mtotal { background: rgba(17, 24, 39, .2); border: 1px solid #314158; }
.rep-stats-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .rep-stats-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .rep-filter-4 { grid-template-columns: 1fr; } }

/* форма вывода отчёта (сальдо, выгрузки): поля в колонку, строки по две-три, переключатели в ряд */
.rep-form { display: flex; flex-direction: column; gap: 1rem; max-width: 42rem; }

.rep-form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; }
/* поля счетов у оригинала идут по одному в строку, во всю ширину формы */
.rep-form-row.rep-form-stack { grid-template-columns: 1fr; }
.rep-radios { display: flex; flex-wrap: wrap; gap: 1rem; }
.rep-radios.rep-checks { column-gap: 2rem; }
.rep-radios .check { display: flex; align-items: center; gap: .375rem; font-size: .875rem; font-weight: 400; }
.rep-form .hint { margin: 0; padding: .75rem 1rem; border: 1px solid var(--line); border-radius: .5rem; background: rgba(148, 163, 184, .08); font-size: .875rem; }
/* адреса письма метками в формах отчётов — как в окне Send документа */
.rep-chips { display: flex; flex-wrap: wrap; gap: .375rem; margin-top: .5rem; }
.rep-chip { display: inline-flex; align-items: center; gap: .25rem; padding: .125rem .5rem; border-radius: 1rem; background: rgba(46, 211, 138, .15); color: var(--text); font-size: .8125rem; }
.rep-chip button { padding: 0 .125rem; border: 0; background: none; color: var(--muted); font-size: .875rem; line-height: 1; }
.muted.small { margin: 0; font-size: .75rem; }
/* отчёт НДС: пояснение налоговой, суммы в две колонки, израильская справка */
.rep-note { display: flex; gap: .75rem; align-items: flex-start; font-size: .875rem; }
.rep-note .icon { width: 1.25rem; height: 1.25rem; flex: none; margin-top: .125rem; color: var(--primary); }
.rep-note p { margin: 0; }
.rep-note-links { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.rep-sums { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem 1rem; max-width: 40rem; margin: 0 0 1rem; font-size: .875rem; }
.rep-sums dt { color: var(--muted); }
.rep-sums dd { margin: 0; text-align: end; font-variant-numeric: tabular-nums; font-weight: 500; }
.rep-sums-total { padding-top: .75rem; border-top: 1px solid var(--line); margin-bottom: 0; }
.rep-sums-total dt, .rep-sums-total dd { color: var(--text); font-weight: 700; }
.rep-help { font-size: .8125rem; color: var(--muted); }
/* НДС как vat.vue оригинала: строки — две равные колонки, значение физически справа (text-right — в иврите у середины строки), подписи
   text-gray-700; поля месяцев без крестика (clearable=false — у полей required); пояснение PCN874 — под чертой (border-t pt-6) */
.rep-vat-model .rep-sums { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 42rem; }
.rep-vat-model .rep-sums dt { color: var(--text); }
.rep-vat-model .rep-sums dd { text-align: right; }
.rep-vat-model + .rep-help { max-width: 42rem; margin-top: 1rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.rep-help p { margin: 0 0 .5rem; }
.rep-help-title { color: var(--text); font-weight: 500; }
.rep-help ul { margin: 0 0 .75rem; padding-inline-start: 1.25rem; }
/* карточка результата отчёта: подпись и значение в две колонки (непрерывность нумерации) */
/* карточка отчёта нумерации как у оригинала: две равные колонки, подписи с двоеточием тёмным, строки через 1rem */
.rep-facts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; margin: 0; font-size: .875rem; line-height: 1.25rem; }
.rep-facts dt { font-weight: 500; }
.rep-facts dd { margin: 0; font-weight: 500; }
.rep-good { color: #16a34a; font-weight: 500; }
.rep-bad { color: #dc2626; font-weight: 500; }
html.dark .rep-good { color: #4ade80; }
html.dark .rep-bad { color: #f87171; }
@media (max-width: 640px) { .rep-facts { grid-template-columns: 1fr; gap: .25rem; } .rep-facts dd { margin-bottom: .5rem; } }

/* ---- страница ссылки Quick Pay (D-0110, part-03-spec.md §2; замеры оригинала 2026-11-05): контейнер max-w-4xl, белая шапка со
   скруглением снизу (логотип, бизнес, язык), карточка со скруглением сверху до низа экрана, сводка slate-50, поля в одну колонку
   (space-y-3), кнопка во всю ширину #3fb116, подвал по центру ---- */
.pay.qp { max-width: 56rem; min-height: 100vh; padding: 0 .75rem; display: flex; flex-direction: column; }
.qp-wrap { display: flex; flex-direction: column; flex: 1; }
.qp-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.5rem; background: #fff; border: 1px solid #e2e8f0;
  border-top: 0; border-radius: 0 0 .75rem .75rem; box-shadow: 0 1px 2px rgba(15, 23, 42, .05); font-size: .875rem; }
.qp-brand { display: flex; align-items: center; gap: .75rem; min-width: 0; flex: 1; }
.qp-brand img { height: 2rem; width: auto; max-width: 120px; object-fit: contain; }
.qp-brand strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1.125rem; font-weight: 700; color: #0f172a; }
.qp-lang { width: auto; min-width: 4.5rem; padding: .25rem 1.75rem .25rem .75rem; background-color: #fff; color: #0f172a; border: 1px solid #cbd5e1; border-radius: .375rem; }
.qp-card { flex: 1; display: flex; flex-direction: column; margin-top: 1.5rem; padding: .75rem 1.5rem 0; background: #fff; border: 1px solid #e2e8f0; border-bottom: 0; border-radius: .75rem .75rem 0 0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05); font-size: .875rem; }
.qp-card h2 { margin: 0 0 .75rem; font-size: 1.125rem; font-weight: 600; color: #0f172a; }
.qp-summary { padding: 1rem; border-radius: .75rem; background: #f8fafc; border: 1px solid #e2e8f0; margin-bottom: 1rem; }
.qp-summary p { margin: 0; }
.qp-summary .qp-name { font-size: 1rem; font-weight: 600; color: #0f172a; }
.qp-summary .qp-desc { margin-top: .25rem; color: #475569; }
.qp-summary .qp-amount { margin-top: .75rem; font-size: 1.5rem; font-weight: 700; color: #0f172a; }
.qp-form { display: flex; flex-direction: column; gap: .75rem; }
.qp-form .field { display: flex; flex-direction: column; gap: .25rem; margin: 0; }
.qp-form label { display: block; font-size: .875rem; font-weight: 500; color: #334155; }
.qp-form .label-row { display: flex; gap: .25rem; }
.qp-form .req-star { color: inherit; }
.qp-form input, .qp-form select { width: 100%; box-sizing: border-box; padding: .5rem .75rem; font-size: .875rem; background-color: #fff; color: #0f172a;
  border: 1px solid #cbd5e1; border-radius: .5rem; }
.qp-form .error { margin: 0; font-size: .875rem; color: #b91c1c; }
.qp-lead { margin: 0; color: #475569; }
.qp-row2, .qp-row3 { display: grid; gap: .75rem; }
@media (min-width: 640px) { .qp-row2 { grid-template-columns: 1fr 1fr; } .qp-row3 { grid-template-columns: 1fr 1fr 1fr; } }
.qp-form button.qp-btn { width: 100%; padding: .625rem 1rem; border: 0; border-radius: .5rem; background: #3fb116; color: #fff; font-size: .875rem; font-weight: 600; cursor: pointer; }
.qp-form button.qp-btn:hover { background: #369a13; border-color: transparent; }
.qp-btn:disabled { opacity: .6; cursor: default; }
.qp-done { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 1.5rem 0; }
.qp-done h3 { margin: 0 0 .5rem; font-size: 1.25rem; font-weight: 700; color: #111827; }
.qp-done p { margin: 0; color: #4b5563; }
.qp-done .qp-hint { margin-top: .5rem; color: #64748b; }
.qp-icon { width: 4rem; height: 4rem; margin-bottom: 1rem; font-size: 3rem; line-height: 4rem; font-weight: 700; }
.qp-icon.ok { color: #22c55e; } .qp-icon.warn { color: #f59e0b; } .qp-icon.fail { color: #ef4444; }
.qp-mark { width: auto; height: auto; font-size: 3.75rem; line-height: 1; }
/* полный экран (ссылка неверна / выключена): знак text-6xl, заголовок 24/700 gray-900 — как у оригинала */
.pay-full.qp-full .qp-full-title { margin: 0; max-width: 28rem; font-size: 1.5rem; font-weight: 700; color: #111827; }
.qp-full-icon { margin-bottom: .25rem; font-size: 3.75rem; line-height: 1; }
.qp-full-icon.fail { color: #ef4444; } .qp-full-icon.warn { color: #f59e0b; }
@media (min-width: 640px) { .qp-done h3 { font-size: 1.5rem; } }
.qp-foot { margin-top: auto; padding: 1rem 0; text-align: center; font-size: .875rem; color: #64748b; }
.qp-legal { display: flex; justify-content: center; gap: 1rem; font-weight: 500; }
.qp-legal a { color: inherit; text-decoration: none; }
.qp-legal a:hover { color: #3fb116; }
.qp-created { margin-top: .5rem; }
.qp-created a { color: #334155; font-weight: 500; text-decoration: none; }
.qp-created a:hover { color: #3fb116; }

/* ---- кабинет клиента /client-portal (часть 12, part-12-spec.md §2): шапка и подвал как у Quick Pay; экран без доступа — одна карточка по
   центру со значком; кабинет — карточка с «Client portal — {клиент}», «Log out» справа и полосой вкладок, ниже панели вкладок ---- */
main.cp { max-width: 72rem; min-height: 100vh; margin: 0 auto; padding: 0 .75rem; display: flex; flex-direction: column; }
.cp-entry { flex: 1; display: flex; align-items: center; justify-content: center; padding: 2rem 0; }
.cp-entry-card { width: 100%; max-width: 28rem; padding: 2rem 1.5rem; text-align: center; background: #fff; border: 1px solid #e2e8f0; border-radius: .75rem;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05); font-size: .875rem; }
.cp-entry-icon { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; margin-bottom: .75rem; border-radius: 9999px;
  background: #ecfdf5; color: #16a34a; font-size: 1.5rem; font-weight: 700; }
.cp-entry-icon.fail { background: #fef2f2; color: #dc2626; }
.cp-entry-title { margin: .5rem 0; font-size: 1.25rem; font-weight: 700; color: #0f172a; }
.cp-entry-hint { margin: 0 0 1rem; color: #475569; }
.cp-entry-form { display: flex; flex-direction: column; gap: .75rem; text-align: start; }
.cp-entry-form .field { margin: 0; }
.cp-entry-form button.qp-btn { width: 100%; padding: .625rem 1rem; border: 0; border-radius: .5rem; background: #3fb116; color: #fff; font-weight: 600; cursor: pointer; }
.cp-card { padding: 1.25rem 1.5rem 0; }
.cp-title-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.cp-title-row .cp-heading { margin: 0; font-size: 1.125rem; line-height: 1.75rem; font-weight: 600; color: #0f172a; }
.cp-logout { display: inline-flex; align-items: center; gap: .375rem; }
[dir="rtl"] .cp-logout .icon { transform: scaleX(-1); }
.cp-tabs { margin: 1rem 0 0; border-bottom: 1px solid #e2e8f0; overflow-x: auto; flex-wrap: nowrap; white-space: nowrap; scrollbar-width: none; }
.cp-tabs .tab { flex: 0 0 auto; }
.cp-tabs::-webkit-scrollbar { display: none; }
/* номера, почта, индекс — слева направо, но у края страницы (в иврите — справа), как у оригинала */
[dir="rtl"] .cp-profile input[dir="ltr"], [dir="rtl"] .cp-bank-row input[dir="ltr"] { text-align: right; }
/* шапка таблиц вкладок — обычным регистром, как у таблиц Tabulator оригинала */
.cp-table th { text-transform: none; letter-spacing: 0; font-size: .875rem; font-weight: 500; color: #334155; }
.cp-notice { margin: .75rem 0 0; padding: .5rem .75rem; border-radius: .5rem; }
.cp-notice.ok { background: #f0fdf4; color: #15803d; } .cp-notice.error { background: #fef2f2; color: #b91c1c; }
.cp-panel { padding: 1rem 0; }
.cp-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.cp-panel-head h2 { margin: 0; }
.cp-search { display: flex; gap: .5rem; margin-bottom: .75rem; }
.cp-search input { flex: 1; }
.cp-empty { padding: 2rem 0; text-align: center; color: #64748b; }
.cp-empty.error { color: #b91c1c; }
.cp-table { width: 100%; }
.cp-pager { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; margin-top: .75rem; }
.cp-grid { display: grid; gap: .75rem 1rem; }
@media (min-width: 640px) { .cp-grid { grid-template-columns: 1fr 1fr; } .cp-grid3 { grid-template-columns: 1fr 1fr 1fr; } .cp-wide { grid-column: span 2; } }
.cp-profile h3 { margin: 1.25rem 0 .5rem; font-size: 1rem; font-weight: 600; color: #0f172a; }
.cp-profile .field { margin: 0; }
/* название и налоговый номер — показом: серое поле, как у оригинала */
.cp-profile input:disabled { background: #f1f5f9; color: #64748b; border-color: #e2e8f0; }
.cp-profile small { display: block; margin-top: .25rem; font-size: .75rem; }
.cp-profile small.error { color: #b91c1c; }
.cp-bank-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 1rem 0 .5rem; }
.cp-bank-row { display: grid; grid-template-columns: 1fr 1fr auto; gap: .5rem; align-items: center; margin-bottom: .5rem; }
.cp-row-error { grid-column: 1 / -1; }
.cp-actions { display: flex; gap: .5rem; margin-top: 1rem; }
.cp-foot { margin-top: 1rem; }
.modal-buttons { display: flex; gap: .75rem; }

/* замеры живого кабинета оригинала: «Log out» и «Search» — мягкие серые (slate-100, slate-700, 14/500, 6px 10px), вкладки 14/500
   8px 12px, активная — зелёная с подчёркиванием; таблица — шапка gray-100 14/600, ячейки 14px 8px 6px; низ — листание Tabulator */
button.cp-soft, form button.cp-soft[type="submit"] { display: inline-flex; align-items: center; gap: .375rem; padding: 6px 10px; border: 0; border-radius: .375rem; background: #f1f5f9; color: #334155;
  font-size: .875rem; font-weight: 500; cursor: pointer; }
button.cp-soft:hover, form button.cp-soft[type="submit"]:hover { background: #e2e8f0; color: #334155; }
.cp-tabs .tab { padding: 8px 12px; font-size: .875rem; font-weight: 500; color: #475569; }
.cp-tabs .tab.current { color: #2ED38A; }
.cp-search input { box-sizing: border-box; height: 2rem; padding: 6px 10px; font-size: .875rem; }
.cp-search button { height: 2rem; }
.cp-head .qp-brand strong { line-height: 1.75rem; }
.cp-table th { padding: 8px 6px; line-height: 28px; background: #f3f4f6; color: #111827; font-weight: 600; }
.cp-table td { padding: 8px 6px; line-height: 20px; font-size: .875rem; color: #111827; }
.cp-table td.cp-empty { padding: 2.25rem 0; text-align: center; font-size: 1rem; font-weight: 700; color: #64748b; }
.cp-table .link-button { color: #2ED38A; font-weight: 500; text-decoration: none; }
.cp-pager { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin-top: 0; padding: .5rem .25rem;
  border: 1px solid #e5e7eb; border-top: 0; border-radius: 0 0 .5rem .5rem; font-size: .875rem; color: #374151; }
.cp-pager-nav { display: inline-flex; align-items: center; gap: .25rem; }
.cp-pager-size { display: inline-flex; align-items: center; gap: .375rem; margin-inline-end: .5rem; font-weight: 400; }
.cp-pager-size select { width: auto; padding: 2px 1.5rem 2px .5rem; font-size: .875rem; }
.cp-page-btn { min-width: 1.75rem; padding: 4px 8px; border: 1px solid #d1d5db; border-radius: 3px; background: #fff; color: #374151; cursor: pointer; }
.cp-page-btn:disabled { opacity: .45; cursor: default; }
.cp-page-current { min-width: 1.75rem; padding: 4px 10px; border: 1px solid #aaa; border-radius: 3px; background: #e3e6ec; color: #d00; text-align: center; }

/* ---- Раздел подписки (часть 15, D-0112): шесть страниц оригинала одной карточкой с вкладками — тарифы, подписка и способы
   оплаты, смена тарифа, оплата, счета, исход оплаты. Вид — как pages/billing/* оригинала, цветами и токенами нашего оформления ---- */
.billing-card { padding: 0; overflow: visible; }
.billing-nav { margin: 0; padding-inline: 1.25rem; border-bottom: 1px solid var(--line); gap: 2rem; }
/* вкладки — одной строкой с прокруткой: на телефоне столбиком они занимали четверть экрана */
.billing-nav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.billing-nav::-webkit-scrollbar { display: none; }
.billing-nav .tab { flex: none; white-space: nowrap; padding: 1rem .25rem; text-decoration: none; color: var(--muted); }
@media (max-width: 640px) { .billing-nav { gap: 1.25rem; } }
.billing-nav .tab:hover { color: var(--fg); }
.billing-nav .tab.current, html.dark .billing-nav .tab.current { color: var(--primary); font-weight: 600; border-bottom-color: var(--primary); }
.billing-body { padding: 1.25rem; display: flex; flex-direction: column; gap: 1.25rem; }
.billing-subtitle { margin: 0; text-align: center; color: var(--muted); }

/* плашки состояний: предупреждение, сведение, успех, отказ — кнопка действия справа */
.billing-note { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0;
  padding: .75rem 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.billing-note > div { display: flex; flex-direction: column; gap: .25rem; }
/* плашка в духе UAlert оригинала (color warning, variant soft): значок слева, заголовок, текст, кнопки — под текстом */
.billing-alert { display: flex; gap: .625rem; align-items: flex-start; margin: 0; padding: 1rem; border-radius: .5rem; }
/* жёлтый текст на жёлтой подложке читается плохо (замечание владельца): текст тёмный, жёлтыми остаются значок и кнопка */
.billing-alert.warning { background: oklch(0.795 0.184 86.047 / .1); color: #713f12; }
.billing-alert.warning > .icon { color: oklch(0.795 0.184 86.047); }
html.dark .billing-alert.warning { color: #fef08a; }
.billing-alert > .icon { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }
.billing-alert-body { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.billing-alert-body strong { font-size: .875rem; font-weight: 500; line-height: 1.25rem; }
.billing-alert-body p { margin: .25rem 0 0; font-size: .875rem; line-height: 1.25rem; color: inherit; opacity: .9; }
.billing-alert-actions { display: flex; flex-wrap: wrap; gap: .375rem; margin-top: .625rem; }
.billing-alert-actions .button, .billing-alert-actions button { display: inline-flex; align-items: center; min-height: 0; padding: .25rem .5rem; border: 0;
  border-radius: .375rem; font-size: .75rem; font-weight: 500; line-height: 1rem; text-decoration: none; cursor: pointer; }
.billing-alert.warning .billing-alert-actions .button, .billing-alert.warning .billing-alert-actions button { background: oklch(0.795 0.184 86.047); color: #fff; }
/* «Pay now» в плашке — зелёная основная кнопка, как у оригинала */
.billing-alert .billing-alert-actions .button.primary { background: var(--primary); color: #fff; }
/* страница подписки до снимка подписки: только «Loading…», без пустых состояний */
.billing-body.is-loading > :not(.billing-loading) { display: none !important; }
/* «Add new card» с плюсом, как у оригинала (UButton icon="i-lucide-plus") */
.add-card-button { display: inline-flex; align-items: center; gap: .375rem; }
.add-card-button > .icon { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }
.billing-alert .billing-alert-actions .button.primary:hover { background: rgba(46, 211, 138, .75); }
.billing-alert.info { background: oklch(0.623 0.214 259.815 / .1); color: #1e3a8a; }
html.dark .billing-alert.info { color: #bfdbfe; }
/* нейтральная кнопка в плашке (UButton neutral outline xs оригинала): белая, серая обводка */
.billing-alert-actions button.neutral { background: #fff; color: #314158; box-shadow: inset 0 0 0 1px #cad5e2; }
.billing-alert-actions button.neutral:hover:not(:disabled) { background: #f1f5f9; }
html.dark .billing-alert-actions button.neutral { background: transparent; color: var(--fg); box-shadow: inset 0 0 0 1px var(--line); }
html.dark .billing-alert-actions button.neutral:hover:not(:disabled) { background: rgba(255, 255, 255, .06); }
.billing-note p { margin: 0; font-size: .875rem; }
.billing-note.warn { border-color: #fcd34d; background: #fffbeb; color: #92400e; }
.billing-note.info { border-color: #bfdbfe; background: #eff6ff; color: #1e40af; }
.billing-note.ok { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
/* ошибка — UAlert color="error" variant="soft" оригинала: без рамки, красный фон 10%, красный текст 14px */
.billing-note.bad { border-color: transparent; background: oklch(0.637 0.237 25.331 / .1); color: oklch(0.577 0.245 27.325); font-size: .875rem; line-height: 1.43; }
html.dark .billing-note.warn { border-color: #78350f; background: rgba(120, 53, 15, .25); color: #fcd34d; }
html.dark .billing-note.info { border-color: #1e3a8a; background: rgba(30, 58, 138, .25); color: #bfdbfe; }
html.dark .billing-note.ok { border-color: #14532d; background: rgba(20, 83, 45, .25); color: #bbf7d0; }
html.dark .billing-note.bad { border-color: transparent; background: oklch(0.704 0.191 22.216 / .1); color: oklch(0.704 0.191 22.216); }

/* баннер бесплатного пробного периода (#704): до выбора тарифа — крупно и зелёным */
.trial-hero { margin: 0; padding: 1rem; border: 1px solid #a7f3d0; border-radius: .75rem; background: #ecfdf5; text-align: center; }
.trial-hero strong { display: block; font-size: 1.375rem; font-weight: 700; color: #065f46; }
.trial-hero p { margin: .25rem 0 0; font-size: .875rem; color: #047857; }
.trial-hero .muted { font-size: .75rem; }
html.dark .trial-hero { border-color: #065f46; background: rgba(6, 95, 70, .25); }
html.dark .trial-hero strong { color: #6ee7b7; }
html.dark .trial-hero p { color: #34d399; }

/* карточки тарифов: до трёх — в ряд, больше — по две и по четыре на широком экране (как сетка оригинала) */
/* ширины как у оригинала (pages/billing/plans.vue): плашки — max-w-3xl по центру, сетка из трёх — max-w-5xl, из четырёх — max-w-7xl */
.plans-body > .billing-note, .plans-body > .billing-alert, .plans-body > .trial-hero { width: 100%; max-width: 48rem; margin-inline: auto; box-sizing: border-box; }
.plan-grid { display: grid; gap: 1.25rem; align-items: start; grid-template-columns: 1fr; width: 100%; max-width: 64rem; margin-inline: auto; }
.plan-grid.wide { max-width: 80rem; }
@media (min-width: 48rem) { .plan-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 40rem) { .plan-grid.wide { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 80rem) { .plan-grid.wide { grid-template-columns: repeat(4, 1fr); } }
.plan-card { position: relative; display: flex; flex-direction: column; padding: 1.25rem; border: 1px solid var(--line);
  border-radius: .75rem; background: var(--surface); box-shadow: var(--shadow); }
.plan-card.current { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(46, 211, 138, .35); }
.plan-card h2 { margin: 0; font-size: 1.25rem; text-align: center; }
/* «Current plan» — как UBadge оригинала: зелёный фон primary, белый текст */
.plan-badge { position: absolute; top: -.625rem; inset-inline-start: 1.25rem; padding: .25rem .5rem; border-radius: .375rem; background: var(--primary);
  color: #fff; font-size: .75rem; font-weight: 500; line-height: 1rem; }
.plan-desc { margin: .5rem 0 0; min-height: 3rem; font-size: .875rem; color: var(--muted); text-align: center; }
.plan-price { margin: 1rem 0 0; text-align: center; }
.plan-amount { font-size: 1.75rem; font-weight: 700; }
/* четыре карточки в ряд: длинная цена с кодом валюты должна оставаться одной строкой */
.plan-amount { white-space: nowrap; font-size: clamp(1.25rem, 1.9vw, 1.75rem); }
.plan-price .muted { font-size: .875rem; }
.plan-vat { margin: .25rem 0 0; font-size: .75rem; text-align: center; }
.plan-action { margin: 1.25rem 0; }
.plan-btn { width: 100%; justify-content: center; }
/* ссылки окна «Contact us» — как у оригинала: зелёные, подчёркивание только при наведении */
[data-testid="billing-contact-email"], [data-testid="billing-contact-phone"] { color: var(--primary); text-decoration: none; }
[data-testid="billing-contact-email"]:hover, [data-testid="billing-contact-phone"]:hover { text-decoration: underline; }
/* «Contact us» у ручных тарифов — UButton variant outline оригинала: зелёный текст, тонкая зелёная обводка */
.plan-btn.outline.contact { background: transparent; color: var(--primary); border-color: transparent; box-shadow: inset 0 0 0 1px rgba(46, 211, 138, .5); }
.plan-btn.outline.contact:hover:not(:disabled) { background: rgba(46, 211, 138, .1); }
/* «Downgrade» — нейтральная, как у оригинала: белая, тёмный текст, серая обводка */
.plan-btn.outline:not(.contact) { background: #fff; color: #314158; border-color: transparent; box-shadow: inset 0 0 0 1px #cad5e2; }
.plan-btn.outline:not(.contact):hover:not(:disabled) { background: #f1f5f9; }
html.dark .plan-btn.outline:not(.contact) { background: transparent; color: var(--fg); box-shadow: inset 0 0 0 1px var(--line); }
/* наведение в тёмной теме — лёгкая подсветка, а не светлый фон #f1f5f9 светлой темы (с белым текстом кнопка становилась белой) */
html.dark .plan-btn.outline:not(.contact):hover:not(:disabled) { background: rgba(255, 255, 255, .06); }
.plan-features-title { margin: 0 0 .5rem; font-size: .875rem; font-weight: 500; color: var(--text); }
.plan-features ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: .375rem; }
.plan-features li { display: flex; align-items: flex-start; gap: .5rem; font-size: .875rem; color: var(--muted); }
.plan-features .icon { width: 1rem; height: 1rem; margin-top: .125rem; color: var(--primary); }
.plan-vat-note { margin: 0; text-align: center; font-size: .75rem; }

/* контакты продаж в окне «Напишите нам» */
.contact-lines { display: flex; flex-direction: column; gap: .5rem; margin: 0; }
.contact-lines a { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; }

/* подписка и способы оплаты: две карточки рядом; смена тарифа и оплата — так же */
.billing-grid { display: grid; gap: 1.25rem; align-items: start; grid-template-columns: 1fr; }
@media (min-width: 64rem) { .billing-grid { grid-template-columns: 1fr 1fr; } }
.billing-pane { display: flex; flex-direction: column; gap: 1rem; padding: 1.25rem; border: 1px solid var(--line);
  border-radius: var(--radius); background: var(--surface); }
/* заголовок и подвал карточки отделены линиями во всю ширину — как UCard оригинала */
.billing-pane > h2 { margin: -1.25rem -1.25rem 0; padding: 1rem 1.25rem; font-size: 1.125rem; border-bottom: 1px solid var(--line); }
.billing-pane-foot { margin: auto -1.25rem -1.25rem; padding: 1rem 1.25rem; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: .5rem; }
.billing-plan-name { font-size: 1rem; }
.billing-plan-note { margin: 0; font-size: .875rem; line-height: 1.25rem; color: var(--muted); }
/* как у оригинала (space-y-2): строка о запланированной отмене на 8 px ниже даты продления */
.billing-plan-warn { margin: .5rem 0 0; font-size: .875rem; line-height: 1.25rem; color: var(--warn); }

/* плитки карт: бренд и цифры, срок, владелец, метка основной и действия строкой */
/* плитка карты подписки — как SavedCardItem оригинала (components/payments/SavedCardItem.vue) */
.method-grid { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 80rem) { .method-grid { grid-template-columns: 1fr 1fr; } }
.method-card { position: relative; overflow: hidden; min-width: 0; padding: 1.25rem; border: 1px solid #e5e7eb; border-radius: .75rem;
  background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1); transition: box-shadow .2s; }
.method-card:hover { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1); }
@media (min-width: 48rem) { .method-card { padding: 1.5rem; } }
.method-body { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: space-between; gap: 1rem; height: 100%; }
.method-top { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; min-height: 1.5rem; }
.method-actions { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.method-default { display: inline-flex; align-items: center; padding: .25rem .5rem; border-radius: .375rem; background: rgba(46, 211, 138, .1);
  color: var(--primary); font-size: .75rem; font-weight: 500; line-height: 1rem; }
.method-ghost { padding: .25rem .5rem; border: 0; border-radius: .375rem; background: transparent; color: #334155; font-size: .75rem;
  font-weight: 500; line-height: 1rem; cursor: pointer; }
.method-icon { display: inline-flex; align-items: center; justify-content: center; padding: .25rem; border: 0; border-radius: .375rem;
  background: transparent; color: #334155; cursor: pointer; }
.method-icon .icon { width: 1rem; height: 1rem; }
.method-icon.remove { color: #ef4444; }
.method-ghost:hover:not(:disabled), .method-icon:hover:not(:disabled) { background: #f1f5f9; }
.method-ghost:disabled, .method-icon:disabled { opacity: .75; cursor: not-allowed; }
.method-tip { display: inline-flex; }
.method-number { display: flex; align-items: baseline; gap: .5rem; min-width: 0; }
.method-number p { margin: 0; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 1rem; line-height: 1.5rem;
  letter-spacing: .025em; color: #111827; white-space: nowrap; }
@media (min-width: 40rem) { .method-number p { font-size: 1.125rem; line-height: 1.75rem; } }
.method-brand { font-size: .875rem; font-weight: 600; line-height: 1.25rem; color: #6b7280; white-space: nowrap; }
.method-foot { display: flex; justify-content: space-between; align-items: flex-end; gap: .75rem; }
@media (min-width: 40rem) { .method-foot { gap: 1rem; } }
.method-foot > div { flex: 1; min-width: 0; }
.method-client { text-align: end; }
.method-label { margin: 0; font-size: .875rem; line-height: 1.25rem; font-weight: 500; letter-spacing: .025em; text-transform: uppercase; color: #6b7280; }
.method-value { margin: 0; font-size: .875rem; line-height: 1.25rem; font-weight: 600; color: #1f2937; }
.method-client .method-value { overflow: hidden; font-weight: 700; color: #111827; text-overflow: ellipsis; white-space: nowrap; }
.method-deco { position: absolute; right: -3rem; bottom: -3rem; width: 10rem; height: 10rem; border-radius: 9999px; pointer-events: none;
  background: linear-gradient(to bottom right, rgba(219, 234, 254, .6), rgba(224, 231, 255, .6)); filter: blur(64px); }
html.dark .method-card { border-color: rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); }
html.dark .method-number p, html.dark .method-client .method-value { color: rgba(255, 255, 255, .9); }
html.dark .method-brand { color: rgba(255, 255, 255, .5); }
html.dark .method-label { color: rgba(255, 255, 255, .4); }
html.dark .method-value { color: rgba(255, 255, 255, .8); }
html.dark .method-ghost, html.dark .method-icon { color: rgba(255, 255, 255, .8); background: transparent; }
html.dark .method-ghost:hover:not(:disabled), html.dark .method-icon:hover:not(:disabled) { background: rgba(255, 255, 255, .08); }
html.dark .method-icon.remove { color: #f87171; }
html.dark .method-ghost:hover:not(:disabled), html.dark .method-icon:hover:not(:disabled) { background: rgba(255, 255, 255, .1); }
html.dark .method-deco { background: linear-gradient(to bottom right, rgba(59, 130, 246, .1), rgba(99, 102, 241, .1)); }

/* смена тарифа: выбор тарифа радио-строками, «Что с оплатой», частые вопросы */
/* страница смены тарифа как у оригинала: заголовки без черты, строки тарифов с отступом 12 px */
.change-plan-panel h2, .change-plan-faq h2 { padding: 0; border: 0; }
/* колонка уже даёт 16 px между блоками: поля заголовка дополняют её до 20 px сверху и 12 px снизу, как у оригинала */
.change-plan-panel h2 { margin: .25rem 0 -.25rem; font-size: 1rem; font-weight: 600; }
.change-plan-panel > p.plan-option { margin: 0; }
/* «Billing impact» как у оригинала: у строк внутри рамки нет своих полей, только 8 px под заголовком */
.change-plan-panel .impact p { margin: 0; }
.change-plan-panel .impact .impact-title { margin-bottom: .5rem; line-height: 1.5rem; }
.change-plan-panel .impact .impact-row + .impact-row { margin-top: .25rem; }
.change-plan-faq h2 { margin: 0 0 1rem; font-size: 1.25rem; font-weight: 600; }
.change-plan-panel .form-rows { display: flex; flex-direction: column; gap: .75rem; }
.plan-option { display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem; border: 1px solid var(--line); border-radius: var(--radius); }
.plan-option.picked { border-color: var(--primary); box-shadow: 0 0 0 1px rgba(46, 211, 138, .4); }
.plan-option-main { flex: 1; min-width: 0; }
.plan-option-name { font-weight: 500; }
.plan-option-price { font-size: .875rem; color: var(--muted); }
.impact { padding: .75rem 1rem; border: 1px solid var(--line); border-radius: var(--radius); }
.impact-title { margin: 0 0 .5rem; font-weight: 500; }
.impact-row { display: flex; justify-content: space-between; gap: .75rem; font-size: .875rem; }
.impact-row strong { font-weight: 600; }
.faq-item { padding: .75rem 1rem; border: 1px solid var(--line); border-radius: var(--radius); }
.faq-item p { margin: 0; }
.faq-item .faq-answer { margin-top: .5rem; font-size: .875rem; color: var(--muted); }
.change-plan-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }

/* оплата: сводка заказа */
.summary-rows { display: flex; flex-direction: column; gap: .25rem; padding-top: .75rem; border-top: 1px solid var(--line); font-size: .875rem; }
.summary-total { font-weight: 600; padding-top: .25rem; }
.summary-note { font-size: .75rem; color: var(--muted); }
.summary-price { font-size: 1.25rem; font-weight: 600; }
/* сводка оплаты как у оригинала (space-y-4): у абзацев нет своих полей — расстояния даёт только колонка, строки итогов плотные */
[data-testid="checkout-summary"] p { margin: 0; }
[data-testid="checkout-summary"] > p.muted { font-size: .875rem; line-height: 1.25rem; }
[data-testid="checkout-summary"] .summary-price { line-height: 1.75rem; }
[data-testid="checkout-summary"] .plan-features li { font-size: .875rem; line-height: 1.25rem; }
[data-testid="checkout-summary"] .summary-rows .impact-row { line-height: 1.25rem; }
[data-testid="checkout-summary"] .summary-note { line-height: 1rem; }
.checkout-card-form { display: flex; flex-direction: column; gap: .75rem; }
.checkout-saved { display: flex; flex-wrap: wrap; gap: .5rem; align-items: flex-end; }
.checkout-saved .field { flex: 1; min-width: 14rem; margin: 0; }

/* исход оплаты */
.paywall-result { max-width: 32rem; margin: 0 auto; padding: 2rem 1rem; text-align: center; display: flex; flex-direction: column;
  align-items: center; gap: 1.25rem; }
/* исход оплаты по центру высоты, как у оригинала (min-h-[60vh] flex flex-col justify-center) */
.paywall-result { min-height: 60vh; justify-content: center; box-sizing: border-box; }
.paywall-result .result-mark { width: 4rem; height: 4rem; border-radius: 50%; display: inline-flex; align-items: center;
  justify-content: center; font-size: 2rem; font-weight: 700; }
.paywall-result .result-mark.ok { background: #dcfce7; color: #16a34a; }
.paywall-result .result-mark.bad { background: #fee2e2; color: #dc2626; }
.paywall-result .result-mark.wait { background: #fef3c7; color: #b45309; }
html.dark .paywall-result .result-mark.ok { background: rgba(22, 163, 74, .25); }
html.dark .paywall-result .result-mark.bad { background: rgba(220, 38, 38, .25); }
html.dark .paywall-result .result-mark.wait { background: rgba(217, 119, 6, .25); color: #fbbf24; }
.paywall-result h1 { margin: 0; font-size: 1.5rem; }

/* регулярные счета и автосписания (D-0113): окна плана, история, пропущенные периоды, «Retry details», списания с неизвестным исходом */
.table-scroll { overflow-x: auto; }
.plain-table { box-shadow: none; }
/* шапка таблиц окон плана — как у оригинала (MissedPeriodsModal, RecurringHistoryModal): обычный регистр, font-medium, цвет текста */
.plain-table th { text-transform: none; letter-spacing: 0; font-size: .875rem; font-weight: 500; color: inherit; }
.plan-modal { border: 0; margin: 0; min-width: 0; }
.plan-modal .plan-next { margin: 0; font-size: .875rem; color: var(--muted); }
.plan-currency-label { margin-inline-start: auto; font-size: .875rem; color: var(--muted); display: inline-flex; align-items: center; gap: .25rem; }
.retry-info { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .75rem; color: #ea580c; }
html.dark .retry-info { color: #fb923c; }
.notice { padding: .6rem .8rem; border-radius: .5rem; font-size: .875rem; }
.notice.ok { background: #dcfce7; color: #166534; }
html.dark .notice.ok { background: rgba(20, 83, 45, .3); color: #86efac; }
.missed-results { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; gap: .25rem; font-size: .875rem; }
.missed-results .ok { color: #16a34a; }
.missed-results .bad { color: #dc2626; }
.missed-foot { display: block; }
.missed-foot-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.missed-foot-buttons { display: inline-flex; gap: .5rem; }
.unknown-charges { margin-bottom: 1rem; }
.unknown-charges h2 { font-size: 1rem; margin: 0 0 .5rem; }
.unknown-charges .toolbar input { max-width: 14rem; }
/* сохранённые карты (D-0113): пустой список по центру, серый пункт меню карты живого автосписания, ссылка после запроса карты */
.cards-empty { text-align: center; padding: 3rem 1rem; }
.cards-empty p { margin: .5rem 0 0; }
.cards-panel { display: flex; flex-direction: column; min-height: calc(100vh - 13.75rem); margin-top: 1rem; padding: 1.5rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); }
.cards-panel > .cards-empty, .cards-panel > .center-note { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0; }
.cards-panel > .card-grid { margin: 0; }
.center-note { text-align: center; padding: 2rem 0; }
.list-panel .danger-item.is-disabled { opacity: .5; cursor: not-allowed; }
.saved-card-foot a { color: var(--primary); text-decoration: none; }
.saved-card-foot a:hover { text-decoration: underline; }
.card-link-out { word-break: break-all; font-size: .875rem; }
@media (min-width: 1024px) { .saved-cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .saved-cards-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1536px) { .saved-cards-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 480px) { .saved-cards-grid { gap: .75rem; padding-top: .75rem; } }
/* транзакции (D-0113): панель деталей — карточки-секции «подпись: значение», красная секция отказа, история */
.tx-sections { display: flex; flex-direction: column; gap: 1rem; }
.tx-card { border: 1px solid #e2e8f0; border-radius: .5rem; padding: .75rem 1rem; }
html.dark .tx-card { border-color: #1d293d; }
.tx-card h3 { margin: 0 0 .5rem; font-size: .875rem; font-weight: 600; }
.tx-card dl { display: grid; grid-template-columns: minmax(8rem, 40%) 1fr; gap: .375rem 1rem; margin: 0; }
.tx-card dt { color: var(--muted); }
.tx-card dd { margin: 0; word-break: break-word; }
.tx-failure { border-color: #fecaca; background: #fef2f2; }
html.dark .tx-failure { border-color: rgba(127, 29, 29, .6); background: rgba(127, 29, 29, .15); }
.tx-history { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.tx-history li { border-bottom: 1px solid #e2e8f0; padding-bottom: .5rem; }
.tx-history li p { margin: .25rem 0 0; }
.link-button { border: 0; background: none; padding: 0; color: var(--primary); text-decoration: underline; cursor: pointer; font: inherit; }
/* окно возврата (D-0113): два режима карточками, недоступный — бледный; ошибка до провайдера — красной плашкой */
.refund-modes { border: 0; margin: .75rem 0; padding: 0; display: grid; gap: .5rem; }
.refund-mode { display: flex; gap: .625rem; align-items: flex-start; padding: .625rem .75rem; border: 1px solid #e2e8f0; border-radius: .5rem; cursor: pointer; }
html.dark .refund-mode { border-color: #1d293d; }
.refund-mode span { display: grid; gap: .125rem; }
.refund-mode.is-disabled { opacity: .5; cursor: not-allowed; }
.notice.bad { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
html.dark .notice.bad { background: rgba(127, 29, 29, .2); color: #fca5a5; border-color: rgba(127, 29, 29, .6); }
.notice.bad p { margin: .25rem 0 0; }

/* форма расхода (ExpenseForm оригинала, часть 7): две карточки рядом от 768px, на телефоне — друг под другом; шапка 2 колонки */
.expense-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: stretch; }
@media (min-width: 768px) { .expense-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.expense-card > h3, .expense-preview-head h3 { font-size: 1.125rem; font-weight: 600; }
.expense-card > h3 { margin: -1.5rem -1.5rem 0; padding: .75rem 1.5rem; }
.expense-fields { border: 0; padding: 0; margin: 0; min-width: 0; display: flex; flex-direction: column; gap: .75rem; }
.expense-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; }
@media (min-width: 768px) { .expense-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .expense-grid .span-2 { grid-column: span 2; } }
.expense-grid .field > input, .expense-grid .field > select, .expense-grid .field > .sel-wrap, .expense-grid .field > .dp-wrap { width: 100%; }
.expense-fields .field { margin: 0; }
.expense-fields label { font-size: .875rem; font-weight: 500; }
.expense-sub { margin: .5rem 0 0; font-size: .9375rem; font-weight: 500; }
/* строки расхода — сетка без прокрутки вбок: узкая карточка — счёт на всю ширину, ниже суммы с подписями; от 560px — колонки оригинала */
.expense-lines { display: flex; flex-direction: column; gap: .75rem; min-width: 0; }
.expense-lines .el-head { display: none; }
.expense-line { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto auto; gap: .5rem; align-items: end; min-width: 0;
  padding-bottom: .75rem; border-bottom: 1px solid var(--line); }
.expense-line:last-child { border-bottom: 0; padding-bottom: 0; }
.expense-line .el-account, .expense-line .el-desc { grid-column: 1 / -1; }
.expense-line > div { min-width: 0; }
.expense-line .el-cap { display: block; font-size: .75rem; color: var(--muted); margin-bottom: .125rem; white-space: nowrap; }
.expense-line .num { text-align: end; }
.expense-line .el-amount, .expense-line .el-total { padding-bottom: .5rem; }
.expense-line .el-total { font-weight: 500; }
.expense-line .el-remove { grid-column: 5; grid-row: 2; align-self: end; }
.expense-line .el-net { grid-column: 1; grid-row: 2; } .expense-line .el-vat { grid-column: 2; grid-row: 2; }
.expense-line .el-amount { grid-column: 3; grid-row: 2; } .expense-line .el-total { grid-column: 4; grid-row: 2; }
.expense-line input, .expense-line select, .expense-line .sel-wrap { width: 100%; min-width: 0; box-sizing: border-box; }
.expense-line .el-net input { text-align: end; }
/* телефон: суммы НДС и итога — третьей строкой, чтобы выбор НДС не сжимался */
@container (max-width: 420px) {
  .expense-line { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
  .expense-line .el-remove { grid-column: 3; grid-row: 2; }
  .expense-line .el-amount { grid-column: 1; grid-row: 3; text-align: start; padding: 0; }
  .expense-line .el-total { grid-column: 2; grid-row: 3; text-align: start; padding: 0; }
}
@container (min-width: 560px) {
  .expense-lines { gap: .5rem; }
  .expense-lines .el-head, .expense-line { display: grid; grid-template-columns: minmax(0, 1fr) 5.5rem 6.5rem 5rem 5.5rem 2rem; gap: .5rem; }
  .expense-lines .el-head { font-size: .8125rem; font-weight: 500; color: var(--muted); padding: .25rem 0; white-space: nowrap; }
  .expense-lines .el-head .num { text-align: end; }
  .expense-line { align-items: center; }
  .expense-line .el-cap { display: none; }
  .expense-line .el-account { grid-column: 1; grid-row: 1; } .expense-line .el-net { grid-column: 2; grid-row: 1; }
  .expense-line .el-vat { grid-column: 3; grid-row: 1; } .expense-line .el-amount { grid-column: 4; grid-row: 1; text-align: end; padding: 0; }
  .expense-line .el-total { grid-column: 5; grid-row: 1; text-align: end; padding: 0; } .expense-line .el-remove { grid-column: 6; grid-row: 1; align-self: center; }
  .expense-line .el-desc { grid-column: 1 / -1; grid-row: 2; }
}
.expense-hint { font-size: .8125rem; margin: 0; }
.expense-wh { max-width: 12rem; }
.input-suffix { display: flex; align-items: center; gap: .375rem; } .input-suffix input { flex: 1; min-width: 0; }
.expense-totals { display: grid; grid-template-columns: 1fr auto; gap: .25rem 1rem; margin: 0; padding-top: .75rem; border-top: 1px solid var(--line); }
.expense-totals dt { font-weight: 600; } .expense-totals dd { margin: 0; text-align: end; font-weight: 600; }
.expense-totals-wh { display: contents; } .expense-totals-wh dt, .expense-totals-wh dd { font-weight: 400; }
.expense-actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: space-between; align-items: center; }
.expense-actions-main { display: flex; flex-wrap: wrap; gap: .5rem; }
button.danger-outline { background: transparent; color: #dc2626; border-color: #fca5a5; }
html.dark button.danger-outline { background: transparent; color: #f87171; border-color: rgba(248, 113, 113, .5); }
.icon-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 2rem; height: 2rem; padding: 0 .375rem; border: 0;
  background: transparent; color: var(--muted); border-radius: .375rem; cursor: pointer; }
html.dark button.icon-btn { background: transparent; border: 0; color: var(--muted); }
.icon-btn:hover { background: rgba(107, 114, 128, .1); }
.icon-btn.danger-icon { color: #ef4444; }
.expense-preview-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin: -1.5rem -1.5rem 0; padding: .75rem 1.5rem; border-bottom: 1px solid var(--line); }
.expense-preview-head h3 { margin: 0; }
.expense-preview-tools { display: flex; align-items: center; gap: .25rem; }
.upload-btn { position: relative; display: inline-flex; align-items: center; gap: .375rem; cursor: pointer; font-size: .875rem; font-weight: 500; }
.upload-btn.success-text { color: #16a34a; padding: .25rem .5rem; border-radius: .375rem; } .upload-btn.success-text:hover { background: rgba(34, 197, 94, .1); }
html.dark .upload-btn.success-text { color: #4ade80; }
.expense-zoom { display: flex; align-items: center; justify-content: center; gap: .5rem; font-size: .875rem; }
.expense-preview { display: flex; flex-direction: column; }
.expense-preview-body { min-height: 12rem; flex: 1; display: flex; flex-direction: column; }
.expense-preview-body > .expense-image, .expense-preview-body > .expense-pdf { flex: 1; }
.expense-empty { text-align: center; margin: 1rem 0; }
.expense-image { overflow: auto; text-align: center; } .expense-image img { max-width: none; }
.expense-pdf { display: flex; flex-direction: column; gap: .5rem; min-height: 75vh; }
.expense-pdf-tools { justify-content: center; flex-wrap: wrap; }
.expense-pdf .pdf-stage { border-radius: .375rem; }
/* «Journal entry to be created» формы расхода (ExpensePostingPreview оригинала) */
.posting-preview { border: 1px solid var(--line); border-radius: .375rem; overflow: hidden; }
.posting-head, html.dark button.posting-head { display: flex; width: 100%; align-items: center; gap: .5rem; padding: .75rem 1rem; border: 0; border-radius: 0;
  background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; }
.posting-head:hover { background: rgba(107, 114, 128, .06); }
.posting-head .icon { width: 1rem; height: 1rem; color: var(--muted); flex: 0 0 auto; }
.posting-title { font-size: .9375rem; font-weight: 500; }
.posting-summary { margin-inline-start: auto; font-size: .8125rem; color: #16a34a; }
.posting-summary.bad, .posting-status.bad { color: #dc2626; }
html.dark .posting-summary { color: #4ade80; } html.dark .posting-summary.bad, html.dark .posting-status.bad { color: #f87171; }
.posting-body { padding: .75rem 1rem; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: .75rem; font-size: .875rem; }
.posting-status { display: flex; justify-content: space-between; gap: .5rem; color: #16a34a; } html.dark .posting-status { color: #4ade80; }
.posting-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; }
.posting-columns h5 { margin: 0 0 .375rem; font-size: .75rem; font-weight: 600; text-transform: uppercase; color: var(--muted); }
.posting-row { display: flex; justify-content: space-between; gap: .5rem; padding: .125rem 0; } .posting-row b { font-weight: 500; white-space: nowrap; }
.posting-foot { padding-top: .5rem; border-top: 1px solid var(--line); font-weight: 600; }
.posting-note { margin: 0; font-size: .8125rem; }

/* черновики расходов (draft.vue оригинала, D-0115): зона загрузки, сетка карточек 1 / 2 / 3 / 4 колонки, бейдж «N / M» */
.drafts-overlay { position: fixed; inset: 0; z-index: 60; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem;
  background: color-mix(in srgb, var(--bg) 75%, transparent); color: var(--fg); font-weight: 500; }
.spinner { display: inline-block; width: 2rem; height: 2rem; border: 3px solid var(--line); border-top-color: var(--primary); border-radius: 50%;
  animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spinner { animation-duration: 3s; } }
.drafts-supplier { display: flex; align-items: center; gap: .5rem; margin-bottom: 1rem; padding: .75rem 1rem; border: 1px solid var(--line);
  border-radius: .5rem; background: var(--surface); color: var(--fg); font-weight: 500; }
.drafts-supplier .icon { color: var(--primary); }
.drafts-drop { display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: 2rem 1rem; margin-bottom: 1.5rem; text-align: center;
  border: 2px dashed var(--line-strong); border-radius: .75rem; background: var(--surface); cursor: pointer; }
.drafts-drop:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.drafts-drop.dragging { border-color: var(--primary); background: color-mix(in srgb, var(--primary) 8%, var(--surface)); }
.drafts-drop.disabled { cursor: not-allowed; opacity: .6; }
.drafts-drop p { margin: 0; }
.drafts-drop .link { color: var(--accent); font-weight: 600; }
.drafts-drop-icon { width: 3rem; height: 3rem; color: var(--muted); }
.small { font-size: .8125rem; }
.notice { color: var(--ok); margin: .25rem 0; }
.drafts-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
@media (min-width: 768px) { .drafts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .drafts-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .drafts-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.draft-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: .75rem; background: var(--surface);
  cursor: pointer; transition: box-shadow .15s; }
.draft-card:hover { box-shadow: 0 4px 12px rgba(0, 0, 0, .08); }
.draft-preview { position: relative; height: 12rem; display: flex; align-items: center; justify-content: center; background: var(--canvas); }
.draft-badge { text-decoration: none; position: absolute; top: .5rem; inset-inline-end: .5rem; z-index: 1; padding: .125rem .5rem; border-radius: 1rem; background: var(--primary);
  color: #fff; font-size: .75rem; font-weight: 600; }
.draft-file { display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: 0 1rem; text-align: center; min-width: 0; max-width: 100%; }
.draft-file .icon { width: 3rem; height: 3rem; color: var(--muted); }
.draft-file-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--fg); font-size: .875rem; }
.draft-image { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.draft-image img { width: 100%; height: 100%; object-fit: cover; }
.draft-image-caption { position: absolute; inset-inline: 0; bottom: 0; padding: 1.5rem .75rem .5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  background: linear-gradient(transparent, rgba(0, 0, 0, .6)); color: #fff; font-size: .75rem; }
.draft-actions { position: absolute; bottom: .5rem; inset-inline-end: .5rem; z-index: 1; display: flex; gap: .25rem; padding: .125rem; border-radius: .5rem;
  background: color-mix(in srgb, var(--surface) 90%, transparent); box-shadow: 0 1px 3px rgba(0, 0, 0, .15); }
.draft-data { margin: 0; padding: .75rem 1rem 1rem; display: flex; flex-direction: column; gap: .25rem; font-size: .875rem;
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 8%, var(--surface)), color-mix(in srgb, #a855f7 8%, var(--surface))); flex: 1; }
.draft-data > div { display: flex; gap: .375rem; min-width: 0; }
.draft-data dt { color: var(--muted); flex: none; }
.draft-data dd { margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--fg); }
.draft-data dd.muted { color: var(--muted); }
.draft-data .draft-review { flex-direction: column; gap: .125rem; margin-top: .25rem; }
.draft-data .draft-review dd { white-space: normal; color: var(--warn); }
/* форма расхода в режиме черновиков: Back и «← N / M →»; телефон — Back во всю ширину, стрелки ниже */
.draft-nav { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1rem; flex-wrap: wrap; }
.draft-nav-steps { display: flex; align-items: center; gap: .5rem; }
.draft-nav-counter { min-width: 3.5rem; text-align: center; font-weight: 500; color: var(--fg); }
[dir='rtl'] .flip-rtl { transform: scaleX(-1); }
@media (max-width: 639px) { .draft-nav > .button { flex: 1 1 100%; text-align: center; } .draft-nav-steps { margin-inline: auto; } }
/* «Needs manual review» — предупреждение (UAlert warning soft оригинала) */
.review-alert { display: flex; gap: .75rem; margin-bottom: 1rem; padding: .75rem 1rem; border-radius: .5rem; color: var(--fg);
  background: color-mix(in srgb, var(--warn) 12%, var(--surface)); border: 1px solid color-mix(in srgb, var(--warn) 35%, transparent); }
.review-alert > .icon { flex: none; color: var(--warn); margin-top: .125rem; }
.review-alert ul { margin: .25rem 0; padding-inline-start: 1.25rem; }
.review-alert p { margin: .25rem 0 .5rem; color: var(--text); }
.recognize-note { display: flex; align-items: center; gap: .5rem; margin: .5rem 0 0; font-size: .875rem; color: var(--ok); }
.small-spinner { width: 1rem; height: 1rem; border-width: 2px; }
/* «Unlock» отправленного в налоговую расхода — ghost-кнопка primary с замком (ExpenseFileManager оригинала) */
.ghost-primary { display: inline-flex; align-items: center; gap: .375rem; padding: .375rem .5rem; border: 0; border-radius: .375rem;
  background: transparent; color: var(--accent); font-weight: 500; cursor: pointer; }
.ghost-primary:hover { background: color-mix(in srgb, var(--primary) 10%, transparent); }
/* выписка счёта: From / To, плашка «Not reconciled», меню «•••» справа (как у оригинала) */
.statement-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: .75rem; }
.statement-toolbar .pending-chip { align-self: center; text-decoration: none; }
.statement-menu { margin-inline-start: auto; align-self: center; }
.statement-menu-panel { inset-inline-start: auto; inset-inline-end: 0; }
.statement-menu-panel > a, .statement-menu-panel > button { display: block; width: 100%; text-align: start; padding: .375rem .5rem; border: 0; border-radius: .25rem;
  background: transparent; color: var(--text); text-decoration: none; font: inherit; cursor: pointer; }
.statement-menu-panel > a:hover, .statement-menu-panel > button:hover { background: var(--hover, var(--canvas)); }
.to-check-toggle.active { background: color-mix(in srgb, var(--primary) 15%, transparent); border-color: var(--primary); }
.to-check-facts { display: flex; gap: .5rem 1rem; margin: 0; align-self: center; }

/* окно «Reconcile statement line» (ReconcilePopup оригинала, sm:max-w-3xl) — components/reconcile-dialog.html */
.reconcile-modal { max-width: 48rem; }
.reconcile-modal .modal-body { gap: 1.25rem; }
.rc-line { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding-bottom: .75rem; border-bottom: 1px solid var(--line); }
.rc-line-text { min-width: 0; }
.rc-line-title { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rc-line-sum { text-align: end; white-space: nowrap; }
.rc-amount { font-size: 1.125rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.rc-small { font-size: .875rem; }
.rc-warn { font-size: .875rem; color: #b45309; }
.rc-facts { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; margin: .5rem 0 0; font-size: .875rem; }
.rc-facts div { display: flex; gap: .375rem; }
.rc-facts dt { color: var(--muted); }
.rc-facts dd { margin: 0; font-variant-numeric: tabular-nums; }
.rc-current, .rc-form, .rc-party { display: flex; flex-direction: column; gap: .75rem; }
.rc-current-head { display: flex; justify-content: space-between; gap: .75rem; font-size: .875rem; }
.rc-side, .rc-strong { font-weight: 500; font-size: .875rem; }
.rc-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.rc-columns > div + div { border-inline-start: 1px solid var(--line); padding-inline-start: 1rem; }
.rc-columns h4 { margin: 0 0 .25rem; font-size: .875rem; font-weight: 500; color: var(--muted); }
.rc-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .25rem 0; font-size: .875rem; }
.rc-row > span, .rc-row > label { min-width: 0; flex: 1; }
.rc-row b { font-weight: 500; text-align: end; font-variant-numeric: tabular-nums; }
.rc-sub { display: block; }
.rc-key { font-family: ui-monospace, monospace; margin-inline-end: .375rem; }
.rc-num { width: 9rem; flex: none; }
.rc-extra select { flex: 1; }
.rc-kinds { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1rem; font-size: .875rem; }
.rc-kinds legend { width: 100%; margin-bottom: .5rem; font-weight: 500; }
.rc-kinds .radio { display: inline-flex; align-items: center; gap: .375rem; cursor: pointer; }
.rc-matches { border: 1px solid #fcd34d; background: #fffbeb; border-radius: .5rem; padding: .75rem; }
html.dark .rc-matches { border-color: #b45309; background: rgba(69, 26, 3, .3); }
.rc-preview { border-top: 1px solid var(--line); padding-top: .75rem; }
.rc-preview-toggle { display: flex; width: 100%; align-items: center; gap: .5rem; background: none; border: 0; padding: 0; color: var(--text); font-size: .875rem; }
.rc-preview-toggle .icon { width: 1rem; height: 1rem; }
.rc-allocated { margin-inline-start: auto; font-variant-numeric: tabular-nums; }
.rc-difference { font-weight: 500; font-variant-numeric: tabular-nums; }
.rc-difference.ok { color: #16a34a; }
.rc-difference.bad { color: #dc2626; }
.rc-foot { justify-content: space-between; }
.rc-actions { display: flex; gap: .75rem; }
button.soft.danger { color: #dc2626; }
@media (max-width: 640px) { .rc-columns { grid-template-columns: 1fr; } .rc-columns > div + div { border: 0; padding: 0; } .rc-line { flex-direction: column; } .rc-line-sum { text-align: start; } .rc-num { width: 6.5rem; } }
tr.clickable { cursor: pointer; }
/* импорт выписки (/account-statement/import/{id}): плашка без заголовка, итог зелёным / красным (ImportResultHeader оригинала) */
.import-intro .import-tip-head { align-items: flex-start; color: #15803d; } html.dark .import-intro .import-tip-head { color: #4ade80; }
.import-intro .import-tip-head .icon { flex: none; margin-top: .125rem; }
.import-upload { display: flex; flex-direction: column; gap: 1rem; }
.import-upload input[type='file'] { width: 100%; }
.import-result { display: flex; align-items: center; gap: .75rem; padding: 1rem; border-radius: .5rem; border: 1px solid #bbf7d0; background: #f0fdf4; }
.import-result.bad { border-color: #fecaca; background: #fef2f2; }
html.dark .import-result { border-color: #166534; background: rgba(20, 83, 45, .2); } html.dark .import-result.bad { border-color: #991b1b; background: rgba(127, 29, 29, .2); }
.import-result .icon { width: 1.5rem; height: 1.5rem; color: #16a34a; flex: none; } .import-result.bad .icon { color: #dc2626; }
.import-result h3 { margin: 0; font-size: .875rem; font-weight: 600; color: #166534; } .import-result.bad h3 { color: #991b1b; }
html.dark .import-result h3 { color: #bbf7d0; } html.dark .import-result.bad h3 { color: #fecaca; }
.import-result p { margin: .25rem 0 0; font-size: .75rem; }
.import-section-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .5rem; }
.import-section-head .section-title { margin: 0; }
.import-map-table select { width: 100%; }
tr.row-error td { background: rgba(254, 242, 242, .6); } html.dark tr.row-error td { background: rgba(127, 29, 29, .15); }
.error-text { color: #dc2626; }
.rc-rate-gap { color: #b45309 !important; font-weight: 500; } html.dark .rc-rate-gap { color: #fbbf24 !important; }
/* правка и удаление строки выписки (StatementLinePopup оригинала, sm:max-w-lg) */
.line-modal { max-width: 32rem; }
.ln-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.ln-form .wide { grid-column: 1 / -1; }
.ln-form .label { display: block; font-size: .875rem; font-weight: 500; margin-bottom: .25rem; }
.ln-direction { display: flex; }
.ln-direction button { flex: 1; justify-content: center; }
.ln-direction button:first-child { border-start-end-radius: 0; border-end-end-radius: 0; }
.ln-direction button:last-child { border-start-start-radius: 0; border-end-start-radius: 0; }
.ln-direction button.ok { color: #16a34a; }
.ln-direction button.bad { color: #dc2626; }
.ln-facts { display: grid; grid-template-columns: auto 1fr; gap: .25rem 1rem; margin: 0; padding: .5rem .75rem; border-radius: .375rem; background: #f9fafb; font-size: .875rem; }
html.dark .ln-facts { background: #1e293b; }
.ln-facts dt { color: var(--muted); }
.ln-facts dd { margin: 0; overflow-wrap: anywhere; }
.ln-facts dd.neg { color: #dc2626; font-weight: 500; }
.ln-facts dd.pos { color: #16a34a; font-weight: 500; }
.ln-delete { display: flex; flex-direction: column; gap: .75rem; }
@media (max-width: 640px) { .ln-form { grid-template-columns: 1fr; } }
td.row-menu { width: 2.75rem; text-align: center; }
td.row-menu .list-menu { position: relative; display: inline-block; }
.row-menu-panel { inset-inline-start: auto; inset-inline-end: 0; min-width: 10rem; }
.row-menu-panel button { display: block; width: 100%; text-align: start; padding: .5rem .75rem; border: 0; background: none; font-size: .875rem; }
.warn-text { color: #b45309; font-size: .875rem; } html.dark .warn-text { color: #fbbf24; }
.drawer-error { margin: .75rem 1rem 0; }

/* поле шириной в половину формы (w-1/2 оригинала), на телефоне — во всю ширину */
.rep-half { width: 50%; }
@media (max-width: 640px) { .rep-half { width: 100%; } }

/* отчёт НДС: черта между блоками и примечание внутри карточки формы */
.rep-vat-model h2 { margin-top: 0; }
.rep-form .rep-sums { max-width: none; }
.rep-rule { border: 0; border-top: 1px solid var(--line); margin: 1rem 0; }
.rep-note-inner { padding: 1rem; border: 1px solid var(--line); border-radius: .5rem; margin-bottom: 1.5rem; }

/* вкладки сверки клиента (ReconcileHeader / ReconcileStatusBadge / ReconcileTable оригинала, Issue #346/#488): шапка одной строкой —
   сальдо значком, «к разрыву», период; в таблице подсвечена только строка разрыва, состояние остальных несёт колонка сальдо */
.rec-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.5rem; margin-bottom: 1rem;
  border: 1px solid #e5e7eb; border-radius: .5rem; background: #fff; }
html.dark .rec-head { border-color: #314158; background: #1d293d; }
.rec-head-side { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.rec-period { display: inline-flex; align-items: center; gap: .375rem; }
.rec-period input { width: 9rem; }
.rec-status { position: relative; display: inline-flex; align-items: center; gap: .25rem; padding: 0; border: 0; background: none; font: inherit; color: inherit;
  white-space: nowrap; cursor: help; }
.rec-status .icon { width: 1rem; height: 1rem; flex-shrink: 0; }
.rec-status-lg { font-size: 1.125rem; font-weight: 700; }
.rec-status.rec-ok { color: #16a34a; }
.rec-status.rec-warn { color: #d97706; }
.rec-status.rec-bad { color: #dc2626; }
html.dark .rec-status.rec-ok { color: #4ade80; }
html.dark .rec-status.rec-warn { color: #fbbf24; }
html.dark .rec-status.rec-bad { color: #f87171; }
.rec-tip { position: fixed; z-index: 60; padding: .5rem .625rem; border-radius: .375rem; background: #111827; color: #f9fafb; font-size: .75rem;
  line-height: 1.1rem; white-space: normal; pointer-events: none; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2); }
html.dark .rec-tip { background: #0f172b; color: #f1f5f9; border: 1px solid #314158; }
.rec-break { display: inline-flex; align-items: center; gap: .375rem; padding: .25rem .5rem; font-size: .75rem; border: 0; border-radius: .375rem;
  background: #fef2f2; color: #dc2626; }
.rec-break .icon { width: 1rem; height: 1rem; }
html.dark .rec-break { background: rgba(127, 29, 29, .35); color: #f87171; }
.rec-table tr.rec-row-break td { background: #fee2e2; }
.rec-table tr.rec-row-break td:first-child { box-shadow: inset 3px 0 0 #dc2626; }
html.dark .rec-table tr.rec-row-break td { background: rgba(127, 29, 29, .45); }
.error-block { padding: 1rem; margin-bottom: 1rem; border: 1px solid #fecaca; border-radius: .5rem; background: #fef2f2; color: #991b1b; }
html.dark .error-block { border-color: #7f1d1d; background: rgba(127, 29, 29, .3); color: #fecaca; }
/* строка сверки щёлкается целиком — ссылка документа выглядит текстом строки, как у оригинала */
.rec-table td a { color: inherit; text-decoration: none; }
.rec-table td a:hover { text-decoration: underline; }
button.rec-status, button.rec-status:hover { background: none; border: 0; box-shadow: none; padding: 0; min-height: 0; }

/* выписка контрагента на телефоне — карточки строк (party-mobile-card оригинала, isMobile: ширина < 768) */
.stmt-cards { display: none; }
@media (max-width: 767px) {
  .stmt .list-table-wrap { display: none; }
  .stmt-cards { display: block; padding: .75rem 0; }
}
.stmt-card { margin: 0 .75rem 1rem; border-radius: .5rem; background: #fff; box-shadow: 0 2px 4px rgba(0, 0, 0, .1); overflow: hidden; cursor: pointer; }
html.dark .stmt-card { background: #1d293d; border: 1px solid #314158; box-shadow: none; }
.stmt-card-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem .5rem; padding: .75rem 1rem;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%); border-bottom: 1px solid #e2e8f0; font-size: 1rem; font-weight: 700; }
html.dark .stmt-card-head { background: linear-gradient(135deg, #1d293d 0%, #314158 100%); border-bottom-color: #314158; }
.stmt-card-date { flex: 1; color: #64748b; }
html.dark .stmt-card-date { color: #90a1b9; }
.stmt-card-amount { flex: 1; text-align: center; white-space: nowrap; }
.stmt-card-balance { flex: 1; text-align: end; white-space: nowrap; }
.stmt-card-body { padding: .25rem 1rem; }
.stmt-field { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid #f1f5f9; font-size: .875rem; }
.stmt-field:last-child { border-bottom: 0; }
html.dark .stmt-field { border-bottom-color: #314158; }
.stmt-label { flex-shrink: 0; font-weight: 500; color: #64748b; }
html.dark .stmt-label { color: #90a1b9; }
.stmt-value { flex: 1; min-width: 0; text-align: end; color: var(--fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stmt-value a { color: inherit; }
/* телефон: вкладки — во всю ширину строкой с прокруткой (без неё вставали столбиком на весь экран), сальдо и «•••» — строкой ниже (мобильная шапка ClientTabs оригинала) */
@media (max-width: 767px) {
  .party-tabs { flex-wrap: wrap; gap: 0; }
  .party-tabs .tabs { flex-basis: 100%; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; background-image: none;
    border-bottom: 1px solid var(--line); }
  .party-tabs .tabs .tab { white-space: nowrap; }
  .party-tabs .tab-side { margin-inline: auto .75rem; min-height: 2.5rem; }
}
/* таблица сверки на узком экране прокручивается в своей рамке, не вылезает за карточку (таблица Tabulator оригинала) */
.rec-table-wrap { overflow-x: auto; }
.rec-table-wrap table { min-width: 40rem; }

/* журнал: окно ручной проводки (ManualEntryPopup оригинала, sm:max-w-5xl) и боковая панель проводки (JournalEntryDetail, 720px) */
.journal-manual { max-width: 64rem; }
.journal-manual .required { color: #ef4444; }
.jm-head { display: grid; grid-template-columns: 1fr 2fr 3fr; gap: 1rem; }
@media (max-width: 767px) { .jm-head { grid-template-columns: 1fr; } }
.jm-lines-wrap { overflow-x: auto; }
.jm-lines { width: 100%; min-width: 48rem; font-size: .875rem; }
.jm-lines th { padding: .5rem .75rem .5rem 0; font-weight: 500; color: #6b7280; text-align: start; border-bottom: 1px solid var(--line); }
.jm-lines td { padding: .5rem .75rem .5rem 0; border-bottom: 1px solid #f1f5f9; }
html.dark .jm-lines td { border-bottom-color: #1d293d; }
.jm-lines td select, .jm-lines td input { width: 100%; min-width: 0; }
.jm-lines td:nth-child(1) { min-width: 13.75rem; } .jm-lines td:nth-child(2) { min-width: 11.25rem; }
.jm-lines td:nth-child(3), .jm-lines td:nth-child(4), .jm-lines td:nth-child(5) { width: 8rem; } .jm-lines td:nth-child(6) { width: 5rem; }
.jm-add { display: inline-flex; align-items: center; gap: .375rem; }
.jm-sum { margin: 0; padding-top: .5rem; border-top: 2px solid var(--fg); font-size: .875rem; }
.jm-sum div { display: flex; justify-content: space-between; gap: 1rem; padding: .25rem 0; }
.jm-sum dt { color: #6b7280; } .jm-sum dd { margin: 0; font-variant-numeric: tabular-nums; }
.jm-sum .jm-ok, .jm-sum .jm-ok dt { color: #16a34a; font-weight: 500; } .jm-sum .jm-bad, .jm-sum .jm-bad dt { color: #dc2626; font-weight: 500; }
.jm-foot { display: flex; justify-content: space-between; align-items: center; }
.jm-foot-main { display: flex; gap: .75rem; }
.journal-drawer { width: 720px; }
.journal-drawer .drawer-head h2 { flex: 0 1 auto; }
.jd-actions { display: flex; gap: .5rem; margin-inline-start: auto; }
button.danger-soft { background: #fef2f2; color: #dc2626; border-color: transparent; }
html.dark button.danger-soft { background: rgba(127, 29, 29, .35); color: #f87171; border-color: transparent; }
.jd-reverse { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem; }
.jd-h { margin: 0 0 .5rem; font-size: .875rem; font-weight: 500; color: #6b7280; }
.jd-move { display: grid; grid-template-columns: 1fr auto 1fr; border: 1px solid #e5e7eb; border-radius: .5rem; overflow: hidden; }
html.dark .jd-move { border-color: #314158; }
.jd-side { padding: 1rem; }
.jd-from, .jd-arrow { background: #f9fafb; }
html.dark .jd-from, html.dark .jd-arrow { background: rgba(29, 41, 61, .6); }
.jd-arrow { display: flex; align-items: center; justify-content: center; padding: 0 1rem; color: #9ca3af; border-inline: 1px solid #e5e7eb; }
html.dark .jd-arrow { border-color: #314158; }
[dir='rtl'] .jd-arrow .icon { transform: scaleX(-1); }
.jd-name { margin-top: .125rem; font-size: 1rem; font-weight: 500; color: var(--fg); }
.jd-amount { margin-top: .75rem; font-size: 1.25rem; font-weight: 600; color: var(--fg); font-variant-numeric: tabular-nums; }
@media (max-width: 640px) { .jd-move { grid-template-columns: 1fr; } .jd-arrow { border-inline: 0; border-block: 1px solid #e5e7eb; padding: .25rem; } .jd-arrow .icon { transform: rotate(90deg); } }
.jd-rates { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: .5rem; border: 1px solid #e5e7eb; border-radius: .5rem; }
html.dark .jd-rates { border-color: #314158; }
.jd-rates > div { padding: .5rem .75rem; } .jd-rates > div + div { border-inline-start: 1px solid #e5e7eb; }
html.dark .jd-rates > div + div { border-color: #314158; }
.jd-rate { margin-top: .125rem; font-size: 1.125rem; font-weight: 600; color: var(--fg); font-variant-numeric: tabular-nums; }
.jd-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 0; }
.jd-facts dt { color: #6b7280; } .jd-facts dd { margin: .125rem 0 0; color: var(--fg); }
.jd-facts .jd-wide { grid-column: 1 / -1; }
.jd-settles { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .25rem; }
.jd-settles li { display: flex; justify-content: space-between; gap: 1rem; padding: .375rem 0; border-bottom: 1px solid #f1f5f9; }
.jd-settles li:last-child { border-bottom: 0; }
.jd-settles a { font-weight: 500; }
html.dark .jd-settles li { border-color: #1d293d; }
.jd-entry { border: 1px solid #e5e7eb; border-radius: .5rem; }
html.dark .jd-entry { border-color: #314158; }
.jd-entry-head { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 1rem; border-bottom: 1px solid #e5e7eb; }
html.dark .jd-entry-head { border-color: #314158; }
.jd-cols { display: grid; grid-template-columns: 1fr 1fr; }
.jd-cols > div { padding: .75rem 1rem; } .jd-cols > div + div { border-inline-start: 1px solid #e5e7eb; }
html.dark .jd-cols > div + div { border-color: #314158; }
@media (max-width: 640px) { .jd-cols { grid-template-columns: 1fr; } .jd-cols > div + div { border-inline-start: 0; border-top: 1px solid #e5e7eb; } }
.jd-col-h { margin-bottom: .5rem; color: #6b7280; }
.jd-line { display: flex; justify-content: space-between; gap: .75rem; padding: .375rem 0; }
.jd-line .num { text-align: end; white-space: nowrap; }
.jd-acc { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .75rem; }
.jd-total { display: flex; justify-content: space-between; margin-top: .5rem; padding-top: .5rem; border-top: 1px solid #e5e7eb; font-weight: 600; }
html.dark .jd-total { border-color: #314158; }
.jm-lines thead th, html.dark .jm-lines thead th { background: none; text-transform: none; letter-spacing: 0; font-size: .875rem; }
.journal-manual .required-mark::after, .fc-form .required-mark::after { color: #ef4444; }

/* прогноз (pages/forecast/index.vue оригинала): карточки разделов, срок карточками, остаток с правкой на месте, итоги прогноза */
.forecast-page { display: flex; flex-direction: column; gap: 1.5rem; }
.forecast-page h1 { margin-bottom: 0; }
.fc-card { padding: 1.5rem; border: 1px solid #e5e7eb; border-radius: .75rem; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
html.dark .fc-card { border-color: #314158; background: #1d293d; }
.fc-card h2 { margin: 0 0 1rem; font-size: 1.125rem; }
.fc-lead { margin: 0 0 1.5rem; font-size: 1.125rem; line-height: 1.75rem; }
.fc-features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
@media (max-width: 767px) { .fc-features { display: none; } }
.fc-feature { display: flex; align-items: flex-start; gap: .75rem; padding: 1rem; border-radius: .5rem; background: #f9fafb; }
html.dark .fc-feature { background: rgba(49, 65, 88, .5); }
.fc-feature h3 { margin: 0 0 .25rem; font-size: .875rem; font-weight: 600; color: var(--fg); }
.fc-feature p { margin: 0; font-size: .875rem; color: #6b7280; }
.fc-feature-icon, .fc-balance-icon { display: inline-flex; padding: .5rem; border-radius: .5rem; background: #f3f4f6; color: #4b5563; }
html.dark .fc-feature-icon, html.dark .fc-balance-icon { background: #314158; color: #cad5e2; }
.fc-feature-icon .icon { width: 1.25rem; height: 1.25rem; }
.fc-two { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
@media (max-width: 1023px) { .fc-two { grid-template-columns: 1fr; } }
.fc-periods { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.fc-period { display: flex; flex-direction: column; gap: .25rem; padding: 1rem; text-align: center; border: 2px solid #e5e7eb; border-radius: .5rem; background: none; }
.fc-period strong { font-size: 1rem; color: var(--fg); } .fc-period span { font-size: .75rem; color: #6b7280; }
.fc-period.current { border-color: var(--primary); background: rgba(34, 197, 94, .06); }
html.dark .fc-period { border-color: #314158; } html.dark .fc-period.current { border-color: var(--primary); }
.fc-balance { display: flex; align-items: center; gap: .75rem; padding: 1rem; border: 1px solid #e5e7eb; border-radius: .75rem; }
html.dark .fc-balance { border-color: #314158; }
.fc-balance-icon { border-radius: 9999px; } .fc-balance-icon .icon { width: 1.5rem; height: 1.5rem; }
.fc-balance-text { flex: 1; } .fc-balance-text p { margin: 0; }
.fc-balance-amount { font-size: 1.5rem; font-weight: 700; color: var(--fg); }
.fc-edit { display: inline-flex; align-items: center; gap: .25rem; }
.fc-balance-form { margin-top: .75rem; } .fc-balance-row { display: flex; gap: .5rem; } .fc-balance-row input { flex: 1; font-size: 1.125rem; font-weight: 600; }
.fc-table-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; }
.fc-table-head h3 { margin: 0; font-size: 1.125rem; font-weight: 600; color: var(--fg); } .fc-table-head p { margin: .25rem 0 0; font-size: .875rem; }
.fc-add { display: inline-flex; align-items: center; gap: .375rem; flex-shrink: 0; }
.fc-empty { padding: 3rem 0; text-align: center; } .fc-empty .icon { width: 4rem; height: 4rem; color: #9ca3af; }
.fc-empty h3 { margin: 1rem 0 .5rem; font-size: 1.125rem; font-weight: 500; color: var(--fg); } .fc-empty p { margin: 0; }
.fc-row-actions { display: flex; gap: .25rem; justify-content: flex-end; }
.fc-forecast { padding: 0; } .fc-forecast-head { padding: 1rem 1.5rem; border-bottom: 1px solid #e5e7eb; }
html.dark .fc-forecast-head { border-color: #314158; }
.fc-forecast-head h2 { margin: 0; } .fc-forecast-head p { margin: .25rem 0 0; font-size: .875rem; }
.fc-totals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; padding: 1.5rem 1.5rem 0; }
.fc-total { padding: 1rem; border-radius: .5rem; background: #f9fafb; } html.dark .fc-total { background: rgba(49, 65, 88, .5); }
.fc-total p { margin: 0; } .fc-total p + p { margin-top: .25rem; font-size: 1.5rem; font-weight: 700; color: var(--fg); }
.fc-total p.money-pos { color: #16a34a; } .fc-total p.money-neg { color: #dc2626; }
.fc-forecast .list-table-wrap { margin: 1.5rem; }
/* строки прогноза — как во всех таблицах, без своего синего фона у документов (владелец 2026-11-09) */
@media (max-width: 640px) { .fc-totals, .fc-periods { grid-template-columns: 1fr; } }
/* таблицы своих строк — рядом только на очень широком экране (2xl:grid-cols-2 оригинала) */
@media (max-width: 1535px) { .fc-two-wide { grid-template-columns: 1fr; } }

/* закрытие месяца (pages/month-close оригинала): шапка с месяцем, вкладки, полоса счётчиков, вопросы карточками, проводки, отправка */
.badge.info { background: #dbeafe; color: #1e40af; } html.dark .badge.info { background: #1e3a8a; color: #bfdbfe; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .75rem; }
.mc-page { display: flex; flex-direction: column; gap: 1.25rem; padding-bottom: 3rem; }
.mc-head { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1rem; }
.mc-head-title { flex: 1; min-width: 0; }
.mc-head h1 { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin: 0; }
.mc-head-title p { margin: .25rem 0 0; font-size: .875rem; }
.mc-period select { min-width: 12rem; }
.mc-tabs { display: flex; gap: 1.5rem; border-bottom: 1px solid var(--line); }
.mc-tabs button { padding: .625rem 0; margin-bottom: -1px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; font-size: .875rem; font-weight: 600; color: #6b7280; min-height: 2.75rem; }
.mc-tabs button.current { border-bottom-color: var(--primary); color: var(--fg); }
.mc-month { display: flex; flex-direction: column; gap: 1.25rem; }
.mc-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding: 1rem; border: 1px solid #e5e7eb; border-radius: .75rem; background: #fff; }
html.dark .mc-bar { border-color: #314158; background: var(--surface); }
.mc-bar-closed { border-color: #bbf7d0; background: rgba(240, 253, 244, .6); }
html.dark .mc-bar-closed { border-color: #14532d; background: rgba(5, 46, 22, .3); }
.mc-bar-closed > .icon { width: 1.25rem; height: 1.25rem; color: #15803d; }
.mc-closed-title { margin: 0; font-weight: 700; } .mc-bar-closed p { margin: 0; font-size: .875rem; }
.mc-counts { display: flex; flex-wrap: wrap; gap: .5rem; }
.mc-grow { flex: 1; min-width: 0; }
.mc-questions { display: flex; flex-direction: column; gap: 1rem; }
.mc-filters { display: flex; flex-wrap: wrap; gap: .5rem; }
.mc-count { opacity: .8; font-variant-numeric: tabular-nums; }
.mc-group { display: flex; flex-direction: column; gap: .5rem; }
.mc-group-head { display: flex; align-items: baseline; gap: .5rem; }
.mc-group-head h3 { margin: 0; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #374151; }
html.dark .mc-group-head h3 { color: #cad5e2; } .mc-group-head span { font-size: .75rem; }
.mc-qlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.mc-q { display: flex; flex-direction: column; gap: .5rem; padding: 1rem; border: 1px solid #e5e7eb; border-radius: .5rem; background: #fff; }
html.dark .mc-q { border-color: #314158; background: var(--surface); }
.mc-q-main { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .75rem; }
.mc-q-text { flex: 1; min-width: 0; } .mc-q-text p { margin: 0; font-size: .875rem; }
.mc-q-title { font-weight: 600; color: var(--fg); }
.mc-q-origin { margin-top: .25rem !important; font-size: .75rem !important; color: #6b7280; }
.mc-q-outcome { margin-top: .25rem !important; font-size: .75rem !important; }
.mc-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.mc-actions button { display: inline-flex; align-items: center; gap: .25rem; }
.mc-dismiss { display: flex; flex-direction: column; gap: .5rem; } .mc-dismiss label { font-size: .875rem; font-weight: 500; }
.mc-add { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem; }
.mc-card { border: 1px solid #e5e7eb; border-radius: .75rem; background: #fff; overflow: hidden; }
html.dark .mc-card { border-color: #314158; background: var(--surface); }
.mc-card-head { padding: .75rem 1rem; border-bottom: 1px solid #e5e7eb; } html.dark .mc-card-head { border-color: #314158; }
.mc-card-head h2 { margin: 0; font-size: 1rem; font-weight: 700; } .mc-card-head p { margin: .125rem 0 0; font-size: .75rem; }
.mc-posting { padding: .75rem 1rem; display: flex; flex-direction: column; gap: .5rem; }
.mc-posting + .mc-posting { border-top: 1px solid #f1f5f9; } html.dark .mc-posting + .mc-posting { border-color: #1d293d; }
.mc-posting-row { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; font-size: .875rem; }
.mc-fx { list-style: none; margin: 0; padding: 0; border: 1px solid #f1f5f9; border-radius: .5rem; font-size: .875rem; }
.mc-fx li { display: flex; justify-content: space-between; gap: .5rem; padding: .375rem .75rem; } .mc-fx li + li { border-top: 1px solid #f1f5f9; }
html.dark .mc-fx, html.dark .mc-fx li + li { border-color: #1d293d; }
.mc-vat { max-width: 28rem; font-size: .875rem; }
.mc-send { display: flex; flex-direction: column; gap: .75rem; }
.mc-send-head { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; } .mc-send-head h2 { margin: 0; font-size: 1.125rem; font-weight: 700; }
.mc-locked { margin: 0; padding: 1rem; border: 1px dashed #d1d5db; border-radius: .75rem; font-size: .875rem; } html.dark .mc-locked { border-color: #314158; }
.mc-send-card { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding: 1rem; font-size: .875rem; } .mc-send-card p { margin: 0 0 .25rem; }
/* выписки банка месяца (BankStatementsCard оригинала) и письмо бухгалтеру (SendSection оригинала, D-0119) */
.mc-stmts { padding: 1rem; display: flex; flex-direction: column; gap: .5rem; font-size: .875rem; }
.mc-stmts p { margin: 0; } .mc-stmts h3 { margin: 0; font-size: .875rem; font-weight: 700; } .mc-stmts-head p { font-size: .75rem; }
.mc-stmts-head { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .75rem; }
.mc-stmts-add { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; } .mc-stmts-add select { max-width: 16rem; }
/* выписки банка месяца — как BankStatementsCard оригинала: строки с линией между ними, значок, название цветом текста, размер справа */
.mc-stmt-list { list-style: none; margin: 0; padding: 0; }
.mc-stmt-list li { display: flex; align-items: center; gap: .625rem; padding: .5rem 0; min-width: 0; }
.mc-stmt-list li + li { border-top: 1px solid #f1f5f9; }
.mc-stmt-icon { width: 1rem; height: 1rem; flex: none; color: var(--muted); }
.mc-stmt-list .file-link { flex: 1; min-width: 0; border: 0; background: none; padding: 0; font: inherit; color: var(--text); text-align: start; overflow-wrap: anywhere; cursor: pointer; }
.mc-stmt-list .file-link:hover { text-decoration: underline; }
.mc-stmt-size { flex: none; font-size: .75rem; color: var(--muted); }
html.dark .mc-stmt-list li + li { border-color: #1d293d; }
.mc-sent { padding: 1rem; display: flex; flex-direction: column; gap: .5rem; font-size: .875rem; border-color: #b9f8cf; background: #f0fdf4; }
html.dark .mc-sent { border-color: #0d542b; background: #032e15; }
.mc-sent p { margin: 0; }
.mc-sent-dl { display: grid; grid-template-columns: minmax(8rem, max-content) minmax(0, 1fr); gap: .25rem 1rem; margin: 0; }
.mc-sent-dl dt { color: var(--muted); overflow-wrap: anywhere; } .mc-sent-dl dd { margin: 0; font-variant-numeric: tabular-nums; }
.mc-sent-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.mc-send-modal { max-width: 48rem; }
.mc-mail, .mc-archive { border: 1px solid #e5e7eb; border-radius: .75rem; overflow: hidden; font-size: .875rem; }
html.dark .mc-mail, html.dark .mc-archive { border-color: #314158; }
.mc-mail-cap { padding: .5rem 1rem; background: #f9fafb; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #4b5563; }
html.dark .mc-mail-cap { background: #1d293d; color: #cad5e2; }
.mc-mail-row { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding: .5rem 1rem; border-bottom: 1px solid #f1f5f9; }
.mc-mail-row > span:first-child { width: 4rem; } html.dark .mc-mail-row { border-color: #1d293d; }
.mc-mail-body { padding: .75rem 1rem; display: flex; flex-direction: column; gap: .75rem; } .mc-mail-body p { margin: 0; }
.mc-mail-h { font-weight: 600; }
.mc-mail-sum { width: 100%; max-width: 32rem; border: 1px solid #e5e7eb; font-variant-numeric: tabular-nums; } html.dark .mc-mail-sum { border-color: #314158; }
.mc-attention { padding: .5rem .75rem; border: 1px solid #fee685; border-radius: .5rem; background: #fffbeb; }
html.dark .mc-attention { border-color: #7b3306; background: #461901; }
.mc-attention ul { margin: .25rem 0 0; padding-inline-start: 1.25rem; }
.mc-archive { margin-top: .75rem; }
.mc-archive-head { padding: .5rem 1rem; border-bottom: 1px solid #e5e7eb; font-weight: 700; overflow-wrap: anywhere; } html.dark .mc-archive-head { border-color: #314158; }
.mc-archive ul { list-style: none; margin: 0; padding: .5rem 0; font-size: .75rem; }
.mc-archive li { display: flex; justify-content: space-between; gap: .75rem; padding: .25rem 1rem; }
.mc-report { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; margin: .5rem 0; } .mc-report div { display: flex; gap: .375rem; }
.mc-report dt { color: #6b7280; } .mc-report dt::after { content: ':'; } .mc-report dd { margin: 0; }
.mc-events-title { margin: 0; padding: .5rem 1rem; border-bottom: 1px solid #e5e7eb; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
html.dark .mc-events-title { border-color: #314158; }
.mc-events { list-style: none; margin: 0; padding: 0; font-size: .875rem; }
.mc-events li { display: flex; flex-wrap: wrap; gap: .75rem; padding: .5rem 1rem; } .mc-events li + li { border-top: 1px solid #f1f5f9; }
.mc-events li > span:first-child { width: 9rem; font-variant-numeric: tabular-nums; } html.dark .mc-events li + li { border-color: #1d293d; }

/* окно вопросов месяца в шапке (QuestionsButton оригинала, max-w-lg) */
.hq-modal { max-width: 32rem; }
.hq-modal .modal-foot { justify-content: flex-end; }
.hq-spinner { width: 2rem; height: 2rem; margin: 2rem auto; border-radius: 9999px; border: 2px solid transparent; border-bottom-color: var(--primary); animation: hq-spin 1s linear infinite; }
@keyframes hq-spin { to { transform: rotate(360deg); } }
.hq-empty { padding: 1.5rem 0; text-align: center; font-size: .875rem; margin: 0; }
.hq-list { list-style: none; margin: -.5rem 0; padding: 0; max-height: 60vh; overflow-y: auto; }
.hq-list li { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; padding: .75rem 0; }
.hq-list li + li { border-top: 1px solid #f1f5f9; } html.dark .hq-list li + li { border-color: #1d293d; }
.hq-text { flex: 1; min-width: 0; } .hq-text p { margin: 0; font-size: .875rem; line-height: 1.35; color: var(--fg); }
.hq-text .hq-desc { margin-top: .25rem; font-size: .75rem; font-style: italic; color: #6b7280; }
.hq-forward { display: inline-flex; align-items: center; gap: .25rem; flex-shrink: 0; }

/* основные средства (pages/expenses/fixed-assets оригинала) */
.fa-page { display: flex; flex-direction: column; gap: 1rem; }
.fa-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; padding: .75rem 1rem; border: 1px solid #e5e7eb; border-radius: .5rem; background: #fff; }
html.dark .fa-toolbar { border-color: #314158; background: #1d293d; }
.fa-grow { flex: 1; }
.fa-explain { padding: 1rem 1.25rem; border: 1px solid #e5e7eb; border-radius: .5rem; font-size: .875rem; } html.dark .fa-explain { border-color: #314158; }
.fa-explain h2 { margin: 0 0 .5rem; font-size: 1rem; } .fa-explain p { margin: 0 0 .5rem; }
.fa-facts { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem 1rem; margin: 0; }
.fa-facts dt { color: #6b7280; font-size: .8125rem; } .fa-facts dd { margin: .125rem 0 0; font-weight: 500; color: var(--fg); }
.fa-warn { margin: 0; padding: .75rem 1rem; border-radius: .5rem; background: #fef3c7; color: #92400e; font-size: .875rem; }
html.dark .fa-warn { background: rgba(120, 53, 15, .4); color: #fde68a; }
.fa-history { width: 100%; font-size: .875rem; }
.fa-dispose { display: flex; flex-direction: column; gap: .75rem; padding-top: .5rem; border-top: 1px solid var(--line); } .fa-dispose h3 { margin: 0; font-size: 1rem; }
.fa-form { display: flex; flex-direction: column; gap: .75rem; }
/* подтверждение долей бухгалтером в карточке счёта (#647) */
.rates-approval { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; font-size: .875rem; }

/* окно «подключить канал» лидов (LeadChannelConnectPopup оригинала) */
.lead-connect { max-width: 40rem; }
.lead-connect .modal-body { display: grid; gap: 1rem; }
.lead-connect .field { margin: 0; }
.lc-copy { display: flex; gap: .5rem; align-items: center; }
.lc-copy input { flex: 1; min-width: 0; }
.lc-copy input.mono, .lc-url, .lc-sample { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.lc-url { flex: 1; min-width: 0; padding: .5rem .75rem; border: 1px solid #e2e8f0; border-radius: .375rem; background: #f8fafc; font-size: .875rem; word-break: break-all; }
html.dark .lc-url, html.dark .lc-sample, html.dark .lc-note { background: #0f172b; border-color: #314158; }
.lead-connect p.small { font-size: .75rem; margin: .25rem 0 0; }
.lc-title { font-size: .875rem; font-weight: 600; margin: 0 0 .5rem; }
.lc-steps { margin: 0; padding-inline-start: 1.25rem; font-size: .875rem; display: grid; gap: .25rem; }
.lc-sample { margin: 0; overflow-x: auto; padding: .75rem; border: 1px solid #e2e8f0; border-radius: .5rem; background: #f8fafc; font-size: .75rem; white-space: pre; }
.lc-note { padding: .75rem; border: 1px solid #e2e8f0; border-radius: .5rem; background: #f8fafc; font-size: .875rem; }

/* карточка лида как у оригинала (сверка 2026-11-09, OSD-E2E): неактивная вкладка — серая 500; статус и ответственный в шапке — UButton xs
   (32px, 12px); кнопки подвала — 32px (6px 10px), Cancel и Remove без фона и в тёмной теме; «+ Add» — обычного веса */
.lead-tab { padding: 1rem; color: #6b7280; font-weight: 500; }
.lead-tab.current { font-weight: 700; }
.lead-top-tools .sel-trigger { min-height: 0; height: 2rem; padding: .5rem 2rem .5rem .75rem; font-size: .75rem; line-height: 1rem; }
.lead-foot button { padding: .375rem .625rem; line-height: 1.25rem; font-size: .875rem; }
html .lead-foot button.outline, html.dark .lead-foot button.outline, html .lead-foot button.ghost-danger, html.dark .lead-foot button.ghost-danger { background: none; }
html .lead-details button.lead-add, html.dark .lead-details button.lead-add { font-weight: 400; }

/* ——— Настройки бизнеса /settings (#639 оригинала: pages/settings/index.vue, SettingsTabPanel, SettingsSection; D-0124) ——— */
.set-page { max-width: none; }
.set-top { position: sticky; top: 3.5rem; z-index: 20; margin: -1rem -1rem 1.25rem; padding: 1rem 1rem 0; background: var(--canvas); }
.set-top-card { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding: 0 1rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); box-shadow: var(--shadow); }
.set-tabs { display: flex; flex: 1 1 0; min-width: 0; gap: 1.5rem; overflow-x: auto; margin-bottom: -1px; }
.set-tabs .tab, html.dark .set-tabs .tab { display: inline-flex; align-items: center; gap: .5rem; flex-shrink: 0; padding: 1rem .25rem; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none;
  color: var(--muted); font-size: .875rem; font-weight: 500; white-space: nowrap; cursor: pointer; }
.set-tabs .tab:hover { color: var(--text); border-bottom-color: var(--line-strong); }
.set-tabs .tab.current, html.dark .set-tabs .tab.current { color: var(--primary); border-bottom-color: var(--primary); }
.set-dot { display: inline-block; width: .5rem; height: .5rem; border-radius: 9999px; background: var(--primary); flex-shrink: 0; }
.set-search { position: relative; display: flex; align-items: center; width: 100%; max-width: 15rem; margin: .5rem 0; }
.set-search .icon { position: absolute; inset-inline-start: .625rem; width: 1rem; height: 1rem; color: var(--muted); pointer-events: none; }
.set-search input { width: 100%; min-width: 0; padding-inline: 2rem 2rem; }
.set-search kbd { position: absolute; inset-inline-end: .5rem; padding: 0 .375rem; border: 1px solid var(--line-strong); border-radius: .25rem; font-size: .6875rem; line-height: 1.125rem; color: var(--muted); }
.set-results { position: absolute; top: calc(100% + .25rem); inset-inline-start: 0; z-index: 30; width: 20rem; max-width: 80vw; max-height: 22rem; overflow-y: auto; padding: .25rem;
  border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1); }
.set-result, html.dark .set-result { display: flex; flex-direction: column; align-items: flex-start; gap: .125rem; width: 100%; padding: .5rem .625rem; border: 0; border-radius: .375rem; background: none; text-align: start; color: var(--fg); cursor: pointer; }
.set-result:hover, html.dark .set-result:hover { background: var(--hover); }
.set-result strong { font-size: .875rem; font-weight: 500; }
.set-result small { font-size: .75rem; color: var(--muted); }
.set-nothing { margin: 0; padding: .5rem .625rem; font-size: .875rem; color: var(--muted); }
.set-body { display: flex; flex-direction: column; gap: 1.25rem; }
.set-nav { display: flex; gap: .25rem; overflow-x: auto; padding: .375rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); box-shadow: var(--shadow); }
.set-nav-title { display: none; margin: 0; padding: .5rem .625rem .25rem; font-size: .6875rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: #9ca3af; }
.set-nav-link { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: .5rem; padding: .5rem .625rem; border-radius: .375rem; white-space: nowrap; text-decoration: none; }
.set-nav-link:hover { background: var(--hover); text-decoration: none; }
.set-nav-label { font-size: .875rem; font-weight: 500; color: var(--text); }
.set-nav-hint { display: none; grid-column-start: 1; overflow: hidden; text-overflow: ellipsis; font-size: .75rem; color: var(--muted); }
.set-nav-side { grid-column-start: 2; grid-row: 1 / span 2; align-self: center; display: flex; align-items: center; gap: .375rem; }
.set-nav-link.current { background: rgba(46, 211, 138, .1); }
.set-nav-link.current .set-nav-label { font-weight: 600; color: #047857; }
html.dark .set-nav-link.current { background: rgba(46, 211, 138, .15); }
html.dark .set-nav-link.current .set-nav-label { color: var(--primary); }
.set-main { flex: 1 1 auto; min-width: 0; }
.set-sections { display: flex; flex-direction: column; gap: 1.25rem; }
.set-section { scroll-margin-top: 8rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); box-shadow: var(--shadow); transition: box-shadow .3s; }
.set-section.flash { box-shadow: 0 0 0 2px var(--primary); }
.set-section > header { padding: 1rem 1.25rem; border-bottom: 1px solid var(--line); }
.set-section > header h2 { margin: 0; font-size: 1rem; font-weight: 600; color: var(--fg); }
.set-section > header p { margin: .125rem 0 0; font-size: .875rem; color: var(--muted); }
.set-section-body { display: flex; flex-direction: column; gap: 1.5rem; padding: 1.25rem; }
.set-section-body > p { margin: 0; font-size: .875rem; }
.set-group { margin: 0; font-size: .6875rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.set-group.dashed { padding-top: 1.25rem; border-top: 1px dashed var(--line); }
.set-sub { margin: 0; font-size: .875rem; font-weight: 600; color: var(--fg); }
.set-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
.set-grid .field input, .set-grid .field select, .set-section-body .field textarea { width: 100%; min-width: 0; }
.set-narrow { max-width: 32rem; }
.set-narrow input, .set-narrow select { width: 100%; }
.set-section .field { gap: .25rem; }
.set-section .hint, .set-check .hint { font-size: .75rem; color: var(--muted); margin: 0; }
.set-section .field .error { font-size: .75rem; color: var(--danger); }
.set-section label.req::after { content: '*'; margin-inline-start: .125rem; color: #ef4444; }
.set-section [data-field].flash { border-radius: .375rem; box-shadow: 0 0 0 2px var(--primary), 0 0 0 6px var(--surface); }
.set-help { display: inline-flex; align-items: center; justify-content: center; width: 1rem; height: 1rem; margin-inline-start: .375rem; border: 1px solid #9ca3af; border-radius: 9999px; font-size: .625rem; line-height: 1; color: var(--muted); cursor: help; }
.set-page .check { display: flex; align-items: flex-start; gap: .5rem; font-size: .875rem; font-weight: 500; color: var(--text); cursor: pointer; }
.set-page .check input { margin-top: .125rem; flex-shrink: 0; }
.set-check { display: flex; flex-direction: column; gap: .25rem; }
.set-check .hint { padding-inline-start: 1.5rem; }
.set-radios { display: flex; flex-direction: column; gap: .5rem; margin: 0; padding: 0; border: 0; }
.set-radios legend { margin-bottom: .5rem; padding: 0; font-size: .875rem; font-weight: 500; color: var(--text); }
.set-subsection { display: flex; flex-direction: column; gap: .75rem; padding-top: 1.25rem; border-top: 1px dashed var(--line); }
.set-subsection h3 { margin: 0; font-size: .875rem; font-weight: 600; color: var(--fg); }
.set-subsection > button { align-self: flex-start; }
.set-table { overflow-x: auto; border: 1px solid var(--line); border-radius: .5rem; }
.set-table table { width: 100%; min-width: 30rem; font-size: .875rem; border-collapse: collapse; }
.set-table th { padding: .5rem .75rem; text-align: start; font-size: .875rem; font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--muted); background: var(--canvas); }
.set-table td { padding: .5rem .75rem; border-top: 1px solid var(--line); color: var(--text); vertical-align: middle; }
.set-table .end { text-align: end; }
.set-table td input:not([type='checkbox']) { width: 100%; min-width: 5rem; }
.set-row-actions { display: inline-flex; gap: .25rem; justify-content: flex-end; }
.set-page label.button, html.dark .set-page label.button { background: transparent; display: inline-flex; align-items: center; padding: .3125rem .625rem; border: 1px solid var(--field-line); border-radius: .375rem; font-size: .875rem; font-weight: 500; color: var(--text-default); cursor: pointer; }
.set-page label.button.ghost { border-color: transparent; }
.set-page label.button:hover { background: var(--hover); }
.set-doc-add { display: flex; flex-direction: column; gap: .75rem; max-width: 42rem; }
/* документы компании (владелец 2026-11-09): «Add document» справа над таблицей, значок у названия, пустой список — рамкой по центру */
.set-docs-head { display: flex; justify-content: flex-end; margin-bottom: .75rem; }
/* панель Save форм — общий компонент savebar.js (владелец 2026-11-09: как в настройках — прилипает к низу окна, слева статус, справа
   кнопки, Save — последней и зелёной; есть несохранённое — зелёная рамка и точка) */
.savebar { position: sticky; bottom: .5rem; z-index: 10; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .75rem;
  margin-top: 1.25rem; padding: .75rem 1rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); box-shadow: var(--shadow); }
.savebar.dirty { border-color: rgba(46, 211, 138, .6); }
.savebar > * { order: 2; margin: 0; }
.savebar > .savebar-status { order: 0; flex: 1 1 12rem; display: flex; align-items: center; gap: .5rem; min-width: 0; font-size: .875rem; font-weight: 600; color: var(--fg); }
.savebar.dirty > .savebar-status::before { content: ''; flex: none; width: .5rem; height: .5rem; border-radius: 50%; background: var(--primary); }
.savebar > .ghost-danger, .savebar > .danger-outline { order: 1; }
.savebar > button[type='submit'] { order: 3; }
.savebar > .hint { order: 1; flex-basis: 100%; }
/* кнопки панели — одного размера на всех формах, как у лида (владелец 2026-11-13: «Save у лида красивенький, маленький» —
   у клиента был 38px и шире 7.5rem); цвета — свои у каждой формы */
.savebar > button, .savebar > .button { display: inline-flex; align-items: center; justify-content: center; gap: .375rem; height: auto; min-width: 0;
  padding: .375rem .625rem; line-height: 1.25rem; font-size: .875rem; font-weight: 500; box-sizing: border-box; }
/* подблок раздела настроек со своим заголовком (бухгалтер в «Notifications») — отделён линией */
.set-subblock { display: flex; flex-direction: column; gap: .75rem; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.set-subblock h3 { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: 1rem; font-weight: 600; }
.set-subblock h3 .icon { width: 1.25rem; height: 1.25rem; color: var(--primary); }
.set-subblock .hint { margin: 0; color: var(--muted); font-size: .875rem; }
.set-docs-head button { display: inline-flex; align-items: center; gap: .375rem; }
.set-doc-name { display: inline-flex; align-items: center; gap: .5rem; min-width: 0; }
.set-doc-name > .icon { flex: none; width: 1.25rem; height: 1.25rem; color: var(--primary); }
.set-docs-empty { display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: 2rem 1rem; border: 1px dashed var(--line-strong); border-radius: .5rem; text-align: center; }
.set-docs-empty > .icon { width: 2rem; height: 2rem; color: var(--muted); }
.set-docs-empty small { color: var(--muted); }
.set-doc-add input { flex: 1 1 auto; min-width: 0; }
.set-doc-add button { display: inline-flex; align-items: center; gap: .375rem; align-self: flex-start; }
.set-page button .icon { width: 1.25rem; height: 1.25rem; }
.set-images { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
.set-image { display: flex; gap: 1rem; align-items: flex-start; }
.set-image-box { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 8rem; height: 5rem; overflow: hidden; border: 1px dashed var(--line-strong); border-radius: .5rem; background: var(--canvas); font-size: .75rem; }
.set-image-box img { max-width: 100%; max-height: 100%; object-fit: contain; }
/* логотип и подпись — как у оригинала (владелец 2026-11-09): каждый блоком в рамке, кнопки с иконками, удаление — красная кнопка-корзина;
   подпись в тёмной теме — светлой линией (тёмные чернила на прозрачном фоне в тёмной рамке не видны) */
.set-image { padding: 1rem; border: 1px solid var(--line); border-radius: .5rem; }
.set-image-actions .button, .set-image-actions button { display: inline-flex; align-items: center; gap: .375rem; }
.set-image-actions .icon { width: 1.125rem; height: 1.125rem; }
.set-image-del, html.dark .set-image-del { padding: .375rem .5rem; border: 1px solid rgba(239, 68, 68, .5); background: rgba(239, 68, 68, .1); color: #ef4444; }
.set-image-del:hover:not(:disabled) { background: rgba(239, 68, 68, .2); }
html.dark .set-image-sig img { filter: invert(1) hue-rotate(180deg); }
.set-image-text { display: flex; flex-direction: column; gap: .25rem; font-size: .875rem; }
.set-image-text small { color: var(--muted); font-size: .75rem; }
.set-image-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.set-alert { display: flex; gap: .625rem; align-items: flex-start; padding: .75rem 1rem; border-radius: .5rem; font-size: .875rem; }
.set-alert.warning { background: #fffbeb; color: #92400e; }
html.dark .set-alert.warning { background: rgba(245, 158, 11, .1); color: #fcd34d; }
.set-alert .icon { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }
.set-alert p { margin: 0; color: inherit; }
.set-alert a, .set-disabled-link { color: inherit; text-decoration: underline; }
.set-disabled-link { opacity: .6; cursor: not-allowed; }
.set-faq { border: 1px solid var(--line); border-radius: .5rem; }
.set-faq summary { padding: 1rem; font-size: 1.125rem; font-weight: 600; color: var(--fg); cursor: pointer; }
.set-faq p { margin: 0; padding: 0 1rem 1rem; font-size: .875rem; }
.set-stripe { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; }
.set-stripe p { margin: 0; font-size: .875rem; }
.set-badge { display: inline-flex; align-items: center; padding: .125rem .5rem; border-radius: .375rem; font-size: .75rem; font-weight: 500; }
.set-badge.off { background: var(--panel); color: var(--text); }
.set-badge.on { background: rgba(46, 211, 138, .15); color: #047857; }
html.dark .set-badge.on { color: var(--primary); }
.set-savebar-wrap { position: sticky; bottom: 0; z-index: 10; margin-top: 1.25rem; padding-bottom: .25rem; pointer-events: none; }
.set-savebar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding: .75rem 1rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); box-shadow: var(--shadow); pointer-events: auto; }
.set-savebar.dirty { border-color: rgba(46, 211, 138, .6); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1); }
.set-savebar-text { flex: 1 1 14rem; min-width: 0; }
.set-savebar-text p { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: .875rem; }
.set-savebar-text p:first-child { font-weight: 600; color: var(--fg); }
.set-savebar kbd { padding: 0 .375rem; border: 1px solid var(--line-strong); border-radius: .25rem; font-size: .6875rem; color: var(--muted); }
.set-page .set-save, html.dark .set-page .set-save { min-width: 6.875rem; justify-content: center; padding: .5rem .75rem; border: 0; border-radius: .375rem; background: rgba(46, 211, 138, .1); color: #047857; font-size: .875rem; font-weight: 500; }
html.dark .set-page .set-save { color: var(--primary); }
.set-page .set-savebar.dirty .set-save, html.dark .set-page .set-savebar.dirty .set-save { background: var(--primary); color: #fff; }
.set-page .signature-pad { width: 100%; height: auto; border: 1px dashed var(--line-strong); border-radius: .5rem; background: #fff; touch-action: none; }
/* телефон: вкладки — своей строкой с прокруткой, поиск — строкой ниже на всю ширину (w-full sm:w-auto оригинала); пункты меню разделов не сжимаются */
.set-tabs { flex-basis: 100%; }
.set-search { max-width: none; }
.set-nav-link { flex-shrink: 0; }
@media (min-width: 640px) { .set-tabs { flex-basis: 0; } .set-search { width: auto; max-width: 15rem; } }
@media (min-width: 768px) {
  .set-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .set-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .set-grid .field.wide { grid-column: span 2; }
  .set-images { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .set-doc-add { flex-direction: row; align-items: flex-start; }
}
@media (min-width: 1024px) {
  .set-body { flex-direction: row; align-items: flex-start; }
  .set-nav { position: sticky; top: 9rem; flex-direction: column; width: 15rem; flex-shrink: 0; overflow: visible; }
  .set-nav-title, .set-nav-hint { display: block; }
}
/* пользователь бизнеса /settings/users/{id} (pages/settings/users/[id].vue оригинала) */
.user-card { max-width: none; }
.user-tabs { padding: 0 1rem; border-bottom: 1px solid var(--line); gap: 1rem; }
.user-tabs .tab .icon { width: 1.25rem; height: 1.25rem; }
.user-tabs .tab { gap: .75rem; padding: 1rem; }
.user-form, .user-security, .user-permissions { display: flex; flex-direction: column; gap: 1.5rem; }
.user-actions { display: flex; gap: .75rem; }
.user-actions > * { min-width: 7.5rem; justify-content: center; text-align: center; }
.set-page a.button { display: inline-flex; align-items: center; padding: .5rem 1rem; border-radius: .375rem; background: var(--panel); color: var(--text-default); font-size: .875rem; font-weight: 500; text-decoration: none; }
.set-alert.info { background: #eff6ff; color: #1e40af; }
html.dark .set-alert.info { background: rgba(59, 130, 246, .1); color: #93c5fd; }
.role-cards { display: grid; grid-template-columns: 1fr; gap: .75rem; }
.role-card { display: flex; gap: .75rem; align-items: flex-start; padding: 1rem; border: 1px solid var(--line); border-radius: .5rem; cursor: pointer; }
.role-card.current { border-color: var(--primary); background: rgba(46, 211, 138, .06); }
.role-card input { margin-top: .2rem; }
.role-card span { display: flex; flex-direction: column; gap: .25rem; }
.role-card small { font-size: .75rem; color: var(--muted); font-weight: 400; }
@media (min-width: 768px) { .role-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.catalog-foot { justify-content: space-between; }
.modal label.req::after { content: '*'; margin-inline-start: .125rem; color: #ef4444; }
/* интеграции и мои бизнесы: вкладки с кнопкой справа, меню строки «•••» на <details> */
.int-tabs { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--line); margin-bottom: 1rem; }
.int-tabs .set-tabs { flex: 0 1 auto; }
.int-create { display: inline-flex; align-items: center; gap: .375rem; }
.int-menu { position: relative; display: inline-block; }
.int-menu summary { list-style: none; cursor: pointer; }
.int-menu summary::-webkit-details-marker { display: none; }
.int-menu-panel { position: absolute; inset-inline-end: 0; top: 100%; z-index: 30; display: flex; flex-direction: column; min-width: 10rem; padding: .25rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1); }
.int-menu-panel > button, .int-menu-panel > a, html.dark .int-menu-panel > button { display: block; padding: .375rem .625rem; border: 0; border-radius: .375rem; background: none; text-align: start; font-size: .875rem; color: var(--text); text-decoration: none; }
.int-menu-panel > button:hover, .int-menu-panel > a:hover { background: var(--hover); }
.int-scopes { display: flex; flex-direction: column; gap: .375rem; margin: 0; padding: 0; border: 0; max-height: 16rem; overflow-y: auto; }
.int-scopes legend { margin-bottom: .375rem; font-size: .875rem; font-weight: 500; }
.biz-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding: .75rem 1rem; }
.biz-filters .chips { display: inline-flex; gap: .25rem; }
.biz-filters .chip { padding: .25rem .75rem; border: 1px solid var(--line); border-radius: .375rem; background: none; font-size: .875rem; color: var(--text); }
.biz-filters .chip.current { border-color: var(--primary); color: var(--primary); }

/* настройки лидов вкладками (владелец 2026-11-09): панель вкладки — слева статус новых лидов, справа «New»; таблица; окна правки */
.ls-tabs { margin-bottom: 1rem; }
.ls-pane { display: grid; gap: .75rem; }
.ls-bar { display: flex; align-items: flex-end; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.ls-default { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.ls-default label { font-size: .875rem; font-weight: 500; }
.ls-default select { min-width: 12rem; }
.ls-new { display: inline-flex; align-items: center; gap: .375rem; margin-inline-start: auto; }
.ls-new .icon { width: 1rem; height: 1rem; }
.ls-pane p.small { font-size: .75rem; margin: 0; }
.ls-table td { vertical-align: middle; }
.ls-actions { text-align: end; white-space: nowrap; }
.ls-actions button + button { margin-inline-start: .375rem; }
.ls-dot { display: inline-block; width: .625rem; height: .625rem; margin-inline-end: .5rem; vertical-align: middle; }
.ls-empty { text-align: center; padding: 1.5rem; }
.ls-howto { display: grid; gap: .75rem; margin-top: 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); }
.ls-howto h2 { margin: 0; font-size: 1rem; }
.ls-howto .field { margin: 0; }
.ls-modal { max-width: 32rem; }
.ls-form { display: grid; gap: .75rem; }
.ls-form .field { margin: 0; }
.ls-pair { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
@media (max-width: 640px) { .ls-bar { align-items: stretch; } .ls-new { margin-inline-start: 0; } }

.ls-pane p.warn { margin: 0; padding: .5rem .75rem; border-radius: .375rem; background: #fef3c7; color: #92400e; font-size: .875rem; }
html.dark .ls-pane p.warn { background: #78350f; color: #fde68a; }

/* ---- страница подписанта /e-signature/public (pages/e-signature/public/[tenantId]/[token].vue оригинала, D-0127): шапка и подвал —
   как у кабинета клиента, карточка max-w-5xl со скруглением и тенью, шаги плашками (текущий — emerald-100), поля в столбец (space-y-3),
   главная кнопка во всю ширину, вторичная — мягкая, «Back» — без фона ---- */
main.es-public { max-width: 64rem; }
.es-public .es-card { flex: none; margin-top: 1.5rem; padding: 1.5rem; border: 1px solid #e5e7eb; border-radius: .75rem; color: #111827; }
.es-public .es-preview-note { margin-top: 1.5rem; padding: .75rem 1rem; border: 1px solid #fcd34d; border-radius: .75rem; background: #fffbeb; color: #78350f; font-size: .875rem; }
.es-public .es-preview-note p { margin: .125rem 0 0; color: #78350f; }
.es-public .es-center { padding: 3rem 0; text-align: center; }
.es-public .es-h1 { margin: 0 0 .25rem; font-size: 1.25rem; font-weight: 600; color: #111827; }
.es-public .es-center .es-h1 { font-size: 1.125rem; margin-bottom: .5rem; }
.es-public .es-h2 { margin: 0; font-size: 1.125rem; font-weight: 600; }
.es-public .es-subtitle { margin: 0 0 1rem; font-size: .875rem; color: #6b7280; }
.es-public .es-steps { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.25rem; padding: 0; list-style: none; font-size: .75rem; }
.es-public .es-steps li { padding: .25rem .5rem; border-radius: .25rem; background: #f3f4f6; color: #6b7280; }
.es-public .es-steps li.current { background: #d1fae5; color: #064e3b; font-weight: 500; }
.es-public .es-letter { margin-bottom: 1.25rem; padding: 1.5rem; border: 1px solid #e5e7eb; border-radius: .25rem; background: #fff; color: #111827; overflow-wrap: anywhere; }
/* письмо подписанта как в PDF (SigningLetter оригинала): шапка бизнеса — логотип и реквизиты, подпись бизнеса под текстом */
.es-public .es-letter .company-header-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem; padding-bottom: .75rem; margin-bottom: 1.25rem; border-bottom: 1px solid #e5e7eb; }
.es-public .es-letter .company-logo-container img { max-height: 72px; max-width: 220px; }
.es-public .es-letter .company-info-section { text-align: end; font-size: .8125rem; line-height: 1.35; color: #374151; }
.es-public .es-letter .company-info-section h3 { margin: 0 0 .125rem; font-size: .95rem; font-weight: 600; color: #111827; }
.es-public .es-letter .company-info-section p { margin: 0; }
.es-public .es-letter .company-signature { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; margin-top: 1.5rem; padding-top: .75rem; border-top: 1px solid #e2e8f0; }
.es-public .es-letter .company-signature img { max-height: 80px; max-width: 220px; }
/* карточка подписанта всегда светлая, и в тёмной теме приложения (у оригинала — bg-white, text-gray-900): токены и таблицы текста — светлые */
.es-public .es-card { --fg: #111827; --text: #374151; --muted: #6b7280; --line: #e5e7eb; --line-strong: #d1d5db; --canvas: #f9fafb; --panel: #f3f4f6;
  --surface: #fff; --soft-line: #f3f4f6; --accent: #059669; background: #fff; color-scheme: light; }
html.dark .es-public .es-card th { background: #f9fafb; color: #111827; }
html.dark .es-public .es-card td, html.dark .es-public .es-card tr { background: #fff; color: #111827; }
html.dark .es-public .es-card input[type=checkbox] { color-scheme: light; background: #fff; border-color: #d1d5db; }
.es-public fieldset.es-form { margin: 0; padding: 0; border: 0; min-width: 0; }
.es-public fieldset.es-form:disabled input:not([type=checkbox]) { background: #f3f4f6; }
.es-public .es-form, .es-public .es-stack { display: flex; flex-direction: column; gap: .75rem; }
.es-public .es-form .field { display: flex; flex-direction: column; gap: .25rem; margin: 0; }
.es-public .es-form label { font-size: .875rem; font-weight: 500; color: #374151; }
.es-public .es-form input:not([type=checkbox]):not([type=file]), .es-public select { width: 100%; box-sizing: border-box; padding: .5rem .75rem; font-size: .875rem;
  background: #fff; color: #111827; border: 1px solid #d1d5db; border-radius: .375rem; }
.es-public .es-two { display: grid; gap: .75rem; }
@media (min-width: 640px) { .es-public .es-two { grid-template-columns: 1fr 1fr; } }
.es-public .es-block { width: 100%; justify-content: center; }
.es-public button.qp-btn { padding: .625rem 1rem; border: 0; border-radius: .375rem; background: #2ed38a; color: #0f172b; font-size: .875rem; font-weight: 600; cursor: pointer; }
.es-public button.qp-btn:hover { background: #20b874; }
.es-public button.qp-soft { padding: .5rem 1rem; border: 0; border-radius: .375rem; background: #f1f5f9; color: #334155; font-size: .875rem; font-weight: 500; cursor: pointer; }
.es-public button.qp-soft:hover { background: #e2e8f0; }
.es-public button.es-ghost { padding: .5rem 1rem; border: 0; background: none; color: #475569; font-size: .875rem; cursor: pointer; }
.es-public button.es-ghost:hover { background: #f8fafc; }
.es-public .es-small { font-size: .75rem; margin: 0; }
.es-public .es-status { padding: .75rem; border: 1px solid #e5e7eb; border-radius: .25rem; font-size: .875rem; background: #f9fafb; }
.es-public .es-status.ok { border-color: #86efac; background: #f0fdf4; color: #166534; }
.es-public .es-status.bad { border-color: #fca5a5; background: #fef2f2; color: #991b1b; }
.es-public .es-consent { display: flex; flex-direction: column; gap: .5rem; font-size: .875rem; }
.es-public .es-consent label.check { display: flex; align-items: flex-start; gap: .5rem; font-weight: 400; }
.es-public .es-methods { display: grid; gap: .75rem; }
@media (min-width: 640px) { .es-public .es-methods { grid-template-columns: 1fr 1fr; } }
.es-public button.es-method { display: flex; flex-direction: column; align-items: flex-start; gap: .25rem; padding: .75rem; border: 1px solid #e5e7eb; border-radius: .5rem;
  background: #fff; color: #111827; text-align: start; cursor: pointer; }
.es-public button.es-method.current { border-color: #2ed38a; box-shadow: 0 0 0 1px #2ed38a; background: #f0fdf4; }
.es-public .es-pad-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: .25rem; }
.es-public .es-pad-wrap .signature-pad { max-width: 100%; margin: 0; }
.es-public .es-schedule { width: 100%; border: 1px solid #e5e7eb; border-radius: .25rem; border-collapse: collapse; font-size: .875rem; }
/* реквизиты перевода шага проформы на странице подписанта (191 17.6) */
.es-public .es-bank { display: grid; gap: .25rem; margin: 0; font-size: .875rem; }
.es-public .es-bank div { display: flex; justify-content: space-between; gap: 1rem; }
.es-public .es-bank dt { color: #6b7280; }
.es-public .es-bank dd { margin: 0; font-weight: 600; }
/* предупреждение о прошедших датах графика на карточке документа подписи (603 TC-7) */
.esign-past-dates { display: flex; align-items: flex-start; gap: .5rem; margin: 0 0 1rem; padding: .5rem .75rem; border: 1px solid #fcd34d; border-radius: .375rem; background: #fffbeb; color: #92400e; font-size: .875rem; }
.esign-past-dates .icon { flex: none; width: 1.25rem; height: 1.25rem; }
html.dark .esign-past-dates { border-color: #b45309; background: rgba(120, 53, 15, .3); color: #fcd34d; }
.es-public .es-schedule caption { text-align: start; font-weight: 500; padding-bottom: .5rem; }
.es-public .es-schedule td { padding: .375rem .75rem; border-top: 1px solid #f3f4f6; }
.es-public .es-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin: 1rem 0 .75rem; }
.es-public .es-preview-brand { margin-bottom: 1rem; }
.es-public button.qp-soft.es-preview-pdf { display: inline-flex; align-items: center; gap: .375rem; margin-top: 1.25rem; background: #0f172b; color: #fff; }
.es-public button.qp-soft.es-preview-pdf:hover { background: #1d293d; }
.es-public .es-preview-pdf .icon { width: 1rem; height: 1rem; }
main.wide-page .es-public.es-preview { max-width: 64rem; }
/* интеграции: вкладка Integrations (карточки ИИ-ассистентов, адрес MCP, инструкция в боковой панели), Connected apps — D-0128 */
.int-url { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: .75rem 0 1rem; font-size: .875rem; }
.int-url code { padding: .25rem .5rem; border: 1px solid var(--line); border-radius: .375rem; background: var(--canvas); word-break: break-all; }
/* ссылка на справочник API (Swagger) во вкладке API keys — карточка как у каталога интеграций */
.int-docs, html.dark .int-docs { display: flex; align-items: center; gap: .75rem; max-width: 40rem; margin: 0 0 1rem; padding: .75rem 1rem; border: 1px solid var(--line); border-radius: .5rem;
  background: var(--surface); color: var(--fg); text-decoration: none; }
.int-docs:hover { border-color: var(--primary); }
.int-docs > .icon:first-child { flex: none; width: 1.5rem; height: 1.5rem; color: var(--primary); }
.int-docs span { display: flex; flex-direction: column; gap: .125rem; min-width: 0; }
.int-docs small { color: var(--muted, #62748e); font-size: .8125rem; }
.int-docs .int-docs-ext { flex: none; margin-inline-start: auto; color: #90a1b9; }
.int-cards { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.int-card, html.dark .int-card { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; padding: 1rem; border: 1px solid var(--line); border-radius: .5rem;
  background: var(--surface); box-shadow: var(--shadow); text-align: start; color: var(--fg); cursor: pointer; }
.int-card:hover, html.dark .int-card:hover { border-color: var(--primary); background: var(--surface); }
.int-card strong { font-size: 1rem; }
.int-card .muted { font-size: .875rem; }
.int-logo { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border: 1px solid var(--line); border-radius: .375rem; background: var(--canvas); }
.int-logo .icon { width: 1.25rem; height: 1.25rem; color: var(--primary); }
.int-guide-link { margin-top: auto; font-size: .875rem; font-weight: 500; color: var(--primary); }
.int-guide { width: 32rem; }
html.dark .int-guide { background: #0f172a; }
.int-guide-body { display: flex; flex-direction: column; gap: 1rem; padding: 1rem; font-size: .875rem; }
.int-guide-body p { margin: 0; }
.int-guide-body { gap: 1.25rem; font-size: .9375rem; line-height: 1.5rem; }
.int-cap { display: block; margin-bottom: .375rem; font-size: .75rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.int-box { padding: .875rem 1rem; border: 1px solid var(--line); border-radius: .5rem; }
.int-box .int-cap { margin-bottom: .25rem; }
.int-url-row { display: flex; align-items: center; gap: .5rem; }
.int-url-box { flex: 1; min-width: 0; padding: .625rem .875rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--canvas);
  font-size: .875rem; overflow-x: auto; white-space: nowrap; }
.int-copy { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; padding: 0;
  border: 1px solid var(--line); border-radius: .375rem; background: none; color: var(--fg); cursor: pointer; }
.int-copy .icon { width: 1.125rem; height: 1.125rem; }
.int-steps-title { margin: 0; font-size: 1rem; font-weight: 600; }
.int-steps { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: .875rem; }
.int-steps li { display: flex; align-items: flex-start; gap: .875rem; }
.int-step-n { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; margin-top: -.125rem;
  border-radius: 9999px; background: var(--primary); color: #fff; font-size: .8125rem; font-weight: 700; }
.int-token { display: flex; flex-direction: column; gap: .75rem; padding-top: 1rem; border-top: 1px dashed var(--line); }
.int-token > button { align-self: flex-start; }
.int-empty { display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: 2.5rem 1rem; border: 1px dashed var(--line); border-radius: .5rem; text-align: center; }
.int-connection .meta { margin-top: .25rem; }
@media (min-width: 768px) { .int-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Settings → Payroll: набор строк листа правится на месте (SettingsPayslipsTab оригинала) */
.pr-table td { vertical-align: middle; }
.pr-table input:not([type=checkbox]), .pr-table select { min-width: 0; width: 100%; }
/* набор строк листа — без прокрутки вбок (владелец 2026-11-09): колонки по долям ширины, длинные названия счетов — с многоточием */
.pr-table table { table-layout: fixed; min-width: 56rem; }
.pr-table col.pr-c-name { width: 17%; } .pr-table col.pr-c-kind { width: 15%; } .pr-table col.pr-c-num { width: 6.5%; }
.pr-table col.pr-c-base { width: 8%; } .pr-table col.pr-c-acc { width: 19%; } .pr-table col.pr-c-icon { width: 2.75rem; }
.pr-table th, .pr-table td { padding-inline: .375rem; }
.pr-table th { white-space: normal; }
/* вид оригинала (SettingsPayslipsTab): без рамки и фона шапки — шапка серым текстом с линией под ней, строки без разделителей */
.pr-table, html.dark .pr-table, .set-plain-table, html.dark .set-plain-table { border: 0; border-radius: 0; background: none; }
.pr-table th, html.dark .pr-table th, .set-plain-table th, html.dark .set-plain-table th { padding-block: .5rem; background: none; border-bottom: 1px solid var(--line); color: var(--muted); font-weight: 400; }
.pr-table td, html.dark .pr-table td, .set-plain-table td, html.dark .set-plain-table td { padding-block: .375rem; border-top: 0; background: none; }
.pr-table th:first-child, .pr-table td:first-child, .set-plain-table th:first-child, .set-plain-table td:first-child { padding-inline-start: 0; }
.pr-table td input:not([type='checkbox']) { min-width: 0; }
.pr-table select { text-overflow: ellipsis; }
.pr-table .combo, .pr-table .combo-input, .pr-table .select-trigger { min-width: 0; max-width: 100%; }
/* «Add line» и «Fill with defaults» — тихие кнопки со значком, как у оригинала (владелец 2026-11-09: «менее видимыми») */
.pr-tools { display: flex; gap: 1.25rem; flex-wrap: wrap; margin-top: .75rem; }
.pr-tool, html.dark .pr-tool { display: inline-flex; align-items: center; gap: .5rem; padding: .375rem .25rem; border: 0; background: none; box-shadow: none; color: var(--muted); font-weight: 500; }
.pr-tool:hover { color: var(--fg); background: none; }
.pr-tool .icon { width: 1.25rem; height: 1.25rem; }
.pr-save { display: flex; align-items: center; gap: .75rem; margin-top: .75rem; }

/* «Month close»: правка адресов письма бухгалтеру прямо в окне (SendSection оригинала, владелец 2026-11-09) */
.mc-to-edit { display: flex; flex-direction: column; gap: .5rem; }
.mc-to-edit input[type=text] { width: 100%; }
.mc-to-buttons { display: flex; justify-content: flex-end; gap: .5rem; }

/* уведомления плашкой справа снизу — общий компонент toast() / [data-toast] в app.js (UNotifications оригинала, владелец 2026-11-09) */
[data-toast], p.error[role="alert"] { display: none !important; }
.toasts { position: fixed; z-index: 200; right: 1.5rem; bottom: 1.5rem; display: flex; flex-direction: column; gap: .5rem; max-width: min(24rem, calc(100vw - 2rem)); }
.toast-item { display: flex; align-items: flex-start; gap: .75rem; padding: .75rem 1rem; border-radius: .5rem; font-size: .875rem; line-height: 1.25rem;
  background: var(--surface); color: var(--fg); border: 1px solid var(--line, #e2e8f0); border-inline-start: 4px solid var(--primary);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .2); }
.toast-item span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.toast-close { flex: none; border: 0; background: none; padding: 0; color: var(--muted); cursor: pointer; display: inline-flex; }
.toast-close .icon { width: 1rem; height: 1rem; }
.toast-item.error { border-inline-start-color: #ef4444; }
.toast-item.error span { color: #b91c1c; }
html.dark .toast-item.error span { color: #fca5a5; }
@media (max-width: 640px) { .toasts { right: 1rem; left: 1rem; bottom: 1rem; max-width: none; } }

/* «Month close» → History как HistoryTable оригинала: месяц жирным, вопросы с оставшимися предупреждениями янтарным (владелец 2026-11-09) */
.mc-history { display: flex; flex-direction: column; gap: 1rem; }
.mc-history > p { margin: 0; font-size: .875rem; }
.mc-history-table td { vertical-align: middle; }
.mc-history-table .nowrap, .mc-h-month { white-space: nowrap; }
.mc-warn-left { color: #b45309; }
html.dark .mc-warn-left { color: #fbbf24; }

/* вкладки в тёмной теме (владелец 2026-11-09, как у оригинала): общее правило кнопок html.dark button сильнее правил вкладок и давало
   каждой вкладке фон и свою серую линию снизу; линия — одна общая под всеми вкладками, зелёная — только у активной */
html.dark :is(.mc-tabs, .set-tabs, .int-tabs, .lead-tabs, .tabs, .pay-tabs) :is(button, a) { background: none; }
html.dark :is(.mc-tabs, .set-tabs, .int-tabs, .lead-tabs, .tabs, .pay-tabs) :is(button, a):not(.current):not([aria-selected='true']) { border-bottom-color: transparent; }
/* ссылки «+ Add line» и «Fill with defaults…» — текстом, как у оригинала (класс 2.x: общее правило кнопок тёмной темы перебивало);
   заголовки колонок и групп листа — без прописных */
html .psf-add button.link, html.dark .psf-add button.link, html .pr-tools button.link, html.dark .pr-tools button.link {
  border: 0; background: none; box-shadow: none; padding: 0; min-height: 0; color: var(--primary); font-size: .875rem; font-weight: 500; }
html .psf-add button.link:hover, html .pr-tools button.link:hover { text-decoration: underline; }
html .psf-table thead th, html .psf-table .psf-group th { text-transform: none; letter-spacing: normal; }
html .psf-table thead th { font-size: .875rem; font-weight: 600; }

/* ключи API Tranzila бизнеса (G-092): статус «задан / не задан», поле замены и кнопки — строкой, на телефоне — переносом */
.tz-keys { margin-top: 1rem; }
.tz-key-row { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.tz-key-row input { flex: 1 1 14rem; min-width: 0; }

/* Профиль /profile (pages/profile/index.vue оригинала, владелец 2026-11-09): две карточки — данные профиля и безопасность */
/* Профиль — размеры /profile оригинала (UCard: rounded-lg, ring, divide-y; шапка p-4 sm:px-6, тело p-6, подвал p-4 sm:px-6; владелец 2026-11-10) */
.profile-page .profile-card { display: block; max-width: none; padding: 0; margin: 0 0 2rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); box-shadow: none; }
html.dark .profile-page .profile-card { background: #0f172b; border-color: #1d293d; }
.profile-page .profile-head { margin: 0; padding: 1rem 1.5rem; border-bottom: 1px solid var(--line); }
html.dark .profile-page .profile-head, html.dark .profile-page .profile-foot { border-color: #1d293d; }
.profile-page .profile-head h2 { margin: 0; font-size: 1.25rem; line-height: 1.75rem; font-weight: 600; }
.profile-page .profile-head p { margin: 0; font-size: .875rem; line-height: 1.25rem; color: #4b5563; }
html.dark .profile-page .profile-head p, html.dark .profile-page .profile-block > p { color: #9ca3af; }
.profile-page .profile-body { padding: 1.5rem; }
.profile-page .profile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.profile-page .field { margin: 0; font-size: .875rem; }
.profile-page .field label { display: block; margin: 0; font-size: .875rem; line-height: 1.25rem; font-weight: 500; }
.profile-page .field input { width: 100%; height: 2.25rem; margin-top: .25rem; padding: .5rem .75rem; font-size: .875rem; line-height: 1.25rem; border-radius: .375rem; box-sizing: border-box; }
html.dark .profile-page .field input { background: #0f172b; border-color: #314158; color: #fff; }
.profile-page .profile-narrow { max-width: 24rem; margin-top: 1rem; }
.profile-page .profile-block { margin-top: 2rem; }
.profile-page .profile-block h3 { margin: 0 0 .5rem; font-size: 1.125rem; line-height: 1.75rem; font-weight: 600; }
.profile-page .profile-block > p { margin: 0 0 1.5rem; font-size: .875rem; line-height: 1.25rem; color: #4b5563; }
.profile-page .profile-sep { padding-top: 2rem; border-top: 1px solid var(--line); }
html.dark .profile-page .profile-sep { border-color: #374151; }
.profile-page .profile-sep h3 { margin-bottom: .75rem; }
.profile-page .profile-sep > p { max-width: 42rem; margin-bottom: .75rem; }
.profile-page .profile-sep .sel-wrap { display: inline-block; width: auto; }
.profile-page .profile-sep .sel-trigger { width: auto; min-width: 8rem; height: 2.25rem; padding-inline-end: 2.25rem; font-size: .875rem; font-weight: 500; }
html.dark .profile-page .profile-sep .sel-trigger { background: #0f172b !important; border-color: #314158 !important; }
.profile-page button.soft { display: inline-flex; align-items: center; gap: .5rem; height: 2.25rem; padding: .5rem .75rem; border: 0; border-radius: .375rem;
  background: rgba(46, 211, 138, .1); color: var(--primary); font-size: .875rem; line-height: 1.25rem; font-weight: 500; }
html.dark .profile-page button.soft { background: rgba(46, 211, 138, .1); color: var(--primary); }
.profile-page button.soft:hover:not(:disabled) { background: rgba(46, 211, 138, .15); }
.profile-page button.soft.small { height: 2rem; padding: .375rem .625rem; gap: .375rem; }
.profile-page button.soft .icon { width: 1.25rem; height: 1.25rem; }
/* требования к паролю — зелёный блок оригинала (bg-primary-50 / dark:bg-primary-900/20, border-primary-200 / 800, p-4, текст text-xs) */
.profile-page .profile-pass .profile-grid { gap: 1rem; margin-bottom: 1rem; }
.profile-page .profile-rules { padding: 1rem; border: 1px solid #a7f3d0; border-radius: .375rem; background: #ecfdf5; color: var(--primary); }
html.dark .profile-page .profile-rules { border-color: var(--primary); background: rgba(46, 211, 138, .2); }
.profile-page .profile-rules h4 { margin: 0 0 .5rem; font-size: .875rem; line-height: 1.25rem; font-weight: 500; color: var(--primary); }
.profile-page .profile-rules ul { margin: 0; padding: 0; list-style: none; font-size: .75rem; line-height: 1rem; }
.profile-page .profile-rules li + li { margin-top: .25rem; }
.profile-page .profile-rules li::before { content: '• '; }
.profile-page .profile-body > p.ok, .profile-page .profile-body > p.error { margin: 1rem 0 0; }
.profile-page .profile-foot { display: flex; justify-content: flex-end; gap: 1rem; margin: 0; padding: 1rem 1.5rem; border-top: 1px solid var(--line); }
.profile-page .profile-foot button { height: 2.25rem; padding: .5rem .75rem; border-radius: .375rem; font-size: .875rem; font-weight: 500; }
html.dark .profile-page .profile-foot button.outline { background: #0f172b; border-color: #314158; color: #e2e8f0; }
.profile-page .profile-otp { margin: 0 0 1rem; color: #374151; }
html.dark .profile-page .profile-otp { color: #d1d5db; }
.profile-page .profile-otp strong { font-weight: 500; }
.profile-page .profile-key { font-family: ui-monospace, monospace; word-break: break-all; }
.profile-page .profile-codes { margin-top: 1rem; padding: 1rem; border: 1px solid #fcd34d; border-radius: .375rem; background: #fffbeb; }
html.dark .profile-page .profile-codes { background: rgba(120, 53, 15, .2); border-color: #92400e; }
.profile-page .profile-codes ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; padding: 0; list-style: none; }
@media (max-width: 767px) {
  .profile-page .profile-grid, .profile-page .profile-codes ul { grid-template-columns: 1fr; }
  .profile-page .profile-head, .profile-page .profile-foot { padding: 1rem; }
  .profile-page .profile-body { padding: 1rem; }
  .profile-page .profile-foot { flex-direction: column; }
}

/* дата строки, открывающая строку таблицы (выписка счёта): кнопка без вида кнопки — текстом, но с клавиатуры и фокусом */
button.row-open { all: unset; cursor: pointer; }
button.row-open:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 2px; }

/* отчёт нумерации: подписи над полями, три равные колонки; карточки с отступом 1.5rem */
.rep-cont { padding: 1.5rem; }
.rep-cont-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem 1rem; align-items: center; }
.rep-cont-label { font-size: .875rem; font-weight: 500; }
.rep-cont-title { font-size: 1.125rem; font-weight: 600; margin: 0 0 1.5rem; }
@media (max-width: 767px) { .rep-cont-grid { grid-template-columns: 1fr; } .rep-cont-gap { display: none; } }

/* аванс налога как у оригинала (tax.vue): плашка bg-primary-50 — бледно-зелёная (у оригинала этого оттенка в теме нет, и плашка выходит
   ярко-зелёной со ссылками того же цвета — делаем по замыслу), блоки в половину ширины (max-w-2xl), значения физически справа */
.rep-tax { padding: 1rem 1.5rem; }
.rep-tax-alert { display: flex; align-items: flex-start; gap: .5rem; padding: 1rem; margin-bottom: 1.5rem; border-radius: .5rem; background: rgba(46, 211, 138, .1);
  font-size: .875rem; color: var(--text); }
.rep-tax-alert .icon { width: 1.25rem; height: 1.25rem; flex: none; margin-top: .125rem; color: var(--primary); }
.rep-tax-alert p { margin: 0; }
.rep-tax-alert p + p { margin-top: .5rem; }
.rep-tax-alert a { color: var(--primary); text-decoration: underline; }
.rep-tax-half { max-width: 42rem; }
.rep-tax-dates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.rep-tax-dates .field label { margin-bottom: .5rem; }
.rep-tax-title { font-size: 1.125rem; font-weight: 700; color: var(--fg); margin-bottom: .75rem; }
.rep-tax-section { font-size: 1rem; font-weight: 700; color: #1f2937; margin-bottom: .5rem; }
.rep-tax-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-bottom: .5rem; font-size: .875rem; color: var(--text); }
.rep-tax-row > span:last-child { text-align: right; font-weight: 500; color: var(--fg); }
.rep-tax-row.rep-tax-last { margin-bottom: 1rem; }
.rep-tax-total > span { font-weight: 700; color: var(--fg); }
.rep-tax hr { border: 0; border-top: 1px solid #d1d5db; margin: 0 0 1rem; }
html.dark .rep-tax-alert { background: rgba(46, 211, 138, .12); color: #d1d5db; }
html.dark .rep-tax-section { color: #e5e7eb; }
html.dark .rep-tax hr { border-top-color: #4b5563; }
@media (max-width: 767px) { .rep-tax-dates { grid-template-columns: 1fr; } }
/* книга поступлений (payments.vue): «For the period:» — одна подпись над обеими датами (block text-sm font-medium mb-2), кнопка — под полями
   у начала строки (justify-start), отступ space-y-6 */
/* ссылка на симулятор налоговой (tax-authority.vue, #454/#502): серая плашка с рамкой #d1d1d1 и значком под кнопкой, только у файла מבנה אחיד;
   ссылка — цвета бренда с подчёркиванием (на зелёной плашке её не было видно) */
.rep-sim-note { display: flex; align-items: flex-start; gap: .5rem; padding: 1rem; margin-top: .5rem; border: 1px solid #d1d1d1; border-radius: .5rem;
  background: #f9fafb; font-size: .875rem; color: var(--text); }
.rep-sim-note .icon { width: 1.25rem; height: 1.25rem; flex: none; margin-top: .125rem; color: var(--primary); }
.rep-sim-note p { margin: 0; }
.rep-sim-note a { color: var(--primary); text-decoration: underline; }
html.dark .rep-sim-note { background: #1f2937; border-color: #374151; }
/* форма налоговой: поля — в max-w-2xl, плашка симулятора — во всю ширину карточки, сразу под кнопкой (space-y-6) */
.rep-ta { max-width: none; }
.rep-ta > :not(.rep-sim-note) { max-width: 42rem; }
.rep-ta .toolbar { margin-bottom: 0; }
.rep-pay-label { display: block; font-size: .875rem; font-weight: 500; color: var(--text); margin-bottom: .5rem; }
.rep-tax .rep-tax-half + .toolbar { margin: 0; }