/* ─── Middle-Earth — Red Book of Westmarch ─── */
[data-theme='middle-earth'] {
  color-scheme: light;
  --color-star-active: #8c6800;
  --color-star-inactive: #b8985a;

  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%234a3728%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");

  /* ── Palette ── */
  /* Warm — Shire, Rohan, Dwarvish gold */
  --ctp-crust: #1a1008;
  --ctp-mantle: #281808;
  --ctp-base: #f0e0b0;
  --ctp-surface0: #e8d498;
  --ctp-surface1: #dcc482;
  --ctp-surface2: #ccb06e;
  --ctp-overlay0: #8a7250;
  --ctp-overlay1: #6a5438;
  --ctp-overlay2: #4a3828;
  --ctp-text: #1e1408;
  --ctp-subtext1: #3e2c1a;
  --ctp-subtext0: #5e4a30;
  /* Gold of the One Ring */
  --ctp-mauve: #d4a820;
  --ctp-lavender: #f0d060;
  --ctp-yellow: #f8e880;
  --ctp-peach: #b88010;
  /* Shire green, Rivendell silver, Elvish blue */
  --ctp-green: #4a7038;
  --ctp-teal: #3a6858;
  --ctp-sky: #7898b8;
  --ctp-blue: #486888;
  --ctp-sapphire: #2a4868;
  /* Mordor / danger */
  --ctp-red: #8a2820;
  --ctp-maroon: #5a1818;
  --ctp-flamingo: #b05838;
  --ctp-pink: #904868;
  --ctp-rosewater: #e8c8a8;

  /* ── Semantic tokens ── */
  --bg-app: #f0e0b0;
  --bg-sidebar: #241a0e;
  /* Bag End — old oak wood, hearthlit */
  --bg-card: #f4e8c0;
  --bg-hover: rgba(180, 130, 20, 0.12);
  --bg-player: #1a1008;
  /* Orodruin / the forge-dark */
  --bg-glass: rgba(244, 232, 192, 0.92);
  --accent: #d4a820;
  --accent-dim: rgba(212, 168, 32, 0.16);
  --accent-glow: rgba(212, 168, 32, 0.45);
  --volume-accent: #d4a820;
  --text-primary: #1e1408;
  --text-secondary: #3e2c1a;
  --text-muted: #5a4428;
  --border: rgba(122, 92, 24, 0.85);
  --border-subtle: rgba(180, 140, 50, 0.18);
  --positive: #4a7038;
  --warning: #805408;
  --danger: #8a2820;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
}

/* ── App shell: parchment map of Middle-Earth ── */
/* Three-layer: warm gold illumination top-right (candlelight),
   ember glow bottom-left (hearth), radial vignette darkening corners */
[data-theme='middle-earth'] .app-shell {
  background:
    radial-gradient(ellipse at center, transparent 50%, rgba(60, 38, 18, 0.12) 100%),
    radial-gradient(ellipse at 78% 18%, rgba(220, 180, 60, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 15% 88%, rgba(180, 110, 20, 0.07) 0%, transparent 45%),
    linear-gradient(155deg, #f4e8c0 0%, #eed8a0 50%, #e8d098 100%);
}

/* Parchment grain overlay — the texture of the Red Book's pages */
[data-theme='middle-earth'] .app-shell::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9999;
  opacity: 0.045;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 200px 200px;
}

/* ── Sidebar: Bag End oak paneling ── */
/* Old Shire craftsmanship — vertical wood grain, warm hearthlight from right edge */
[data-theme='middle-earth'] .sidebar {
  background-color: #221608;
  background-image: linear-gradient(180deg, #261a0a 0%, #1e1408 55%, #241c0e 100%);
  border-right: 2px solid rgba(200, 160, 40, 0.28);
  box-shadow:
    inset -3px 0 12px rgba(200, 140, 30, 0.10),
    2px 0 8px rgba(0, 0, 0, 0.50);
}

/* Sidebar text: warm candlelight on dark oak */
[data-theme='middle-earth'] .nav-link {
  color: #c8a060;
}

[data-theme='middle-earth'] .nav-link:hover {
  background: rgba(212, 168, 32, 0.12);
  color: #f0d880;
}

[data-theme='middle-earth'] .nav-link.active {
  background: linear-gradient(90deg, rgba(212, 168, 32, 0.22) 0%, transparent 100%);
  color: #f0d060;
  border-left: 2px solid #d4a820;
  box-shadow: inset 4px 0 18px rgba(212, 168, 32, 0.12);
}

[data-theme='middle-earth'] .nav-link.active::before {
  background: #d4a820;
  box-shadow: 0 0 10px rgba(212, 168, 32, 0.80), 0 0 20px rgba(212, 168, 32, 0.40);
}

[data-theme='middle-earth'] .nav-link.active svg {
  color: #d4a820;
}

[data-theme='middle-earth'] .nav-section-label {
  color: #b88a50;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.67em;
  font-family: Georgia, 'Book Antiqua', serif;
}

/* ── Player bar: Sammath Naur — the fires of Orodruin ── */
/* Near-black volcanic dark, sealed with the gold of the Ring */
[data-theme='middle-earth'] .player-bar {
  background: linear-gradient(180deg, #1c1208 0%, #100c04 100%);
  border-top: 2px solid rgba(212, 168, 32, 0.58);
  box-shadow:
    inset 0 1px 0 rgba(240, 200, 60, 0.22),
    0 -8px 40px rgba(180, 120, 20, 0.20),
    0 -20px 70px rgba(160, 100, 15, 0.09);
}

/* Track name: THE ONE RING INSCRIPTION — breathing gold fire */
[data-theme='middle-earth'] .player-track-name {
  color: #f0d060;
  font-family: Georgia, 'Book Antiqua', 'Palatino Linotype', Palatino, serif;
  letter-spacing: 0.06em;
  font-weight: 600;
  animation: ring-inscription-glow 5s ease-in-out infinite;
}

/* Artist: Elvish silver on the dark forge */
[data-theme='middle-earth'] .player-track-artist {
  color: #b8985a;
  font-family: Georgia, 'Book Antiqua', serif;
  letter-spacing: 0.03em;
  opacity: 1;
}

[data-theme='middle-earth'] .player-time {
  color: #a88048;
}

/* ── Transport buttons: Mithril-crafted, hearthlit ── */
[data-theme='middle-earth'] .player-btn,
[data-theme='middle-earth'] .player-btn-primary {
  background: linear-gradient(180deg, #2e2010 0%, #1e1408 100%);
  color: #d4a820;
  border: 1px solid rgba(212, 168, 32, 0.38);
  border-radius: 50%;
  box-shadow: inset 0 1px 0 rgba(240, 200, 60, 0.10), 0 2px 6px rgba(0, 0, 0, 0.60);
}

[data-theme='middle-earth'] .player-btn:hover,
[data-theme='middle-earth'] .player-btn-primary:hover {
  background: rgba(212, 168, 32, 0.14);
  border-color: #d4a820;
  color: #f0d060;
  box-shadow:
    0 0 16px rgba(212, 168, 32, 0.48),
    inset 0 0 8px rgba(200, 140, 20, 0.10);
}

/* ── Regular buttons: parchment scroll / carved Shire wood ── */
[data-theme='middle-earth'] .btn,
[data-theme='middle-earth'] .btn-surface,
[data-theme='middle-earth'] .btn-ghost {
  background: linear-gradient(180deg, #f8f0d0 0%, #e8d898 50%, #dece88 100%);
  color: #2a1c0e;
  border: 1px solid rgba(160, 120, 40, 0.48);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.65),
    inset 1px 0 0 rgba(255, 255, 255, 0.45),
    0 1px 3px rgba(80, 50, 10, 0.22);
  border-radius: 6px;
  font-family: Georgia, 'Book Antiqua', serif;
}

[data-theme='middle-earth'] .btn:hover,
[data-theme='middle-earth'] .btn-surface:hover,
[data-theme='middle-earth'] .btn-ghost:hover {
  background: linear-gradient(180deg, #fffff0 0%, #f0e8a8 50%, #e8d890 100%);
  border-color: rgba(180, 140, 40, 0.70);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.80),
    0 1px 4px rgba(80, 50, 10, 0.20),
    0 0 8px rgba(212, 168, 32, 0.18);
}

/* ── Primary button: One Ring gold — the most precious craftsmanship ── */
[data-theme='middle-earth'] .btn-primary {
  background: linear-gradient(180deg, #e8bc28 0%, #c8940c 50%, #aa7808 100%);
  color: #1a1008;
  border: 1px solid #c89818;
  box-shadow:
    inset 0 1px 0 rgba(255, 240, 100, 0.45),
    0 0 16px rgba(212, 168, 32, 0.42),
    0 2px 4px rgba(80, 50, 0, 0.30);
  border-radius: 6px;
  font-weight: 700;
  font-family: Georgia, 'Book Antiqua', serif;
}

[data-theme='middle-earth'] .btn-primary:hover {
  background: linear-gradient(180deg, #f8cc38 0%, #d8a018 50%, #bc8810 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 240, 100, 0.55),
    0 0 24px rgba(212, 168, 32, 0.60),
    0 2px 6px rgba(80, 50, 0, 0.28);
}

/* ── Hero / album-card play buttons: solid One Ring gold ── */
/* These appear on dark album-art overlays — must be fully opaque and prominent */
[data-theme='middle-earth'] .hero-play-btn,
[data-theme='middle-earth'] .album-card-details-btn {
  background: linear-gradient(180deg, #e8bc28 0%, #c8940c 50%, #aa7808 100%);
  color: #1a1008;
  border: 1px solid #c89818;
  font-family: Georgia, 'Book Antiqua', serif;
  font-weight: 700;
  box-shadow:
    inset 0 1px 0 rgba(255, 240, 100, 0.45),
    0 0 14px rgba(212, 168, 32, 0.38),
    0 2px 6px rgba(0, 0, 0, 0.40);
}

[data-theme='middle-earth'] .hero-play-btn:hover,
[data-theme='middle-earth'] .album-card-details-btn:hover {
  background: linear-gradient(180deg, #f8cc38 0%, #d8a018 50%, #bc8810 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 240, 100, 0.55),
    0 0 22px rgba(212, 168, 32, 0.58),
    0 2px 8px rgba(0, 0, 0, 0.35);
  filter: none;
}

/* ── Queue round buttons ── */
[data-theme='middle-earth'] .queue-round-btn {
  background: linear-gradient(180deg, #f0e4b0 0%, #dece88 100%);
  color: #4a3828;
  border: 1px solid rgba(150, 112, 38, 0.40);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 1px 2px rgba(80, 50, 10, 0.18);
}

[data-theme='middle-earth'] .queue-round-btn:hover:not(:disabled):not(.active) {
  background: linear-gradient(180deg, #fffff0 0%, #f0e4a0 100%);
  border-color: rgba(180, 140, 40, 0.60);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.70), 0 0 8px rgba(212, 168, 32, 0.22);
  color: #2a1c0e;
}

[data-theme='middle-earth'] .queue-round-btn.active {
  background: linear-gradient(180deg, #e8bc28 0%, #c8940c 100%);
  color: #1a1008;
  border-color: #c89818;
  box-shadow: 0 0 14px rgba(212, 168, 32, 0.45), inset 0 1px 0 rgba(255, 240, 100, 0.35);
}

/* ── Cards: leaves of the Red Book — layered parchment ── */
[data-theme='middle-earth'] .card {
  background: linear-gradient(180deg, #f8f0d0 0%, #f0e4b8 100%);
  border: 1px solid rgba(168, 130, 48, 0.32);
  border-radius: 10px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.70),
    0 2px 8px rgba(80, 50, 10, 0.16),
    0 4px 16px rgba(60, 38, 10, 0.08);
}

/* ── Content header: illuminated manuscript chapter heading ── */
/* The gold ruled border at the bottom is the decorative line
   that separates the chapter title from the body of the text  */
[data-theme='middle-earth'] .content-header {
  position: relative;
  background: linear-gradient(180deg, #f8f0d0 0%, #f0e4b8 100%);
  border-bottom: 2px solid rgba(200, 158, 38, 0.45);
  box-shadow: 0 3px 14px rgba(120, 80, 15, 0.12);
}

/* The gold rule — fades at edges like gold leaf on vellum */
[data-theme='middle-earth'] .content-header::after {
  content: '';
  position: absolute;
  bottom: -3px;
  left: 8%;
  right: 8%;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(212, 168, 32, 0.65) 20%,
      rgba(240, 210, 60, 0.85) 50%, rgba(212, 168, 32, 0.65) 80%, transparent 100%);
  pointer-events: none;
}

/* Connection indicators — sidebar is dark, need light text */
[data-theme='middle-earth'] .connection-type,
[data-theme='middle-earth'] .connection-server {
  color: #b88a50;
}

/* ── Theme accordion: old book binding ── */
[data-theme='middle-earth'] .theme-accordion-header:hover {
  background: rgba(212, 168, 32, 0.12);
  color: #6a4820;
}

[data-theme='middle-earth'] .theme-accordion-open .theme-accordion-header {
  background: rgba(212, 168, 32, 0.16);
  color: #5a3818;
}

[data-theme='middle-earth'] .theme-accordion-open .theme-accordion-chevron {
  color: #c89818;
}

/* ── Progress bar: THE ROAD GOES EVER ON ── */
/* From darkness into gold light — the long journey from the Shire to Mount Doom */
[data-theme='middle-earth'] .progress-bar-track {
  background: #d8c880;
  border: 1px solid rgba(160, 120, 38, 0.40);
  border-radius: 4px;
  box-shadow: inset 0 1px 3px rgba(80, 50, 10, 0.20);
}

[data-theme='middle-earth'] .progress-bar-fill {
  background: linear-gradient(90deg,
      #5a3802 0%,
      #9a6808 25%,
      #c89018 55%,
      #d4a820 75%,
      #f0d060 90%,
      #fff0a0 100%);
  border-radius: 4px;
  box-shadow: 0 0 10px rgba(212, 168, 32, 0.65), 0 0 3px rgba(255, 230, 100, 0.55);
}

/* ── Scrollbar: aged oak library shelves ── */
[data-theme='middle-earth'] ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

[data-theme='middle-earth'] ::-webkit-scrollbar-track {
  background: #dcc880;
  border-radius: 4px;
}

[data-theme='middle-earth'] ::-webkit-scrollbar-thumb {
  background: linear-gradient(to right, #6e4a28 0%, #9a7040 40%, #6a4420 100%);
  border: 1px solid rgba(180, 130, 40, 0.45);
  border-radius: 4px;
  box-shadow: inset 0 1px 0 rgba(255, 220, 100, 0.25);
}

[data-theme='middle-earth'] ::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(to right, #8a6038 0%, #b88a50 40%, #8a5a30 100%);
  box-shadow: inset 0 1px 0 rgba(255, 220, 100, 0.35), 0 0 5px rgba(212, 168, 32, 0.28);
}

/* ── Glass / dropdowns: a scroll held to the light ── */
[data-theme='middle-earth'] .glass {
  background: rgba(248, 238, 198, 0.96) !important;
  backdrop-filter: none !important;
  border: 1px solid rgba(180, 140, 48, 0.45) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.70),
    0 4px 20px rgba(80, 50, 10, 0.20),
    0 8px 30px rgba(60, 38, 10, 0.10) !important;
  border-radius: 10px !important;
}

[data-theme='middle-earth'] .glass [style*="var(--bg-hover)"] {
  background: rgba(212, 168, 32, 0.12) !important;
  border-radius: 6px !important;
}

[data-theme='middle-earth'] .glass [style*="var(--text-primary)"] {
  color: #1e1408 !important;
}

[data-theme='middle-earth'] .glass [style*="var(--text-secondary)"] {
  color: #3e2c1a !important;
}

[data-theme='middle-earth'] .glass [style*="var(--text-muted)"] {
  color: #5e4828 !important;
}

/* ── Hover / selection: candlelight — warm gold glow ── */
[data-theme='middle-earth'] .settings-tab:hover {
  background: rgba(212, 168, 32, 0.12);
  color: #2a1c0e;
}

[data-theme='middle-earth'] .settings-tab.active {
  background: rgba(212, 168, 32, 0.18);
  color: #2a1c0e;
  box-shadow: inset 2px 0 0 #d4a820;
}

[data-theme='middle-earth'] .custom-select-trigger:hover {
  background: rgba(212, 168, 32, 0.10);
}

[data-theme='middle-earth'] .custom-select-option:hover {
  background: rgba(212, 168, 32, 0.15) !important;
  color: #1e1408 !important;
}

[data-theme='middle-earth'] .artist-ext-link:hover {
  background: rgba(212, 168, 32, 0.12);
  color: #2a1c0e !important;
  border-color: rgba(180, 140, 40, 0.55) !important;
}

[data-theme='middle-earth'] .np-action-btn:hover {
  background: rgba(212, 168, 32, 0.10);
}

[data-theme='middle-earth'] .np-queue-item:hover,
[data-theme='middle-earth'] .np-queue-item.context-active {
  background: rgba(212, 168, 32, 0.13);
  box-shadow: inset 2px 0 0 #d4a820;
}

[data-theme='middle-earth'] .track-row:hover,
[data-theme='middle-earth'] .track-row.context-active {
  background: rgba(212, 168, 32, 0.10) !important;
  box-shadow: inset 2px 0 0 #d4a820;
}

[data-theme='middle-earth'] .artist-row:hover {
  background: rgba(212, 168, 32, 0.10);
  box-shadow: inset 2px 0 0 #d4a820;
}

[data-theme='middle-earth'] .playlist-row:hover {
  background: rgba(212, 168, 32, 0.10);
  box-shadow: inset 2px 0 0 #d4a820;
}

[data-theme='middle-earth'] .queue-item:hover,
[data-theme='middle-earth'] .queue-item.context-active {
  background: rgba(212, 168, 32, 0.12) !important;
  box-shadow: inset 2px 0 0 #d4a820;
}

/* ── Active queue / now-playing: the bearer of the Ring ── */
[data-theme='middle-earth'] .queue-item.active {
  background: rgba(212, 168, 32, 0.14);
  box-shadow: inset 2px 0 0 #d4a820;
}

[data-theme='middle-earth'] .queue-item.active .queue-item-title {
  color: #f8e060;
}

[data-theme='middle-earth'] .queue-item.active .queue-item-artist,
[data-theme='middle-earth'] .queue-item.active .queue-item-duration {
  color: #c8a060;
}

[data-theme='middle-earth'] .np-queue-item-active {
  color: #2a1c0e;
  text-shadow: 0 0 6px rgba(212, 168, 32, 0.40);
}

[data-theme='middle-earth'] .np-queue-item.active {
  background: rgba(212, 168, 32, 0.10);
}

[data-theme='middle-earth'] .np-album-track.active .np-album-track-title,
[data-theme='middle-earth'] .np-album-track.active .np-album-track-num {
  color: #2a1c0e;
  text-shadow: 0 0 6px rgba(212, 168, 32, 0.38);
}

/* ── Queue tech bar: dark text on light parchment ── */
[data-theme='middle-earth'] .queue-current-tech {
  color: #3e2808;
}

/* ── Queue + Lyrics on dark sidebar ── */
[data-theme='middle-earth'] .queue-current-info h3 {
  color: #f0d880;
}

[data-theme='middle-earth'] .queue-current-sub {
  color: #d4a820;
}

[data-theme='middle-earth'] .queue-item-title {
  color: #f0d880;
}

[data-theme='middle-earth'] .queue-item-artist {
  color: #c8a060;
}

[data-theme='middle-earth'] .queue-item-duration {
  color: #b08858;
}

[data-theme='middle-earth'] .queue-tab-btn {
  color: #c8a060;
  font-family: Georgia, serif;
}

[data-theme='middle-earth'] .queue-tab-btn:hover {
  color: #f0d880;
  background: rgba(212, 168, 32, 0.10);
}

[data-theme='middle-earth'] .queue-tab-btn.active {
  color: #d4a820;
}

[data-theme='middle-earth'] .lyrics-line {
  color: #b08858;
}

[data-theme='middle-earth'] .lyrics-line.active {
  color: #f0d880;
  text-shadow: 0 0 6px rgba(212, 168, 32, 0.35);
}

[data-theme='middle-earth'] .lyrics-plain-line {
  color: #c8a060;
}

[data-theme='middle-earth'] .lyrics-status {
  color: #a88048;
}

/* Queue: "Nächste Titel" divider label */
[data-theme='middle-earth'] .queue-divider span {
  color: #b8905a !important;
}

/* Queue: artist text visible on hover for inactive items */
[data-theme='middle-earth'] .queue-item:hover .queue-item-artist,
[data-theme='middle-earth'] .queue-item.context-active .queue-item-artist {
  color: #e8c878;
}

/* AlbumDetail header: artist name readable */
[data-theme='middle-earth'] .album-detail-artist,
[data-theme='middle-earth'] .album-detail-artist-link {
  color: #e8c878;
}

[data-theme='middle-earth'] .album-detail-artist-link:hover {
  color: #f8e060;
}

/* ArtistDetail About: heading, bio text + "Mehr lesen" readable */
[data-theme='middle-earth'] .np-card-title {
  color: #6b4e2a;
}

[data-theme='middle-earth'] .np-bio-text {
  color: #5a3e20;
}

[data-theme='middle-earth'] .np-bio-toggle {
  color: #7a5228;
}

