/* Desktop dashboard visual refinement: energy tiles, live-flow density and battery SOC placement. */
@media (min-width: 981px) {
  /* Add 5px to the dashboard/site content rail. The flow and scrollbar gutters stay unchanged. */
  .workspace {
    grid-template-columns: 323px minmax(0, 1fr) !important;
  }

  .sidebar.has-energy-dashboard-v3 {
    width: 323px !important;
  }

  .header {
    padding-left: 339px !important;
  }

  /* Construction status: keep the count large, with a deliberate brick-red emphasis. */
  #energyHeartbeat[data-energy-dashboard-v3] .energy-dashboard-v3-network-count > small > strong {
    color: #a63b32 !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .energy-dashboard-v3-network-count > small > span {
    color: #6c7689 !important;
    font-size: 7.9px !important;
    line-height: 1.04 !important;
  }

  /* ENERGY metrics deliberately use asymmetric widths: savings narrower, production wider. */
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row {
    display: grid !important;
    grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr) !important;
    gap: 7px !important;
    align-items: stretch !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-savings,
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-energy-main {
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 9px 9px 8px !important;
    border: 1px solid rgba(0, 32, 92, .085) !important;
    border-radius: 11px !important;
    box-sizing: border-box !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-savings {
    border-color: rgba(43, 116, 73, .30) !important;
    background: linear-gradient(145deg, rgba(43, 116, 73, .13), rgba(255,255,255,.965)) !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-energy-main {
    border-color: rgba(0, 32, 92, .25) !important;
    background: linear-gradient(145deg, rgba(0, 32, 92, .115), rgba(255,255,255,.975)) !important;
  }

  /* Suppress legacy geometry/pseudo display paths so Production has one visible value only. */
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-energy-main::before,
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-energy-main::after {
    content: none !important;
    display: none !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-energy-main > strong[hidden],
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-energy-main > .energy-kwh-geometry-proxy {
    display: none !important;
  }

  /* 25px is the default for both metrics. JS only scales downward when the full value + unit needs it. */
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row .desktop-metric-value {
    display: block !important;
    max-width: 100% !important;
    overflow: visible !important;
    color: #10265f !important;
    font-family: "Oswald", sans-serif !important;
    font-size: var(--desktop-metric-font-size, 25px) !important;
    font-weight: 700 !important;
    line-height: .95 !important;
    letter-spacing: -.018em !important;
    font-variant-numeric: tabular-nums !important;
    white-space: nowrap !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-savings > .desktop-metric-value {
    color: #2e6f4d !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row > .energy-dashboard-v3-energy-main > .desktop-metric-value {
    color: #10265f !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row .energy-dashboard-v3-savings > span,
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row .energy-dashboard-v3-energy-main > span:not(.energy-kwh-geometry-proxy) {
    margin-top: 5px !important;
    font-size: 9.6px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: .035em !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row .energy-dashboard-v3-savings > span {
    color: #46765d !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-energy-summary-row .energy-dashboard-v3-energy-main > span:not(.energy-kwh-geometry-proxy) {
    color: #405581 !important;
  }

  /* The extra 5px keeps this heading on one line without reducing its established font size. */
  #energyHeartbeat[data-energy-dashboard-v3] .energy-dashboard-v3-now > strong {
    margin-bottom: 6px !important;
    letter-spacing: .052em !important;
    white-space: nowrap !important;
  }

  /* Compact the live indicators and tuck their labels closer to the percentages. */
  #energyHeartbeat[data-energy-dashboard-v3] .energy-dashboard-v3-flow {
    gap: 6px !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .energy-dashboard-v3-flow > div {
    padding: 4px 4px 3px !important;
    border-radius: 9px !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .energy-dashboard-v3-flow strong {
    font-size: 21.2px !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .energy-dashboard-v3-flow span {
    min-height: 0 !important;
    margin-top: 0 !important;
    font-size: 7px !important;
    line-height: 1 !important;
  }

  /* Battery SOC follows the live indicators and uses a lighter, lower-profile treatment. */
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-summary {
    margin: 7px 0 0 !important;
    padding: 5px 8px 6px !important;
    border-color: rgba(53, 103, 189, .16) !important;
    background: linear-gradient(145deg, rgba(53, 103, 189, .055), rgba(255,255,255,.992) 76%) !important;
    box-shadow: none !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-head {
    grid-template-columns: 25px minmax(0, 1fr) auto !important;
    column-gap: 7px !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-icon {
    width: 25px !important;
    height: 25px !important;
    border-radius: 8px !important;
    background: rgba(53, 103, 189, .075) !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-icon::before,
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-icon::after,
  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-icon > i {
    content: none !important;
    display: none !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-icon > svg {
    width: 21px !important;
    height: 21px !important;
    overflow: visible !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-icon .battery-shell {
    fill: rgba(255,255,255,.46) !important;
    stroke: #3567bd !important;
    stroke-width: 1.7 !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-icon .battery-terminal {
    fill: none !important;
    stroke: #3567bd !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-icon .battery-fill {
    fill: rgba(78, 115, 195, .28) !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-icon .battery-bolt {
    fill: #3567bd !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-copy > strong {
    color: #2f5fb4 !important;
    font-family: "Oswald", sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .07em !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-copy > span {
    margin-top: 2px !important;
    font-size: 6.9px !important;
    letter-spacing: .02em !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-value {
    font-size: 21.5px !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-meter {
    height: 3px !important;
    margin: 5px 0 0 !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-battery-storage-summary > small {
    display: none !important;
  }

  /* Realtime source follows the battery condition row. */
  #energyHeartbeat[data-energy-dashboard-v3] > .desktop-realtime-source,
  #energyHeartbeat[data-energy-dashboard-v3] .energy-dashboard-v3-power > .desktop-realtime-source {
    display: block !important;
    margin: 5px 1px 0 !important;
    color: #747f92 !important;
    font-size: 7.8px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
  }

  #energyHeartbeat[data-energy-dashboard-v3] .desktop-realtime-source b {
    color: #53627b !important;
    font-weight: 900 !important;
  }
}