/* Раздел «Расчёты»: стили только с префиксом .p-quotes */

/* курсы ЦБ в шапке раздела */
.p-quotes .q-rates { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.p-quotes .q-rate { display: inline-flex; align-items: baseline; gap: 6px; padding: 6px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow); font-variant-numeric: tabular-nums; }
.p-quotes .q-rate-sym { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: var(--surface-2); color: var(--ink-2); font-size: 12px; font-weight: 700; align-self: center; }
.p-quotes .q-rate-name { color: var(--ink-2); font-size: 13px; }
.p-quotes .q-rate strong { font-size: 16px; letter-spacing: -.01em; }
.p-quotes .q-rate-d { font-size: 12px; color: var(--muted); }
.p-quotes .q-rate-d.up { color: var(--bad); }
.p-quotes .q-rate-d.down { color: var(--good); }
.p-quotes .q-rate-date { color: var(--muted); font-size: 12.5px; }

/* раскладка: очередь слева, работа справа */
.p-quotes .q-work { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 16px; align-items: start; }
.p-quotes .q-queue { position: sticky; top: calc(var(--topbar-h, 60px) + 12px); max-height: calc(100vh - var(--topbar-h, 60px) - 24px); display: flex; flex-direction: column; padding: 14px 12px; }
.p-quotes .q-queue .card-head { padding: 0 4px; }
.p-quotes .q-queue .chips { margin: 0 4px 8px; }
.p-quotes .q-queue .chip { font-size: 12.5px; padding: 2px 9px; }
.p-quotes .q-list { overflow-y: auto; min-height: 120px; margin: 0 -4px; }
.p-quotes .q-list > li:last-child { border-bottom: 0; }
.p-quotes .q-row { display: grid; gap: 3px; padding: 9px 8px; }
.p-quotes .q-row-top { display: flex; align-items: center; gap: 7px; min-width: 0; }
.p-quotes .q-row-title { font-weight: 600; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p-quotes .q-row-time { color: var(--muted); font-size: 12px; white-space: nowrap; }
.p-quotes .q-row-sub { color: var(--ink-2); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p-quotes .q-row-st { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; font-size: 12px; }
.p-quotes .q-st { color: var(--muted); }
.p-quotes .q-st::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--axis); margin-right: 5px; vertical-align: 1px; }
.p-quotes .q-st.new { color: var(--accent); font-weight: 600; }
.p-quotes .q-st.new::before { background: var(--accent); }
.p-quotes .q-st.warn { color: color-mix(in srgb, var(--warn) 55%, var(--ink)); }
.p-quotes .q-st.warn::before { background: var(--warn); }
.p-quotes .q-st.good { color: var(--good); }
.p-quotes .q-st.good::before { background: var(--good); }
.p-quotes .q-tag { font-size: 11.5px; padding: 0 6px; border-radius: 5px; border: 1px solid var(--border); color: var(--ink-2); background: var(--surface-2); white-space: nowrap; }
.p-quotes .badge.manual::before { content: ""; width: 7px; height: 7px; border-radius: 50%; margin: 5px 5px 0 0; background: var(--s3); }
.p-quotes .q-queue .note { padding: 0 4px; }
.p-quotes .q-block { display: block; }

.p-quotes .q-main { display: grid; gap: 16px; min-width: 0; }
.p-quotes .q-back { display: none; justify-self: start; }
.p-quotes .q-empty { padding: 48px 24px; }
.p-quotes .q-sub { margin: 2px 0 0; }
.p-quotes h4 { font-size: 13.5px; font-weight: 600; margin: 16px 0 8px; color: var(--ink); }

/* карточка заявки */
.p-quotes .q-req-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.p-quotes .q-req-title h3 { font-size: 17px; }
.p-quotes .q-status button { max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.p-quotes .q-dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 16px; margin: 0; font-size: 13.5px; }
.p-quotes .q-dl dt { color: var(--muted); }
.p-quotes .q-dl dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.p-quotes .q-dl dd.pre { white-space: pre-wrap; }
.p-quotes .q-mail { margin-top: 14px; border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; background: var(--surface-2); }
.p-quotes .q-mail-head { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; margin-bottom: 6px; font-size: 13px; }
.p-quotes .q-mail-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13.5px; line-height: 1.5; max-height: 320px; overflow-y: auto; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; }
.p-quotes .q-mail-tools { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; margin-top: 8px; font-size: 13px; }
.p-quotes .q-params { margin-top: 6px; border-top: 1px solid var(--grid); }
.p-quotes .q-pgrid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px 12px; }
.p-quotes .q-pgrid .input { width: 100%; min-width: 0; }
.p-quotes .q-hint { font-size: 11.5px; color: var(--muted); line-height: 1.3; }
.p-quotes .q-notes { margin: 10px 0 0; padding-left: 18px; color: color-mix(in srgb, var(--warn) 50%, var(--ink)); font-size: 13px; }
.p-quotes .q-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; }
.p-quotes .q-actions .spacer { flex: 1; }
.p-quotes .q-inline { margin: 0; }
.p-quotes .q-history ul { margin: 0; padding-left: 18px; font-size: 13px; }
.p-quotes .q-history .link-btn { padding: 2px 0; text-align: left; }

/* калькулятор */
.p-quotes .q-calc-strip { margin-bottom: 12px; }
.p-quotes .q-strip { display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: center; padding: 10px 14px; border-radius: 10px; background: color-mix(in srgb, var(--accent) 9%, var(--surface)); border: 1px solid color-mix(in srgb, var(--accent) 25%, var(--border)); }
.p-quotes .q-strip-item { display: grid; gap: 1px; }
.p-quotes .q-strip-k { font-size: 12px; color: var(--ink-2); }
.p-quotes .q-strip-item strong { font-size: 16px; font-variant-numeric: tabular-nums; }
.p-quotes .q-strip-btn { margin-left: auto; }
.p-quotes .q-strip-empty { margin: 0; padding: 10px 14px; border: 1px dashed var(--axis); border-radius: 10px; }
.p-quotes .q-owner { display: none; }
body[data-role="owner"] .p-quotes .q-owner { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 6px; font-size: 12.5px; color: var(--ink-2); }

/* калькулятор (pages/quotes-calc.js) */
.p-quotes .qc { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; min-width: 0; }
.p-quotes .qc-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; min-width: 0; }
.p-quotes .qc-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.p-quotes .qc-bar .spacer { flex: 1; }
.p-quotes .qc-bar-item { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.p-quotes .qc-k { font-size: 13px; color: var(--ink-2); font-weight: 500; }
.p-quotes .qc-k.muted { color: var(--muted); font-weight: 400; font-size: 12.5px; }
.p-quotes .qc-disc { width: 72px; }
.p-quotes .qc-check { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; cursor: pointer; }
.p-quotes .qc-order { grid-template-columns: minmax(0, 1fr); border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; background: var(--surface-2); display: grid; gap: 10px; min-width: 0; }
.p-quotes .qc-order-head { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end; }
.p-quotes .qc-order-head .field { min-width: 180px; }
.p-quotes .qc-order-head .qc-name { flex: 1 1 200px; }
.p-quotes .qc-del-order { margin-left: auto; }
.p-quotes .qc-order .table-wrap { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; }
.p-quotes .qc-rows td { padding: 4px 6px; }
.p-quotes .qc-rows th { padding: 6px 6px; }
.p-quotes .qc-rows .input { width: 100%; min-width: 64px; min-height: 32px; padding: 4px 8px; }
.p-quotes .qc-lab { color: var(--muted); font-weight: 600; font-size: 12.5px; width: 28px; }
.p-quotes .qc-per { font-size: 12px; color: var(--muted); white-space: nowrap; }
.p-quotes .qc-hint-cell { min-width: 120px; }
.p-quotes .qc-del { min-width: 28px; height: 28px; font-size: 16px; }
.p-quotes .qc-del:disabled { opacity: .35; cursor: not-allowed; }
.p-quotes .qc-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.p-quotes .qc-fill summary { cursor: pointer; font-size: 13.5px; font-weight: 500; color: var(--ink-2); }
.p-quotes .qc-fill[open] { display: grid; gap: 8px; }
.p-quotes .qc-fill .btn { justify-self: start; }
.p-quotes .qc-status { margin: 0; min-height: 1.2em; }
.p-quotes .qc-error:empty { display: none; }
.p-quotes .qc-err { padding: 8px 0; }
.p-quotes .qc-result { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; min-width: 0; transition: opacity .2s; }
.p-quotes .qc-result:empty { display: none; }
.p-quotes .qc-result.loading, .p-quotes .qc-result.qc-stale { opacity: .55; }
.p-quotes .qc-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
.p-quotes .qc-kpi { box-shadow: none; padding: 14px 16px; }
.p-quotes .qc-kpi .kpi-value { font-size: 21px; }
.p-quotes .qc-kpi.main { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); background: color-mix(in srgb, var(--accent) 6%, var(--surface)); }
.p-quotes .qc-warns { display: flex; flex-wrap: wrap; gap: 6px; }
.p-quotes .qc-warns .pill { white-space: normal; border-radius: 8px; padding: 3px 9px; }
.p-quotes .qc-sum-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.p-quotes .qc-summary { width: 100%; font: 12.5px/1.5 var(--font-mono); resize: vertical; }
.p-quotes .qc-owner { display: none; }
body[data-role="owner"] .p-quotes .qc-owner { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; min-width: 0; border-top: 1px solid var(--grid); padding-top: 4px; }
.p-quotes .qc-mode { margin: 0; }
.p-quotes .qc-cost .qc-expl { color: var(--ink-2); font-size: 12.5px; }
.p-quotes .qc-layout-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.p-quotes .qc-layout-head h4 { margin: 8px 0; }
.p-quotes .qc-layout-head .spacer { flex: 1; }
.p-quotes .qc-layout-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.p-quotes .qc-sheet { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: var(--surface); }
.p-quotes .qc-svg { display: block; width: 100%; height: auto; max-height: 78vh; }
.p-quotes .qc-dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 14px; margin: 0 0 8px; font-size: 13px; }
.p-quotes .qc-dl dt { color: var(--muted); }
.p-quotes .qc-dl dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.p-quotes .qc-legend { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12.5px; color: var(--ink-2); }
.p-quotes .qc-legend li { display: inline-flex; align-items: center; gap: 6px; }
.p-quotes .qc-sw { width: 11px; height: 11px; border-radius: 3px; flex: none; }
/* настройки цены и аналитика фабрики */
.p-quotes .qc-set-top { display: grid; gap: 4px; margin-bottom: 14px; }
.p-quotes .qc-set-top .note { margin: 0; }
.p-quotes .qc-set-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.p-quotes .qc-set-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.p-quotes .qc-set { gap: 4px; }
.p-quotes .qc-set .input { width: 100%; }
.p-quotes .qc-set-wide, .p-quotes .qc-set-bool { grid-column: 1 / -1; }
.p-quotes .qc-set-bool { align-items: flex-start; flex-wrap: wrap; }
.p-quotes .qc-def { font-size: 11.5px; color: var(--muted); font-weight: 400; }
.p-quotes .qc-help { font-size: 12px; color: var(--ink-2); font-weight: 400; line-height: 1.4; flex-basis: 100%; }
.p-quotes .qc-set .table-wrap { flex: none; }
.p-quotes .qc-set > .btn { align-self: flex-start; }
.p-quotes .qc-tiers .input { width: 100%; min-width: 70px; min-height: 30px; padding: 3px 7px; }
.p-quotes .qc-an-grid { margin-bottom: 16px; }
.p-quotes .qc-chart-svg { display: block; width: 100%; height: auto; }
.p-quotes .qc-dist { list-style: none; margin: 0 0 6px; padding: 0; font-size: 13px; }
.p-quotes .qc-dist li { display: flex; justify-content: space-between; gap: 12px; padding: 3px 0; border-bottom: 1px solid var(--grid); }
.p-quotes .q-term-hint { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; }
.p-quotes .q-term-hint .note { margin: 0; }

/* рекомендация */
.p-quotes .q-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 10px; }
.p-quotes .q-kpi { box-shadow: none; }
.p-quotes .q-kpi.main { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); }
.p-quotes .q-kpi.warn .kpi-delta { color: color-mix(in srgb, var(--warn) 60%, var(--ink)); font-weight: 600; }
.p-quotes .q-kpi .kpi-value { font-size: 22px; }
.p-quotes .q-explain { font-size: 13px; color: var(--ink-2); margin: 0; }
.p-quotes .q-index { font-variant-numeric: tabular-nums; font-size: 12.5px; color: var(--ink-2); }
.p-quotes .q-nowrap { white-space: nowrap; }

/* письмо */
.p-quotes .q-tpl { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.p-quotes .q-tpl { min-width: 0; max-width: 100%; }
.p-quotes .q-tpl .input { max-width: 280px; min-width: 0; }
.p-quotes .q-letter-state { display: flex; flex-wrap: wrap; gap: 6px; }
.p-quotes .q-letter-state .pill { white-space: normal; border-radius: 8px; padding: 3px 9px; }
.p-quotes .q-ltable td { padding: 4px 4px; }
.p-quotes .q-ltable .input { width: 100%; min-width: 64px; min-height: 30px; padding: 4px 7px; }
.p-quotes .q-ltable select.input { min-width: 140px; }
.p-quotes .q-size { display: inline-flex; align-items: center; gap: 4px; }
.p-quotes .q-size .input { width: 64px; }
.p-quotes .q-del { min-width: 28px; height: 28px; font-size: 16px; }
.p-quotes .q-lform { margin-top: 14px; }
.p-quotes .q-lform .input, .p-quotes .form-grid .input { width: 100%; }
.p-quotes .q-text { font: 13.5px/1.5 ui-monospace, "Cascadia Mono", Consolas, monospace; min-height: 320px; resize: vertical; }

/* окна */
.p-quotes .q-confirm .q-dl { margin-bottom: 10px; }
.p-quotes .q-preview { max-height: 46vh; }
.p-quotes.dialog .q-mail-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13.5px; line-height: 1.5; max-height: 46vh; overflow-y: auto; background: var(--surface-2); border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; }
.p-quotes.dialog .q-dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 14px; margin: 0 0 10px; font-size: 13.5px; }
.p-quotes.dialog .q-dl dt { color: var(--muted); }
.p-quotes.dialog .q-dl dd { margin: 0; overflow-wrap: anywhere; }
.p-quotes.dialog .q-mono { font-family: ui-monospace, Consolas, monospace; font-size: 12px; }
.p-quotes.dialog .q-notes { margin: 0; padding-left: 18px; }
.p-quotes.dialog .q-reasons { display: grid; gap: 8px; margin-top: 8px; }
.p-quotes.dialog .q-radio { display: flex; gap: 8px; align-items: center; cursor: pointer; }
.p-quotes.dialog .pill.warn { white-space: normal; border-radius: 8px; padding: 4px 10px; display: block; margin: 0; }
.p-quotes.dialog .input { width: 100%; }

/* шаблоны */
.p-quotes .q-tplgrid { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 16px; align-items: start; }
.p-quotes .q-tplgrid .list-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.p-quotes .q-ph { display: flex; flex-wrap: wrap; gap: 6px; }
.p-quotes .q-ph .chip { font-family: ui-monospace, Consolas, monospace; font-size: 12px; }
.p-quotes .q-check { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font-size: 13.5px; }
.p-quotes .q-tplgrid .q-preview { max-height: 520px; }

@media (max-width: 1200px) {
  .p-quotes .q-pgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .p-quotes .qc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-quotes .qc-layout-grid, .p-quotes .qc-set-cards { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1000px) {
  .p-quotes .q-work, .p-quotes .q-tplgrid { grid-template-columns: 1fr; }
  .p-quotes .q-queue { position: static; max-height: none; }
  .p-quotes .q-list { max-height: 56vh; }
  .p-quotes .q-back { display: inline-block; }
  .p-quotes .q-kpis { grid-template-columns: 1fr; }
  .p-quotes .qc-an-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .p-quotes .page-head { align-items: flex-start; }
  .p-quotes .q-rates { width: 100%; }
  .p-quotes .q-rate { padding: 5px 9px; }
  .p-quotes .q-pgrid { grid-template-columns: 1fr 1fr; }
  .p-quotes .q-dl { grid-template-columns: 1fr; gap: 0; }
  .p-quotes .q-dl dd { margin-bottom: 6px; }
  .p-quotes .q-strip-btn { margin-left: 0; width: 100%; }
  .p-quotes .q-tpl { width: 100%; }
  .p-quotes .q-tpl .input { max-width: none; flex: 1 1 0; width: 0; }
  .p-quotes .q-status { width: 100%; }
  .p-quotes .q-text { min-height: 260px; }
  .p-quotes .qc-set-grid { grid-template-columns: minmax(0, 1fr); }
  .p-quotes .qc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .p-quotes .qc-kpi { padding: 12px; }
  .p-quotes .qc-kpi .kpi-value { font-size: 17px; }
  /* позиции заказа на телефоне — карточкой: подписи над полями */
  .p-quotes .qc-order .table-wrap { border: 0; background: none; }
  .p-quotes .qc-rows thead { display: none; }
  .p-quotes .qc-rows, .p-quotes .qc-rows tbody { display: block; }
  .p-quotes .qc-rows tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 8px; padding: 8px; margin-bottom: 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); position: relative; }
  .p-quotes .qc-rows td, .p-quotes .qc-rows th { display: block; padding: 0; border: 0; }
  .p-quotes .qc-rows td[data-label]::before { content: attr(data-label); display: block; font-size: 12px; color: var(--muted); margin-bottom: 2px; }
  .p-quotes .qc-rows .qc-lab { grid-column: 1 / -1; width: auto; }
  .p-quotes .qc-rows .qc-hint-cell { grid-column: 1 / -1; min-width: 0; }
  .p-quotes .qc-rows td:last-child { position: absolute; top: 4px; right: 4px; }
  .p-quotes .qc-order { padding: 10px; }
  .p-quotes .qc-order-head .field { min-width: 0; flex: 1 1 100%; }
  .p-quotes .qc-del-order { margin-left: 0; }
  .p-quotes .qc-bar .btn.primary { width: 100%; }
  .p-quotes .qc-dl { grid-template-columns: 1fr; gap: 0; }
  .p-quotes .qc-dl dd { margin-bottom: 4px; }
}

/* Подсказки в полях калькулятора — заметно бледнее введённых значений. */
.qc input::placeholder, [class*="qc-"] input::placeholder { color: var(--muted); opacity: .6; font-style: italic; }