/* ============================================================
   Pastāvīgā hroma — augšējā josla, breadcrumbs, tēmu josla
   Šie elementi pārejās nepārzīmējas (view-transition-name).
   ============================================================ */

/* ---- Augšējā josla --------------------------------------------------
   Dizainā: virsraksts 30,59 · atpakaļ 1447,70 · mājas 1585,67
            EN RU 1701,78 · skaņa 1847,68                             */
/* Ikonas novietotas pēc dizaina koordinātām, nevis plūsmā. Tad tās
   paliek savā vietā arī tad, kad kāda no tām nav redzama — piemēram,
   kad valodu slēdzis vēl ir paslēpts vai lapa ir pati sākumlapa. */
.augsa {
  position: absolute;
  inset: 0 0 auto;
  height: calc(var(--u) * 180);
  z-index: 10;
  view-transition-name: augsa;
  pointer-events: none;
}
.augsa > * { pointer-events: auto; }

.augsa__logo {
  position: absolute;
  left: calc(var(--u) * 30);
  top: calc(var(--u) * 59);
  height: calc(var(--u) * 58);
  width: auto;
}

/* Pieskāriena laukums 76×76 ap katru ikonu — dizaina ikonas ir
   37…49 px, kas pirkstam ir par maz. */
.augsa__ikona {
  position: absolute;
  top: calc(var(--u) * 52);
  display: grid;
  place-items: center;
  width: calc(var(--u) * 76);
  height: calc(var(--u) * 76);
  color: var(--teksts);
}
.augsa__ikona--atpakal { right: calc(var(--u) * 416.5); }
.augsa__ikona--majas   { right: calc(var(--u) * 272.5); }
.augsa__ikona--skana   { right: calc(var(--u) * 13); }
.augsa__ikona svg { width: calc(var(--u) * 46); height: auto; display: block; }
.augsa__ikona--atpakal svg { width: calc(var(--u) * 37); }
.augsa__ikona--skana  svg { width: calc(var(--u) * 44); }

.augsa__valodas {
  position: absolute;
  right: calc(var(--u) * 125);
  top: calc(var(--u) * 72);
  display: flex;
  gap: calc(var(--u) * 18);
  font-size: calc(var(--u) * 35);
  font-weight: 600;
  line-height: 1;
}
.augsa__valodas button[aria-current="true"] { opacity: 1; }
.augsa__valodas button { opacity: 0.65; }

/* Uz pilnekrāna ekrāniem (karte, attēls, saraksts virs kartes) dizainā
   logotipa nav — kreiso augšējo stūri aizņem leģenda vai ceļš. */
html[data-ekrans="karte"] .augsa__logo,
html[data-ekrans="attels"] .augsa__logo,
html[data-ekrans="saraksts"] .augsa__logo { display: none; }

/* Sākumā tikai LV — pārējās parādās, kad tulkojumi ir gatavi. */
html[data-valodas="lv"] .augsa__valodas { display: none; }

/* ---- Breadcrumbs ----------------------------------------------------
   Dizainā: 29,142 · Regular 25px                                      */
.celins {
  position: absolute;
  left: calc(var(--u) * 29);
  top: calc(var(--u) * 140);
  /* <p> noklusētā 1em atkāpe nobīdīja ceļu par 25 px uz leju — tieši
     uz satura paneļa malas. Dizainā starp tiem ir 25 px. */
  margin: 0;
  font-size: var(--sv-josla);
  line-height: 1;
  color: var(--teksts-kluss);
  z-index: 10;
  view-transition-name: celins;
}
.celins__sep { opacity: 0.55; margin: 0 calc(var(--u) * 6); }

/* Ceļa posmi ved atpakaļ uz savu sadaļu. Pieskāriena laukums ir
   augstāks par burtiem — pirksts nav 25 px precīzs. */
.celins a,
.legenda__celins a {
  display: inline-block;
  padding-block: calc(var(--u) * 12);
  margin-block: calc(var(--u) * -12);
  color: var(--teksts-pasiv-1);
  text-decoration: underline;
  text-decoration-color: rgba(255, 255, 255, 0.3);
  text-underline-offset: 0.2em;
  text-decoration-thickness: calc(var(--u) * 1);
}
.celins a:active,
.legenda__celins a:active { color: var(--teksts); }
@media (hover: hover) {
  .celins a:hover,
  .legenda__celins a:hover { color: var(--teksts); text-decoration-color: currentColor; }
}

/* ---- Tēmu josla apakšā ----------------------------------------------
   Dizainā: josla 30,990 1860×60 · aktīvā sadaļa pacelta par 10px
   Josla ir aktīva pārslēgšanās — nevis dekorācija.                    */
.temas {
  position: absolute;
  left: var(--mala);
  right: var(--mala);
  bottom: calc(var(--u) * 30);
  height: calc(var(--u) * 60);
  display: flex;
  gap: calc(var(--u) * 4);
  z-index: 10;
  view-transition-name: temas;
}

.temas__poga {
  flex: 1;
  display: grid;
  place-items: center;
  height: 100%;
  background: var(--tema, #555);
  font-size: var(--sv-josla);
  font-weight: 500;
  line-height: 1;
  /* Saturs glabājas dabiskā reģistrā; versālburti ir noformējums. */
  text-transform: uppercase;
  letter-spacing: 0.035em;
  text-align: center;
  padding-inline: calc(var(--u) * 8);
  transition: translate var(--t-hover) var(--likne-hover),
              filter var(--t-hover) var(--likne-hover);
}

/* Aktīvā sadaļa izceļas, paceļoties par 10px — tieši kā dizainā. */
.temas__poga[aria-current="page"] {
  translate: 0 calc(var(--u) * -10);
  box-shadow: 0 calc(var(--u) * 6) calc(var(--u) * 14) var(--ena);
}
.temas__poga:active { filter: brightness(1.2); }
@media (hover: hover) {
  .temas__poga:not([aria-current="page"]):hover {
    translate: 0 calc(var(--u) * -4);
    filter: brightness(1.12);
  }
  .augsa__ikona { transition: scale var(--t-hover) var(--likne-hover); }
  .augsa__ikona:hover { scale: 1.1; }
}

.temas__poga--zeme       { --tema: var(--tema-zeme); }
.temas__poga--vara       { --tema: var(--tema-vara); }
.temas__poga--religija   { --tema: var(--tema-religija); }
.temas__poga--kultura    { --tema: var(--tema-kultura); }
.temas__poga--notikumi   { --tema: var(--tema-notikumi); }
.temas__poga--represijas { --tema: var(--tema-represijas); }

/* ---- Mobilais -------------------------------------------------------- */
@media (max-width: 820px) {
  /* Mobilajā ikonas atgriežas plūsmā — dizaina koordinātas te vairs
     neder, jo tās ir domātas 1920 px platam ekrānam. */
  .augsa {
    position: sticky;
    inset: auto;
    top: 0;
    height: auto;
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 8);
    padding: calc(var(--u) * 10) var(--mala);
    backdrop-filter: blur(calc(var(--u) * 12));
    background: rgba(20, 20, 22, 0.75);
    pointer-events: auto;
  }
  .augsa__logo {
    position: static;
    height: calc(var(--u) * 22);
    margin-right: auto;
  }
  .augsa__ikona,
  .augsa__ikona--atpakal,
  .augsa__ikona--majas,
  .augsa__ikona--meklet,
  .augsa__ikona--skana {
    position: static;
    right: auto;
    top: auto;
    width: calc(var(--u) * 38);
    height: calc(var(--u) * 38);
  }
  .augsa__ikona svg,
  .augsa__ikona--atpakal svg,
  .augsa__ikona--meklet svg,
  .augsa__ikona--skana svg { width: calc(var(--u) * 22); }
  .augsa__valodas {
    position: static;
    font-size: calc(var(--u) * 15);
    gap: calc(var(--u) * 8);
  }

  .celins {
    position: static;
    margin: calc(var(--u) * 12) var(--mala) calc(var(--u) * 14);
    line-height: 1.35;
  }

  .temas {
    position: static;
    height: auto;
    flex-wrap: wrap;
    margin: calc(var(--u) * 24) var(--mala) calc(var(--u) * 24);
  }
  .temas__poga {
    flex: 1 1 45%;
    padding-block: calc(var(--u) * 12);
  }
  .temas__poga[aria-current="page"] { translate: none; outline: 2px solid #fff; }
}

/* ============================================================
   Dīkstāves brīdinājums

   Parādās pēc 3 minūtēm miera; pēc vēl 15 sekundēm ekrāns
   atgriežas sākumā. Jebkurš pieskāriens to atceļ.
   ============================================================ */

.dikstave {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  background: rgba(10, 10, 12, 0.78);
  backdrop-filter: blur(calc(var(--u) * 10));
  animation: dikstave-ienak 700ms var(--likne-aiziet) both;
}
@keyframes dikstave-ienak { from { opacity: 0; } }

.dikstave__logs {
  display: grid;
  justify-items: center;
  gap: calc(var(--u) * 18);
  padding: calc(var(--u) * 56) calc(var(--u) * 72);
  background: var(--panelis);
  text-align: center;
}
.dikstave__jaut {
  margin: 0;
  font-size: var(--sv-virsraksts);
  font-weight: 500;
}
.dikstave__laiks {
  margin: 0;
  font-size: var(--sv-valoda);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--teksts-pasiv-1);
}
.dikstave__poga {
  padding: calc(var(--u) * 16) calc(var(--u) * 44);
  background: rgba(255, 255, 255, 0.14);
  font-size: var(--sv-saraksts);
  font-weight: 500;
}

/* Diagnostika ar ?diag — tikai uzstādīšanas un pārbaudes laikā. */
.diag {
  position: fixed;
  right: calc(var(--u) * 8);
  bottom: calc(var(--u) * 8);
  z-index: 200;
  padding: calc(var(--u) * 6) calc(var(--u) * 12);
  background: rgba(0, 0, 0, 0.7);
  font-size: var(--sv-mazs);
  font-variant-numeric: tabular-nums;
  pointer-events: none;
}

/* Meklēšana augšējā joslā. Dizainā 2021. gadā tās nebija — toreiz
   navigācija bija tikai pa koku. Ar tūkstoš personu reģistru meklēšana
   ir otrs nepieciešams ceļš pie satura, tāpēc ikona stāv blakus mājām,
   kur to meklē roka. */
.augsa__ikona--meklet { right: calc(var(--u) * 344.5); }
.augsa__ikona--meklet svg { width: calc(var(--u) * 40); }
/* Šis stāv aiz mobilā bloka, tāpēc mobilais izmērs jāatkārto šeit —
   citādi telefonā lupa ir divreiz lielāka par pārējām ikonām. */
@media (max-width: 820px) {
  .augsa__ikona--meklet { right: auto; }
  .augsa__ikona--meklet svg { width: calc(var(--u) * 22); }
}

html[data-ekrans="meklet"] .augsa__ikona--meklet { opacity: 0.4; pointer-events: none; }

/* Sadaļa, kas vēl nav publicēta: vieta joslā paliek, bet nav klikšķināma. */
.temas__poga[aria-disabled="true"] {
  opacity: 0.45;
  cursor: default;
  pointer-events: none;
}