/* Moja firma (R3). Tokens only: no hex here. */

/* ---- filters ---- */
.firm-filters { align-items: flex-end; }
.firm-filters .filters-select label { display: block; font: var(--text-label); color: var(--ink-muted); margin-bottom: 6px; }
.firm-cats { flex: 1 1 320px; min-width: 0; border: 0; margin: 0; padding: 0; }
.firm-cats legend { font: var(--text-label); color: var(--ink-muted); padding: 0; margin-bottom: 6px; }
/* A 13x13 checkbox with a sibling label 4 px from the next row is a 19 px
   tall target whose neighbours' centres are 23 px apart - under the WCAG 2.2
   minimum of 24 px, and too close together for the spacing exception to
   apply. The row is given the height and the label the same padding, so the
   whole label is the 24 px target its `for` already makes it. */
.firm-cat { display: inline-flex; align-items: center; gap: 6px; min-height: 24px; margin: 0 var(--space-3) var(--space-2) 0; font: var(--text-body-small); white-space: nowrap; }
.firm-cat label { color: var(--ink); display: inline-flex; align-items: center; min-height: 24px; }
.firm-cat-n { color: var(--ink-muted); font: var(--text-caption); }

/* ---- scope line ---- */
.firm-scope { font: var(--text-body-small); color: var(--ink-muted); margin-bottom: var(--space-4); line-height: 20px; }
.firm-scope b { color: var(--ink); }

/* ---- the three KPI cards ---- */
.firm-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---- the three panels ---- */
/* Explicit column counts, not auto-fit: the third panel has to know when it
   is alone in its row, and no selector can ask auto-fit how many columns it
   made. Three columns need 3x296 + 2x16 = 920 px of grid, which .main gives
   from 968 px (top bar shell, viewport - 48) and again from 1240 px (sidebar
   shell, viewport - 320). In the two bands in between the grid is two wide,
   and there the third panel used to sit alone with an empty cell of its own
   height beside it - 344x1574 px at 1024 px, about two phone screens of
   nothing next to the only panel that lists open opportunities. */
.firm-panels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); align-items: start; }
.firm-panel { min-width: 0; }
@media (max-width: 967px), (min-width: 1200px) and (max-width: 1239px) {
  .firm-panels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .firm-panels > .firm-panel:nth-child(3) { grid-column: 1 / -1; }
}
.firm-panel .card-title { font: var(--text-h2); margin-bottom: var(--space-3); }

/* The shared table, tightened for a narrow panel: no cell gutters, no
   min-width (components.css widens data tables under 1024 px, which would
   push a scrollbar into every panel). */
.firm-panel table.data { min-width: 0; table-layout: fixed; font-size: 13px; }
.firm-panel table.data th { padding: 0 var(--space-2) 6px 0; white-space: normal; }
.firm-panel table.data td { padding: 8px var(--space-2) 8px 0; vertical-align: top; word-wrap: break-word; }
.firm-panel table.data th:last-child, .firm-panel table.data td:last-child { padding-right: 0; }
.firm-panel table.data tbody tr:hover { background: transparent; }
/* Fixed layout takes the widths from the header row and never wraps a
   number, so each panel's second column is sized for its own content and
   the name column keeps the rest. */
.firm-panel table.data .c-n { width: 4.6em; }
.firm-panel table.data .c-km { width: 9em; }
.firm-panel table.data .c-st { width: 6.8em; }
.firm-sub { display: block; font: var(--text-caption); color: var(--ink-muted); margin-top: 2px; }
.firm-date { white-space: nowrap; color: var(--ink-muted); }
.firm-none { font: var(--text-body-small); color: var(--ink-muted); padding: var(--space-2) 0; }
.firm-note { font: var(--text-caption); color: var(--ink-muted); margin-top: var(--space-3); line-height: 16px; }

/* ---- no firm assigned yet ---- */
.firm-empty { max-width: 640px; }
.firm-empty .h2 { margin-bottom: var(--space-2); }
.firm-empty p + p { margin-top: var(--space-2); }

@media (max-width: 719px) {
  .firm-kpis { grid-template-columns: 1fr; }
  .firm-panels { grid-template-columns: 1fr; }
  .firm-filters .filters-select { min-width: 0; flex: 1 1 100%; }
  .firm-filters .select { width: 100%; }
  .firm-cats { flex: 1 1 100%; }
  .firm-panel table.data .c-n { width: 4.2em; }
}

/* Geografija: two lists side by side, stacking on a phone. The city is a link
   because it opens the contracts it counts. */
.firm-geo { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  gap: var(--space-3) var(--space-4); }
.firm-geo-head { margin: 0 0 6px; }
.firm-geo-list { list-style: none; margin: 0; padding: 0; }
.firm-geo-list li { padding: 5px 0; border-top: 1px solid var(--border); }
.firm-geo-list li:first-child { border-top: none; }
.firm-geo-list .firm-sub { display: block; }