/* Внешний вид всей системы (решение владельца 29.09).

   Фирменные цвета 4COLORS: основной фиолетовый 142 84 230 (шкала primary
   задана в настройках Unfold), дополнительные — голубой 192 227 255 и
   салатовый 217 227 128, чёрный и белый.

   Было «белое на белом»: фон страницы, карточки и таблицы одного цвета,
   разделены линиями в 1px. Теперь фон рабочей области светло-серый, а
   карточки белые с мягкой тенью; серые полосы-заголовки секций убраны. */

:root {
  --brand: #8e54e6;
  --brand-strong: #7a3cd6;
  --brand-blue: #c0e3ff;
  --brand-lime: #d9e380;
  --ground: #f4f3f8;
  --card: #ffffff;
  --card-line: #e8e6ef;
  --card-shadow: 0 1px 2px rgba(24, 16, 48, 0.05), 0 6px 20px rgba(24, 16, 48, 0.06);
}
html.dark {
  --ground: #0b0d14;
  --card: #151823;
  --card-line: #242838;
  --card-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}

/* --- Фон и карточки --- */
#main { background: var(--ground) !important; }

/* секции форм */
#content fieldset.module > .form-rows,
#content .inline-group > .border,
#content .inline-group .tabular,
.doc-top-grid > div:not(.doc-head-block),
.doc-summary {
  background: var(--card) !important;
  border-color: var(--card-line) !important;
  box-shadow: var(--card-shadow) !important;
}
/* заголовок секции — просто заголовок, без серой полосы */
#content fieldset.module > h2,
#content .inline-group > h2,
#content .inline-group h2.inline-heading {
  background: transparent !important;
  padding-left: .15rem !important;
  font-size: .9375rem;
  height: auto !important;
  margin-bottom: .6rem !important;
}

/* списки: панель поиска и таблица — одна белая карточка */
#changelist .result-list-wrapper > .grow > div.lg\:border,
#changelist-form > div.rounded-default {
  background: var(--card) !important;
  border-color: var(--card-line) !important;
}
#changelist-form > div.rounded-default { box-shadow: var(--card-shadow); }
#result_list tbody tr:hover > * { background: rgba(142, 84, 230, 0.04); }
html.dark #result_list tbody tr:hover > * { background: rgba(170, 124, 239, 0.07); }

/* --- Кнопки: в тёмной теме — насыщенный фиолетовый, а не пастель --- */
html.dark .bg-primary-600,
html.dark .dark\:bg-primary-500,
html.dark button.bg-primary-600,
html.dark a.bg-primary-600 { background-color: var(--brand-strong) !important; color: #fff !important; }

/* --- Списки (этап 1: кнопка оплаты обрезалась, клиент в три строки) --- */
#result_list td.field-client,
#result_list td.field-client_column {
  white-space: nowrap; max-width: 15rem; text-overflow: ellipsis;
}
#result_list td.field-subject { max-width: 11rem; white-space: nowrap; text-overflow: ellipsis; }
#result_list td.field-due_column { white-space: nowrap; }
#result_list td.field-status select { max-width: 9.75rem; }
#result_list > thead > tr > th, #result_list > tbody > tr > * { padding-left: .6rem !important; padding-right: .6rem !important; }
#result_list td.field-kind_column { white-space: nowrap; }
/* «Record payment» в строке — значком, подпись во всплывающей подсказке */
#result_list a[href*="/record-payment/"] {
  font-size: 0 !important; gap: 0 !important; padding: .4rem !important;
}
#result_list a[href*="/record-payment/"] .material-symbols-outlined { font-size: 20px !important; }

/* --- Архив --- */
.archive-version { font-variant-numeric: tabular-nums; white-space: nowrap; }
.archive-badge {
  display: inline-block; margin-left: .35rem; padding: .1rem .5rem; border-radius: 999px;
  font-size: .75rem; font-weight: 600; white-space: nowrap;
}
.archive-badge.current { background: var(--brand-lime); color: #3d4500; }
.archive-badge.old { background: rgba(120, 113, 108, 0.14); color: #57534e; }
.archive-badge.void { background: #fee2e2; color: #b91c1c; }
html.dark .archive-badge.current { background: rgba(217, 227, 128, 0.18); color: var(--brand-lime); }
html.dark .archive-badge.old { background: rgba(214, 211, 209, 0.12); color: #d6d3d1; }
html.dark .archive-badge.void { background: rgba(239, 68, 68, 0.2); color: #fca5a5; }
.archive-download {
  display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .45rem;
  border: 1px solid var(--card-line); border-radius: .5rem; font-weight: 500; white-space: nowrap;
}
.archive-download:hover { border-color: var(--brand); color: var(--brand-strong); }
.archive-download .material-symbols-outlined { font-size: 18px; }

/* --- Удаление реквизитов компании: отдельная страница с подтверждением --- */
.danger-page {
  max-width: 36rem; margin: 2rem auto; padding: 1.75rem; background: var(--card);
  border-radius: .75rem; box-shadow: var(--card-shadow); display: flex; flex-direction: column; gap: .9rem;
}
.danger-page h2 { margin: 0; font-size: 1.25rem; font-weight: 700; }
.danger-page p { margin: 0; line-height: 1.55; }
.danger-page label { display: block; font-weight: 600; font-size: .875rem; margin-bottom: .35rem; }
.danger-page input {
  width: 100%; padding: .55rem .75rem; border: 1px solid var(--card-line); border-radius: .5rem;
  font-size: 1rem; letter-spacing: .05em; background: transparent; color: inherit;
}
.danger-page .danger-error { color: #b91c1c; font-weight: 500; margin-top: .5rem; }
.danger-page .danger-actions { display: flex; gap: 1rem; align-items: center; margin-top: 1rem; }
.danger-page .danger-button {
  background: #b91c1c; color: #fff; border: 0; border-radius: .5rem; padding: .6rem 1.1rem;
  font-weight: 600; cursor: pointer;
}

/* --- Вход: ссылка «Return to site» никуда не ведёт — сайта у системы нет --- */
body.login a[href="/"]:has(.material-symbols-outlined),
.login a[href="/"] { display: none !important; }

/* --- Метки проблем (сверка с реестром и т.п.) --- */
.flag {
  display: inline-block; padding: .12rem .55rem; border-radius: 999px;
  font-size: .75rem; font-weight: 600; white-space: nowrap;
}
.flag.warn { background: #fef3c7; color: #92400e; }
.flag.bad { background: #fee2e2; color: #b91c1c; }
.flag.info { background: rgba(120, 113, 108, 0.14); color: #57534e; }
html.dark .flag.warn { background: rgba(245, 158, 11, 0.2); color: #fcd34d; }
html.dark .flag.bad { background: rgba(239, 68, 68, 0.2); color: #fca5a5; }
html.dark .flag.info { background: rgba(214, 211, 209, 0.12); color: #d6d3d1; }

/* --- Карточка клиента --- */
/* поля одной ширины: адреса и email тоже не шире остальных */
#client_form textarea { max-width: 42rem; }
.lookup-wrap { display: flex !important; gap: .5rem; align-items: center; }
.lookup-wrap input { flex: 1; min-width: 0; }
.lookup-button {
  flex: none; white-space: nowrap; padding: .5rem .8rem; border-radius: .5rem; cursor: pointer;
  border: 1px solid var(--brand); background: transparent; color: var(--brand-strong);
  font-size: .8125rem; font-weight: 600;
}
.lookup-button:hover:not(:disabled) { background: rgba(142, 84, 230, 0.08); }
.lookup-button:disabled { opacity: .55; cursor: default; }
html.dark .lookup-button { color: #c4a5f5; }
.lookup-note { font-size: .8125rem; margin-top: .4rem; }
.lookup-note:empty { display: none; }

/* --- Отчёт НДС: выбор месяца --- */
.month-select {
  appearance: none; -webkit-appearance: none; cursor: pointer;
  border: 1px solid var(--card-line); border-radius: .5rem; background-color: var(--card); color: inherit;
  padding: .5rem 2rem .5rem .75rem; font-size: .875rem; font-weight: 500;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
                    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 16px) 55%, calc(100% - 11px) 55%;
  background-size: 5px 5px; background-repeat: no-repeat;
}

/* --- Шапка карточки документа: второстепенные действия — значками --- */
#header-inner a.icon-only { font-size: 0 !important; gap: 0 !important; padding-left: .6rem !important; padding-right: .6rem !important; }
#header-inner a.icon-only .material-symbols-outlined { font-size: 20px !important; }

/* ======================================================================
   Телефон (этап 4). Списки на узком экране — карточками: таблица, сжатая
   до 390px, прятала статус и сумму за краем, а названия ломала в 4 строки.
   Подписи значений (data-label) ставит row_actions.js из заголовков.
   ====================================================================== */
@media (max-width: 767px) {
  #changelist-form > div.rounded-default { overflow: visible !important; background: transparent !important;
    border: 0 !important; box-shadow: none !important; }
  #result_list, #result_list tbody { display: block; width: 100%; }
  #result_list thead { display: none; }
  #result_list tbody tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: center;
    background: var(--card); border-radius: 12px; box-shadow: var(--card-shadow);
    padding: 12px 14px; margin-bottom: 10px;
  }
  #result_list tbody tr > * {
    display: block; border: 0 !important; padding: 0 !important; height: auto !important;
    min-width: 0; white-space: normal; text-align: left;
  }
  /* галочки для массовых действий на телефоне не нужны */
  #result_list tbody tr > td.action-checkbox { display: none; }
  /* обычный список: первая колонка — заголовок карточки, остальное подписано */
  #result_list tbody tr > :nth-child(2) { grid-column: 1 / -1; font-weight: 600; font-size: 15px; }
  #result_list tbody tr > [data-label]:not(:nth-child(2)) { grid-column: 1 / -1; font-size: 13px; }
  #result_list tbody tr > [data-label]:not(:nth-child(2))::before {
    content: attr(data-label) " · "; opacity: .55;
  }
  #result_list tbody tr > td:empty { display: none; }

  /* --- документы: номер и статус, клиент, даты слева, суммы справа --- */
  #result_list tbody tr:has(> .field-number_column) {
    grid-template-areas: "num status" "client client" "date total" "due balance" "subject subject" "pdf act";
  }
  #result_list tr > .field-number_column { grid-area: num; grid-column: auto !important; }
  #result_list tr > .field-status { grid-area: status; grid-column: auto !important; justify-self: end; }
  #result_list tr > .field-status::before { content: none !important; }
  #result_list tr > .field-status select { max-width: 11rem; }
  #result_list tr > .field-client { grid-area: client; font-size: 14px !important; font-weight: 500;
    white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; max-width: none; }
  #result_list tr > .field-client::before { content: none !important; }
  #result_list tr > .field-date_column { grid-area: date; grid-column: auto !important; }
  #result_list tr > .field-due_column, #result_list tr > .field-valid_until { grid-area: due; grid-column: auto !important; }
  #result_list tr > .field-total_column { grid-area: total; grid-column: auto !important; justify-self: end;
    font-size: 17px !important; font-weight: 700; }
  #result_list tr > .field-total_column::before { content: "฿" !important; opacity: .55; font-weight: 500; }
  #result_list tr > .field-balance_column, #result_list tr > .field-paid_column { grid-area: balance;
    grid-column: auto !important; justify-self: end; }
  #result_list tr > .field-subject { grid-area: subject; }
  #result_list tr > .field-pdf_column { grid-area: pdf; grid-column: auto !important; }
  #result_list tr > .field-pdf_column::before { content: none !important; }
  #result_list tr > .field-actions_holder { grid-area: act; grid-column: auto !important; justify-self: end;
    width: auto !important; }
  #result_list tr > .field-actions_holder a { margin: 0 !important; }
  #result_list tbody tr > .is-blank { display: none !important; }
  #result_list tr > .field-actions_holder::before { content: none !important; }
  #result_list tr > .field-subject:has(> :only-child:empty) { display: none; }

  /* кнопка оплаты в карточке — крупнее, под палец */
  #result_list a[href*="/record-payment/"] { padding: .55rem .7rem !important; }

  /* --- карточка документа: главное действие — кнопкой внизу экрана --- */
  .mobile-actions {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 45;
    display: flex; gap: 8px; align-items: center; padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    background: var(--card); box-shadow: 0 -4px 16px rgba(24, 16, 48, 0.1);
  }
  .mobile-actions a {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 44px; min-width: 44px; border-radius: 10px; font-weight: 600; font-size: 15px;
    border: 1px solid var(--card-line); color: inherit; text-decoration: none;
  }
  .mobile-actions a.primary { flex: 1; background: #7a3cd6; border-color: #7a3cd6; color: #fff; }
  .mobile-actions .material-symbols-outlined { font-size: 22px; }
  body.has-mobile-actions #main { padding-bottom: 76px; }
}

/* --- Импорт выписки банка --- */
.bank-page { display: flex; flex-direction: column; gap: 20px; max-width: 1180px; }
.bank-card { background: var(--card); border-radius: 14px; box-shadow: var(--card-shadow); padding: 22px 26px; }
.bank-card h2 { margin: 0 0 6px; font-size: 16px; font-weight: 600; }
.bank-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.bank-note { font-size: 13px; opacity: .72; margin: 0 0 14px; line-height: 1.5; }
.bank-error { color: #b91c1c; font-weight: 500; }
.bank-empty { font-size: 14px; opacity: .7; margin: 6px 0 0; }
.bank-upload { display: flex; flex-wrap: wrap; gap: 14px 18px; align-items: flex-end; }
.bank-upload label, .bank-fields label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 500; }
.bank-page select, .bank-page input[type=password], .bank-page input[type=file] {
  border: 1px solid var(--card-line); border-radius: .5rem; padding: .45rem .6rem; font-size: .875rem;
  background: var(--card); color: inherit; max-width: 100%;
}
.bank-primary {
  background: #7a3cd6; color: #fff; border: 0; border-radius: .5rem; padding: .6rem 1.1rem;
  font-weight: 600; cursor: pointer; min-height: 40px;
}
.bank-primary:hover { background: #682dba; }
.bank-queue, .bank-history, .bank-preview table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.bank-queue th, .bank-history th, .bank-preview th {
  text-align: left; font-weight: 600; font-size: 12px; opacity: .7; padding: 8px 10px; border-bottom: 1px solid var(--card-line);
}
.bank-queue td, .bank-history td, .bank-preview td { padding: 10px; border-bottom: 1px solid var(--card-line); vertical-align: top; }
.bank-queue tr.has-choice td { background: rgba(217, 227, 128, .14); }
.bank-queue .num, .bank-history .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.bank-queue .strong { font-weight: 700; }
.bank-queue .desc { max-width: 22rem; word-break: break-word; }
.bank-queue .choice { min-width: 20rem; }
.bank-queue .choice select { width: 100%; }
.bank-queue .hint { font-size: 12px; margin-top: 4px; }
.bank-page .muted { opacity: .6; font-size: 12px; }
.bank-page .nowrap { white-space: nowrap; }
.bank-actions { display: flex; justify-content: flex-end; align-items: center; gap: 12px 20px;
  flex-wrap: wrap; margin-top: 16px; }
/* Галка «выпустить RE» рядом с кнопкой: от неё зависят налоговые документы */
.bank-check { display: inline-flex; gap: 8px; align-items: flex-start; font-size: 13px; cursor: pointer; }
.bank-check input { accent-color: var(--brand-strong); width: 16px; height: 16px; margin: 1px 0 0; flex: none; }
.bank-preview { overflow-x: auto; margin-bottom: 14px; border: 1px solid var(--card-line); border-radius: .5rem; }
.bank-preview td { white-space: nowrap; font-size: 12px; }
.bank-fields { display: flex; flex-wrap: wrap; gap: 12px 16px; margin-bottom: 14px; }
.bank-fields fieldset { border: 0; padding: 0; margin: 0; flex-basis: 100%; }
.bank-fields legend { font-size: 13px; font-weight: 500; margin-bottom: 4px; }
.bank-fields label.inline { flex-direction: row; display: inline-flex; margin-right: 12px; font-weight: 400; }
@media (max-width: 767px) {
  .bank-card { padding: 16px; }
  .bank-queue thead { display: none; }
  .bank-queue, .bank-queue tbody, .bank-queue tr, .bank-queue td { display: block; width: 100%; }
  .bank-queue tr { padding: 10px 0; border-bottom: 1px solid var(--card-line); }
  .bank-queue td { border: 0; padding: 3px 0; }
  .bank-queue .choice { min-width: 0; }
}

/* --- История FlowAccount: пояснение и итоги над списком, панель в карточке
   клиента, позиции документа --- */
.legacy-summary {
  display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1rem; padding: .85rem 1rem;
  background: var(--card); border-radius: .75rem; box-shadow: var(--card-shadow);
}
.legacy-summary p { margin: 0; }
.legacy-note { display: flex; gap: .5rem; align-items: flex-start; font-size: .875rem; opacity: .8; }
.legacy-note .material-symbols-outlined, .legacy-history .material-symbols-outlined {
  font-size: 20px; color: var(--brand); flex: none;
}
.legacy-totals { display: flex; flex-wrap: wrap; gap: .35rem 1.5rem; }
.legacy-summary .num, .legacy-history .num, .legacy-items .num { font-variant-numeric: tabular-nums; }
.legacy-history {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-bottom: 1.5rem;
  padding: .75rem 1rem; background: var(--card); border-radius: .75rem; box-shadow: var(--card-shadow);
}
.legacy-history .grow { flex: 1 1 16rem; }
.legacy-history a { font-weight: 600; color: var(--brand-strong); white-space: nowrap; }
html.dark .legacy-history a { color: var(--brand-blue); }
.legacy-items { width: 100%; max-width: 56rem; border-collapse: collapse; font-size: .875rem; }
.legacy-items th, .legacy-items td { padding: .4rem .6rem; border-bottom: 1px solid var(--card-line);
  text-align: left; vertical-align: top; }
.legacy-items td:first-child { white-space: pre-line; }
.legacy-items .num { text-align: right; white-space: nowrap; }
a.legacy-link { color: var(--brand-strong); font-weight: 500; }
a.legacy-link:hover { text-decoration: underline; }
html.dark a.legacy-link { color: var(--brand-blue); }
