.ecoflow-summary.is-vertical {
  grid-template-columns: minmax(0, 1fr);
}
.ecoflow-summary.is-week-first > .ecoflow-week {
  order: -1;
}
.ecoflow-summary.is-separated > .ecoflow-today,
.ecoflow-summary.is-separated > .ecoflow-week {
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}
.ecoflow-summary[style] {
  max-width: 100%;
}
.ecoflow-chart-line {
  display: block;
  width: 100%;
  min-height: 112px;
  overflow: visible;
}
.ecoflow-chart-line polyline {
  fill: none;
  stroke: var(--panel-accent, var(--accent, #f2b84b));
  stroke-width: 2.5;
  vector-effect: non-scaling-stroke;
}
.ecoflow-chart-line circle {
  fill: var(--panel-accent, var(--accent, #f2b84b));
}
.ecoflow-chart-line-labels {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
  color: var(--muted);
  font-size: .68rem;
  text-align: center;
}
.ecoflow-today .ecoflow-chart-line-labels {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.energy-grid-settings {
  margin: 18px 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel-soft);
}
.energy-grid-settings h4,
.energy-grid-settings p {
  margin: 0;
}
.energy-grid-settings h4 {
  margin-bottom: 5px;
}
.energy-grid-settings p {
  margin-bottom: 12px;
  color: var(--muted);
}
.energy-grid-settings .grid {
  align-items: end;
}

.energy-grid-dimension {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px;
  gap: 8px;
}
/* Module-owned layout controls: theme CSS may style the surface, but cannot discard saved grid settings. */
.ecoflow-summary.is-vertical {
  grid-template-columns: minmax(0, 1fr) !important;
}
.ecoflow-summary:not(.is-vertical) {
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr) !important;
}
.ecoflow-panel.is-split-tiles {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.ecoflow-panel.is-split-tiles > .ecoflow-summary {
  gap: 18px;
}
.ecoflow-panel.is-split-tiles > .ecoflow-summary > .ecoflow-today,
.ecoflow-panel.is-split-tiles > .ecoflow-summary > .ecoflow-week {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-soft);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}

/* Wspólna siatka modułu Energia EcoFlow. Odstęp jest częścią modułu,
   dzięki czemu kafelki pozostają rozdzielone we wszystkich motywach. */
.ecoflow-grid {
  --energy-grid-gap: clamp(8px, .75vw, 14px);
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: repeat(24, minmax(0, 1fr));
  gap: var(--energy-grid-gap) !important;
  width: 100%;
  min-height: clamp(520px, 58vh, 720px);
}
.energy-grid-item {
  grid-column: calc(var(--energy-x) + 1) / span var(--energy-w);
  grid-row: calc(var(--energy-y) + 1) / span var(--energy-h);
  min-width: 0;
  min-height: 0;
  margin: 0;
  overflow: hidden;
}
.ecoflow-source-plan {
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 0;
  padding: 12px 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-soft);
}
.ecoflow-source-plan .panel-footer {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
}
.ecoflow-info-tile {
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.ecoflow-info-tile .ecoflow-statusbar {
  grid-template-columns: repeat(var(--ecoflow-info-count, 1), minmax(0, 1fr));
  align-items: center;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
.ecoflow-info-item {
  min-width: 0;
  overflow: hidden;
}
.ecoflow-info-item:not(:last-child) {
  border-right: 1px solid var(--line);
  padding-right: 12px;
}
.ecoflow-info-item + .ecoflow-info-item {
  padding-left: 12px;
}
.ecoflow-info-item span,
.ecoflow-info-item strong,
.ecoflow-info-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ecoflow-production-today,
.ecoflow-production-week {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.ecoflow-production-today .ecoflow-chart,
.ecoflow-production-week .ecoflow-chart {
  flex: 1 1 auto;
  min-height: 0;
}

.energy-layout-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
  margin-top: 12px;
}
.energy-layout-summary-item {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
}
.energy-layout-summary-item strong,
.energy-layout-summary-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.energy-layout-summary-item small {
  color: var(--muted);
  font-size: .72rem;
}
/* Moduł zachowuje klasę powierzchni EcoFlow dla istniejących motywów,
   ale sam nie odtwarza usuniętego dużego kontenera. */
.ecoflow-grid.ecoflow-panel {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  max-height: none !important;
  overflow: visible !important;
}
.ecoflow-grid.ecoflow-panel .energy-grid-item {
  min-width: 0;
}
.energy-overlay {
  height: 100dvh;
  max-height: 100dvh;
  overflow-y: scroll !important;
  overscroll-behavior: contain;
}
.energy-overlay-shell {
  min-height: 100%;
  height: auto;
}
body.has-custom-layout #dashboard:has(.theme-layout-page[data-theme-layout-page="energy"]) {
  height: auto !important;
  min-height: 100vh !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
#dashboard-app .theme-layout-page[data-theme-layout-page="energy"] {
  height: auto !important;
  min-height: 100vh !important;
  max-height: none !important;
  overflow: visible !important;
  align-content: start;
}

/* Tablet/phone: let the page grow like the Lights page so the lower tiles
   remain reachable by touch scrolling. Desktop sizing is unchanged. */



/* Landscape touch tablet: release the desktop viewport lock. */



/* Corrected landscape touch selector: body is #dashboard-app itself. */

/* Kafelek informacyjny: wartość i jednostka są jednym elementem układu. */
.ecoflow-info-tile .ecoflow-info-value {
  display: inline-flex;
  align-items: baseline;
  gap: .35em;
  min-width: 0;
  overflow: hidden;
}
.ecoflow-info-tile .ecoflow-info-unit {
  flex: 0 0 auto;
}