/* ============================================================================
   THEME YIELD LAYER
   ----------------------------------------------------------------------------
   When ANY theme class (cp-theme-clean / -industrial / -classic / future) is
   present on a .lyric-sheet-container, the base stylesheet's hardcoded chart
   styling must step aside so the theme's own CSS (ported faithfully from the
   design HTML) comes through cleanly — instead of being fought rule-by-rule
   with !important.

   This file is loaded AFTER the base sheet and BEFORE the per-theme files, so:
     base  ->  yield (neutralize)  ->  theme (rebuild)
   It only neutralizes the specific properties the base sheet forces; it does
   not style anything itself. Each theme file then sets its own values.

   Scope is `.lyric-sheet-container[class*="cp-theme-"]` so it applies to every
   theme uniformly. Clean is a theme too, so Clean also rebuilds from its file.
   Loaded everywhere a chart loads (chords + setlist libraries), so no chart is
   ever stranded without it.
   ========================================================================== */

/* --- container: drop the forced black bg + zero padding from .dark-mode --- */
.lyric-sheet-container[class*="cp-theme-"],
.lyric-sheet-container[class*="cp-theme-"].dark-mode {
  background-color: transparent;     /* theme sets --ground bg */
  background-image: none;            /* theme sets its own texture */
  padding: 0;                        /* theme sets its own padding */
  color: inherit;
}

/* --- lyrics / chords: clear base colors so theme tokens win (light + dark) --- */
.lyric-sheet-container[class*="cp-theme-"] .lyrics,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .lyrics,
.lyric-sheet-container[class*="cp-theme-"] .chords,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .chords {
  color: inherit;
}
.lyric-sheet-container[class*="cp-theme-"] .lyrics span.chord span.chord-text,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .lyrics span.chord span.chord-text,
.lyric-sheet-container[class*="cp-theme-"] .chords span.chord span.chord-text,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .chords span.chord span.chord-text {
  /* theme repositions/recolors chord-text; clear base top/color so it can */
  color: inherit;
}

/* --- section markers: drop base display:block + pill bg/border/padding --- */
.lyric-sheet-container[class*="cp-theme-"] .section-marker,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .section-marker {
  background: transparent;
  border: 0;
  padding: 0;
}
.lyric-sheet-container[class*="cp-theme-"] .section-marker__name,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .section-marker__name,
.lyric-sheet-container[class*="cp-theme-"] .section-marker--focal .section-marker__name,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .section-marker--focal .section-marker__name,
.lyric-sheet-container[class*="cp-theme-"] .section-marker__repeat,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .section-marker__repeat {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  color: inherit;
}

/* --- ribbon chips: drop base per-section-type colors/backgrounds --- */
.lyric-sheet-container[class*="cp-theme-"] .lyric-ribbon-chip,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .lyric-ribbon-chip,
.lyric-sheet-container[class*="cp-theme-"] .lyric-ribbon-chip[data-section-type],
.lyric-sheet-container[class*="cp-theme-"].dark-mode .lyric-ribbon-chip[data-section-type] {
  background: transparent;
  border: 0;
  color: inherit;
}
/* base [data-section-type] !important bands also hit the marker rows */
.lyric-sheet-container[class*="cp-theme-"] .section-marker[data-section-type] {
  background: transparent;
  border-left: 0;
  padding: 0;
}

/* --- controls bar: drop the .dark-mode black band behind the tools --- */
.lyric-sheet-container[class*="cp-theme-"] .lyric-controls,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .lyric-controls {
  background-color: transparent;
}

/* --- meta-strip: clear base cream/rust styling so theme owns it --- */
.lyric-sheet-container[class*="cp-theme-"] .lyric-meta-strip,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .lyric-meta-strip {
  background: transparent;
  border: 0;
}

/* --- suppress base [data-section-type]::before glyphs (§ ¶ ◊ ▸ ✦ ♪) on
   ribbon chips and rail items inside themed charts; themes show clean labels --- */
.lyric-sheet-container[class*="cp-theme-"] .lyric-ribbon-chip::before,
.lyric-sheet-container[class*="cp-theme-"] .lyric-section-rail-item::before {
  content: none !important;
}
/* --- neutralize base per-type colors on the section rail items --- */
.lyric-sheet-container[class*="cp-theme-"] .lyric-section-rail-item,
.lyric-sheet-container[class*="cp-theme-"].dark-mode .lyric-section-rail-item {
  color: inherit;
  background: transparent;
}