/* Moj račun — customer account. Same tokens as the site (site.css :root). */
.acc{max-width:1040px;margin:0 auto;padding:110px 20px 90px;display:grid;gap:22px}
.acc h1{font-size:clamp(32px,5vw,50px);line-height:1.04;letter-spacing:-.03em;font-weight:500}
.acc h1 span{color:var(--muted)}
.acc h2{font:600 12px Manrope,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:0}
.acc .lead{color:var(--muted);max-width:620px}
.acc-nav{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--muted)}
.btn.sm{min-height:38px;padding:0 14px;font-size:13px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:clamp(18px,3vw,28px);display:grid;gap:16px}
.login{max-width:520px}
.field{display:grid;gap:6px;font-size:14px;color:var(--muted)}
.field input,.field select,.field textarea{background:#0b100f;border:1px solid #ffffff2e;border-radius:10px;padding:12px 14px;color:var(--ink);font-size:15px;width:100%}
.field textarea{resize:vertical;min-height:84px;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:transparent}
.msg{font-size:14px;min-height:1.3em}.msg.ok{color:var(--ok)}.msg.err{color:#f0a08a}
.proj-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px}
.proj-head h3{font:600 22px Manrope,sans-serif;letter-spacing:-.01em;margin:4px 0 0}
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;border:1px solid #ffffff22;font-size:12px;color:#cfd5cc}
.chip.gold{border-color:#e6bd7c66;color:var(--gold)}.chip.ok{border-color:#8fd19e66;color:var(--ok)}
/* timeline */
.steps8{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.steps8 li{display:grid;gap:8px;font-size:12px;color:var(--dim);line-height:1.3}
.steps8 li i{height:4px;border-radius:999px;background:#ffffff14}
.steps8 li.gotovo i{background:#8fd19e}.steps8 li.gotovo{color:#b9c3b6}
.steps8 li.sada i{background:linear-gradient(90deg,#e6bd7c,#f0cb8e);box-shadow:0 0 12px #e6bd7c66}.steps8 li.sada{color:var(--ink);font-weight:600}
.now{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:10px;background:#e6bd7c12;border:1px solid #e6bd7c33;font-size:14px;color:#e9e4d8}
.now b{color:var(--gold);white-space:nowrap}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mini-card{border:1px solid var(--line);border-radius:12px;padding:16px;display:grid;gap:8px;align-content:start}
.mini-card h4{margin:0;font:600 12px Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.big{font:600 26px Manrope,sans-serif;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:14px;margin:0}.kv dt{color:var(--muted)}.kv dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
.meter{height:6px;border-radius:999px;background:#ffffff14;overflow:hidden}.meter i{display:block;height:100%;background:linear-gradient(90deg,#e6bd7c,#5fe08a)}
.small{font-size:13px;color:var(--muted)}
.mini-card .btn{min-height:40px;font-size:14px;margin-top:4px}
/* messages */
.thread{display:grid;gap:10px;max-height:360px;overflow:auto;padding-right:4px}
.bubble{max-width:82%;padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.5;white-space:pre-wrap}
.bubble.kupac{justify-self:end;background:#e6bd7c1c;border:1px solid #e6bd7c33}
.bubble.solar{justify-self:start;background:#ffffff0a;border:1px solid var(--line)}
.bubble small{display:block;color:var(--dim);font-size:11px;margin-bottom:4px}
.two{display:grid;grid-template-columns:1.3fr 1fr;gap:14px}
.row-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.orders{display:grid;gap:8px}.orders div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding:8px 0;font-size:14px}
.danger{color:#f0a08a}
@media (max-width:860px){.cards3,.two{grid-template-columns:1fr}.steps8{grid-template-columns:repeat(4,1fr);row-gap:14px}}
@media (max-width:520px){.steps8{grid-template-columns:repeat(2,1fr)}.acc-nav #acc-who{display:none}}
.code-input{font:600 28px Manrope,sans-serif;letter-spacing:.3em;text-align:center;max-width:260px}
.linkish{background:none;border:0;padding:0;color:var(--gold);font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
/* passkeys */
.pk-login{display:grid;gap:10px}
.pk-btn{min-height:54px;font-size:16px;display:inline-flex;align-items:center;justify-content:center;gap:10px}
.pk-ico{width:20px;height:20px;flex:none;border:2px solid currentColor;border-radius:6px;position:relative;display:inline-block}
.pk-ico::before{content:"";position:absolute;left:4px;top:5px;width:2px;height:3px;background:currentColor;box-shadow:6px 0 currentColor}
.pk-ico::after{content:"";position:absolute;left:4px;bottom:3px;width:8px;height:3px;border:2px solid currentColor;border-top:0;border-radius:0 0 6px 6px;box-sizing:border-box}
.or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px;margin:18px 0}
.or::before,.or::after{content:"";flex:1;height:1px;background:#ffffff22}
.pk-panel.pk-new{border-color:#e6bd7c88;background:#e6bd7c12}
.pk-list{list-style:none;margin:8px 0 12px;padding:0;display:grid;gap:8px}
.pk-list li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border:1px solid #ffffff1f;border-radius:12px}
.pk-list span{display:grid;gap:2px}.pk-list small{color:var(--muted)}
.msg:empty{display:none}
.tabs{display:inline-grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:14px;background:#ffffff0d;border:1px solid #ffffff1f;margin:8px 0 14px}
.tabs button{min-width:130px;min-height:42px;border:0;border-radius:10px;background:none;color:var(--muted);font:600 15px Manrope,sans-serif;cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--gold);color:#16130d}
.login form{display:grid;gap:12px}
.login .or{margin:6px 0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid2.pc{grid-template-columns:140px 1fr}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.45;color:#d5d9d0;cursor:pointer}
.check input{width:20px;height:20px;margin-top:1px;accent-color:var(--gold);flex:none}
.check a{color:var(--gold)}
.field.bad input,.check.bad span{border-color:#e07a5f!important;color:#ffb4a2}
.field.bad input{box-shadow:0 0 0 1px #e07a5f}
.profile{display:grid;gap:12px;max-width:620px}
@media (max-width:520px){.grid2{grid-template-columns:1fr}.grid2.pc{grid-template-columns:120px 1fr}}
/* project tabs and detail panes */
.ptabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:14px 0 18px;padding-bottom:2px}
.ptabs button{flex:none;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid #ffffff26;background:none;color:var(--muted);font:600 14px Manrope,sans-serif;cursor:pointer}
.ptabs button[aria-selected="true"]{background:var(--gold);border-color:var(--gold);color:#16130d}
.dot-n{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#e07a5f;color:#fff;font-size:11px;margin-left:4px}
.hist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.hist li{display:grid;gap:2px;padding-left:14px;border-left:2px solid #e6bd7c66}
.hist span{font-size:12px;color:var(--muted)}
.soon{border-style:dashed}
.soon-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.soon-grid div{display:grid;padding:10px;border-radius:10px;background:#ffffff08}
.soon-grid b{font:600 20px Manrope,sans-serif;color:#ffffff66}.soon-grid span{font-size:12px;color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.stats div{display:grid;gap:2px}.stats b{font:600 20px Manrope,sans-serif;color:var(--gold)}.stats span{font-size:12px;color:var(--muted)}
.echart{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;height:150px;align-items:end}
.ec-col{display:grid;grid-template-rows:1fr auto;height:100%;gap:4px;text-align:center}
.ec-col span{font-size:10px;color:var(--muted)}
.ec-bars{display:flex;align-items:flex-end;justify-content:center;gap:2px;height:100%}
.ec-bars i{width:40%;border-radius:3px 3px 0 0;display:block}
i.p{background:var(--gold)}i.c{background:#ffffff40}
.legend{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;margin:8px 0}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-left:8px}
.ticks{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:6px}
.ticks li{padding-left:22px;position:relative;line-height:1.4}
.ticks li::before{content:"✓";position:absolute;left:0;color:var(--gold);font-weight:700}
.ticks small{color:var(--muted)}
.sub{margin:10px 0 6px;text-transform:uppercase;letter-spacing:.08em;font-size:11px!important}
.docs{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:8px}
.docs li{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:10px;border:1px solid #e07a5f55}
.docs li.ok{border-color:#5fe08a55}
.docs span{display:grid;gap:2px}.docs small{color:var(--muted)}
.docs em{font-style:normal;font-size:12px;color:#ffb4a2;white-space:nowrap}.docs li.ok em{color:#9df2b4}
.kv.wide{grid-template-columns:1fr auto}
.kv.wide dd{text-align:right}
b.gold{color:var(--gold);font-size:18px}
@media (max-width:620px){.stats{grid-template-columns:1fr 1fr}}

/* ---- redesign: project header with the house, big track, bank-style tiles, bottom tab bar ---- */
.hello{margin:0 0 14px;font:500 15px Manrope,sans-serif;color:var(--muted)}
.proj{padding:0;overflow:hidden;border-radius:22px;background:#0f1514}
.phead{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);min-height:340px}
.phead-img{position:relative;overflow:hidden;background:#0b100f}
.phead-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:86% 88%}
.phead-img canvas{position:absolute;inset:0;width:100%!important;height:100%!important}
.phead-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,#0f1514 100%);pointer-events:none}
.phead-info{display:grid;align-content:center;justify-items:start;gap:12px;padding:28px 32px}
.phead-info h2{margin:0;font:500 clamp(24px,2.6vw,34px)/1.1 Manrope,sans-serif;letter-spacing:-.02em}
.now-line{margin:0;color:#d5d9d0;font-size:15px;line-height:1.5;max-width:420px}
.btn.big{min-height:52px;padding:0 22px;font-size:16px;margin-top:6px}
.proj .track,.proj .ptabs,.proj .ppane{margin-left:24px;margin-right:24px}
.proj .ppane{margin-bottom:24px}
.track{list-style:none;padding:22px 0 6px;margin-top:0;display:grid;grid-template-columns:repeat(8,1fr);position:relative;counter-reset:s}
.track li{display:grid;justify-items:center;text-align:center;gap:6px;position:relative;padding:0 4px}
.track li::before{content:"";position:absolute;top:15px;left:-50%;width:100%;height:2px;background:#ffffff1c;z-index:0}
.track li:first-child::before{display:none}
.track li.gotovo::before,.track li.sada::before{background:#8fd19e}
.track i{position:relative;z-index:1;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:600 13px Manrope,sans-serif;font-style:normal;
  background:#141b1a;border:2px solid #ffffff26;color:var(--muted)}
.track li.gotovo i{background:#8fd19e;border-color:#8fd19e;color:#0b100f}
.track li.sada i{background:var(--gold);border-color:var(--gold);color:#16130d;box-shadow:0 0 0 6px #e6bd7c2e}
.track b{font:600 12px Manrope,sans-serif;color:var(--muted);line-height:1.25}
.track li.gotovo b{color:#cfd6cc}.track li.sada b{color:var(--ink)}
.track small{font-size:11px;color:var(--dim);min-height:14px}
.track li.sada small{color:var(--gold)}
.ptabs svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin-right:6px;vertical-align:-4px}
.ptabs .s{display:none}
/* bank-style tiles and cards */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}
.tile{display:grid;gap:4px;padding:18px;border-radius:18px;background:linear-gradient(160deg,#18211f,#121817);border:1px solid #ffffff12}
.tile span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.tile b{font:600 clamp(22px,2.2vw,30px) Manrope,sans-serif;letter-spacing:-.02em}
.tile:first-child b{color:var(--gold)}
.tile small{font-size:12px;color:var(--muted)}
.proj .mini-card{border:1px solid #ffffff12;border-radius:18px;background:#121817;padding:18px}
.proj .mini-card .big{font-size:30px}
/* touch id toast */
.pk-toast{position:fixed;z-index:60;left:50%;bottom:20px;transform:translateX(-50%);display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  width:min(560px,calc(100% - 24px));padding:12px 14px;border-radius:16px;background:#141b1af2;border:1px solid #e6bd7c66;backdrop-filter:blur(12px);box-shadow:0 18px 40px #0008}
.pk-toast p{margin:0;display:grid;flex:1;min-width:150px}.pk-toast small{color:var(--muted)}
.pk-toast .msg{flex-basis:100%}
@media (max-width:980px){.phead{grid-template-columns:1fr}.phead-img{height:260px}.phead-img::after{background:linear-gradient(0deg,#0f1514 0%,transparent 40%)}.tiles{grid-template-columns:1fr 1fr}}
@media (max-width:760px){
  .phead-info{padding:18px 18px 8px}
  .proj .track,.proj .ptabs,.proj .ppane{margin-left:16px;margin-right:16px}
  .track{grid-template-columns:1fr;gap:0;padding-top:10px}
  .track li{grid-template-columns:32px 1fr auto;justify-items:start;text-align:left;align-items:center;gap:12px;padding:8px 0}
  .track li::before{left:15px;top:-50%;width:2px;height:100%}
  .track b{font-size:14px}
  .track li.kasnije{opacity:.7}
  /* one project: the sections become an app-style bar at the bottom of the screen */
  .one-proj .ptabs{position:fixed;z-index:50;left:0;right:0;bottom:0;margin:0!important;padding:6px 6px calc(6px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(5,1fr);
    gap:2px;background:#0b100ff2;border-top:1px solid #ffffff1f;backdrop-filter:blur(14px)}
  .one-proj .ptabs button{display:grid;justify-items:center;gap:3px;min-height:54px;padding:4px 0;border:0;border-radius:12px;font-size:11px;position:relative}
  .one-proj .ptabs button[aria-selected="true"]{background:#e6bd7c1f;color:var(--gold)}
  .one-proj .ptabs svg{margin:0;width:22px;height:22px}
  .one-proj .ptabs .l{display:none}.one-proj .ptabs .s{display:block}
  .one-proj .ptabs .dot-n{position:absolute;top:2px;right:calc(50% - 22px);margin:0;min-width:16px;height:16px;font-size:10px}
  .one-proj{padding-bottom:84px}
  .one-proj ~ .pk-toast,body:has(.one-proj) .pk-toast{bottom:84px}
  .tiles{gap:8px}.tile{padding:14px}
}
.phead-info h2{text-transform:none;color:var(--ink);letter-spacing:-.02em}
.phead-img img{max-width:none}
.phead-img::after{background:linear-gradient(90deg,transparent 85%,#0f1514 100%)}
.phead-img img{z-index:0}.phead-img canvas{z-index:1}.phead-img .hb-tags{z-index:3}.phead-img::after{z-index:2}
@media (max-width:760px){.pk-toast{flex-wrap:nowrap;gap:8px;padding:10px 12px}.pk-toast small{display:none}.pk-toast p{min-width:0;font-size:14px}.pk-toast .btn{padding:0 12px;min-height:38px}}

.account-kind,.company-fields{border:0;margin:0 0 18px;padding:0;min-width:0}.account-kind legend,.company-fields legend{font-weight:600;margin-bottom:12px}.account-kind .tabs{display:flex;gap:12px;padding:12px}.account-kind label{flex:1;cursor:pointer;padding:12px;border-radius:8px}.account-kind label:has(input:checked){background:#bd5a35;color:white}.company-fields{display:grid;gap:14px;padding:18px;border:1px solid #ffffff25;border-radius:10px}.company-fields[hidden]{display:none}