/*
 * Админка: операционные разделы — поиск, заказы, услуги, домены, счета, платежи, выписки банка, акты, отчёты.
 * Только переменные и приёмы из app.css; классы с узкими именами, чтобы не задевать другие разделы.
 */

/* ---------------------------------------------------------------- общие мелочи */

/* Карточки в сетке выравниваются по верху: отступ «.panel + .panel» нужен только в колонке. */
.app-admin .grid-2 > .panel + .panel, .app-admin .grid-3 > .panel + .panel { margin-top: 0; }
.app-admin p.help { color: var(--text-3); font-size: 13px; line-height: 1.45; }
.alert > .alert-led { margin-top: 6px; }
.secret .input::placeholder { font-family: var(--font-ui); }

.kv-compact { grid-template-columns: minmax(92px, 128px) minmax(0, 1fr); gap: 8px 14px; font-size: 14px; }
.kv-compact dd .small { margin-top: 1px; }
.strong-link { display: block; font-weight: 600; color: var(--text); font-size: 15px; }
.strong-link:hover { color: var(--brand-ink); }
.plain-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 14px; color: var(--text-2); }
.ops-mono { font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; font-size: 13.5px; color: var(--text); }
.divider { border-top: 1px solid var(--line); margin: 14px 0; }
.display-amount { font-family: var(--font-display); font-weight: 500; color: var(--text-3); margin-left: 6px; }
.ops-check { display: flex; align-items: flex-end; padding-bottom: 2px; }
.ops-check > .field { margin-bottom: 16px; }
.tabs .count.count-danger { color: var(--danger-ink); }
.table tfoot tr.subtotal td { font-weight: 400; color: var(--text-2); background: var(--surface); border-top: 0; }
.table tr.is-cancelled td { color: var(--text-3); }
.table tr.is-cancelled td strong { text-decoration: line-through; font-weight: 500; }
.job-result { max-width: 380px; font-size: 13px; overflow-wrap: anywhere; color: var(--text-2); }
.secret .input { min-width: 0; }

/* Дата с относительной подписью (Ui::due) в сводках и таблицах */
.due-cell .rel, .table .rel { display: block; font-size: 12.5px; color: var(--text-3); margin-top: 1px; }
.due-cell .rel.is-soon, .table .rel.is-soon { color: var(--warn-ink); }
.due-cell .rel.is-late, .table .rel.is-late { color: var(--danger-ink); }

/* Строка итогов над таблицей с фильтрами */
.filter-total { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 9px 18px; border-bottom: 1px solid var(--line); font-size: 13.5px; color: var(--text-2); background: var(--surface); }
.filter-total strong { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }

/* Поле даты с подписью в строке фильтров; пара «с … по …» переносится целиком */
.filters .select-narrow { max-width: 210px; }
.filter-range { display: inline-flex; align-items: center; gap: 10px; flex-wrap: nowrap; }
.filter-date { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; color: var(--text-3); white-space: nowrap; }
.filters .filter-date .input, .report-period .filter-date .input { min-width: 0; width: 142px; height: 36px; font-size: 14px; }
.filters.filters-dense .input[type="search"] { min-width: 220px; }

/* ---------------------------------------------------------------- поиск */

.inline-search { display: flex; gap: 10px; align-items: center; }
.inline-search .input { flex: 1 1 auto; width: auto; min-width: 0; }
.inline-search .btn { flex: none; }

.search-page-form .input { height: 42px; font-size: 15.5px; }
.search-jump { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 16px; }
.search-jump a { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--surface); color: var(--text-2); font-size: 14px; font-weight: 500; }
.search-jump a:hover { border-color: var(--text-3); color: var(--text); text-decoration: none; }
.search-jump .icon { width: 16px; height: 16px; }
.search-jump .count { color: var(--text-3); font-weight: 500; }
.panel-head h2.gap { gap: 8px; }
.panel-head h2.gap .icon { color: var(--text-3); width: 17px; height: 17px; }

/* ---------------------------------------------------------------- заказ сотрудником */

.product-config { border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--surface-2); padding: 14px 16px 2px; margin-bottom: 16px; }
.product-config[hidden] { display: none; }
.product-config-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; font-size: 14.5px; }
.product-config-head .muted { font-size: 13px; }
.product-config .field > label { font-size: 13.5px; }

/* ---------------------------------------------------------------- управление на сервере и у регистратора */

.mode-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mode-cards .radio-card .meta { display: block; }
.module-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.module-form > .field:last-of-type { margin-bottom: 4px; }

/* ---------------------------------------------------------------- ручной счёт: строки позиций */

.line-rows { display: grid; gap: 0; margin-bottom: 6px; }
.line-row { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 0 12px; }
.line-row .field { margin-bottom: 10px; }
.line-row-head { font-size: 13px; color: var(--text-3); font-weight: 500; margin-bottom: 6px; }

/* ---------------------------------------------------------------- карточка счёта */

.total-figure { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.total-figure .display { font-size: 27px; font-weight: 600; letter-spacing: -.01em; line-height: 1.1; }

/* ---------------------------------------------------------------- выписки банка */

.bank-top { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 20px; align-items: stretch; }
.bank-top .panel { margin: 0; }
.input-file { height: auto; padding: 8px 10px; font-size: 14px; }
.input-file::file-selector-button { font: 500 13.5px var(--font-ui); margin-right: 12px; padding: 6px 12px; border-radius: var(--radius-s); border: 1px solid var(--line-strong); background: var(--surface-2); color: var(--text); cursor: pointer; }
.steps-list { margin: 0; padding-left: 20px; display: grid; gap: 8px; font-size: 14px; color: var(--text-2); }
.import-summary .panel-head h2 { overflow-wrap: anywhere; }
.summary-figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.summary-figures > div { padding: 14px 18px; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 2px; }
.summary-figures > div:last-child { border-right: 0; }
.summary-figures .label { font-size: 13px; color: var(--text-3); }
.summary-figures .value { font-family: var(--font-display); font-feature-settings: "tnum" 1; font-size: 24px; font-weight: 600; line-height: 1.2; }
.summary-figures .hint { font-size: 12.5px; color: var(--text-3); }
.import-warnings { list-style: none; margin: 0; padding: 12px 18px 14px; border-top: 1px solid var(--line); display: grid; gap: 6px; font-size: 13.5px; color: var(--warn-ink); }
.import-warnings li { display: flex; gap: 8px; align-items: flex-start; }
.import-warnings .icon { width: 16px; height: 16px; margin-top: 2px; }
.bank-lines .payer-cell { min-width: 170px; max-width: 260px; }
.bank-lines .purpose-cell { min-width: 220px; }
.bank-lines .purpose { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13.5px; color: var(--text-2); max-width: 420px; }
.bank-lines .status-cell { min-width: 150px; }
.bank-lines td { vertical-align: top; }
.bank-lines td.actions > * + * { margin-left: 4px; }
.line-match { display: inline-block; text-align: left; vertical-align: top; }
.line-match > summary { list-style: none; }
.line-match > summary::-webkit-details-marker { display: none; }
.line-match[open] > summary { background: var(--brand-soft); border-color: var(--brand); color: var(--brand-ink); }
.line-match-form { display: grid; gap: 8px; width: 250px; margin-top: 8px; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--surface-2); white-space: normal; }
.line-match-form label span { display: block; font-size: 12.5px; color: var(--text-3); margin-bottom: 3px; }

/* ---------------------------------------------------------------- акты */

.generate-form { display: flex; gap: 12px 16px; align-items: center; flex-wrap: wrap; }
.generate-form .check { white-space: nowrap; }
.generate-copy { flex: 1 1 280px; min-width: 0; }
.generate-copy h2 { font-size: 16px; margin-bottom: 4px; }
.generate-form .select { width: auto; min-width: 200px; }

/* ---------------------------------------------------------------- отчёты */

.report-period .presets { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.report-period .presets .btn.is-current { background: var(--brand-soft); color: var(--brand-ink); }
.report-bars { height: 210px; }
.report-bars .bar { position: relative; }
.report-bars .bar-value { font-size: 10.5px; color: var(--text-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.report-table tr.is-current td { background: color-mix(in srgb, var(--brand-soft) 45%, transparent); }
.gateway-split { display: flex; flex-wrap: wrap; gap: 8px 26px; font-size: 13.5px; color: var(--text-2); }
.gateway-split strong { color: var(--text); font-weight: 600; }
.rank { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--muted-bg); color: var(--muted-ink); font-size: 12px; font-weight: 600; margin-right: 9px; vertical-align: 1px; }
.rank-offset { margin-left: 31px; }
.report-tabs { margin-bottom: 16px; }
/* Доля строки — тонкая полоса под названием */
.share { height: 4px; border-radius: 2px; background: var(--muted-bg); margin-top: 6px; max-width: 260px; overflow: hidden; }
.share > span { display: block; height: 100%; background: color-mix(in srgb, var(--brand) 55%, var(--surface)); border-radius: 2px; }
/* Список «название — полоса — сумма» (типы услуг, физлица и организации) */
.kind-bars { list-style: none; margin: 0; padding: 6px 20px 14px; }
.kind-bars li { display: grid; grid-template-columns: 30px minmax(150px, 1.3fr) minmax(80px, 2fr) minmax(120px, auto); align-items: center; gap: 12px; padding: 9px 0; }
.kind-bars li + li { border-top: 1px solid var(--line); }
.kb-icon { width: 30px; height: 30px; border-radius: 8px; background: var(--muted-bg); display: inline-flex; align-items: center; justify-content: center; color: var(--text-2); }
.kb-icon .icon { width: 17px; height: 17px; }
.kb-title { font-weight: 500; min-width: 0; }
.kb-bar, .mg-bar { height: 8px; border-radius: 4px; background: var(--muted-bg); overflow: hidden; }
.kb-bar > span, .mg-bar > span { display: block; height: 100%; background: var(--brand); border-radius: 4px; }
.kb-sum, .mg-sum { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* Группы тарифов с раскрытием */
.mrr-group + .mrr-group { border-top: 1px solid var(--line); }
.mrr-group > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(180px, 1.4fr) 110px minmax(80px, 1.6fr) minmax(140px, auto); align-items: center; gap: 12px; padding: 12px 20px; }
.mrr-group > summary::-webkit-details-marker { display: none; }
.mrr-group > summary:hover { background: var(--surface-2); }
.mrr-group > summary:focus-visible { outline: 2px solid var(--brand); outline-offset: -2px; }
.mg-name { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; min-width: 0; }
.mg-name .icon { width: 16px; height: 16px; color: var(--text-3); transition: transform .15s ease; flex: none; }
.mrr-group[open] .mg-name .icon { transform: rotate(90deg); }
.mg-count { text-align: right; font-variant-numeric: tabular-nums; }
.mg-table { background: var(--surface-2); }
.mg-table th:first-child, .mg-table td:first-child { padding-left: 42px; }
/* Два ряда столбиков: подключено / удалено */
.duo-bars .duo { display: flex; gap: 2px; align-items: flex-end; height: 100%; width: 100%; justify-content: center; }
.duo-bars .duo .fill { flex: 0 1 15px; max-width: 15px; border-radius: 4px 4px 1px 1px; min-height: 2px; }
.duo-bars .fill-new { background: var(--brand); }
.duo-bars .fill-lost { background: color-mix(in srgb, var(--danger, #d64545) 70%, var(--surface)); }
.legend { display: inline-flex; gap: 16px; font-size: 12.5px; color: var(--text-3); }
.legend span::before { content: ""; display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 6px; vertical-align: -0.5px; }
.legend .lg-new::before { background: var(--brand); }
.legend .lg-lost::before { background: color-mix(in srgb, var(--danger, #d64545) 70%, var(--surface)); }
/* Прогноз по месяцам: покрыто балансами + доплатить */
.forecast-months { list-style: none; margin: 0; padding: 8px 20px 16px; }
.forecast-months li { display: grid; grid-template-columns: 150px minmax(80px, 1fr) minmax(220px, auto); align-items: center; gap: 14px; padding: 10px 0; }
.forecast-months li + li { border-top: 1px solid var(--line); }
.fm-title { font-weight: 500; }
.fm-bar { display: flex; height: 12px; border-radius: 6px; background: var(--muted-bg); overflow: hidden; }
.fm-covered { background: var(--brand); }
.fm-rest { background: color-mix(in srgb, var(--danger, #d64545) 70%, var(--surface)); }
.fm-sum { display: flex; flex-direction: column; align-items: flex-end; font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------- адаптив */

@media (max-width: 1100px) {
  .bank-top { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .report-bars .bar-value { display: none; }
}
@media (max-width: 640px) {
  .kind-bars li { grid-template-columns: 30px minmax(0, 1fr) auto; }
  .kind-bars .kb-bar { grid-column: 2 / -1; grid-row: 2; }
  .mrr-group > summary { grid-template-columns: minmax(0, 1fr) auto; padding: 12px 16px; }
  .mrr-group .mg-count, .mrr-group .mg-bar { display: none; }
  .forecast-months li { grid-template-columns: minmax(0, 1fr) auto; }
  .forecast-months .fm-bar { grid-column: 1 / -1; grid-row: 2; }
  .mode-cards { grid-template-columns: minmax(0, 1fr); }
  .line-row { grid-template-columns: minmax(0, 1fr) 130px; }
  .summary-figures > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .filter-range { width: 100%; flex-wrap: wrap; }
  .filters .filter-date { width: 100%; }
  .filters .filter-date .input { flex: 1 1 auto; width: auto; }
  .rank-offset { margin-left: 0; }
}

/* Платёжные системы: иконки способов оплаты (.pay-method-icon — в client.css) */
.pay-icon-row { display: flex; align-items: flex-start; gap: 14px; }
.pay-icon-row + .pay-icon-row { border-top: 1px solid var(--line); padding-top: 16px; }
.method-texts { display: flex; flex-direction: column; gap: 8px; max-width: 760px; }
.method-texts-row { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 6px 10px; align-items: start; }
.method-texts-row .input { grid-column: 2; }
.method-texts-row .textarea { grid-column: 2; min-height: 84px; }
.method-texts-lang { grid-row: span 2; font-size: 13px; color: var(--text-2); padding-top: 9px; }
.method-texts-row:not(:has(.method-texts-lang)) { grid-template-columns: minmax(0, 1fr); }
.method-texts-row:not(:has(.method-texts-lang)) .input, .method-texts-row:not(:has(.method-texts-lang)) .textarea { grid-column: 1; }
@media (max-width: 640px) { .method-texts-row { grid-template-columns: minmax(0, 1fr); } .method-texts-row .input, .method-texts-row .textarea { grid-column: 1; } .method-texts-lang { grid-row: auto; padding-top: 0; } }