/* Beállítások view: forms, location list with bulk actions, tariff tables, integration cards, logs.
   Uses the app.css tokens only, so both themes work. */

/* ---------- shared ---------- */
/* Wrappers that receive a table: as grid items they must not take the table's width, the
   .table-wrap inside scrolls instead. */
.slot { min-width: 0; }
.panel .form h2 { font-size: 1rem; padding-top: 0.25rem; }
.panel .form h2:not(:first-of-type) { margin-top: 0.5rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.panel h3 { padding-top: 0.75rem; border-top: 1px solid var(--line); }
.panel__pad { padding: 0 1.25rem 1.25rem; }
.stack { display: grid; gap: 1.25rem; align-content: start; min-width: 0; }
.check-row { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; padding: 0.25rem 0; }
.field > legend.field__label { margin-bottom: 0.375rem; }
fieldset[disabled] .check, fieldset[disabled] .choice { cursor: not-allowed; opacity: 0.7; }

/* ---------- panel internals: toolbar and bulk bar inside a flush panel ---------- */
.panel--flush > .toolbar { padding: 1rem 1.25rem; border-bottom: 1px solid var(--line); }
.panel--flush > .table-foot { border-top: 1px solid var(--line); }
.loc-filters .field { min-width: 8.5rem; flex: 1 1 8.5rem; }
.loc-filters .field--grow, .log-filters .field--grow { flex: 2 1 14rem; }
.log-filters .field { min-width: 9rem; flex: 1 1 9rem; }

.bulkbar {
  position: sticky;
  top: var(--topbar-h);
  z-index: 5;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.875rem;
  padding: 0.625rem 1.25rem;
  background: color-mix(in oklab, var(--hi-vis) 22%, var(--panel));
  border-bottom: 2px solid var(--ink);
}
.bulkbar--hint { position: static; display: flex; gap: 0.5rem; background: var(--panel); border-bottom: 1px solid var(--line); }
.bulkbar__spacer { flex: 1; }
.row-actions { display: inline-flex; gap: 0.25rem; }
.table .w-actions { width: 1%; white-space: nowrap; }
.loc-note { max-width: 16rem; overflow-wrap: anywhere; color: var(--ink-2); }
.loc-table .loc-partner { min-width: 11rem; }
.loc-table td:first-child + td .link-btn { font-weight: 700; }
.table .link-btn.mono { font-family: var(--font-mono); font-size: 0.875rem; }

/* location dialog */
.loc-stock { border: 1px solid var(--line); }
.loc-stock > summary { padding: 0.625rem 0.75rem; cursor: pointer; font-weight: 700; background: var(--panel-alt); }
.loc-stock .table-wrap { border: 0; }
.danger-zone { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; padding-top: 0.875rem; border-top: 1px solid var(--line); }
.danger-zone .icon { display: inline; vertical-align: -0.2em; margin-right: 0.25rem; }

/* bulk create preview */
.code-preview { display: grid; gap: 0.5rem; padding: 0.875rem 1rem; min-height: 4rem; background: var(--panel-alt); border: 1px solid var(--line); }
.code-preview .notice { background: var(--panel); }
.code-list { display: flex; flex-wrap: wrap; gap: 0.375rem; max-height: 9.5rem; overflow-y: auto; }
.code-list .tag { background: var(--panel); }

/* ---------- tariffs ---------- */
.tariff-table td { vertical-align: middle; }
.tariff-table td.r { width: 9.5rem; }
.tariff-table .field { gap: 0.125rem; }
.tariff-table .input { min-height: 2.125rem; padding: 0.25rem 0.5rem; }
.tariff-table tbody tr.group td {
  padding-top: 0.75rem;
  background: var(--panel-alt);
  font: 600 0.6875rem/1.2 var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.tariffs > .form-actions { margin-top: 1.25rem; }

/* ---------- integrations ---------- */
.courier-card .dl { grid-template-columns: minmax(7rem, max-content) minmax(0, 1fr); }
.feature-list { display: flex; flex-wrap: wrap; gap: 0.375rem 1rem; font-size: 0.8125rem; }
.feature-list li { display: inline-flex; align-items: center; gap: 0.25rem; }
.feature-list li .icon { width: 1rem; height: 1rem; }
.feature-list li[data-on="true"] .icon { color: var(--ok); }
.feature-list li[data-on="false"] { color: var(--ink-3); }
.feature-list li[data-on="warn"] { color: var(--warn); }
.choice-row { display: grid; gap: 0.5rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.choice {
  display: flex; gap: 0.625rem; align-items: center; padding: 0.75rem 0.875rem; cursor: pointer;
  background: var(--panel); border: 2px solid var(--line-strong);
}
.choice span { display: grid; gap: 0.125rem; }
.choice input { width: 1.125rem; height: 1.125rem; accent-color: var(--hi-vis); flex: none; }
.choice:hover { border-color: var(--ink-2); }
.choice:has(input:checked) { border-color: var(--ink); background: color-mix(in oklab, var(--hi-vis) 18%, var(--panel)); }
.choice:has(input:checked) .muted { color: var(--ink-2); } /* the tinted background needs the stronger grey */
.choice:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }

/* ---------- logs ---------- */
.seg { display: inline-flex; flex-wrap: wrap; border: 2px solid var(--ink); justify-self: start; max-width: 100%; }
.seg a {
  display: inline-flex; align-items: center; gap: 0.5rem; min-height: 2.5rem; padding: 0 1rem;
  font-weight: 700; color: var(--ink-2); text-decoration: none;
}
.seg a + a { border-left: 2px solid var(--ink); }
.seg a:hover { background: var(--panel-alt); color: var(--ink); }
.seg a[aria-current="page"] { background: var(--ink); color: var(--paper); }
.log-msg { max-width: 28rem; overflow-wrap: anywhere; }
.log-table .link-btn { text-align: left; }
.log-filters .field:has(input[type="date"]) { flex: 0 1 11rem; }
.json {
  margin: 0; padding: 0.875rem 1rem; max-height: 20rem; overflow: auto;
  font: 0.8125rem/1.5 var(--font-mono); white-space: pre-wrap; overflow-wrap: anywhere;
  background: var(--panel-alt); border: 1px solid var(--line);
}

@media (max-width: 640px) {
  .loc-kpis .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .loc-kpis .kpi__value { font-size: 1.375rem; }
  .bulkbar { padding: 0.625rem 0.75rem; }
  .bulkbar__spacer { display: none; }
  .panel--flush > .toolbar { padding: 0.875rem; }
  .seg a { padding: 0 0.75rem; }
}
