/* ==========================================================================
   Navigacijska traka (docs/arhitektura.md, poglavlje 19; odluka 2. 10. 2026.).
   Jedna traka za cijelu stranicu i sve inacice izgleda: vrlo svijetla siva
   podloga s tankom donjom crtom, ljepljiva, pri pomicanju se blago stanji.
   Stavke nemaju crte ni podcrtavanje; prelazak daje blago obojenu podlogu sa
   zaobljenim kutovima, aktivna stavka istu podlogu nesto izrazeniju i podebljan
   tekst. Boja skupine pojavljuje se tek u otvorenom padajucem izborniku (tanka
   crta na vrhu) i na samoj stranici. Pretplata je obrubljeni gumb.
   Izbornik s gumbom (ispod 1400 px) ostaje kakav je bio, bez podcrtavanja.
   ========================================================================== */
:root {
  --cs-nav-podloga: #F6F7F8;
  --cs-nav-crta: #DFE3E7;
  --cs-nav-tekst: #22262B;
  --cs-nav-prelazak: #E8EBEE;
  --cs-nav-aktivno: #DCE1E6;
  --cs-nav-obrub: #1D4E89;
}
.navbar, .navbar.navbar-light, .navbar.navbar-dark {
  background-color: var(--cs-nav-podloga); border-bottom: 1px solid var(--cs-nav-crta); box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none; font-family: var(--cs-font-sans);
}
/* ista unutarnja sirina i isti rubovi kao sadrzaj stranice (main.content) */
.navbar > .navbar-container {
  max-width: var(--cs-content-max); margin-left: auto; margin-right: auto;
  padding-left: calc(32px + var(--cs-rub-stranice)); padding-right: calc(32px + var(--cs-rub-stranice));
}
/* rub mreze stranice: 1,5 em osnovnog pisma na sirokom zaslonu, 6 px ispod 768 px (izmjereno; provjera `navigacija`) */
:root { --cs-rub-stranice: 1.5rem; }
@media (max-width: 767.98px) { :root { --cs-rub-stranice: 6px; } }
/* tekstne stranice (raspored article) ispod 768 px imaju sadrzaj uvucen 16 px vise; traka ga prati */
@media (max-width: 767.98px) { html:has(.page-layout-article) { --cs-rub-stranice: 22px; } }
#quarto-header .navbar, #quarto-header .navbar.navbar-light, #quarto-header .navbar.navbar-dark { padding-left: 0 !important; padding-right: 0 !important; }

/* nigdje crta ni podcrtavanja na stavkama */
.navbar .navbar-nav .nav-link, .navbar .navbar-nav .nav-link .menu-text, .navbar .dropdown-item, .navbar .dropdown-item .dropdown-text,
.navbar .navbar-nav .nav-link:hover, .navbar .navbar-nav .nav-link:focus, .navbar .navbar-nav .nav-link.active,
.navbar .dropdown-item:hover, .navbar .dropdown-item:focus, .navbar .dropdown-item.active {
  text-decoration: none !important; border-bottom: 0 !important; box-shadow: none !important; background-image: none !important;
}
.navbar .navbar-nav .nav-link, .navbar.navbar-light .navbar-nav .nav-link, .navbar.navbar-dark .navbar-nav .nav-link,
.navbar .navbar-nav .nav-link:hover, .navbar .navbar-nav .nav-link:focus, .navbar .navbar-nav .nav-link.active,
.navbar.navbar-dark .navbar-nav .nav-link:hover, .navbar.navbar-dark .navbar-nav .nav-link:focus, .navbar.navbar-dark .navbar-nav .nav-link.active,
.navbar.navbar-light .navbar-nav .nav-link:hover, .navbar.navbar-light .navbar-nav .nav-link:focus, .navbar.navbar-light .navbar-nav .nav-link.active {
  color: var(--cs-nav-tekst);
}
.navbar .navbar-nav .nav-link { font-weight: 500; border-radius: 8px; transition: background-color 150ms ease; }
.navbar .navbar-nav .nav-link:focus-visible, .navbar .dropdown-item:focus-visible, .navbar .navbar-brand:focus-visible, .navbar .navbar-toggler:focus-visible {
  outline: 2px solid var(--cs-nav-obrub); outline-offset: 2px;
}
.navbar .dropdown-item { transition: background-color 150ms ease; }
.navbar .dropdown-item, .navbar .dropdown-item:hover, .navbar .dropdown-item:focus, .navbar .dropdown-item.active, .navbar .dropdown-item:active { color: var(--cs-nav-tekst); }
.navbar .dropdown-item:hover, .navbar .dropdown-item:focus { background-color: var(--cs-nav-prelazak); }
.navbar .dropdown-item.active, .navbar .dropdown-item:active { background-color: var(--cs-nav-aktivno); font-weight: 700; }

/* Traka sa stavkama od 1400 px navise (ispod toga stavke ne stanu u unutarnju sirinu sadrzaja,
   pa vrijedi izbornik s gumbom; _quarto.yml, collapse-below: xxl). Pismo i razmak rastu sa sirinom. */
@media (min-width: 1400px) {
  .navbar { padding-top: 0.4rem; padding-bottom: 0.4rem; }
  .navbar .navbar-nav { align-items: center; column-gap: 2px; }
  .navbar .navbar-nav .nav-link { font-size: clamp(13.6px, calc(13.6px + (100vw - 1400px) * 0.008), 15.2px); line-height: 1.25; padding: 0.4rem clamp(6px, calc(6px + (100vw - 1400px) * 0.014), 8.8px) !important; margin: 0; white-space: nowrap; }
  .navbar .navbar-nav .nav-link:hover, .navbar .navbar-nav .nav-link.show { background-color: var(--cs-nav-prelazak); }
  /* aktivna je stranica ili skupina kojoj stranica pripada (oznaku daje styles/dinamika.html); gumb izbornika sam po sebi nije aktivan */
  .navbar .navbar-nav .nav-link.active:not(.dropdown-toggle), .navbar .navbar-nav .nav-link.cs-nav-aktivno { background-color: var(--cs-nav-aktivno); font-weight: 700; }
  .navbar .dropdown-toggle::after { margin-left: 0.3em; opacity: 0.7; }
  /* padajuci izbornik: bijela ploha, zaobljeni kutovi, tanka crta u boji skupine na vrhu */
  .navbar .dropdown-menu {
    background: #FFFFFF; border: 1px solid var(--cs-nav-crta); border-radius: 10px; padding: 0 6px 6px !important; margin-top: 6px; overflow: hidden;
    box-shadow: 0 10px 28px rgba(16, 24, 32, 0.10); min-width: 15rem;
  }
  .navbar .dropdown-menu::before { content: ""; display: block; height: 3px; margin: 0 -6px 6px; background: var(--cs-nav-skupina, var(--cs-nav-crta)); }
  .navbar .dropdown-item { font-size: 0.92rem; font-weight: 500; padding: 0.45rem 0.7rem; border-radius: 7px; white-space: nowrap; }
  .navbar .dropdown-item:focus-visible { outline-offset: -2px; }
  .navbar .dropdown-menu[aria-labelledby*="gospodarstvo"] { --cs-nav-skupina: var(--cs-skupina-gospodarstvo); }
  .navbar .dropdown-menu[aria-labelledby*="rada"]         { --cs-nav-skupina: var(--cs-skupina-trziste-rada); }
  .navbar .dropdown-menu[aria-labelledby*="cijene"]       { --cs-nav-skupina: var(--cs-skupina-cijene); }
  .navbar .dropdown-menu[aria-labelledby*="nekretnine"]   { --cs-nav-skupina: var(--cs-skupina-nekretnine); }
  .navbar .dropdown-menu[aria-labelledby*="financije"]    { --cs-nav-skupina: var(--cs-skupina-javne-financije); }
  .navbar .dropdown-menu[aria-labelledby*="novac"]        { --cs-nav-skupina: var(--cs-skupina-novac); }
  .navbar .dropdown-menu[aria-labelledby*="energetika"]   { --cs-nav-skupina: var(--cs-skupina-energetika); }
  /* Pretplata: obrubljeni gumb; O stranici ostaje obicna poveznica */
  .navbar .navbar-nav .nav-link[href$="pretplata"], .navbar .navbar-nav .nav-link[href$="pretplata.html"] {
    border: 1px solid var(--cs-nav-obrub) !important; color: var(--cs-nav-obrub); padding-left: 0.7rem !important; padding-right: 0.7rem !important; margin-left: 4px;
  }
  .navbar .navbar-nav .nav-link[href$="pretplata"]:hover, .navbar .navbar-nav .nav-link[href$="pretplata.html"]:hover { color: var(--cs-nav-obrub); background-color: var(--cs-nav-prelazak); }
  .navbar .navbar-nav .nav-link[href$="pretplata"].active, .navbar .navbar-nav .nav-link[href$="pretplata.html"].active { color: var(--cs-nav-obrub); }
}
@media (prefers-reduced-motion: reduce) {
  .navbar, .navbar .navbar-nav .nav-link, .navbar .dropdown-item, .navbar .navbar-brand-logo img, .navbar .navbar-logo { transition: none !important; }
}