/* Galvenes josla — kopēja lietotnei (/app) un statiskajām lapām (/help, /about).
   Stili dzīvoja app.css, un tāpēc /help un /about galvene izskatījās pavisam citādi: tur bija
   savas plikas saites, nevis tā pati ciļņu rinda. Tagad definīcija ir VIENA; app.html to ielādē
   pirms app.css, abas statiskās lapas — pēc base.css.
   app.js uzliek .top.hide un .top.short-tabs (fitHeader); statiskajās lapās tā nav, tāpēc tām ir
   .top.wrap — josla drīkst pārnest uz nākamo rindu, jo sarukšanas mehānikas tur nav. */
.top { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; gap: 1rem; flex-wrap: nowrap;
  padding: .6rem max(1rem, env(safe-area-inset-right)) .6rem max(1rem, env(safe-area-inset-left));
  background: color-mix(in srgb, var(--card) 92%, transparent); backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line); }
.brand { font-weight: 650; color: var(--ink); letter-spacing: -.01em; white-space: nowrap; display: flex; align-items: center; gap: .4rem; }
.brand i { font-style: normal; }
.top { transition: transform .2s ease; }
.top.hide { transform: translateY(-100%); }
.icon { display: none; width: 2.2rem; height: 2.2rem; border-radius: 8px; font-size: 1.05rem; align-items: center; justify-content: center; }
.icon:hover { background: var(--bg); }
.brand span { display: none; }              /* galvenē tikai ikona; pilns nosaukums — uzbraucot (title) */
.brand i { font-size: 1.25rem; }

.tabs { display: flex; gap: .2rem; flex: none; white-space: nowrap; }
.tabs a { padding: .35rem .75rem; border-radius: 8px; color: var(--muted); flex: none; }
.tabs a.on { color: var(--ink); background: var(--bg); font-weight: 600; }

/* sadaļu nosaukumi: pilnie -> īsie (fitHeader uzliek .short-tabs, kad pilnie vairs nesatilpst) */
.t-short { display: none; }
.top.short-tabs .t-long { display: none; }
.top.short-tabs .t-short { display: inline; }

/* Tikai statiskajām lapām: bez fitHeader() šaurā ekrānā josla citādi izlīstu sāniski.
   `flex: 1 1 auto` + `min-width: 0` ir tas, kas liek to strādāt — ar mantoto `flex: none` rinda
   paliek max-content plata, nesarūk līdz vecāka platumam, un `flex-wrap` nekad nenostrādā
   (telefonā 375 px "Izdevumi (vecie)" vienkārši aizgāja aiz labās malas). */
.top.wrap { flex-wrap: wrap; row-gap: .35rem; }
.top.wrap .tabs { flex: 1 1 auto; min-width: 0; flex-wrap: wrap; white-space: normal; }

/* izvēlnes panelis — kopīgs lietotnes 👤 izvēlnei un sadaļu dropdown'am */
.menu { display: none; position: absolute; right: 0; top: calc(100% + .3rem); z-index: 30; flex-direction: column;
  align-items: stretch; gap: 0; min-width: 13rem; background: var(--card); border: 1px solid var(--line);
  border-radius: 12px; box-shadow: 0 8px 28px rgba(0,0,0,.18); overflow: hidden; }
.menu > * { padding: .65rem 1rem; }
.menu a:hover { background: var(--bg); }

/* ...un, ja arī īsie nesatilpst, sadaļas kļūst par izvēlni; poga rāda, kurā sadaļā esam */
.navdd { position: relative; flex: none; }
.navbtn { font: inherit; font-weight: 600; color: var(--ink); background: var(--bg); border: 1px solid var(--line);
  border-radius: 8px; padding: .35rem .6rem; white-space: nowrap; cursor: pointer; display: flex; gap: .25rem; align-items: center; }
.navbtn i { font-style: normal; font-size: .8em; color: var(--muted); }
.navdd .menu { left: 0; right: auto; min-width: 12rem; }
.navdd.open .menu { display: flex; }
#navmenu a { padding: .6rem 1rem; color: var(--ink); font-size: .92rem; }
#navmenu a.on { background: var(--bg); font-weight: 600; }

/* Statiskajās lapās (/help, /about) sadaļu rinda telefonā kļūst par dropdown — tāpat kā lietotnē,
   tikai bez mērīšanas: tur to pārslēdz fitHeader() pēc reāliem platumiem, šeit pietiek ar robežu.
   760 px ir tas pats skaitlis, kas izmērīts lietotnē: no turienes pilnie nosaukumi satilpst rindā. */
.top.wrap .navdd { display: none; }
@media (max-width: 760px) {
  .top.wrap .tabs { display: none; }
  .top.wrap .navdd { display: block; }
}