/* ==========================================================================
   Svetlana Tratch Music Studio — Dynamic Theme Stylesheet
   Actief thema: Nocturne Navy & Warm Champagne (navy)
   Automatisch gegenereerd door het Controlepaneel.
   ========================================================================== */

:root {
  /* Primary Base */
  --primary: #1E3A5F;
  --primary-dark: #12243B;
  --primary-light: #2B5384;
  --primary-container: #1E3A5F;
  --primary-rgb: 30, 58, 95;
  --on-primary: #FFFFFF;

  /* Secondary Base (Gold/Brass Accent) */
  --secondary: #8A6D3B;
  --secondary-dark: #664E24;
  --secondary-light: #F4E7CB;
  --secondary-container: #F4E7CB;
  --secondary-rgb: 138, 109, 59;
  --on-secondary: #281800;
}

/* Tailwind Utility Overrides */
.text-primary { color: var(--primary) !important; }
.text-primary-dark { color: var(--primary-dark) !important; }
.bg-primary { background-color: var(--primary) !important; }
.bg-primary-dark { background-color: var(--primary-dark) !important; }
.border-primary { border-color: var(--primary) !important; }

.text-secondary { color: var(--secondary) !important; }
.text-secondary-dark { color: var(--secondary-dark) !important; }
.bg-secondary { background-color: var(--secondary) !important; }
.bg-secondary-dark { background-color: var(--secondary-dark) !important; }
.bg-secondary-container { background-color: var(--secondary-container) !important; }
.text-on-secondary-container { color: var(--secondary-dark) !important; }
.border-secondary { border-color: var(--secondary) !important; }

/* Alpha / Opacity variants */
.bg-primary\/10 { background-color: rgba(var(--primary-rgb), 0.1) !important; }
.bg-primary\/15 { background-color: rgba(var(--primary-rgb), 0.15) !important; }
.bg-primary\/20 { background-color: rgba(var(--primary-rgb), 0.2) !important; }
.bg-secondary\/10 { background-color: rgba(var(--secondary-rgb), 0.1) !important; }
.bg-secondary\/20 { background-color: rgba(var(--secondary-rgb), 0.2) !important; }
.border-primary\/20 { border-color: rgba(var(--primary-rgb), 0.2) !important; }
.border-primary\/30 { border-color: rgba(var(--primary-rgb), 0.3) !important; }

/* Interactive Hover & Focus */
.hover\:bg-primary:hover { background-color: var(--primary) !important; }
.hover\:bg-primary-dark:hover { background-color: var(--primary-dark) !important; }
.hover\:text-primary:hover { color: var(--primary) !important; }
.hover\:border-primary:hover { border-color: var(--primary) !important; }
.focus\:border-primary:focus { border-color: var(--primary) !important; }
.focus\:ring-primary:focus { --tw-ring-color: var(--primary) !important; }

/* Buttons & Components */
.btn-primary {
  background-color: var(--primary) !important;
  color: #FFFFFF !important;
}
.btn-primary:hover {
  background-color: var(--primary-dark) !important;
}

/* Announcement Bar */
.announcement-bar {
  background: linear-gradient(90deg, var(--primary) 0%, var(--primary-dark) 50%, var(--primary) 100%) !important;
  color: #FFFFFF !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
}
.announcement-bar a.announcement-btn {
  background-color: var(--secondary-light) !important;
  color: var(--primary-dark) !important;
}
.announcement-bar a.announcement-btn:hover {
  background-color: #FFFFFF !important;
}

/* Editorial Cards & Badges */
.editorial-card:hover {
  border-color: var(--primary) !important;
}
.nav-link:hover {
  color: var(--primary) !important;
}
.nav-link.active {
  color: var(--primary) !important;
  border-bottom-color: var(--secondary) !important;
}