/* © 2026 Ivo Čajkovac. Sva prava pridržana. Kopiranje, mijenjanje i objavljivanje ovog koda i podataka bez pisanog odobrenja autora nije dopušteno (vidi LICENSE). */
/* Parkiraj Osijek 5.0 — novi izgled (korak 1): mekani "staklo" stil, plavo-bijela paleta,
   plutajuća traka, zaglavlje s pješačkim mostom. Učitava se poslije app.css i samo nadjačava. */

:root{
  --bg:#EAF2FC; --surface:#FFFFFF; --surface-2:#EEF4FC; --surface-3:#DCE8F7;
  --border:#B4C8E4; --border-strong:#6F8DB3;
  --accent:#0F4FA0; --accent-soft:#DCE9F8;
  --radius:20px; --nav-h:64px;
  --shadow:0 1px 2px rgba(10,42,94,.10), 0 10px 28px rgba(10,42,94,.16);
  --shadow-lg:0 -4px 24px rgba(10,42,94,.16);
  /* tapeta mosta */
  --sky1:#CFE3FF; --sky2:#F4F9FF; --bridge:#0F4FA0; --water1:#8FB9EE; --water2:#4F8FDB;
  --sun:inline; --moon:none; --bglow:none;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#08152B; --surface:#0F2445; --surface-2:#14305C; --surface-3:#1A3A6E;
    --border:#28457A; --border-strong:#5D7FB8;
    --sky1:#08183A; --sky2:#0F2A5C; --bridge:#8FA8FF; --water1:#153A78; --water2:#0C2653;
    --sun:none; --moon:inline; --bglow:url(#glowf);
  }
}
:root[data-theme="dark"]{
  --bg:#08152B; --surface:#0F2445; --surface-2:#14305C; --surface-3:#1A3A6E;
  --border:#28457A; --border-strong:#5D7FB8;
  --sky1:#08183A; --sky2:#0F2A5C; --bridge:#8FA8FF; --water1:#153A78; --water2:#0C2653;
  --sun:none; --moon:inline; --bglow:url(#glowf);
}

/* ---- tipografija: mekana, bez uskih velikih slova ---- */
.brand h1,.pill-brand b{font-family:'IBM Plex Sans',system-ui,sans-serif; font-weight:700; text-transform:none; letter-spacing:0;}
.brand h1{font-size:21px;} .pill-brand b{font-size:15px;}
.brand .logo,.pill-brand .logo{font-family:'IBM Plex Sans',system-ui,sans-serif; font-weight:800; border-radius:11px;}

/* ---- list (donji panel) ---- */
.side{border-radius:32px 32px 0 0; overflow:hidden;}
.grab i{background:var(--border-strong); opacity:.55;}
.hero{display:none; flex:none; height:min(44vw,190px); background:linear-gradient(180deg,var(--sky1),var(--sky2));}
.hero svg{width:100%; height:100%; display:block;}
.side[data-size="full"] .hero{display:block;}
.side[data-size="full"] .grab i{background:#fff; opacity:.9; box-shadow:0 1px 3px rgba(10,42,94,.35);}

/* ---- kartice, gumbi, polja ---- */
.card{border-radius:22px; border-width:1.5px; box-shadow:var(--shadow-sm);}
.seg{gap:9px;}
.seg button{border-radius:20px; border-width:1.5px; border-color:var(--border);}
.seg button[aria-pressed="true"]{background:var(--accent); border-color:var(--accent); box-shadow:none; color:#fff;}
.seg button[aria-pressed="true"] span{color:#DCEAFF;}
.seg button[aria-pressed="true"]::before{background:#fff; opacity:.9;}
.pay{border-radius:999px; min-height:56px; background:linear-gradient(135deg,#2F7FE0,#0F4FA0); color:#fff;
  box-shadow:0 10px 22px rgba(15,79,160,.32);}
.pay.off{background:var(--surface-3); color:var(--ink-2); box-shadow:none;}
.btn,.link-btn{border-radius:999px;}
.plate{border-radius:16px;}
.sel,.field,.search input{border-radius:14px;}
.fab{border-radius:17px; border:1.5px solid var(--border);}
.pill-brand,.status-pill,.langsw{border-radius:999px; border:1px solid var(--border);}

/* ---- donja traka: plutajuća tableta (samo mobitel) ---- */
@media (max-width:899px){
  .tabbar{left:10px; right:10px; bottom:calc(10px + var(--safe-b)); height:var(--nav-h); padding:0 6px;
    border:1px solid var(--border); border-radius:999px; background:var(--surface);
    box-shadow:0 8px 24px rgba(10,42,94,.24);}
  .tab{border-radius:999px; margin:6px 0; font-size:11px; gap:2px;}
  .tab svg{width:21px; height:21px;}
  .tab[aria-selected="true"]{background:var(--accent); color:#fff;}
  .tab[aria-selected="true"]::before{display:none;}
  /* list i traka: isti razmaci sa strana, sve zaobljeno */
  .side{left:10px; right:10px; bottom:calc(var(--nav-h) + var(--safe-b) + 20px); border-radius:30px; overflow:hidden;
    box-shadow:0 10px 30px rgba(10,42,94,.22);}
  .side[data-view="info"]{top:calc(10px + var(--safe-t)); bottom:calc(var(--nav-h) + var(--safe-b) + 20px); border-radius:30px; box-shadow:0 10px 30px rgba(10,42,94,.22); padding-bottom:0; max-height:none;}
}
@media (max-width:370px){ .tab{font-size:10px;} }

/* ---- naslovi i brojke: mekani sans umjesto uskih velikih slova ---- */
h2.vh{font:700 26px/1.1 'IBM Plex Sans',system-ui,sans-serif; text-transform:none; letter-spacing:0; margin:6px 0;}
.pl-head b{font-family:'IBM Plex Sans',system-ui,sans-serif; font-weight:700; font-size:24px; letter-spacing:0;}
.zbig,.price .amt{font-family:'IBM Plex Sans',system-ui,sans-serif; font-weight:800;}
.zbig{border-radius:18px;}
.price .amt{font-size:26px;}
.tab{font-size:10.5px;}

/* ručka je u punom prikazu na vrhu zaglavlja s mostom */
.side[data-size="full"] .grab{position:absolute; top:4px; left:0; right:0; margin:0; height:24px; z-index:3;}

/* ---- Planer i Istraži: sažeto ---- */
.pl-more,.pl-det,.pl-msgdet,.is-more{}
.pl-more{margin-top:10px; border:1.5px solid var(--border); border-radius:18px; padding:2px 12px 12px; background:var(--surface-2);}
.pl-more > summary,.pl-det > summary,.pl-msgdet > summary{cursor:pointer; padding:10px 0; font-weight:700; color:var(--accent); list-style:none;}
.pl-more > summary::-webkit-details-marker,.pl-det > summary::-webkit-details-marker,.pl-msgdet > summary::-webkit-details-marker,.is-more > summary::-webkit-details-marker{display:none;}
.pl-more > summary::after,.pl-det > summary::after,.pl-msgdet > summary::after{content:"▸"; float:right; transition:transform .15s;}
.pl-more[open] > summary::after,.pl-det[open] > summary::after,.pl-msgdet[open] > summary::after{transform:rotate(90deg);}
.pl-det{padding-top:0; padding-bottom:4px;}
.pl-opts{display:flex; flex-direction:column; gap:6px; margin-top:6px;}
/* Pošalji rutu — istaknuti blok */
.pl-send{background:linear-gradient(135deg,#1660C4,#0F4FA0); color:#fff; border:none; box-shadow:0 10px 24px rgba(15,79,160,.32);}
.pl-send a,.pl-send .link-btn{color:#fff;}
.pl-send-h{display:flex; gap:12px; align-items:center; margin-bottom:10px;}
.pl-send-h b{display:block; font-size:16px;} .pl-send-h small{display:block; opacity:.9; font-size:12.5px; line-height:1.35;}
.pl-send-ic{width:42px; height:42px; border-radius:14px; background:rgba(255,255,255,.2); display:grid; place-items:center; font-size:20px; flex:none;}
.pl-send .pl-chips button{background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.5); color:#fff;}
.pl-send .pl-chips button[aria-pressed="true"]{background:#fff; color:#0F4FA0;}
.pl-send .btn{background:rgba(255,255,255,.16); border:1.5px solid rgba(255,255,255,.6); color:#fff;}
.pl-send .btn.primary{background:#fff; color:#0F4FA0; border-color:#fff;}
.pl-send .pl-msgdet > summary{color:#fff; opacity:.95; padding:8px 0 2px; font-weight:600; font-size:13px;}
.pl-send .pl-msg{background:#fff; color:#0B1A2E; margin-top:6px;}
/* Istraži */
.is-list{display:flex; flex-direction:column; gap:8px; margin-top:10px;}
.is-item{display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1.5px solid var(--border); border-radius:20px; background:var(--surface); box-shadow:var(--shadow-sm);}
.is-e{width:38px; height:38px; border-radius:13px; background:var(--accent-soft); display:grid; place-items:center; font-size:18px; flex:none;}
.is-m{flex:1; min-width:0;} .is-m b{display:block; font-size:14.5px; line-height:1.25;} .is-m small{display:block; font-size:12px; line-height:1.3;}
.is-more > summary{cursor:pointer; color:var(--accent); font-size:12.5px; font-weight:700; list-style:none; padding:4px 0 0;}
.is-more p{margin:4px 0 0; font-size:13px; color:var(--ink-2);}
.is-go{display:flex; flex-direction:column; gap:6px; flex:none;}
.is-go .btn{min-height:34px; padding:0 12px; font-size:12.5px;}

/* zaglavlje s mostom je niže na karticama s puno sadržaja */
.side[data-size="full"]:not([data-view="park"]) .hero{height:104px;}
.pl-more:not([open]){padding-bottom:2px;}
.pl-btns{display:flex; flex-wrap:wrap; gap:8px;}
.pl-btns .btn{flex:1 1 auto; min-height:44px; padding:0 14px; font-size:13.5px; justify-content:center; text-align:center;}

/* registarska oznaka: izbor države i dodavanje tablice uz polje */
.plate-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px;}
.pchip{border:1.5px solid var(--accent); background:var(--surface); color:var(--accent); border-radius:999px; padding:7px 13px; font-weight:700; font-size:13px; min-height:38px;}
:root[data-theme="dark"] .pchip{color:var(--ink);}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .pchip{color:var(--ink);} }

/* podsjetnik za stanarsku kartu */
.re-h{margin:0 0 4px; font-size:17px;} .re-p{margin:4px 0 8px; font-size:13px;}
.re-banner{display:flex; gap:10px; align-items:center; padding:11px 13px; margin:0 0 12px; border-radius:20px; background:var(--warn-soft); color:var(--ink); border:1.5px solid var(--warn);}
.re-banner b{display:block; font-size:14px;} .re-banner small{display:block; font-size:12px; color:var(--ink-2); line-height:1.3;}
.re-banner > span{font-size:20px;} .re-banner .btn{margin-left:auto; flex:none;}
.re-banner.bad{background:var(--bad-soft); border-color:var(--bad);}
#reDays{margin-bottom:10px;}

/* računalo: šest kartica stane u bočnu ploču (ikona iznad naziva, jednake širine) */
@media (min-width:900px){
  .tabbar{gap:4px; padding:0 10px 10px;}
  .tab{flex:1 1 0; min-width:0; flex-direction:column; gap:3px; font-size:11.5px; padding:6px 2px; min-height:56px; border-radius:14px;}
  .tab svg{width:22px; height:22px;}
  .tab[aria-selected="true"]{background:var(--accent); color:#fff;}
}

/* računalo: šira lijeva ploča s izbornikom, uža karta */
@media (min-width:900px){
  .side{width:480px;}
  #map{left:480px;}
  .topbar{left:492px;}
  .tab{font-size:12px;}
  .tab svg{flex:none;}
}

/* Info: sklopivi odjeljci */
.info-sec > summary{font-weight:700;}
.info-sec .body{padding-top:4px;}
.acc .body > div + div{margin-top:8px;}

/* Stanari: sklopivi podsjetnik */
.acc-card > summary{cursor:pointer; font-weight:700; color:var(--accent); list-style:none; font-size:16px;}
.acc-card > summary::-webkit-details-marker{display:none;}
.acc-card > summary::after{content:"▸"; float:right;} .acc-card[open] > summary::after{transform:rotate(90deg);}
.acc-card[open] > summary{margin-bottom:8px;}

/* 5.1 — instalacija preko Chromea */
.chromebox{background:var(--accent-soft); border:1.5px solid var(--accent); border-radius:var(--radius); padding:12px; margin-bottom:12px; display:grid; gap:8px;}
.chromebox b{font-size:15px; line-height:1.3;}
.chromebox p{margin:0; font-size:13.5px; line-height:1.4; color:var(--ink-2,var(--ink-3));}
.pp-note{margin:0 0 12px; font-size:12.5px; line-height:1.4; color:var(--ink-3);}

/* v6.0 — priča u prozoru Novo */
.news-story{background:var(--surface-2); border:1px solid var(--border); border-radius:18px; padding:12px 14px; margin:0 0 12px; font-size:14px; line-height:1.45;}
.news-story b{display:block; font-size:16px; margin-bottom:4px;}
.news-story p{margin:6px 0 0;}

/* v6.0.2 — dok je otvorena tipkovnica (upis tablice, ulice…) ili je zaslon nizak, slika mosta se skriva da ne prekrije polje za upis */
body.typing .hero{display:none !important;}
@media (max-height:560px){ .side .hero{display:none !important;} }