/*
  Rám aplikácie. Farebná paleta aj prepínanie svetlej/tmavej schémy sú v `gate-ui.css`
  (vrstva Gate.Ui) — tu sa už len používajú, aby bol zdroj farieb jediný.
*/

/*
  PÍSMO — vedomá zmena oproti pôvodnému pravidlu „len systémové" (2026-08-18, redizajn).

  Doteraz tu stálo, že vlastný font by bol ďalšia závislosť (licencia, SBOM) a že rám by sa
  rozišiel s komponentmi FluentUI. Prvé už neplatí: majiteľ produktu si vyžiadal vlastnú vizuálnu
  identitu a Archivo je pod SIL OFL 1.1 (licenčný text a atribúcia autorovi — Omnibus-Type —
  ležia vedľa súborov v `fonts/OFL.txt`), takže je licenčne čisté aj pre on-prem dodávku.
  Druhé prestalo platiť tým, že komponenty FluentUI čítajú rodinu z tokenu `--body-font`, ktorý
  ukazuje na to isté písmo (gate-ui.css) — rám a web komponenty teda sadzia jednou rodinou.

  Dodáva sa PODĽA MANTINELU dodávateľského reťazca: dva podmnožinové súbory woff2 (latin,
  latin-ext; spolu ~67 kB) ležia vo `wwwroot/fonts/`, žiadne CDN, žiadny balík, žiadne sieťové
  volanie mimo stanice (CSP `font-src 'self'`). Súbor je VARIABILNÝ (os hmotnosti 100–900),
  takže jedna dvojica súborov pokrýva bežný text (400), zvýraznenie (600) aj nadpisy (800) —
  statické rezy by boli šesť súborov namiesto dvoch.

  `font-display: swap` je zámer: na pomalej stanici sa text vykreslí systémovým písmom hneď
  a preberie Archivo po dopočítaní — obsah aplikácie nikdy nečaká na písmo.
*/
@font-face {
    font-family: "Archivo";
    font-style: normal;
    font-weight: 100 900;
    font-stretch: 100%;
    font-display: swap;
    src: url("fonts/archivo-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Archivo";
    font-style: normal;
    font-weight: 100 900;
    font-stretch: 100%;
    font-display: swap;
    src: url("fonts/archivo-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*
  Rodina je token (gate-ui.css), nie zoznam opísaný v troch súboroch — číta ho aj `--body-font`
  pre web komponenty. Slovenská diakritika (ľ, š, č, ť, ž, ý, á, í, é, ú, ä, ô, ŕ, ĺ, ň, ď)
  leží v rozsahu latin-ext, preto sú súbory dva.
*/
html, body {
    font-family: var(--gate-font);
}

/*
  Plocha stránky sa berie z Fluent tokenov, takže sa v tmavej schéme prekreslí spolu
  s komponentmi. Bez toho by ostal biely podklad pod tmavými kartami a text stránky
  (biely v tmavej schéme) by na ňom zmizol.
*/
body {
    /* Predvolený 8 px okraj prehliadača by okolo celej aplikácie (sidebar, login panel,
       100dvh plochy) kreslil svetlý rám a pridával zvislý presah — rám appky ho nuluje. */
    margin: 0;
    background-color: var(--gate-bg);
    color: var(--gate-text);
    /*
      Základ sadzby je 15 px (dizajnový systém „Modernist"), nie 14 px: pri Archive s vyššou
      x-výškou je 14 px na registri s ôsmimi stĺpcami na hranici čitateľnosti. Ovládacie prvky
      (polia, tlačidlá, bunky tabuliek) si svojich 14 px pýtajú samy — hustota je vlastnosť
      dátovej obrazovky, nie celej stránky.
    */
    font-size: 15px;
    line-height: 1.55;
}

/*
  Zvyšok rámu (skratka na obsah, chybová lišta) je mimo `.content`, takže by nadpisy
  v ňom ostali na predvolenej sadzbe prehliadača. Rodina a hmotnosť nadpisov sú tu, mierka
  vnútri obsahu nižšie.
*/
h1, h2, h3, h4, h5, h6 {
    font-family: var(--gate-font-heading);
    font-weight: var(--gate-heading-weight);
    line-height: 1.12;
    letter-spacing: -0.015em;
    margin: 0 0 .5rem;
}

/*
  Na úzkej obrazovke prekrýva horných ~56 px okna lišta aplikácie (sticky `.sidebar`
  v MainLayout.razor.css). Bez odsadenia posunu by prvok, na ktorý stránka skočí — kotva,
  prechod na prvé chybné pole formulára — skončil presne pod ňou a používateľ by ho nenašiel.
*/
@media (max-width: 640.98px) {
    html {
        scroll-padding-top: calc(var(--gate-nav-bar-h, 3.5rem) + env(safe-area-inset-top, 0px));
    }
}

a {
    color: var(--gate-accent-text);
    text-underline-offset: 3px;
}

/*
  OHNISKOVÝ PRSTENEC PLATÍ PRE KAŽDÝ ODKAZ, NIE LEN PRE TIE V RÁME.

  Tlačidlá, vstupy, selecty aj odkazy v bočnom paneli mali správny 2 px akcentový prstenec —
  ale odkazy v OBSAHU („Detail", „Otvoriť konanie", „Stiahnuť PDF", drobčeková cesta) a skratka
  na obsah dostávali predvolený 1 px čierny obrys prehliadača, lebo pravidlo bolo písané vždy
  pri konkrétnom komponente (kontrola 2026-08-19, položka #14). Prstenec je vlastnosť sústavy,
  nie jedného prvku, preto stojí na holom selektore tu — komponenty s vlastnou kresbou (vstupy
  s odstupom 0, položky navigácie so záporným odstupom) ho prebijú svojou špecificitou.

  `:focus-visible`, nie `:focus`: po kliknutí myšou sa prstenec nekreslí, po klávese Tab áno.
*/
a:focus-visible {
    outline: 2px solid var(--gate-accent);
    outline-offset: 2px;
}

p {
    margin: 0 0 .75rem;
}

.content {
    /*
      Vodorovné odsadenie sa na úzkej obrazovke nemá odkiaľ vziať: pravidlo v MainLayout.razor.css
      platí až od 641 px. Bez tohto riadku sa text na mobile dotýka okraja displeja.
    */
    padding: 1rem 1rem 0;
}

/* ── typografická hierarchia ─────────────────────────────────────────────── */

/*
  Mierka nadpisov OBSAHU je posunutá o dva stupne oproti dizajnovému systému: nadpis obrazovky
  je `h1`, ale v predlohe je to veľkosť „h3" (25 px). Predlohové 42 px patrí titulnej strane,
  nie registru s tabuľkou — a pod 25 px nadpisom ostáva pre podnadpisy karty ešte 20/16 px,
  teda tri rozlíšiteľné stupne. Rodinu a hmotnosť (800) nesie pravidlo pre všetky nadpisy vyššie.
*/
.content h1 {
    margin: 0 0 .625rem;
    font-size: 25px;
    /* Dlhé slovenské nadpisy registrov sa lámu na vyrovnané riadky, nie na jedno visiace slovo. */
    text-wrap: balance;
}

.content h2 {
    margin: 1.5rem 0 .5rem;
    font-size: 20px;
}

.content h3 {
    margin: 1.25rem 0 .5rem;
    font-size: 16px;
}

.content h4 {
    margin: 1rem 0 .35rem;
    font-size: 14px;
}

/*
  Piaty stupeň nosia časti bloku vloženého pod nadpis sekcie formulára (pripomienkovanie návrhu
  zmluvy v časti B2). Bez vlastnej mierky by mal predvolených ~11 px prehliadača — menej než
  text, ktorý uvádza.
*/
.content h5 {
    margin: 1rem 0 .35rem;
    font-size: 14px;
}

/*
  Nadpis na začiatku karty odsadzuje už vnútorný okraj karty — druhý raz by ho odtlačil od hrany.
  To isté platí pre nadpis na začiatku sekcie (`.gate-section`): odstup medzi sekciami nesie
  pravidlo `.gate-section + .gate-section` v gate-ui.css, takže vlastný horný margin nadpisu by
  sa k nemu pripočítal a každá sekcia by mala inú medzeru podľa toho, či nadpis má, alebo nie.
*/
.content .gate-card__body > h1:first-child,
.content .gate-card__body > h2:first-child,
.content .gate-card__body > h3:first-child,
.content .gate-section > h2:first-child,
.content .gate-section > h3:first-child {
    margin-top: 0;
}

h1:focus {
    outline: none;
}
