/* ===== CHORD STYLE TOKENS =====
   A cor dos acordes e a fonte da cifra saem daqui. Cada pessoa escolhe a sua
   (ver ChordStyle e o seletor em shared/_chord_style), e a escolha chega como
   data-chord-color / data-chord-font no body. Os tons do tema claro e do
   escuro são calibrados separadamente para o acorde saltar do texto. */
:root {
  --chord-color: #3730a3;
  --chord-section-color: #1f2937;
  --chord-section-bg: rgba(55, 48, 163, 0.14);
  --chords-font-family: 'Courier New', Courier, monospace;
  --chords-letter-spacing: 0;
}

[data-bs-theme="dark"] {
  --chord-color: #aab4ff;
  --chord-section-color: #f8f9fa;
  --chord-section-bg: rgba(170, 180, 255, 0.2);
}

/* ===== CHORD FONT (shared between editor and display) ===== */
.chords-font,
.chords-display,
.lyrics-display {
  font-family: var(--chords-font-family);
  font-size: 0.9rem;
  line-height: 1.6;
  letter-spacing: var(--chords-letter-spacing);
  white-space: pre-wrap;
}

/* ===== CHORD HIGHLIGHTING ===== */
.chord {
  font-weight: 800;
  color: var(--chord-color);
}

/* Section markers: [Intro], [Refrão], [Estrofe 1], etc. Viram etiqueta para
   não se confundirem com os acordes. */
.chord-section {
  font-weight: 800;
  color: var(--chord-section-color);
  background: var(--chord-section-bg);
  border-radius: 0.3rem;
  padding: 0.05em 0.4em;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Manual formatting: bold and color highlights */
.chord-bold {
  font-weight: 700;
}
.chord-hl-yellow {
  background-color: rgba(234, 179, 8, 0.35);
  border-radius: 3px;
}
.chord-hl-green {
  background-color: rgba(22, 163, 74, 0.35);
  border-radius: 3px;
}
.chord-hl-red {
  background-color: rgba(220, 38, 38, 0.35);
  border-radius: 3px;
}
.chord-hl-blue {
  background-color: rgba(102, 126, 234, 0.35);
  border-radius: 3px;
}

[data-bs-theme="dark"] .chord-hl-yellow { background-color: rgba(234, 179, 8, 0.3); }
[data-bs-theme="dark"] .chord-hl-green { background-color: rgba(22, 163, 74, 0.3); }
[data-bs-theme="dark"] .chord-hl-red { background-color: rgba(220, 38, 38, 0.3); }
[data-bs-theme="dark"] .chord-hl-blue { background-color: rgba(102, 126, 234, 0.3); }

/* ===== PALETAS ===== */
[data-chord-color="indigo"] {
  --chord-color: #3730a3;
  --chord-section-bg: rgba(55, 48, 163, 0.14);
}
[data-bs-theme="dark"] [data-chord-color="indigo"] {
  --chord-color: #aab4ff;
  --chord-section-bg: rgba(170, 180, 255, 0.2);
}

[data-chord-color="blue"] {
  --chord-color: #0b5ed7;
  --chord-section-bg: rgba(11, 94, 215, 0.14);
}
[data-bs-theme="dark"] [data-chord-color="blue"] {
  --chord-color: #7cc3ff;
  --chord-section-bg: rgba(124, 195, 255, 0.2);
}

[data-chord-color="teal"] {
  --chord-color: #0f766e;
  --chord-section-bg: rgba(15, 118, 110, 0.16);
}
[data-bs-theme="dark"] [data-chord-color="teal"] {
  --chord-color: #5eead4;
  --chord-section-bg: rgba(94, 234, 212, 0.2);
}

[data-chord-color="green"] {
  --chord-color: #15803d;
  --chord-section-bg: rgba(21, 128, 61, 0.16);
}
[data-bs-theme="dark"] [data-chord-color="green"] {
  --chord-color: #6ee7a0;
  --chord-section-bg: rgba(110, 231, 160, 0.2);
}

[data-chord-color="red"] {
  --chord-color: #b02a37;
  --chord-section-bg: rgba(176, 42, 55, 0.14);
}
[data-bs-theme="dark"] [data-chord-color="red"] {
  --chord-color: #ff9aa4;
  --chord-section-bg: rgba(255, 154, 164, 0.2);
}

[data-chord-color="amber"] {
  --chord-color: #a35a06;
  --chord-section-bg: rgba(163, 90, 6, 0.16);
}
[data-bs-theme="dark"] [data-chord-color="amber"] {
  --chord-color: #ffc247;
  --chord-section-bg: rgba(255, 194, 71, 0.2);
}

[data-chord-color="purple"] {
  --chord-color: #6b21a8;
  --chord-section-bg: rgba(107, 33, 168, 0.14);
}
[data-bs-theme="dark"] [data-chord-color="purple"] {
  --chord-color: #dcaaff;
  --chord-section-bg: rgba(220, 170, 255, 0.2);
}

[data-chord-color="contrast"] {
  --chord-color: #000000;
  --chord-section-bg: rgba(0, 0, 0, 0.12);
}
[data-bs-theme="dark"] [data-chord-color="contrast"] {
  --chord-color: #ffffff;
  --chord-section-bg: rgba(255, 255, 255, 0.22);
}

/* ===== FONTES ===== */
[data-chord-font="mono"] {
  --chords-font-family: 'Courier New', Courier, monospace;
}
[data-chord-font="mono-modern"] {
  --chords-font-family: ui-monospace, 'SF Mono', 'JetBrains Mono', Menlo, Consolas, 'Liberation Mono', monospace;
}
[data-chord-font="mono-wide"] {
  --chords-font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --chords-letter-spacing: 0.04em;
}
[data-chord-font="sans"] {
  --chords-font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
}