/* Blueport Metalworks – spoločný vzhľad podľa manuálu identity (hranatý štýl, Manrope / IBM Plex). */
:root,:root[data-skin="dark"]{
  --bg:#12171c; --panel:#1b222a; --fg:#e6ebf0; --muted:#97a4b1; --line:#34404c;
  --accent:#6db3f5; --steel:#6f7e8c; --steel-edge:#c3ced8; --warn:#ff8a80; --conc:#2c3138; --conc-edge:#7d8791;
  --brand:#2461AA; --hot:#AC2500; --ok:#5fd08c; --top:#0A1930; --top-fg:#ffffff; --top-muted:#9DB8E8; --top-line:#22406e;
  --sans:"IBM Plex Sans",system-ui,sans-serif; --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace; --head:"Manrope","IBM Plex Sans",system-ui,sans-serif;
  color-scheme:dark;
}
:root[data-skin="light"]{
  --bg:#F3F5F8; --panel:#ffffff; --fg:#0A1930; --muted:#5A6B82; --line:#DDE3EC;
  --accent:#2461AA; --steel:#8493a1; --steel-edge:#3B4A60; --warn:#AC2500; --conc:#dcd9d2; --conc-edge:#8b867b;
  --ok:#136B3A; --top:#ffffff; --top-fg:#0A1930; --top-muted:#5A6B82; --top-line:#DDE3EC;
  color-scheme:light;
}
:root[data-skin="corp"]{
  --bg:#0A1930; --panel:#0f2444; --fg:#ffffff; --muted:#9DB8E8; --line:#22406e;
  --accent:#9DB8E8; --steel:#5f7699; --steel-edge:#c5d6ea; --warn:#ff8a80; --conc:#1b2f4f; --conc-edge:#7f95b8;
  --ok:#5fd08c; --top:#2461AA; --top-fg:#ffffff; --top-muted:#dbe6f7; --top-line:#2461AA;
  color-scheme:dark;
}
*,*::before,*::after{border-radius:0!important}
[hidden]{display:none!important}
html,body{min-height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.4 var(--sans)}
img{max-width:100%}
h1,h2,h3{font-family:var(--head);font-weight:800;letter-spacing:-.02em}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* horná lišta */
.bp-top{display:flex;align-items:center;gap:8px 22px;flex-wrap:wrap;padding:10px 16px;background:var(--top);color:var(--top-fg);border-bottom:1px solid var(--top-line)}
.bp-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--top-fg)}
.bp-brand span{font:500 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--top-muted);padding-left:12px;border-left:1px solid var(--top-muted)}
.bp-logo{display:block;height:28px;width:auto}
.bp-logo-light{display:none}
:root[data-skin="light"] .bp-logo-light{display:block}
:root[data-skin="light"] .bp-logo-dark{display:none}
.bp-nav{display:flex;gap:4px}
.bp-nav a{font:700 12.5px var(--head);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--top-fg);padding:8px 10px;border-bottom:3px solid transparent}
.bp-nav a:hover{border-bottom-color:var(--top-muted)}
.bp-nav a[aria-current="page"]{border-bottom-color:var(--hot)}
:root[data-skin="corp"] .bp-nav a[aria-current="page"]{border-bottom-color:#fff}
.bp-right{margin-left:auto;display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;font-size:13px}
.bp-credits{font:500 12px var(--mono);letter-spacing:.04em;padding:5px 9px;border:1px solid var(--top-muted);color:var(--top-fg);text-decoration:none}
.bp-credits:hover{border-color:var(--top-fg)}
.bp-credits b{font-weight:600}
.bp-build{font:600 11px var(--mono);letter-spacing:.04em;color:var(--top-muted);border:1px solid var(--top-muted);padding:3px 7px;cursor:default;white-space:nowrap}

/* používateľská ikonka s menu (vzor: redport CRM, tvar podľa identity Blueportu) */
.bp-um{position:relative}
.bp-top .bp-um-btn{display:flex;align-items:center;gap:9px;background:transparent;border:1px solid var(--top-muted);color:var(--top-fg);padding:4px 10px 4px 4px;cursor:pointer;font-family:var(--sans);text-align:left}
.bp-top .bp-um-btn:hover,.bp-top .bp-um-btn[aria-expanded="true"]{border-color:var(--top-fg)}
.bp-avatar{width:28px;height:28px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--brand);color:#fff;font:800 12px var(--head);letter-spacing:.02em}
:root[data-skin="corp"] .bp-avatar{background:#fff;color:var(--brand)}
.bp-um-text{display:flex;flex-direction:column;line-height:1.2}
.bp-um-name{font-weight:600;font-size:12.5px;white-space:nowrap}
.bp-um-role{font-size:11px;color:var(--top-muted)}
.bp-chev{font-size:10px;color:var(--top-muted)}
.bp-um-drop{position:absolute;top:calc(100% + 6px);right:0;z-index:30;min-width:190px;padding:6px;background:var(--panel);border:1px solid var(--line);box-shadow:0 10px 28px rgba(0,0,0,.28)}
.bp-um-drop form{margin:0;border-top:1px solid var(--line);margin-top:6px;padding-top:6px}
.bp-top .bp-um-item{display:block;width:100%;box-sizing:border-box;text-align:left;background:none;border:0;padding:9px 10px;font:500 13px var(--sans);color:var(--fg);text-decoration:none;cursor:pointer}
.bp-top .bp-um-item:hover{background:var(--bg);color:var(--accent)}
@media (max-width:640px){.bp-um-text,.bp-chev{display:none}.bp-top .bp-um-btn{padding:4px}}

/* obsah */
.bp-main{max-width:1180px;margin:0 auto;padding:28px 16px 48px}
.bp-h1{font-size:32px;line-height:1.1;margin:0}
.bp-h1::after{content:"";display:block;width:48px;height:3px;background:var(--hot);margin-top:12px}
.bp-h2{font-size:20px;margin:0 0 14px}
.bp-sub{color:var(--muted);margin:12px 0 24px;max-width:65ch}
.bp-foot{max-width:1180px;margin:0 auto;padding:0 16px 28px;font:400 12px var(--mono);color:var(--muted)}
.bp-btn{display:inline-block;font:600 14px var(--sans);padding:9px 16px;cursor:pointer;text-decoration:none;background:var(--brand);border:1px solid var(--brand);color:#fff}
.bp-btn:hover{background:#1d5294}
.bp-btn.ghost{background:transparent;color:var(--fg);border-color:var(--line)}
.bp-btn.ghost:hover{border-color:var(--accent);background:transparent}
.bp-tag{display:inline-block;font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.bp-tag.ok{color:var(--ok);border-color:var(--ok)}
.bp-tag.warn{color:var(--warn);border-color:var(--warn)}
.bp-tag.acc{color:var(--accent);border-color:var(--accent)}

/* prihlásenie */
.bp-login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px 16px;box-sizing:border-box}
.bp-card{background:var(--panel);border:1px solid var(--line);padding:28px;width:100%;max-width:360px;display:flex;flex-direction:column;gap:16px}
.bp-card .bp-brand{color:var(--fg)}
.bp-card .bp-brand span{color:var(--muted);border-left-color:var(--line)}
.bp-card h1{font-size:20px;margin:6px 0 0}
.bp-card label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
.bp-card input{font:500 16px var(--mono);color:var(--fg);background:var(--bg);border:1px solid var(--line);padding:9px 10px}
.bp-err{margin:0;color:var(--warn);font-weight:500;font-size:13px}
.bp-build-fixed{position:fixed;top:14px;right:16px;font:600 11px var(--mono);letter-spacing:.04em;color:var(--muted);border:1px solid var(--line);padding:3px 7px;cursor:default}

/* dlaždice */
.bp-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.bp-tile{display:flex;flex-direction:column;gap:10px;background:var(--panel);border:1px solid var(--line);padding:18px;text-decoration:none;color:var(--fg);min-width:0}
a.bp-tile:hover{border-color:var(--accent)}
.bp-tile svg{width:72px;height:72px;stroke:var(--accent);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.bp-tile svg .thin{stroke:var(--steel-edge);stroke-width:1.3}
.bp-tile h2{font-size:17px;margin:4px 0 0}
.bp-tile p{margin:0;font-size:13px;color:var(--muted)}
.bp-tile .st{margin-top:auto;padding-top:8px;display:flex;justify-content:space-between;align-items:center;gap:8px;font:500 12px var(--mono);letter-spacing:.04em}
.bp-tile .st .go{color:var(--accent)}
.bp-tile.off{border-style:dashed}
.bp-tile.off svg{stroke:var(--muted)}
.bp-tile.off .st{color:var(--muted)}

/* účet */
.bp-acc{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;align-items:start;margin-top:24px}
.bp-side{display:flex;flex-direction:column;border:1px solid var(--line);background:var(--panel)}
.bp-side a{font:700 12.5px var(--head);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--fg);padding:11px 14px;border-left:3px solid transparent;border-bottom:1px solid var(--line)}
.bp-side a:last-child{border-bottom:0}
.bp-side a:hover{color:var(--accent)}
.bp-side a[aria-current="page"]{border-left-color:var(--hot);background:var(--bg)}
@media (max-width:760px){
  .bp-acc{grid-template-columns:1fr;gap:18px}
  .bp-side{flex-direction:row;overflow-x:auto}
  .bp-side a{border-bottom:0;border-left:0;border-top:3px solid transparent;white-space:nowrap}
  .bp-side a[aria-current="page"]{border-top-color:var(--hot)}
}
.bp-sec{min-width:0;display:flex;flex-direction:column;gap:22px}
.bp-box{background:var(--panel);border:1px solid var(--line);padding:18px;min-width:0}
.bp-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:18px}
.bp-stat{background:var(--panel);border:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:6px}
.bp-stat.main{border-top:3px solid var(--hot)}
.bp-k{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.bp-v{font:800 26px var(--head);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.bp-v small{font:400 13px var(--sans);color:var(--muted);margin-left:5px;letter-spacing:0}
.bp-stat .more{font-size:13px;color:var(--muted)}
.bp-dl{display:grid;grid-template-columns:minmax(120px,200px) minmax(0,1fr);gap:0;margin:0}
.bp-dl dt{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:10px 12px 10px 0;border-bottom:1px solid var(--line)}
.bp-dl dd{margin:0;padding:9px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.bp-dl dt:last-of-type,.bp-dl dd:last-of-type{border-bottom:0}
@media (max-width:520px){.bp-dl{grid-template-columns:1fr}.bp-dl dt{border-bottom:0;padding-bottom:0}}
.bp-tw{overflow-x:auto}
.bp-table{border-collapse:collapse;width:100%;font-size:14px;font-variant-numeric:tabular-nums}
.bp-table th,.bp-table td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.bp-table th{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.bp-table tr:last-child td{border-bottom:0}
.bp-table .num{text-align:right;font-family:var(--mono)}
.bp-table .wrap{white-space:normal;min-width:180px}
.bp-plus{color:var(--ok)}
.bp-minus{color:var(--warn)}
.bp-empty{color:var(--muted);margin:0}
.bp-boxhead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.bp-boxhead .bp-h2{margin:0}
.bp-boxhead a{font-size:13px}

/* názov projektu pri ukladaní do účtu (výpočtové stránky) */
.bp-name{font:500 14px var(--sans);color:var(--fg);background:var(--bg);border:1px solid var(--line);padding:5px 9px;width:220px;max-width:100%}

/* nastavenia – výber témy */
.bp-themes{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin:0 0 18px;padding:0;border:0}
.bp-theme{display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid var(--line);cursor:pointer}
.bp-theme:has(input:checked){border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.bp-theme:hover{border-color:var(--accent)}
.bp-theme .sw{display:grid;grid-template-rows:14px 1fr;height:74px;border:1px solid var(--line)}
.bp-theme .sw i{display:block}
.bp-theme .sw .b{display:flex;gap:6px;padding:8px;align-items:flex-start}
.bp-theme .sw .b i{flex:1;height:100%}
.bp-theme .lab{display:flex;align-items:center;gap:8px;font-weight:600}
.bp-theme .lab small{font:400 12px var(--sans);color:var(--muted)}
.bp-ok{margin:0 0 16px;padding:9px 12px;border:1px solid var(--ok);color:var(--ok);font-weight:500}

/* dlaždice typov schodov */
.bp-tile.plan svg{width:96px;height:96px}
.bp-tile.plan svg .fill{fill:var(--line);stroke:none}
.bp-back{display:inline-block;margin-bottom:14px;font-size:13px}
.bp-tile.plan.off svg{stroke:var(--accent)}