/* GEO-01 (wyszukiwarka adresow): nadpisania stylu aplikacji do wygladu Orbispect. Laduje sie PO stil.css i katalogi.css (patrz skrypty/motyw/stosuj_motyw.py).
   Zasada: najpierw zmienne (paleta, czcionki), potem tylko to, czego zmienne nie obejmuja (naglowek, chipy nawigacji, przyciski, liczby). Jeden motyw: ciemny, jak cala strona Orbispect. */

:root:root:root {
  color-scheme: dark !important;

  --font-serif: var(--os-display);
  --font-ui: var(--os-body);
  --font-mono: var(--os-mono);

  --tlo: #06080a;
  --powierzchnia: #0d1217;
  --powierzchnia-2: #10161c;
  --powierzchnia-3: #172029;
  --tekst: #e8eef0;
  --tekst-2: #93a4ad;
  --linia: rgba(160, 190, 200, .16);
  --obrys: rgba(160, 190, 200, .32);

  --akcent: #c8ff4d;
  --akcent-hover: #d8ff7d;
  --akcent-tlo: rgba(200, 255, 77, .12);
  --akcent-tekst: #c8ff4d;
  --na-akcencie: #06080a;
  --fokus: #c8ff4d;
  --halo: rgba(200, 255, 77, .22);

  --pin: #c8ff4d;
  --mark-tlo: rgba(255, 180, 84, .30);

  --kontur-cienki: #0b1218;
  --kontur-gruby: #0e171f;
  --cien-kolor: rgb(0 0 0 / .6);
  --filtr-kafli: var(--filtr-ciemny);
}

html { background: #06080a; }
body {
  background: #06080a;
  font-family: var(--os-body);
}
/* tlo: delikatne poswiaty jak na stronie glownej */
body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(1200px 700px at 78% -10%, rgba(109, 226, 226, .05), transparent 60%),
    radial-gradient(900px 600px at 8% 110%, rgba(200, 255, 77, .04), transparent 60%);
}
.strona { min-height: calc(100vh - 68px); }

/* naglowek narzedzia: etykieta produktu (os-kod) zastepuje "Demonstracja", przelacznik motywu zbedny (jeden motyw) */
.nadtytul, .motyw { display: none !important; }
.naglowek { padding-top: 1.75rem; }
.pasek { min-height: 0; gap: 0; }

.menu, .k-nawigacja { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .25rem; }
.menu__link, .k-nawigacja__link {
  display: inline-flex; align-items: center; min-height: 2.5rem;
  padding: .4rem 1rem;
  border: 1px solid var(--os-line-2); border-radius: 99px;
  background: transparent;
  font-family: var(--os-mono); font-size: .72rem; font-weight: 400; letter-spacing: .1em; text-transform: uppercase;
  color: var(--os-txt-2); text-decoration: none;
  transition: color .2s, border-color .2s, background-color .2s;
}
.menu__link:hover, .k-nawigacja__link:hover { border-color: var(--os-lime); color: var(--os-lime); background: transparent; }
.menu__link[aria-current="page"], .k-nawigacja__link[aria-current="page"] {
  background: var(--os-lime); border-color: var(--os-lime); color: #06080a; font-weight: 500;
}
.menu__link::after, .k-nawigacja__link::after, .menu__link::before, .k-nawigacja__link::before { content: none; }

/* tytul i wstep: Unbounded w lekkiej wadze jak h1 na orbispect.com */
.tytul {
  font-family: var(--os-display); font-weight: 300;
  font-size: clamp(1.9rem, 1.1rem + 3.2vw, 3.4rem);
  line-height: 1.12; letter-spacing: -.01em;
}
.tytul__uwaga {
  font-family: var(--os-mono); font-style: normal; font-weight: 400;
  font-size: .68rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--os-txt-3); margin-top: 1.1rem;
}
.lead { color: var(--os-txt-2); }
.statystyka { border-left: 2px solid var(--os-lime); }
.statystyka__liczba { font-family: var(--os-display); font-weight: 300; color: var(--os-lime); font-size: clamp(1.6rem, 1.1rem + 2vw, 2.6rem); }
.statystyka__opis { font-family: var(--os-mono); font-weight: 400; font-size: .68rem; letter-spacing: .14em; color: var(--os-txt-3); }

/* etykiety pol i przyciski: czcionka mono jak przyciski na stronie glownej */
.szukaj__etykieta { font-family: var(--os-mono); font-weight: 400; letter-spacing: .16em; color: var(--os-txt-3); }
.przycisk {
  border-radius: 10px;
  font-family: var(--os-mono); font-weight: 500; letter-spacing: .06em; text-transform: uppercase; font-size: .78rem;
}
.przycisk--glowny { box-shadow: 0 0 0 0 rgba(200, 255, 77, .4); }
.przycisk--glowny:hover { box-shadow: 0 0 28px 0 rgba(200, 255, 77, .22); }

/* stopka narzedzia */
.stopka { border-top: 1px solid var(--os-line); }
.stopka__glowna, .stopka__atrybucja, .stopka__mala { font-family: var(--os-body); color: var(--os-txt-3); }

/* pokaz w narzedziu (Podpowiadaj blisko, karta wyniku, Czemu warto): podpisy w mono jak etykiety pol, tytuly sekcji i karty w Unbounded jak h1 */
.blisko__etykieta { font-family: var(--os-mono); font-weight: 400; letter-spacing: .14em; color: var(--os-txt-3); }
.pokaz__tytul, .sklep__tytul { font-family: var(--os-display); font-weight: 300; }
.pokaz__tytul { font-size: clamp(1.45rem, 1.05rem + 1.6vw, 2.1rem); line-height: 1.18; }

/* po wyniku strona przewija sie do karty: nad nia zostaje miejsce na przyklejony naglowek serwisu (68 px), zeby nie zaslanial tytulu karty */
.wyniki { scroll-margin-top: 5.25rem; }

/* linijki pokrycia pod tytulem (Dzis, W przygotowaniu): dwa wiersze, wiersz z krajami zawija sie czytelnie */
.os-pokrycie { max-width: 52rem; font-size: 12px; }
.os-pokrycie p + p { margin-top: .35rem; }
