/*
 * Koncertlista szerkesztése — light theme refinements (vanilla prototype only).
 *
 * Applies only with <html data-theme="light">; the dark theme is untouched.
 * The title row of both panels (Teljes repertoár, Koncert műsora) gets the shared table-heading
 * treatment (--color-table-head-* in theme-light.css). The search field, the sorting hint and
 * the song rows stay white.
 *
 * No layout change: the band reaches into the head's padding with negative margins and gives the
 * same space back as padding, so every title, field and list keeps its exact position. It ends
 * halfway through the 12px gap above the search field / hint.
 */

:root[data-theme='light'] .editor-column__heading {
  --head-pad: var(--space-4);
  --head-split: calc(var(--space-3) / 2);

  margin: calc(-1 * var(--head-pad)) calc(-1 * var(--head-pad)) calc(-1 * var(--head-split));
  padding: var(--head-pad) var(--head-pad) var(--head-split);
  background: var(--color-table-head-bg);
  /* Bottom line drawn as an inset shadow: takes no space, so nothing below moves at any zoom */
  box-shadow: inset 0 calc(-1 * var(--border-width)) 0 var(--color-table-head-border);
  color: var(--color-table-head-text);
}

:root[data-theme='light'] .editor-column__heading .editor-column__count {
  color: var(--color-table-head-text);
}

/* Matches the head's smaller padding on narrow screens (SetlistEditorScreen.css) */
@media (max-width: 40rem) {
  :root[data-theme='light'] .editor-column__heading {
    --head-pad: var(--space-3);
  }
}

/* ---------- Planned playing time and programme rows ---------- */

/* Totals: white card, pale neutral tiles */
:root[data-theme='light'] .timing__stat {
  background: #f3f5f7;
}

:root[data-theme='light'] .timing__label,
:root[data-theme='light'] .timing__optional-title {
  color: var(--color-table-head-text);
}

/* Optional toggle: amber is too light for a fill in this theme, so the tint is stronger and the
   text stays dark (the „Elhagyható” text and the tick carry the meaning, not the colour) */
:root[data-theme='light'] .programme__optional[aria-pressed='true'],
:root[data-theme='light'] .programme__badge {
  background: color-mix(in srgb, var(--color-status-pending) 12%, white);
}

:root[data-theme='light'] .programme__details {
  background: #f8f9fa;
}