.modern-dashboard{max-width:1220px}.dashboard-intro{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:20px}.dashboard-intro h2{font-family:Inter,system-ui,sans-serif;font-size:30px;font-weight:650;letter-spacing:-.04em}.dashboard-intro p:not(.eyebrow){color:#748092;margin:8px 0 0}.live-badge{background:#e8faec;color:#217d38;border-radius:999px;padding:9px 12px;font-size:12px;font-weight:700;white-space:nowrap}.status-board{background:#fff;border:1px solid #e4e7f2;border-radius:18px;padding:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;box-shadow:0 9px 25px #34417a0b}.status-card{background:#f5f5ff;border-radius:12px;padding:14px;min-height:105px;display:grid;align-content:start;gap:6px}.status-card span{font-weight:800;font-size:17px}.status-card strong{font-size:36px;line-height:1;letter-spacing:-.06em;font-weight:650}.status-card small{color:#687084;font-weight:650}.status-card.available span{color:#45c85c}.status-card.occupied span{color:#f19b54}.status-card.unavailable span{color:#f5667f}.status-card.inoperative span{color:#8c91a8}.availability-strip{grid-column:1/-1;display:flex;min-height:58px;border-radius:10px;overflow:hidden;background:#eff1f6}.availability-strip>div{flex:var(--share) 1 0;background:color-mix(in srgb,var(--segment) 18%,#fff);border-top:4px solid var(--segment);padding:8px 10px;min-width:94px}.availability-strip strong{display:block;font-size:20px;letter-spacing:-.04em}.availability-strip small{color:#667085;font-size:11px}.dashboard-layout{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(260px,.7fr);gap:18px;margin-top:20px}.dashboard-panel,.dashboard-side{background:#fff;border:1px solid #e4e7f2;border-radius:18px;padding:20px;box-shadow:0 9px 25px #34417a0b}.dashboard-panel header{display:flex;align-items:start;margin:0 0 18px}.dashboard-panel h3,.dashboard-side h3{font-size:15px;margin:0;font-family:Inter,system-ui,sans-serif}.dashboard-panel p{margin:5px 0 0;color:#7b8597;font-size:12px}.dashboard-panel header span{margin-left:auto;color:#4457ea;font-weight:750;white-space:nowrap}.energy-chart{height:250px;display:flex;align-items:end;gap:7px;border-bottom:1px solid #dce1fb;padding:24px 7px 0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 61px,#edf0fa 62px)}.bar-column{height:100%;flex:1;display:grid;grid-template-rows:18px 1fr 24px;justify-items:center;gap:7px;min-width:0}.bar-value{font-size:10px;color:#788096;white-space:nowrap}.bar{align-self:end;width:min(52px,85%);border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,#7383ff 0%,#aeb8ff 58%,#edf0ff 100%);border-top:3px solid #4f61f3;transition:height .3s ease}.bar-column small{text-transform:capitalize;color:#687084;font-size:10px}.dashboard-side{display:grid;align-content:start;gap:10px}.system-status{padding:13px;border-radius:10px;font-weight:750;font-size:12px}.system-status.healthy{color:#28753a;background:#e9fae8}.system-status.attention{color:#9a442f;background:#fff0e8}.today-stat{background:#f5f5ff;border-radius:10px;padding:11px;display:flex;gap:11px;align-items:center}.today-stat>span{display:grid;place-items:center;color:#5265ef;border:1px solid #9faaf8;border-radius:7px;width:28px;height:28px;font-size:17px;font-weight:800}.today-stat strong{display:block;font-size:22px;letter-spacing:-.05em}.today-stat small{color:#767f91}.dashboard-streams{margin-top:20px}.overview-columns{display:grid;grid-template-columns:1.5fr 1fr;gap:18px}.overview-columns>div{background:#fff;border:1px solid #e4e7f2;border-radius:18px;padding:18px}.overview-columns h2{font-size:17px;margin:0 0 15px;font-family:Inter,system-ui,sans-serif}.stream{display:grid;gap:9px}.stream-item{border:1px solid #e3e7ef;border-left:4px solid #4f61f3;border-radius:8px;padding:12px;display:flex;justify-content:space-between;gap:12px}.stream-item.alert{border-left-color:#ed6579}.stream-item strong{display:block;font-size:13px}.stream-item span{font-size:12px;color:#657587;display:block;margin-top:4px}.stream-item .energy{font-size:16px;color:#4457ea;white-space:nowrap}.stream-empty{color:#657587;padding:16px 0}@media(max-width:900px){.dashboard-layout,.overview-columns{grid-template-columns:1fr}.status-board{grid-template-columns:repeat(2,1fr)}.availability-strip{flex-wrap:wrap}.availability-strip>div{flex:1 1 45%}}@media(max-width:600px){.dashboard-intro{align-items:start;flex-direction:column}.status-board{padding:12px;gap:8px}.status-card{min-height:90px;padding:11px}.status-card strong{font-size:29px}.availability-strip>div{min-width:45%;padding:7px}.energy-chart{gap:6px;height:220px}.dashboard-panel,.dashboard-side,.overview-columns>div{padding:14px}}

/* Energiadiagram forrás szerinti bontással. Az oszlop alul napenergia, fölötte
   hálózat, legfelül az, aminek a forrását nem mértük — az utóbbit külön színnel,
   mert nem állíthatjuk róla, hogy napból vagy hálózatból jött. */
.history-controls{display:flex;gap:10px;align-items:center}
.history-scope{display:inline-flex;padding:3px;border-radius:999px;background:#f1f3fa;gap:2px}
.history-scope button{border:0;border-radius:999px;background:transparent;color:#5a6478;font:700 11.5px Inter,system-ui,sans-serif;padding:6px 13px;cursor:pointer}
.history-scope button:hover{color:#1a3b4d}
.history-scope button.active{background:#1a3b4d;color:#fff}
.history-nav{display:inline-flex;gap:4px}
.history-nav button{width:28px;height:28px;border:1px solid #e1e5f3;border-radius:8px;background:#fff;color:#5a6478;font-size:15px;line-height:1;cursor:pointer}
.history-nav button:hover:not(:disabled){border-color:#1a3b4d;color:#1a3b4d}
.history-nav button:disabled{color:#c8cedb;cursor:not-allowed}
.history-summary{display:flex;gap:20px;flex-wrap:wrap;margin:2px 0 14px;font-size:12px;color:#748097}
.history-summary b{font-size:15px;color:#14243e;margin-right:4px;font-variant-numeric:tabular-nums}
.history-bar{display:flex;flex-direction:column-reverse;width:min(100%,74px);border-radius:8px 8px 0 0;overflow:hidden;background:#eef0f6;min-height:2px}
.history-part{display:block;width:100%}
.history-part.pv{background:linear-gradient(180deg,#f5c945,#eab308)}
.history-part.grid{background:linear-gradient(180deg,#8f9ff5,#5a6ef0)}
.history-part.unknown{background:#cbd2e2}
.history-legend{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px;font-size:11px;color:#8a93a6}
.history-key{width:10px;height:10px;border-radius:3px;display:inline-block}
.history-key.pv{background:#eab308}
.history-key.grid{background:#5a6ef0;margin-left:10px}
.history-key.unknown{background:#cbd2e2;margin-left:10px}

/* A még futó töltés csíkozva: látszik, hogy hozzátartozik, de nem kész adat. */
.history-part.live{background:repeating-linear-gradient(135deg,#9fb4c9,#9fb4c9 4px,#b9c9da 4px,#b9c9da 8px)}
.history-live b{color:#4a6076}
.history-key.live{background:repeating-linear-gradient(135deg,#9fb4c9,#9fb4c9 3px,#b9c9da 3px,#b9c9da 6px);margin-left:10px}

/* Szélesebb oszlopok: a hónapnézet 31 rovatánál a hely szabja meg a szélességet,
   a napnézetnél és az évnézetnél viszont a felső határ tartja arányosan. */
.energy-chart .bar-column{gap:6px}
.energy-chart .bar-value{font-size:11px;font-weight:700;color:#5a6478;font-variant-numeric:tabular-nums}
.energy-chart .bar-column small{font-size:10.5px;color:#8a93a6}
@media(max-width:1100px){
  .energy-chart{gap:4px}
  .energy-chart .bar-column small{font-size:9.5px}
}
