/* Dashboard v0.9 — final polish pass on top of v0.8. */

/* Floating tooltips are viewport-level, never clipped by card boundaries. */
.start-page [data-tip]::after{display:none!important}
.v09-floating-tip{position:fixed;z-index:9999;max-width:min(280px,calc(100vw - 16px));padding:8px 10px;border-radius:9px;border:1px solid color-mix(in srgb,var(--line) 66%,var(--text) 34%);background:color-mix(in srgb,var(--panel) 94%,#000 6%);color:var(--text);font-size:11px;line-height:1.35;box-shadow:0 12px 34px rgba(0,0,0,.32);opacity:0;pointer-events:none;transform:translateY(3px);transition:opacity .12s ease,transform .12s ease}
.v09-floating-tip.show{opacity:1;transform:none}

/* A subtle instrument header treatment on all panels. */
.start-page .panel>.panel-head.v09-panel-head{margin:-3px -3px 5px;padding:5px 7px 6px;border-radius:10px;background:linear-gradient(90deg,color-mix(in srgb,var(--text) 5%,transparent),transparent 72%)}
:root[data-theme="dark"] .start-page .panel>.panel-head.v09-panel-head{background:linear-gradient(90deg,color-mix(in srgb,var(--text) 7%,transparent),transparent 72%)}

/* Planning is now future-only: history is carried by the energy chart. */
.start-page .planning-panel .history-row{display:none!important}
.start-page .planning-panel .timeline-shell.timeline-24h{gap:4px;margin-top:5px}
.start-page .planning-panel .timeline-axis-v07,.start-page .planning-panel .timeline-row-v07.future-row{grid-template-columns:72px minmax(0,1fr);gap:7px}
.start-page .planning-panel .timeline-row-v07.future-row .timeline-track{height:43px;background:var(--panel-2)}
.start-page .planning-panel .timeline-row-v07.future-row .timeline-segment{top:4px;bottom:4px;border-radius:9px;box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(0,0,0,.12),0 4px 12px rgba(0,0,0,.08)}
.start-page .planning-panel .timeline-segment.self-use{background:linear-gradient(135deg,color-mix(in srgb,var(--green) 82%,#fff 18%),var(--green))}
.start-page .planning-panel .timeline-segment.charge{background:linear-gradient(135deg,color-mix(in srgb,var(--cyan) 82%,#fff 18%),var(--cyan))}
.start-page .planning-panel .timeline-segment.hold{background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 84%,#fff 16%),var(--blue))}
.start-page .planning-panel .timeline-segment.export{background:linear-gradient(135deg,color-mix(in srgb,var(--orange) 84%,#fff 16%),var(--orange))}
.start-page .planning-panel .timeline-segment.curtail{background:linear-gradient(135deg,color-mix(in srgb,var(--yellow) 86%,#fff 14%),var(--yellow))}
.start-page .planning-panel .v07-axis-tick{font-size:9px;font-weight:750;color:color-mix(in srgb,var(--muted) 90%,var(--text) 10%)}
.start-page .planning-panel .timeline-row-label strong{font-size:10px}.start-page .planning-panel .timeline-row-label small{font-size:7.5px}

/* Weather: current conditions + today detail + four future days. */
.start-page .weather-card.weather-rich{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.65fr);grid-template-rows:auto 1fr;gap:7px 10px}
.start-page .weather-card .eyebrow{grid-column:1/-1}
.start-page .weather-card .weather-top{grid-column:1;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;margin:0;border-right:1px solid color-mix(in srgb,var(--weather-accent) 24%,var(--line));padding-right:10px}
.start-page .weather-card .weather-top>div:first-child{min-width:92px}
.start-page .weather-card .weather-range{display:none}
.start-page .v09-weather-today{min-width:0;display:grid;gap:3px;padding-left:2px}
.start-page .v09-weather-today strong{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--weather-accent)}
.start-page .v09-weather-today span{font-size:8.5px;line-height:1.2;color:var(--muted)}
.start-page .weather-hours.weather-days-v09{grid-column:2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;align-self:stretch}
.start-page .weather-days-v09 .weather-day{min-height:67px;padding:6px 3px;display:flex;flex-direction:column;justify-content:center}
.start-page .weather-days-v09 .weather-day time{font-size:8px;font-weight:800}.start-page .weather-days-v09 .weather-day b{font-size:13px;margin-top:2px}.start-page .weather-days-v09 .weather-day small,.start-page .weather-days-v09 .weather-day em{font-size:7.5px;line-height:1.15}
.start-page .weather-card .pv-forecast-line{display:none!important}

/* Energy chart legend now also explains the EMS decision backdrop. */
.start-page .energy-legend [data-series="ems"] i{height:8px;width:13px;border-radius:3px;background:linear-gradient(90deg,var(--green),var(--blue),var(--orange))}
.start-page .energy-legend{font-size:10px}

/* Price zones need to remain visible in dark mode; canvas alpha is raised in JS,
 * and the card gets a little more depth so the chart does not collapse into grey. */
:root[data-theme="dark"] .start-page #priceChart{filter:saturate(1.06) contrast(1.03)}

@media(max-width:680px){
  .v09-floating-tip{font-size:11px;max-width:min(270px,calc(100vw - 18px))}
  .start-page .panel>.panel-head.v09-panel-head{margin:-2px -2px 4px;padding:5px 6px}

  .start-page .planning-panel .timeline-axis-v07,.start-page .planning-panel .timeline-row-v07.future-row{grid-template-columns:54px minmax(0,1fr);gap:4px}
  .start-page .planning-panel .timeline-row-v07.future-row .timeline-track{height:37px}
  .start-page .planning-panel .timeline-row-label strong{font-size:9.5px}.start-page .planning-panel .timeline-row-label small{font-size:7px}
  .start-page .planning-panel .v07-axis-tick{font-size:8.5px}

  /* Current weather and future days stay on one compact line. */
  .start-page .weather-card.weather-rich{grid-template-columns:105px minmax(0,1fr);grid-template-rows:auto 1fr;gap:7px;padding:10px}
  .start-page .weather-card .weather-top{grid-column:1;grid-template-columns:1fr;gap:4px;padding-right:7px}
  .start-page .weather-card .weather-top>div:first-child{min-width:0}
  .start-page .weather-now .weather-icon{font-size:29px}.start-page .weather-now strong{font-size:29px}
  .start-page .weather-condition{font-size:9px}.start-page .v09-weather-today{padding:0}.start-page .v09-weather-today strong{font-size:7.5px}.start-page .v09-weather-today span{font-size:7px}
  .start-page .weather-hours.weather-days-v09{grid-column:2;gap:3px}
  .start-page .weather-days-v09 .weather-day{min-height:64px;padding:4px 2px}.start-page .weather-days-v09 .weather-day time{font-size:8px}.start-page .weather-days-v09 .weather-day b{font-size:12px}.start-page .weather-days-v09 .weather-day small,.start-page .weather-days-v09 .weather-day em{font-size:7px}
}