/* ═══════════════════════════════════════════════════════════════
   Biroplast Solutions — začasna obvestilna vrstica (november 2026)
   Prikaz in skrivanje ureja js/obvestilo.js. Vrstica stoji takoj pod
   glavo (<header id="glava">) in nad <main>, torej v običajnem toku
   strani — z lepljivo glavo se zato nikoli ne prekriva: ob drsenju
   preprosto odide navzgor pod glavo, kot vsa ostala vsebina.
   Barve so izključno iz tokens.css (cyan/blue/navy), samo kot prosojni
   odtenki — nobene nove barve.
   Ko obvestilo ni več potrebno, se odstrani vrstica <link> te datoteke
   in <script> za js/obvestilo.js iz vseh strani; ničesar drugega.
   ═══════════════════════════════════════════════════════════════ */

/* 10. 11. 2026 (2. krog): vrstica je LEPLJIVA — ob drsenju ostane
   pritrjena tik pod lepljivo glavo. `top` je izmerjena višina glave
   (--bp-glava-h, nastavi jo js/obvestilo.js in jo sproti posodablja,
   ker se glava ob drsenju skrči). Ker vrstica ostaja v toku strani,
   vsebine nikoli ne prekrije — prostor zanjo je rezerviran sam. */
.bp-obvestilo{
  position:sticky;
  top:var(--bp-glava-h, 0px);
  z-index:99;                      /* tik pod glavo (100), pod mobilnim menijem (150) */
  background:
    linear-gradient(90deg, rgba(23,185,236,.09), rgba(4,123,193,.06)),
    var(--surface);
  border-bottom:1px solid rgba(4,123,193,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
  color:var(--navy);
  font-family:var(--fb);
  overflow:hidden;
}

/* 10. 11. 2026 (3. krog): besedilo je sredinsko poravnano v dveh vrsticah.
   Mreža s tremi stolpci: ikona levo | besedilo | X desno. Stranska stolpca
   imata ENAKO najmanjšo širino (--bp-obv-stran) in si delita prostor
   enakovredno (1fr), zato je besedilo vedno na sredini CELE vrstice —
   neodvisno od tega, da sta ikona in X različno široka. */
.bp-obvestilo-vsebina{
  --bp-obv-stran:36px;
  display:grid;
  grid-template-columns:minmax(var(--bp-obv-stran),1fr) minmax(0,auto) minmax(var(--bp-obv-stran),1fr);
  align-items:center; column-gap:12px;
  min-height:44px;
  padding-top:8px; padding-bottom:8px;
}

.bp-obvestilo-ikona{
  justify-self:start;
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:50%;
  background:rgba(4,123,193,.08);
  border:1px solid rgba(4,123,193,.16);
  color:var(--blue);
}
.bp-obvestilo-ikona svg{ width:15px; height:15px; display:block; }

.bp-obvestilo-besedilo{
  min-width:0;
  margin:0;
  text-align:center;
  font-size:16.8px; line-height:1.4;   /* +20 % (prej 14px) */
  color:var(--navy);
  text-wrap:balance;
}
.bp-obvestilo-naslov{
  display:block;
  font-family:var(--fh); font-weight:600;
  letter-spacing:.005em;
  color:var(--navy-deep);
}
.bp-obvestilo-datum{ white-space:nowrap; }
.bp-obvestilo-locilo{ display:none; }
.bp-obvestilo-telo{
  display:block;
  margin-top:3px;                        /* majhen, uravnotežen razmik med vrsticama */
  font-weight:600;                       /* tudi druga vrstica krepko */
}

.bp-obvestilo-zapri{
  justify-self:end;
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; margin-right:-6px;
  padding:0; border:0; border-radius:50%;
  background:transparent; color:var(--navy);
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-premium),
             color var(--dur-fast) var(--ease-premium);
}
.bp-obvestilo-zapri svg{ width:16px; height:16px; display:block; }
.bp-obvestilo-zapri:hover{ background:rgba(4,123,193,.10); color:var(--navy-deep); }
.bp-obvestilo-zapri:focus-visible{ outline:2px solid var(--cyan); outline-offset:2px; }

/* zapiranje — kratko, mirno zlaganje višine (brez pri reduced-motion) */
.bp-obvestilo.je-zapiranje{
  transition:height var(--dur-med) var(--ease-premium),
             opacity var(--dur-fast) var(--ease-premium);
  opacity:0;
}

/* telefon: ista dvovrstična sredinska postavitev, le manjša ikona/zrak */
@media (max-width:760px){
  .bp-obvestilo-vsebina{ column-gap:8px; padding-top:9px; padding-bottom:9px; }
  .bp-obvestilo-ikona{ width:26px; height:26px; }
  .bp-obvestilo-ikona svg{ width:14px; height:14px; }
  .bp-obvestilo-besedilo{ font-size:16.2px; line-height:1.35; }   /* +20 % (prej 13.5px) */
  .bp-obvestilo-telo{ margin-top:4px; }
  .bp-obvestilo-zapri{ width:36px; height:36px; margin-right:-6px; }
}

/* Sidra: dokler je vrstica vidna, cilj skoka (#…) pristane pod glavo
   IN vrstico skupaj (+16px zraka), ne zadaj za njima. Razred na <html>
   nastavi in ob zaprtju odstrani js/obvestilo.js. */
html.ima-bp-obvestilo [id]{
  scroll-margin-top:calc(var(--bp-glava-h, 0px) + var(--bp-obvestilo-h, 0px) + 16px);
}

/* programski fokus po zaprtju (na <main>) naj ne riše obrobe */
[data-bp-obvestilo-fokus]:focus{ outline:none; }

@media print{ .bp-obvestilo{ display:none; } }