/* ═══════════════════════════════════════════════════════════════════════
   Plan Sjedenja · PANEL ORGANIZATORA (dashboard)
   Sloj izgleda preko postojećeg panela. Boje i fontove daje /ps-sistem.css,
   a ovdje su komponente: okvir, meni, kartice, tabele, prozori, mobitel.
   Logika i HTML panela ostaju isti; ako se ovaj fajl ukloni, panel radi
   kao ranije, samo u starom izgledu.
   Svi selektori počinju s „html" da budu jači od ugrađenog <style> bloka.
   ═══════════════════════════════════════════════════════════════════════ */

/* ─────────────────────────────── OSNOVA ─────────────────────────────── */
html body{font-weight:400;font-size:15px;color:var(--ps-tinta);background:var(--ps-papir)}
/* blago zrno papira, kao na naslovnoj — ispod sadržaja, ne preko njega */
html body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .25 0 0 0 0 .2 0 0 0 0 .12 0 0 0 .06 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
html[data-theme="dark"] body::before{opacity:.3}
html .ic{width:20px;height:20px}
/* sve stare linijske ikonice dobijaju isti, tanji potez kao novi set */
html svg[stroke="currentColor"]{stroke-width:1.6}

/* ─────────────────────────── TRAKE NA VRHU ─────────────────────────── */
html .demo-traka{background:var(--ps-zelena);color:var(--ps-na-zelenoj);padding:9px 20px}
html .demo-traka span{font-size:13px;color:var(--ps-na-zelenoj-2)}
html .demo-traka strong{color:var(--ps-na-zelenoj);font-weight:600}
html .demo-traka-btn{background:var(--ps-na-zelenoj);color:#1C1A16;border-radius:var(--ps-r-sm);font-weight:600;padding:7px 14px}
html .demo-traka-nazad{color:var(--ps-na-zelenoj-2)}
html .demo-banner{background:var(--ps-tinta);color:var(--ps-papir);font-size:12px;padding:6px 16px;letter-spacing:.02em}
html .demo-banner a{color:var(--ps-papir)}

/* ─────────────────────────── GORNJA TRAKA ─────────────────────────── */
html .topbar{height:64px;padding:0 24px;background:color-mix(in srgb,var(--ps-papir) 88%,transparent);
  -webkit-backdrop-filter:saturate(1.2) blur(14px);backdrop-filter:saturate(1.2) blur(14px);border-bottom:1px solid var(--ps-linija)}
html .tb-left{gap:22px}
html .logo{font-family:var(--ps-serif);font-size:21px;font-weight:500;letter-spacing:-.015em;color:var(--ps-tinta)}
html .logo-mark .logo-ink,html .auth-logo .logo-mark .logo-ink{fill:var(--ps-tinta)}

/* event kao kartica na stolu: imena u serifu, datum sitno */
html .event-switch{position:relative;gap:12px;padding:7px 14px 7px 12px;border:1px solid var(--ps-linija);border-radius:var(--ps-r-sm);
  background:var(--ps-karta);box-shadow:var(--ps-sjena);transition:border-color .2s,transform .2s var(--ps-ease)}
html .event-switch:hover{border-color:var(--ps-tinta);transform:translateY(-1px)}
html .event-switch-dot{width:7px;height:7px;background:var(--ps-ok);box-shadow:0 0 0 3px var(--ps-ok-meka)}
html .event-switch-name{font-family:var(--ps-serif);font-size:16px;font-weight:500;letter-spacing:-.01em;line-height:1.15}
html .event-switch-date{font-size:11px;letter-spacing:.06em;color:var(--ps-tinta-3)}
html .event-switch svg{width:15px;height:15px;color:var(--ps-tinta-3)}

html .tb-right{gap:8px}
html .icon-btn{width:38px;height:38px;border-radius:50%;border:1px solid var(--ps-linija);background:var(--ps-karta);color:var(--ps-tinta-2)}
html .icon-btn:hover{border-color:var(--ps-tinta);color:var(--ps-tinta)}
html .icon-btn svg{width:18px;height:18px}

/* status paketa u gornjoj traci (dodaje ga ps-panel skripta) */
html .tb-paket{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px 0 12px;border-radius:999px;border:1px solid var(--ps-linija);
  background:var(--ps-karta);color:var(--ps-tinta);font:600 12.5px/1 var(--ps-sans);letter-spacing:.01em;cursor:pointer;white-space:nowrap;
  transition:border-color .2s,background .2s,color .2s}
html .tb-paket i{width:7px;height:7px;border-radius:50%;background:var(--ps-mesing);flex:none}
html .tb-paket b{font-weight:600;color:var(--ps-nit)}
html .tb-paket.proba{border-color:var(--ps-nit-srednja);background:var(--ps-nit-meka)}
html .tb-paket.proba:hover{background:var(--ps-nit);border-color:var(--ps-nit);color:#fff}
html .tb-paket.proba:hover b{color:#fff}
html .tb-paket.proba:hover i{background:#fff}
html .tb-paket.aktivan i{background:var(--ps-ok);box-shadow:0 0 0 3px var(--ps-ok-meka)}
html .tb-paket.aktivan b{color:var(--ps-tinta-3);font-weight:500}
html .tb-paket.aktivan:hover{border-color:var(--ps-tinta)}

/* ─────────────────────────────── MENI ─────────────────────────────── */
html .layout{min-height:calc(100vh - 64px)}
html .sidebar{width:248px;padding:18px 12px 28px;background:transparent;border-right:1px solid var(--ps-linija);
  position:sticky;top:64px;align-self:flex-start;height:calc(100vh - 64px);overflow-y:auto}
html .side-label{font-size:10.5px;font-weight:600;letter-spacing:.16em;color:var(--ps-tinta-3);opacity:1;padding:0 14px;margin:22px 0 8px;display:flex;align-items:center;gap:8px}
html .side-label:first-child{margin-top:6px}
html .side-link{position:relative;gap:12px;padding:9px 12px;margin:1px 0;font-size:14px;font-weight:500;color:var(--ps-tinta-2);
  border-left:0;border-radius:var(--ps-r);transition:background .18s,color .18s}
html .side-link svg,html .side-link .ic{width:20px;height:20px;color:var(--ps-tinta-3);transition:color .18s}
html .side-link:hover{background:color-mix(in srgb,var(--ps-karta) 75%,transparent);color:var(--ps-tinta)}
html .side-link:hover .ic{color:var(--ps-tinta)}
html .side-link.active{background:var(--ps-karta);color:var(--ps-tinta);font-weight:600;box-shadow:var(--ps-sjena)}
html .side-link.active .ic,html .side-link.active svg{color:var(--ps-nit)}
html .side-link.active::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:2px;border-radius:2px;background:var(--ps-nit)}
html .side-divider{margin:14px 12px 0;background:var(--ps-linija)}
html .side-strelica{width:13px;height:13px}
html .lock-badge{border-radius:2px;background:transparent;border:1px solid var(--ps-mesing);color:var(--ps-mesing);font-size:9px;letter-spacing:.08em;padding:2px 5px}
html .lock-badge svg{display:none}

/* kartica paketa na dnu menija (dodaje je ps-panel skripta) */
html .side-paket{margin:18px 4px 0;padding:16px;border-radius:var(--ps-r);background:var(--ps-zelena);color:var(--ps-na-zelenoj);position:relative;overflow:hidden}
html .side-paket::after{content:"";position:absolute;right:-26px;top:-26px;width:96px;height:96px;border-radius:50%;border:1px solid rgba(238,232,218,.14);box-shadow:0 0 0 14px rgba(238,232,218,.04)}
html .side-paket small{display:block;font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ps-na-zelenoj-2);margin-bottom:6px}
html .side-paket strong{display:block;font-family:var(--ps-serif);font-weight:500;font-size:19px;line-height:1.2;margin-bottom:6px}
html .side-paket p{font-size:12.5px;line-height:1.5;color:var(--ps-na-zelenoj-2);margin:0 0 12px}
html .side-paket button{width:100%;height:36px;border:0;border-radius:var(--ps-r-sm);background:var(--ps-na-zelenoj);color:#1C1A16;font:600 13px/1 var(--ps-sans);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}
html .side-paket button:hover{background:#fff}

/* ─────────────────────────────── SADRŽAJ ─────────────────────────────── */
html .main{padding:34px 44px 72px}
html .main > .view{max-width:1240px;margin:0 auto}
html .view{animation:psUlaz .45s var(--ps-ease)}
@keyframes psUlaz{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
html .view-head{margin-bottom:28px;gap:16px 24px;align-items:flex-end}
html .view-kicker{margin-bottom:12px}
html .view-title{font-family:var(--ps-serif);font-size:42px;font-weight:500;letter-spacing:-.025em;line-height:1.02;color:var(--ps-tinta)}
html .view-sub{font-size:14px;color:var(--ps-tinta-3);margin-top:8px;max-width:62ch;line-height:1.5}

/* ─────────────────────────────── DUGMAD ─────────────────────────────── */
html .btn{height:40px;padding:0 18px;border-radius:var(--ps-r-sm);font:600 13.5px/1 var(--ps-sans);letter-spacing:.005em;gap:8px;border:1px solid var(--ps-tinta);
  transition:background .2s,border-color .2s,color .2s,transform .2s var(--ps-ease),box-shadow .2s}
html .btn svg{width:16px;height:16px}
html .btn-dark{background:var(--ps-tinta);border-color:var(--ps-tinta);color:var(--ps-papir);box-shadow:0 8px 18px -10px rgba(28,26,22,.55)}
html .btn-dark:hover{background:var(--ps-nit);border-color:var(--ps-nit);color:#fff;transform:translateY(-1px)}
html .btn-outline{background:var(--ps-karta);border-color:var(--ps-linija);color:var(--ps-tinta)}
html .btn-outline:hover{border-color:var(--ps-tinta);color:var(--ps-tinta)}
html .btn-opasno{border-radius:var(--ps-r-sm);background:var(--ps-greska);font-weight:600}
html .gal-tbtn,html .ps-fit-btn,html .ps-el-btn,html .ps-add-btn,html .ps-zum button{border-radius:var(--ps-r-sm);background:var(--ps-karta);border-color:var(--ps-linija);color:var(--ps-tinta)}
html .gal-tbtn:hover,html .ps-fit-btn:hover,html .ps-el-btn:hover,html .ps-add-btn:hover,html .ps-zum button:hover{border-color:var(--ps-tinta);color:var(--ps-tinta);background:var(--ps-karta)}

/* ─────────────────────────────── KARTICE ─────────────────────────────── */
html .panel-card,html .table-card,html .qr-box,html .koraci,html .kstat,html .bz-kartica,html .stat-card,html .print-stavka{
  background:var(--ps-karta);border:1px solid var(--ps-linija);border-radius:var(--ps-r);box-shadow:var(--ps-sjena)}
html .panel-card{margin-bottom:22px}
html .panel-card-head{padding:18px 24px;border-bottom:1px solid var(--ps-linija)}
html .panel-card-title{font-family:var(--ps-serif);font-size:21px;font-weight:500;letter-spacing:-.012em}
html .pregled-mini{transition:border-color .2s,transform .25s var(--ps-ease),box-shadow .25s}
html .pregled-mini:hover{border-color:var(--ps-tinta);transform:translateY(-2px);box-shadow:var(--ps-sjena-lg)}
html .pregled-mini-link{font-size:12.5px;font-weight:600;color:var(--ps-nit)}

/* brojke */
html .stat-row{gap:16px}
html .stat-card{padding:20px 22px 20px}
html .stat-card-label{font-size:10.5px;font-weight:600;letter-spacing:.14em;color:var(--ps-tinta-3)}
html .stat-card-ic{width:36px;height:36px;border-radius:50%;background:transparent;border:1px solid var(--ps-linija);color:var(--ps-nit)}
html .stat-card-ic svg,html .stat-card-ic .ic{width:18px;height:18px}
html .stat-card-val{font-family:var(--ps-serif);font-size:46px;font-weight:500;letter-spacing:-.03em;margin-top:6px}
html .stat-card-sub{font-size:12.5px;color:var(--ps-tinta-3)}
html .stat-card-sub.up{color:var(--ps-ok)}

/* odbrojavanje — zelena kartica s crtežom stola, kao sekcije na naslovnoj */
html .odbroj-banner{position:relative;overflow:hidden;background:var(--ps-zelena);border:0;border-radius:var(--ps-r);color:var(--ps-na-zelenoj);padding:26px 30px;box-shadow:var(--ps-sjena-lg)}
html .odbroj-banner::after{content:"";position:absolute;right:-30px;top:50%;width:240px;height:240px;transform:translateY(-50%);opacity:.12;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120' fill='none' stroke='%23EEE8DA' stroke-width='.8'%3E%3Ccircle cx='60' cy='60' r='24'/%3E%3Ccircle cx='60' cy='60' r='44' stroke-dasharray='2 5'/%3E%3Cg fill='%23EEE8DA' stroke='none'%3E%3Ccircle cx='60' cy='27' r='4'/%3E%3Ccircle cx='83.3' cy='36.7' r='4'/%3E%3Ccircle cx='93' cy='60' r='4'/%3E%3Ccircle cx='83.3' cy='83.3' r='4'/%3E%3Ccircle cx='60' cy='93' r='4'/%3E%3Ccircle cx='36.7' cy='83.3' r='4'/%3E%3Ccircle cx='27' cy='60' r='4'/%3E%3Ccircle cx='36.7' cy='36.7' r='4'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat}
html .odbroj-lijevo,html .odbroj-broj{position:relative;z-index:1}
html .odbroj-banner .odbroj-label{color:var(--ps-na-zelenoj-2);font-size:11px;font-weight:600;letter-spacing:.16em}
html .odbroj-banner .odbroj-ime{color:var(--ps-na-zelenoj);font-family:var(--ps-serif);font-size:30px;font-weight:500;letter-spacing:-.015em;margin-top:4px}
html .odbroj-banner .odbroj-broj{color:var(--ps-na-zelenoj);font-family:var(--ps-serif);font-size:44px;font-weight:500;letter-spacing:-.02em;margin-right:150px}

/* traka „Sve za vjenčanje" */
html .szv-traka{border-radius:var(--ps-r);border-left:2px solid var(--ps-nit);box-shadow:var(--ps-sjena);background:var(--ps-karta)}
html .szv-ikona svg,html .szv-ikona .ic{color:var(--ps-nit)}
html .szv-dugme{background:var(--ps-tinta);color:var(--ps-papir);border-radius:var(--ps-r-sm)}
html .szv-dugme:hover{background:var(--ps-nit);color:#fff}

/* prvi koraci */
html .koraci{padding:20px 22px}
html .koraci-head strong{font-family:var(--ps-serif);font-size:20px;font-weight:500}
html .koraci-traka{height:3px;background:var(--ps-papir-2)}
html .koraci-fill{background:var(--ps-nit)}
html .korak{border-radius:var(--ps-r-sm);background:var(--ps-karta);padding:12px 14px}
html .korak:hover{border-color:var(--ps-tinta)}
html .korak-znak{border-color:var(--ps-linija)}
html .korak.gotov .korak-znak{background:var(--ps-ok);border-color:var(--ps-ok)}

/* budžet i obaveze na pregledu */
html .pregled-bz-broj{font-family:var(--ps-serif);font-weight:500;letter-spacing:-.02em}
html .pregled-bz-bar,html .bz-progres,html .chk-napredak-bar,html .cap-bar{height:4px;background:var(--ps-papir-2);border-radius:4px}
html .chk-napredak-fill{background:var(--ps-ok)}
html .bz-progres-fill{background:var(--ps-mesing)}

/* ─────────────────────────────── TABELE ─────────────────────────────── */
html thead th{font-size:10.5px;font-weight:600;letter-spacing:.14em;color:var(--ps-tinta-3);background:var(--ps-karta-2);padding:12px 24px;border-bottom:1px solid var(--ps-linija)}
html tbody td{padding:13px 24px;font-size:14px;border-bottom:1px solid var(--ps-linija-2)}
html tbody tr:hover{background:color-mix(in srgb,var(--ps-papir) 55%,transparent)}
html .avatar{width:34px;height:34px;font-family:var(--ps-serif);font-size:13px;font-weight:600;letter-spacing:.02em}
html .badge{font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:999px}
html .badge-confirmed{background:var(--ps-ok-meka);color:var(--ps-ok)}
html .badge-pending{background:var(--ps-mesing-meka);color:var(--ps-mesing-t,var(--ps-mesing))}
html .badge-declined{background:var(--ps-greska-meka);color:var(--ps-greska)}
html .row-action{width:32px;height:32px;border-radius:50%}
html .row-action:hover{background:var(--ps-papir-2);color:var(--ps-tinta)}
html .row-action.opasno:hover,html .row-action[onclick*="obrisi"]:hover,html .row-action[onclick*="Obrisi"]:hover{background:var(--ps-greska-meka);color:var(--ps-greska)}
html .row-action.ima-mail{color:var(--ps-nit)}
html .oznaka-chip{border-radius:var(--ps-r-sm)}
html .status-filter{padding:14px 24px 6px;gap:8px}
html .status-fbtn{height:34px;padding:0 14px;border-radius:999px;border-color:var(--ps-linija);background:var(--ps-karta);color:var(--ps-tinta-2);font-weight:500}
html .status-fbtn:hover{border-color:var(--ps-tinta)}
html .status-fbtn.aktivan{background:var(--ps-tinta);border-color:var(--ps-tinta);color:var(--ps-papir);font-weight:600}
html .status-fbtn span{background:var(--ps-papir-2);color:var(--ps-tinta-2);font-weight:600}
html .status-fbtn.aktivan span{background:var(--ps-nit);color:#fff}

/* ─────────────────────────────── POLJA ─────────────────────────────── */
html .text-input,html .auth-field input,html .dlg-polje input,html .dlg-polje textarea,html .bulk-area,
html .modal-body input[type=text],html .modal-body input[type=email],html .modal-body input[type=number],html .modal-body input[type=date],html .modal-body input[type=time],html .modal-body textarea,html .modal-body select,html #auth-tip{
  border:1px solid var(--ps-linija);border-radius:var(--ps-r-sm);background:var(--ps-karta);color:var(--ps-tinta);font-family:var(--ps-sans);
  transition:border-color .2s,box-shadow .2s}
html .text-input,html .auth-field input,html .dlg-polje input{min-height:44px}
html .text-input:focus,html .auth-field input:focus,html .dlg-polje input:focus,html .dlg-polje textarea:focus,html .bulk-area:focus,
html .modal-body input:focus,html .modal-body textarea:focus,html .modal-body select:focus{outline:none;border-color:var(--ps-tinta);box-shadow:0 0 0 4px var(--ps-nit-meka)}
html .bulk-area{background:var(--ps-karta-2);font-size:14.5px;line-height:1.75;min-height:140px}
html .bulk-hint svg{color:var(--ps-nit)}
html .form-label,html .auth-field label,html .dlg-polje label,html .diy-label{font-size:10.5px;font-weight:600;letter-spacing:.14em;color:var(--ps-tinta-3)}
html .table-select,html .print-format{border-radius:var(--ps-r-sm);background-color:var(--ps-karta);border-color:var(--ps-linija);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238A8272' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}
html .print-format{background-repeat:no-repeat;background-position:right 10px center;padding-right:30px;-webkit-appearance:none;appearance:none}
html .table-select:hover,html .print-format:hover{border-color:var(--ps-tinta)}
html .table-select:focus,html .print-format:focus{border-color:var(--ps-tinta);box-shadow:0 0 0 4px var(--ps-nit-meka)}
html .diy-switch-track{background:var(--ps-linija)}
html .diy-switch input:checked + .diy-switch-track{background:var(--ps-ok)}

/* ─────────────────────────────── STOLOVI ─────────────────────────────── */
html .tables-grid{gap:18px}
html .table-card{transition:transform .25s var(--ps-ease),box-shadow .25s,border-color .2s}
html .table-card:hover{transform:translateY(-2px);box-shadow:var(--ps-sjena-lg);border-color:color-mix(in srgb,var(--ps-tinta) 30%,var(--ps-linija))}
html .table-card-head{padding:16px 18px 14px}
html .table-card-name{font-family:var(--ps-serif);font-size:19px;font-weight:500}
html .table-color{width:9px;height:9px;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 0%,transparent)}
html .table-guest{font-size:13.5px;padding:6px 0}
html .table-guest .tg-num{font-family:var(--ps-serif);font-size:12px;color:var(--ps-tinta-3)}
html .table-guest .tg-dot{background:var(--ps-tinta-3);opacity:.5}

/* plan sale: stolovi kao na planu s naslovne — papir i tinta, crveno samo za izabrano */
html .plansale-toolbar{border-radius:var(--ps-r);background:var(--ps-karta);box-shadow:var(--ps-sjena)}
html .plansale-canvas{border-radius:var(--ps-r);background:var(--ps-karta-2)}
html .plansale-svijet{background-image:radial-gradient(circle,var(--ps-linija) 1px,transparent 1.2px);background-size:24px 24px}
html .ps-stol{background:var(--ps-karta);border:1.5px solid var(--ps-tinta);color:var(--ps-tinta);font-family:var(--ps-serif);box-shadow:0 4px 12px -6px rgba(28,26,22,.35)}
html .ps-stolica{background:var(--ps-tinta-3);opacity:.55}
html .ps-stol.izabran,html .ps-stol.ps-sel{box-shadow:0 0 0 3px var(--ps-nit);border-color:var(--ps-nit)}
html .plansale-bina{background:var(--ps-tinta);color:var(--ps-papir);border-radius:var(--ps-r-sm);letter-spacing:.14em}
html .ps-gosti-blok{background:var(--ps-papir-2);border-radius:var(--ps-r)}
html .ps-gosti-broj{background:var(--ps-tinta);color:var(--ps-papir)}
html .ps-gost-red{border-radius:var(--ps-r-sm)}
html .ps-gost-tackica.zelena{background:var(--ps-ok)}

/* materijali za štampu */
html .print-bar{background:var(--ps-papir-2);border:1px solid var(--ps-linija);border-radius:var(--ps-r)}
html .print-bar-info svg{color:var(--ps-nit)}
html .print-bar-info strong{font-family:var(--ps-serif);font-size:18px;font-weight:500}
html .print-stavka{box-shadow:none}
html .print-zakljucano{background:var(--ps-nit-meka);border-color:var(--ps-nit-srednja);border-radius:var(--ps-r-sm)}

/* ─────────────────────────────── QR ─────────────────────────────── */
html .qr-box{padding:36px}
html .qr-img-wrap{background:#fff;border-radius:var(--ps-r-sm);box-shadow:0 12px 28px -14px rgba(28,26,22,.35);padding:18px}
html .qr-event-name{font-family:var(--ps-serif);font-size:26px;font-weight:500;letter-spacing:-.015em}
html .qr-event-date{letter-spacing:.14em;font-weight:600;font-size:11px}
html .qr-url{background:var(--ps-papir-2);border-radius:var(--ps-r-sm);font-size:12.5px;color:var(--ps-tinta-2)}
html .qr-info h3{font-family:var(--ps-serif);font-size:24px;font-weight:500}
html .qr-step-num{font-family:var(--ps-serif);font-style:italic;color:var(--ps-nit)}
html .qr-step-txt h4{font-size:14.5px;font-weight:600}

/* ─────────────────────────── POZIVNICA (uređivač) ─────────────────────────── */
html .stil-opcija,html .paleta-opcija{border-width:1px;border-radius:var(--ps-r);transition:transform .2s var(--ps-ease),border-color .2s,box-shadow .2s}
html .stil-opcija:hover,html .paleta-opcija:hover{border-color:var(--ps-tinta);transform:translateY(-2px)}
html .stil-opcija.izabran,html .paleta-opcija.izabran{border-color:var(--ps-nit);box-shadow:0 0 0 2px var(--ps-nit)}
html .diy-bg-opcija{border-radius:var(--ps-r-sm)}
html .diy-bg-opcija.aktivna{border-color:var(--ps-tinta);background:var(--ps-karta-2)}
html .diy-preview{border-radius:var(--ps-r)}

/* ─────────────────────────────── ŽELJE, GALERIJA, KOLONA ─────────────────────────────── */
html .zelje-ikona{background:transparent;border:1px solid var(--ps-linija);color:var(--ps-nit)}
html .poruka-tekst{font-family:var(--ps-serif);font-size:16px;line-height:1.55}
html .poruka-tekst::before{font-family:var(--ps-serif);color:var(--ps-nit)}
html .poruka-ime{color:var(--ps-nit-2)}
html .pj-zvijezda.akt,html .pj-zvijezda:hover{color:var(--ps-nit)}
html .pj-must{border-left-color:var(--ps-nit);background:var(--ps-nit-meka)}
html .kstat-broj{font-family:var(--ps-serif);font-weight:500;color:var(--ps-tinta)}
html .kstat-ic{color:var(--ps-nit)}
html .gal-item{border-radius:var(--ps-r-sm)}
html .gp-okvir{border-color:var(--ps-tinta-3)}
html .gp-naslov{font-family:var(--ps-serif);font-weight:500}

/* ─────────────────────────────── BUDŽET, POKLONI ─────────────────────────────── */
html .bz-kartica{padding:20px 22px}
html .bz-kartica-label{font-size:10.5px;font-weight:600;letter-spacing:.14em}
html .bz-kartica-val{font-size:30px;letter-spacing:-.02em}
html .bz-kartica.zlato{border-top:2px solid var(--ps-nit)}
html .bz-kartica.zlato .bz-kartica-val{color:var(--ps-tinta)}
/* ukupni budžet — zelena kartica, kao odbrojavanje na pregledu */
html .ukupni-budzet-banner{background:var(--ps-zelena);border:0;border-radius:var(--ps-r);color:var(--ps-na-zelenoj);padding:22px 26px;box-shadow:var(--ps-sjena-lg)}
html .ubb-label{color:var(--ps-na-zelenoj-2);font-size:11px;font-weight:600;letter-spacing:.16em}
html .ubb-iznos{color:var(--ps-na-zelenoj);font-family:var(--ps-serif);font-weight:500;font-size:34px;letter-spacing:-.02em}
html .ukupni-budzet-banner .btn-outline,html .ukupni-budzet-banner .btn{background:transparent;border-color:rgba(238,232,218,.32);color:var(--ps-na-zelenoj)}
html .ukupni-budzet-banner .btn:hover{background:var(--ps-na-zelenoj);color:#1C1A16;border-color:var(--ps-na-zelenoj)}
html .bz-kartica.zeleno .bz-kartica-val{color:var(--ps-ok)}
html .wl-rezervisao{color:var(--ps-nit)}
html .wl-slobodno{color:var(--ps-ok)}

/* ─────────────────────────────── PRAZNA STANJA ─────────────────────────────── */
html .empty{padding:56px 20px}
html .empty svg{width:48px;height:48px;color:var(--ps-nit);opacity:.75;stroke-width:1.2}
html .empty p{font-family:var(--ps-serif);font-style:italic;font-size:17px;color:var(--ps-tinta-2)}

/* ─────────────────────────────── PROZORI ─────────────────────────────── */
html .overlay,html .up-back{background:rgba(20,18,14,.46);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
html .modal,html .dlg,html .up-modal{background:var(--ps-karta);border-radius:8px;box-shadow:var(--ps-sjena-lg);border:1px solid var(--ps-linija)}
html .modal-head{padding:22px 28px 18px;border-bottom:1px solid var(--ps-linija)}
html .modal-head h2{font-family:var(--ps-serif);font-size:26px;font-weight:500;letter-spacing:-.015em}
html .modal-close,html .up-close{width:36px;height:36px;border-radius:50%;border:1px solid var(--ps-linija);display:flex;align-items:center;justify-content:center;
  color:var(--ps-tinta-2);background:var(--ps-karta);font-size:20px;line-height:1;padding:0;transition:border-color .2s,color .2s}
html .modal-close:hover,html .up-close:hover{border-color:var(--ps-tinta);color:var(--ps-tinta)}
html .up-close{top:14px;right:14px}
html .modal-foot{padding:16px 28px;background:var(--ps-karta-2);border-top:1px solid var(--ps-linija);border-radius:0 0 8px 8px}
html .color-swatch{box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
html .color-swatch.sel{border-color:var(--ps-tinta);box-shadow:0 0 0 2px var(--ps-karta),0 0 0 3px var(--ps-tinta)}
/* dijalog potvrde */
html .dlg-ikona{background:transparent;border:1px solid currentColor}
html .dlg-ikona.upozorenje{color:var(--ps-greska);background:var(--ps-greska-meka);border-color:transparent}
html .dlg-ikona.info{color:var(--ps-nit);background:var(--ps-nit-meka);border-color:transparent}
html .dlg-ikona.uspjeh{color:var(--ps-ok);background:var(--ps-ok-meka);border-color:transparent}
html .dlg-naslov{font-family:var(--ps-serif);font-size:23px;font-weight:500;letter-spacing:-.012em}
html .dlg-poruka{font-size:14px;color:var(--ps-tinta-2)}
html .dlg-btn{height:42px;padding:0 20px;border-radius:var(--ps-r-sm);font-weight:600}
html .dlg-btn-odustani{background:var(--ps-karta);border:1px solid var(--ps-linija);color:var(--ps-tinta)}
html .dlg-btn-odustani:hover{border-color:var(--ps-tinta);opacity:1}
html .dlg-btn-potvrdi{background:var(--ps-tinta);color:var(--ps-papir)}
html .dlg-btn-opasno{background:var(--ps-greska);color:#fff}
html .dlg-btn:focus-visible{outline:2px solid var(--ps-tinta-3);outline-offset:2px}
/* proba / limit / pomoć */
html .proba-znak{background:transparent;border:1px solid var(--ps-nit-srednja);width:54px;height:54px}
html .proba-znak svg{color:var(--ps-nit)}
html .proba-head h3{font-family:var(--ps-serif);font-size:27px;font-weight:500;letter-spacing:-.015em;line-height:1.15}
html .proba-naslov{font-size:10.5px;letter-spacing:.14em;opacity:1;color:var(--ps-tinta-3)}
html .proba-lista.da li::before{color:var(--ps-ok)}
html .proba-lista.ne li::before{color:var(--ps-greska)}
html .limit-traka{height:4px;background:var(--ps-papir-2)}
html .limit-fill{background:var(--ps-nit)}
html .pomoc-stavka{border-radius:var(--ps-r-sm);background:var(--ps-karta)}
html .pomoc-stavka summary{font-weight:600}
html .pomoc-stavka summary::after{color:var(--ps-nit)}
html .pomoc-kontakt{background:var(--ps-papir-2);border-radius:var(--ps-r)}

/* aktivacija paketa (Polar) */
html .up-head{padding-top:32px}
html .up-title{font-family:var(--ps-serif);font-size:30px;font-weight:500;letter-spacing:-.02em}
html .up-sub{font-size:13.5px}
html .up-tab{border-radius:var(--ps-r);background:var(--ps-karta);border-width:1px;padding:16px 10px 14px;transition:border-color .2s,transform .2s var(--ps-ease)}
html .up-tab:hover{border-color:var(--ps-tinta);transform:translateY(-1px)}
html .up-tab.aktivan{border-color:var(--ps-tinta);background:var(--ps-karta);box-shadow:inset 0 0 0 1px var(--ps-tinta)}
html .up-tab-naziv{font-family:var(--ps-serif);font-size:17px;font-weight:600}
html .up-tab-cijena{font-family:var(--ps-serif);font-size:26px;font-weight:500;color:var(--ps-tinta)}
html .up-tab-lok{display:block;font-size:11.5px;color:var(--ps-tinta-3);margin-top:2px}
html .up-tab-trenutni{border-radius:2px;background:var(--ps-nit)}
html .up-lista li svg{color:var(--ps-ok)}
html .up-kontakt-box{border-radius:var(--ps-r);background:var(--ps-papir-2);border-color:var(--ps-linija)}
html .up-kontakt-naslov{font-size:13.5px}
html .up-btn-uplata{background:var(--ps-tinta);color:var(--ps-papir);border-radius:var(--ps-r-sm);font-weight:600;padding:15px}
html .up-btn-uplata:hover{opacity:1;background:var(--ps-nit);color:#fff}
html .up-btn-uplata.onemoguceno{opacity:.45;pointer-events:none}
html .up-sigurno{display:flex;align-items:center;justify-content:center;gap:7px;font-size:12px;color:var(--ps-tinta-3);margin-top:10px}
html .up-sigurno svg{width:14px;height:14px}
html .up-btn-contact{border-radius:var(--ps-r-sm)}
html .up-btn-contact.mail{background:var(--ps-karta);color:var(--ps-tinta);border:1px solid var(--ps-linija)}
html .up-btn-contact.mail:hover{border-color:var(--ps-tinta);opacity:1}

/* poruke i „vrati" */
html .toast{background:var(--ps-tinta);color:var(--ps-papir);border-radius:var(--ps-r-sm);padding:13px 20px 13px 18px;font-size:13.5px;box-shadow:var(--ps-sjena-lg),inset 3px 0 0 var(--ps-nit)}
html .toast svg{color:var(--ps-nit)}
html .undo-btn{background:var(--ps-tinta);color:var(--ps-papir);border-radius:var(--ps-r-sm);box-shadow:var(--ps-sjena-lg)}
html .undo-btn:hover{background:var(--ps-nit);color:#fff}

/* ─────────────────────────── PRIJAVA I UČITAVANJE ─────────────────────────── */
html .auth-screen{background:var(--ps-papir)}
html .auth-screen::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.07;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 540' fill='none' stroke='%231C1A16' stroke-width='1.3'%3E%3Cpath d='M292 500H38a18 18 0 0 1-18-18V38a18 18 0 0 1 18-18h564a18 18 0 0 1 18 18v444a18 18 0 0 1-18 18H348'/%3E%3Cpath d='M292 500a28 28 0 0 1 28-28M348 500a28 28 0 0 0-28-28'/%3E%3Ccircle cx='110' cy='130' r='26'/%3E%3Ccircle cx='230' cy='130' r='26'/%3E%3Ccircle cx='410' cy='130' r='26'/%3E%3Ccircle cx='530' cy='130' r='26'/%3E%3Ccircle cx='110' cy='265' r='26'/%3E%3Ccircle cx='530' cy='265' r='26'/%3E%3Ccircle cx='110' cy='400' r='26'/%3E%3Ccircle cx='230' cy='400' r='26'/%3E%3Ccircle cx='410' cy='400' r='26'/%3E%3Ccircle cx='530' cy='400' r='26'/%3E%3Crect x='262' y='206' width='116' height='118' rx='8' stroke-dasharray='4 4'/%3E%3C/svg%3E") center/min(1100px,140vw) no-repeat}
html[data-theme="dark"] .auth-screen::before{filter:invert(1);opacity:.06}
html .auth-card{position:relative;z-index:1}
html .auth-logo{font-family:var(--ps-serif);font-weight:500;font-size:30px;letter-spacing:-.015em}
html .auth-tagline{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ps-tinta-3)}
html .auth-box{border-radius:8px;box-shadow:var(--ps-sjena-lg);background:var(--ps-karta);padding:34px 30px}
html .auth-title{font-family:var(--ps-serif);font-weight:500;font-size:30px;letter-spacing:-.02em}
html .auth-sub{color:var(--ps-tinta-3)}
html .auth-btn{border-radius:var(--ps-r-sm);font-weight:600;height:46px;padding:0;background:var(--ps-tinta);color:var(--ps-papir)}
html .auth-btn:hover{background:var(--ps-nit);color:#fff}
html .auth-google{border-radius:var(--ps-r-sm);height:46px;padding:0;font-weight:600}
html .auth-google:hover{border-color:var(--ps-tinta);background:var(--ps-karta)}
html .auth-switch a{color:var(--ps-nit);font-weight:600}
html .auth-spin{border-color:var(--ps-linija);border-top-color:var(--ps-nit);border-width:2px}
html .verify-banner{background:var(--ps-mesing-meka);border-color:var(--ps-mesing);border-radius:var(--ps-r-sm)}
html .verify-banner a{color:var(--ps-nit)}

/* ─────────────────────────────── MOBITEL ─────────────────────────────── */
html #pwa-baner{border-radius:var(--ps-r);box-shadow:var(--ps-sjena-lg);background:var(--ps-karta)}
html .pwa-baner-ic{background:var(--ps-papir-2);color:var(--ps-nit);border-radius:var(--ps-r-sm)}
html .pwa-baner-inst{background:var(--ps-tinta);color:var(--ps-papir);border-radius:var(--ps-r-sm)}
html .ios-upute-sheet{background:var(--ps-karta);border-radius:14px 14px 0 0}
html .ios-korak-br{background:var(--ps-nit-meka);color:var(--ps-nit)}
html .skeleton{background:linear-gradient(90deg,var(--ps-papir-2) 0%,var(--ps-karta) 50%,var(--ps-papir-2) 100%);background-size:200% 100%}

@media (max-width:880px){
  html .sidebar{display:none}
  html .main{padding:22px 16px 110px}
  html .view-title{font-size:34px}
  html .mobile-nav{height:auto;padding:4px 6px calc(4px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--ps-papir) 92%,transparent);
    -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--ps-linija);box-shadow:none}
  html .mobile-nav button{padding:9px 0 8px;font-size:10.5px;font-weight:600;letter-spacing:.02em;color:var(--ps-tinta-3);gap:5px}
  html .mobile-nav button svg,html .mobile-nav button .ic{width:22px;height:22px}
  html .mobile-nav button.active{color:var(--ps-tinta)}
  html .mobile-nav button.active .ic{color:var(--ps-nit)}
  html .mobile-nav button.active::before{top:2px;width:4px;height:4px;border-radius:50%;background:var(--ps-nit)}
  html .odbroj-banner{padding:22px}
  html .odbroj-banner .odbroj-broj{margin-right:0;font-size:36px}
  html .odbroj-banner::after{width:150px;height:150px;right:-56px;top:24px;transform:none;opacity:.1}
}
@media (max-width:700px){
  html .topbar{padding:0 12px;height:60px;gap:8px}
  html .tb-left{gap:10px;min-width:0;flex:1 1 auto}
  html .tb-left .logo{font-size:0;gap:0}
  html .event-switch{min-width:0;flex:0 1 auto;max-width:100%;padding:6px 10px}
  html .event-switch > div{min-width:0}
  html .event-switch-name{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  html .tb-right .footer-lang{display:none}
  html .tb-paket{height:32px;padding:0 11px;font-size:12px}
  html .tb-paket b{display:none}
  html .icon-btn{width:36px;height:36px}
}
@media (max-width:600px){
  /* demo traka: tekst gore, dva dugmeta jedno pored drugog */
  html .demo-traka{padding:9px 14px}
  html .demo-traka-sadrzaj{gap:8px 10px}
  html .demo-traka svg{display:none}
  html .demo-traka span{flex:1 1 100%;font-size:12px;line-height:1.4}
  html .demo-traka-nazad{width:auto;flex:0 0 auto;padding:6px 4px}
  html .demo-traka-btn{width:auto;flex:1 1 auto;text-align:center}
  html .demo-banner{font-size:11.5px}
  html .view-head{align-items:flex-start}
  html .view-title{font-size:32px}
  html .stat-card{padding:16px}
  html .stat-card-val{font-size:36px}
  html thead th,html tbody td{padding-left:16px;padding-right:16px}
  html .panel-card-head{padding:16px 18px}
}
/* „Više" — donji list sa svim funkcijama */
html .vise-overlay{background:rgba(20,18,14,.46)}
html .vise-sheet{background:var(--ps-karta);border-radius:16px 16px 0 0;box-shadow:0 -10px 40px rgba(0,0,0,.18)}
html .vise-naslov{font-family:var(--ps-serif);font-size:24px;font-weight:500;letter-spacing:-.015em}
html .vise-grabber{background:var(--ps-linija)}
html .vise-zatvori{border-radius:50%;border:1px solid var(--ps-linija);background:var(--ps-karta);color:var(--ps-tinta-2)}
html .vise-grupa-labela{font-size:10.5px;font-weight:600;letter-spacing:.16em;color:var(--ps-tinta-3)}
html .vise-stavka{color:var(--ps-tinta);font-weight:500;border-radius:var(--ps-r)}
html .vise-stavka svg,html .vise-stavka .ic{width:22px;height:22px;color:var(--ps-tinta);padding:10px;box-sizing:content-box;border-radius:12px;background:var(--ps-papir-2);transition:background .2s,color .2s}
html .vise-stavka:hover .ic,html .vise-stavka:active .ic{background:var(--ps-tinta);color:var(--ps-papir)}
html .vise-stavka.aktivna{background:transparent}
html .vise-stavka.aktivna .ic,html .vise-stavka.aktivna svg{background:var(--ps-nit);color:#fff}

/* ─────────────────────────────── DORADA v4 ─────────────────────────────── */
/* RSVP i statusi — boje iz sistema, ne stare zelene/zlatne */
html .rsvp-bar-seg.potvrdio,html .rsvp-tac.potvrdio{background:var(--ps-ok)}
html .rsvp-bar-seg.odbio,html .rsvp-tac.odbio{background:var(--ps-greska)}
html .rsvp-bar-seg.ceka,html .rsvp-tac.ceka{background:var(--ps-mesing)}
html .bz-status{border-radius:999px;font-weight:600;letter-spacing:.02em}
html .bz-status.placeno{background:var(--ps-ok-meka);color:var(--ps-ok)}
html .bz-status.ceka{background:var(--ps-papir-2);color:var(--ps-tinta-3)}
html .bz-status.djelimicno{background:var(--ps-mesing-meka);color:var(--ps-mesing-t,var(--ps-mesing))}
html .pj-broj{background:var(--ps-nit);color:#fff;font-weight:600}

/* Brojke: niža optička veličina = čvršće cifre, bez tankih „dlačica" na karticama */
html .stat-card-val,html .odbroj-broj,html .pregled-bz-broj,html .bz-kartica-val,
html .ubb-iznos,html .kstat-broj,html .up-tab-cijena,html .table-card-name,html .ps-stol,html .avatar{font-variation-settings:'opsz' 18;font-feature-settings:'lnum' 1}

/* Avatari: boja stola samo kao podloga, slova uvijek čitka */
html .avatar{color:var(--ps-tinta-2)!important;box-shadow:inset 0 0 0 1px rgba(28,26,22,.06)}
html[data-theme="dark"] .avatar,html body[data-theme="dark"] .avatar{color:var(--ps-tinta)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}

/* Plan sale: stolice kao na naslovnoj (obrisi), elementi mirnije */
html .ps-stolica{background:var(--ps-karta);border:1.2px solid var(--ps-tinta-3);opacity:.9;box-sizing:border-box}
html .ps-element{border-radius:6px;opacity:1;box-shadow:0 6px 14px -8px rgba(28,26,22,.45);font-family:var(--ps-sans)}
html .ps-el-txt{letter-spacing:.06em;text-transform:uppercase;font-size:9.5px;text-shadow:none;font-weight:600}
html .ps-el-x{color:var(--ps-greska)}
html .ps-el-x:hover{background:var(--ps-greska);color:#fff}
html[data-theme="dark"] .ps-element,html body[data-theme="dark"] .ps-element{box-shadow:0 0 0 1px rgba(238,232,218,.16),0 6px 14px -8px rgba(0,0,0,.6)}

/* Prijedlozi (čipovi) — neutralni, crvena nit tek na hover */
html .chip-prijedlog{border:1px dashed var(--ps-linija);background:var(--ps-karta);color:var(--ps-tinta-2);border-radius:999px;transition:border-color .2s,color .2s,background .2s}
html .chip-prijedlog:hover{border-style:solid;border-color:var(--ps-nit);background:var(--ps-nit-meka);color:var(--ps-nit-2)}
html .chip-prijedlog.dodano{opacity:.38}

/* Prikazano / Skriveno — ikona oka prati boju teksta (maska) */
html .sakrij-btn{background:var(--ps-ok-meka);color:var(--ps-ok);border:1px solid transparent;border-radius:999px;font-weight:600;letter-spacing:.02em}
html .sakrij-btn::before{background:currentColor!important;-webkit-mask:var(--oko) center/contain no-repeat;mask:var(--oko) center/contain no-repeat}
html .sakrij-btn.skriveno{background:var(--ps-papir-2);color:var(--ps-tinta-3);border-color:var(--ps-linija)}

/* Padajući izbornici u formama — ista strelica kao ostala polja */
html select.text-input,html #auth-tip{-webkit-appearance:none;appearance:none;padding-right:36px!important;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238A8272' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-position:right 12px center!important}
html select.text-input:focus{border-color:var(--ps-tinta);box-shadow:0 0 0 4px var(--ps-nit-meka)}
html .table-select{-webkit-appearance:none;appearance:none;background-repeat:no-repeat;background-position:right 10px center;padding-right:30px}
html select option{background:var(--ps-karta);color:var(--ps-tinta)}

/* Učitavanje naslovne fotografije */
html #hero-upload-wrap label.btn{display:inline-flex!important;align-items:center;gap:8px}
html #hero-upload-wrap label.btn::before{content:'';width:16px;height:16px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M7 9l5-5 5 5M4 16v2.8A1.2 1.2 0 0 0 5.2 20h13.6a1.2 1.2 0 0 0 1.2-1.2V16'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M7 9l5-5 5 5M4 16v2.8A1.2 1.2 0 0 0 5.2 20h13.6a1.2 1.2 0 0 0 1.2-1.2V16'/%3E%3C/svg%3E") center/contain no-repeat}

/* Kolona — ikone iz seta u redovima liste */
html #kolona-lista .zelje-stavka strong .ic,html #kolona-lista .zelje-stavka strong svg{display:inline-block;width:16px;height:16px;vertical-align:-3px;margin-right:4px;color:var(--ps-nit)}
html .kstat-ic .ic,html .kstat-ic svg{width:22px;height:22px}

/* Gornja traka „promjene se čuvaju" — tiha, papirna */
html .demo-banner{background:var(--ps-papir-2);color:var(--ps-tinta-2);border-bottom:1px solid var(--ps-linija);letter-spacing:.01em}
html .demo-banner svg{color:var(--ps-ok)}
html .demo-banner a{color:var(--ps-tinta);text-decoration-color:var(--ps-nit)}

/* Budžet: „potrošeno" je neutralno (tinta); crveno samo kad je prekoračeno */
html .bz-kartica.crveno .bz-kartica-val{color:var(--ps-tinta)}
html .bz-kartica.zeleno .bz-kartica-val{color:var(--ps-ok)}
html .bz-kartica.prekoraceno .bz-kartica-val{color:var(--ps-greska)}

/* Ponavljajuće stavke (raspored, FAQ, meni…) — lakše kutije, uredno dugme za brisanje */
html .unos-red{background:var(--ps-papir);border-color:var(--ps-linija);border-radius:var(--ps-r);padding:14px 50px 14px 14px}
html .unos-obrisi{top:14px;right:12px;width:28px;height:28px;border-radius:50%;border:1px solid var(--ps-linija);background:var(--ps-karta);color:var(--ps-tinta-3);font-size:17px;display:flex;align-items:center;justify-content:center;transition:color .2s,border-color .2s,background .2s}
html .unos-obrisi:hover{color:var(--ps-greska);border-color:var(--ps-greska);background:var(--ps-greska-meka)}
html .unos-vrijeme{max-width:92px}
@media (max-width:600px){html .unos-red{padding:12px 12px 12px 12px;padding-top:48px}html .unos-obrisi{top:10px}}
html .poruka-tekst{padding-left:28px}
html .poruka-tekst::before{font-size:44px;top:-9px;left:-1px;font-style:normal;font-variation-settings:'opsz' 96;opacity:.85}
/* Budžet na mobitelu: ukupno preko cijele širine, ostalo dvije kolone — manje skrolanja */
@media (max-width:600px){
  html .budzet-sazetak{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  html .budzet-sazetak .bz-kartica{padding:16px;margin:0}
  html .budzet-sazetak .bz-kartica:first-child{grid-column:1 / -1}
  html .budzet-sazetak .bz-kartica-val{font-size:24px}
  html .budzet-sazetak .bz-kartica:first-child .bz-kartica-val{font-size:30px}
  html .budzet-sazetak .bz-kartica-label{font-size:9.5px;letter-spacing:.12em}
}
html[lang="en"] .sakrij-btn::after{content:'Shown'}
html[lang="en"] .sakrij-btn.skriveno::after{content:'Hidden'}

/* Teme u panelu: prava sličica pozivnice (iz /teme), shema ostaje kao rezerva */
html .tp-omot{position:relative;border-radius:calc(var(--ps-r) - 1px) calc(var(--ps-r) - 1px) 0 0;overflow:hidden}
html .tp-slika{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;display:block;background:var(--ps-papir-2)}
html .stil-opcija:hover .tp-slika{transform:scale(1.03)}
html .tp-slika{transition:transform .35s var(--ps-ease)}
html .tp-omot .tp-mini{aspect-ratio:3/4}

/* Upozorenje kad Storage ne vraća sačuvanu sliku */
html .storage-upozorenje{font-size:13px;line-height:1.5;color:var(--ps-greska);background:var(--ps-greska-meka);border:1px solid color-mix(in srgb,var(--ps-greska) 30%,transparent);border-radius:var(--ps-r-sm);padding:10px 12px;margin-bottom:10px}

/* ── Pozivnica: traka za spremanje (uvijek vidljiva pri dnu) ── */
html .poz-traka{position:sticky;bottom:16px;z-index:30;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin:8px 0 0;padding:12px 14px 12px 18px;background:color-mix(in srgb,var(--ps-karta) 94%,transparent);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--ps-linija);border-radius:var(--ps-r);box-shadow:var(--ps-sjena-lg)}
html .poz-traka-status{flex:1;min-width:150px;font-size:13px;color:var(--ps-tinta-3,var(--text-muted));display:inline-flex;align-items:center;gap:8px}
html .poz-traka-status::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--ps-ok,#4a7c59);flex:none}
html .poz-traka.prljavo .poz-traka-status{color:var(--ps-tinta,var(--text-main));font-weight:500}
html .poz-traka.prljavo .poz-traka-status::before{background:var(--ps-nit)}
html .poz-traka.prljavo{border-color:var(--ps-nit-srednja)}
@media (max-width:880px){
  html .poz-traka{bottom:calc(70px + env(safe-area-inset-bottom));padding:10px 12px;gap:8px}
  html .poz-traka .btn{flex:1;justify-content:center}
  html .poz-traka-status{flex-basis:100%}
}
html .up-tab-cijena .up-val{font-family:var(--ps-sans);font-size:15px;font-weight:600;margin-right:2px;vertical-align:4px;color:var(--ps-tinta-2)}
html .up-tab-period{font-family:var(--ps-sans);font-size:12px;color:var(--ps-tinta-3);margin-top:2px}
html a.vise-stavka{text-decoration:none}
html .vise-stavka.aktivna span{color:var(--ps-tinta);font-weight:600}
/* Prazna stanja u listama želja — isti ton kao ostala prazna stanja */
html .zelje-prazno{font-family:var(--ps-serif);font-style:italic;font-size:15.5px;color:var(--ps-tinta-2);text-align:center;padding:30px 24px}
/* Toast i „Vrati" se ne preklapaju: „Vrati" stoji iznad obavijesti; na telefonu oboje iznad donjeg menija */
html .undo-btn{bottom:84px}
@media (max-width:880px){
  html .toast{bottom:calc(76px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px)}
  html .undo-btn{bottom:calc(136px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px)}
}
/* Na Pozivnici obavijest stoji iznad trake za spremanje */
html body.na-pozivnici .toast{bottom:96px}
@media (max-width:880px){ html body.na-pozivnici .toast{bottom:calc(196px + env(safe-area-inset-bottom))} }