/* ============================================================
   ODPISKRS.PL - PRZEGLĄDANIE WG LOKALIZACJI
   Styl przejęty z wariantu „Działy rejestru" (03-dzialy):
   hairline-siatka, monospace etykiety kolumn, czerwony akcent,
   tabular-nums. Ostre rogi. Tylko style specyficzne dla układu
   list lokalizacyjnych - tokeny i chrome z app.css.
   ============================================================ */

/* ---------- nagłówek strony ---------- */
.loc-head{ border-bottom:1px solid var(--line); background:var(--paper); }
.loc-head-inner{ padding:2.6rem 0 2.2rem; }
.loc-eyebrow{ font-family:var(--font-mono); font-size:.7rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3); margin-bottom:.9rem; }
.loc-head h1{ font-family:var(--font-sans); font-weight:700; font-size:clamp(1.8rem,4.2vw,2.7rem); letter-spacing:-.02em; line-height:1.08; text-wrap:balance; color:var(--ink); }
.loc-lead{ margin-top:.9rem; font-size:.98rem; color:var(--ink-2); max-width:68ch; }
.loc-lead .num{ font-weight:600; color:var(--ink); }

/* ---------- breadcrumb ---------- */
.breadcrumb{ padding:1.1rem 0 0; }
.breadcrumb ol{ list-style:none; display:flex; flex-wrap:wrap; align-items:baseline; gap:.5rem; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.03em; color:var(--ink-3); }
.breadcrumb li{ display:flex; align-items:baseline; gap:.5rem; }
.breadcrumb li::after{ content:"/"; color:var(--line-3); }
.breadcrumb li:last-child::after{ content:""; }
.breadcrumb a{ color:var(--ink-2); text-decoration:none; border-bottom:1px solid transparent; transition:color .2s ease, border-color .2s ease; }
.breadcrumb a:hover{ color:var(--red); border-color:var(--red); }
.breadcrumb [aria-current="page"]{ color:var(--ink); }

/* ---------- sekcja listy ---------- */
.loc-section{ padding:2.4rem 0 3.2rem; }
.loc-section-kicker{ display:flex; align-items:center; gap:.7rem; margin-bottom:1.2rem; }
.loc-section-kicker .no{ font-family:var(--font-mono); font-size:.7rem; font-weight:500; color:var(--red); border:1px solid var(--line-3); padding:.18rem .5rem; letter-spacing:.05em; }
.loc-section-kicker .lbl{ font-family:var(--font-mono); font-size:.68rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3); }

/* ---------- nagłówek h2 sekcji (woj.) ---------- */
.loc-h2{ font-family:var(--font-mono); font-size:.68rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3); margin-bottom:1.1rem; }

/* ---------- narzędzia: wyszukiwarka + indeks alfabetyczny ---------- */
.loc-tools{ display:flex; flex-direction:column; gap:1rem; margin-bottom:1.2rem; }
.loc-search{ display:flex; align-items:center; gap:.7rem; border:1.5px solid var(--ink); background:var(--paper); padding:.7rem 1rem; max-width:540px; transition:box-shadow .25s ease; }
.loc-search svg{ color:var(--ink-3); flex:none; }
.loc-search input{ flex:1; min-width:0; border:0; background:transparent; font-family:var(--font-mono); font-size:.92rem; color:var(--ink); }
.loc-search input::placeholder{ color:var(--ink-3); }
.loc-search input:focus{ outline:none; }
.loc-search:focus-within{ box-shadow:0 0 0 3px var(--red-wash); }
.loc-search-inline{ margin-bottom:1.1rem; }

.loc-alpha{ display:flex; flex-wrap:wrap; gap:.25rem; }
.loc-letter{ font-family:var(--font-mono); font-size:.78rem; font-weight:500; min-width:1.7rem; height:1.7rem; display:inline-flex; align-items:center; justify-content:center; padding:0 .35rem; border:1px solid var(--line-3); background:var(--paper); color:var(--ink-2); cursor:pointer; transition:color .15s ease, border-color .15s ease, background-color .15s ease; }
.loc-letter:hover{ border-color:var(--red); color:var(--red); }
.loc-letter.active{ background:var(--red); border-color:var(--red); color:#fff; }
.loc-letter.is-empty{ color:var(--line-3); border-color:var(--line-2); cursor:default; pointer-events:none; }
.loc-letter.loc-reset{ min-width:auto; padding:0 .7rem; letter-spacing:.06em; text-transform:uppercase; font-size:.64rem; color:var(--ink-2); }

/* ---------- wiersz wyniku ---------- */
.loc-result{ font-family:var(--font-mono); font-size:.74rem; letter-spacing:.02em; color:var(--ink-2); margin-bottom:1rem; }
.loc-result b{ color:var(--ink); font-weight:600; }

/* ---------- tabela kartoteczna ---------- */
.loc-table-wrap{ border:1px solid var(--line); overflow-x:auto; -webkit-overflow-scrolling:touch; }
.loc-table{ width:100%; border-collapse:collapse; font-size:.92rem; min-width:520px; }
.loc-table thead th{
  text-align:left; font-family:var(--font-mono); font-size:.62rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3);
  padding:.85rem 1.1rem; border-bottom:1px solid var(--line); background:var(--paper-3);
  white-space:nowrap;
}
.loc-table th.r, .loc-table td.r{ text-align:right; }
.loc-table tbody td{ padding:.78rem 1.1rem; border-bottom:1px solid var(--line-2); vertical-align:baseline; color:var(--ink); }
.loc-table tbody tr:last-child td{ border-bottom:0; }
.loc-table tbody tr{ transition:background-color .18s ease; }
.loc-table tbody tr:hover{ background:var(--paper-3); }
.loc-table tbody tr:hover .place-name{ color:var(--red); }

/* rank (numer porządkowy) */
.loc-table .rank{ font-family:var(--font-mono); font-size:.72rem; font-weight:500; color:var(--ink-3); width:3.2rem; }

/* nazwa miejsca / firmy */
.loc-table .place{ display:inline-flex; align-items:baseline; gap:.5rem; }
.loc-table .place-name{ font-weight:600; color:var(--ink); text-decoration:none; border-bottom:1px solid transparent; transition:color .2s ease, border-color .2s ease; }
.loc-table .place-name:hover{ color:var(--red); border-color:var(--red); }
.loc-table .sub{ display:block; font-family:var(--font-mono); font-size:.68rem; color:var(--ink-3); margin-top:.15rem; letter-spacing:.02em; }

/* kolumna liczbowa */
.loc-table .num{ font-family:var(--font-mono); font-weight:500; color:var(--ink); white-space:nowrap; }
.loc-table td.muted{ color:var(--ink-3); }

/* przeważający link „zobacz" */
.loc-table .go{ font-family:var(--font-mono); font-size:.7rem; font-weight:500; letter-spacing:.04em; color:var(--ink-2); text-decoration:none; white-space:nowrap; }
.loc-table .go:hover{ color:var(--red); }
.loc-table .go .arr{ font-family:var(--font-mono); }

/* ---------- informacja o ograniczeniu listy ---------- */
.loc-note{ margin-top:1.1rem; font-family:var(--font-mono); font-size:.74rem; letter-spacing:.02em; color:var(--ink-2); }
.loc-note b{ color:var(--ink); font-weight:600; }

/* ---------- paginacja ---------- */
.loc-pagination{ margin-top:1.4rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.loc-pagination .pg-link{ font-family:var(--font-mono); font-size:.8rem; font-weight:500; letter-spacing:.02em; color:var(--ink); text-decoration:none; border:1.5px solid var(--ink); padding:.5rem 1rem; transition:background-color .2s ease, color .2s ease; }
.loc-pagination a.pg-link:hover{ background:var(--red); border-color:var(--red); color:#fff; }
.loc-pagination .pg-link.is-off{ color:var(--ink-3); border-color:var(--line); cursor:default; }
.loc-pagination .pg-info{ font-family:var(--font-mono); font-size:.76rem; color:var(--ink-2); }
.loc-pagination .pg-info b{ color:var(--ink); }

/* ---------- pusty stan ---------- */
.loc-empty{ border:1px solid var(--line); border-left:3px solid var(--red); background:var(--paper-2); padding:1.2rem 1.4rem; font-size:.92rem; color:var(--ink-2); }
.loc-empty b{ color:var(--ink); }

/* ---------- responsywność ---------- */
@media (max-width:640px){
  .loc-head-inner{ padding:2rem 0 1.7rem; }
  .loc-section{ padding:1.8rem 0 2.6rem; }
  .loc-table{ font-size:.86rem; }
  .loc-table thead th, .loc-table tbody td{ padding:.65rem .8rem; }
}
