/* src/styles.css */
:root {
  --bg: #0a0a0f;
  --surface: #15151d;
  --surface-2: #1c1c27;
  --surface-hover: #242433;
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.16);
  --text: rgba(255, 255, 255, 0.94);
  --text-secondary: rgba(255, 255, 255, 0.62);
  --text-tertiary: rgba(255, 255, 255, 0.4);
  --accent-from: #6366f1;
  --accent-to: #ec4899;
  --accent: #818cf8;
  --accent-strong: #6366f1;
  --accent-gradient:
    linear-gradient(
      135deg,
      var(--accent-from),
      var(--accent-to));
  --accent-soft: rgba(99, 102, 241, 0.18);
  --glow-rgb-1:
    99,
    102,
    241;
  --glow-rgb-2:
    236,
    72,
    153;
  --glow-pos-1: 12% 0%;
  --glow-pos-2: 100% 18%;
  --btn-hover-bg: #4f46e5;
  --btn-active-bg: #4338ca;
  --switch-bg-url: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23818cf8'/%3e%3c/svg%3e");
  --danger: #f87171;
  --success: #4ade80;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 20px 48px rgba(0, 0, 0, 0.55);
  --shadow-glow: 0 8px 20px rgba(99, 102, 241, 0.35);
  --bg-glass: rgba(10, 10, 15, 0.82);
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --font-display:
    "Manrope",
    "Inter",
    sans-serif;
  font-family:
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    sans-serif;
  color-scheme: dark;
}
[data-theme=midnight-synth] {
  --bg: #0a0a0f;
  --surface: #15151d;
  --surface-2: #1c1c27;
  --surface-hover: #242433;
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.16);
  --text: rgba(255, 255, 255, 0.94);
  --text-secondary: rgba(255, 255, 255, 0.62);
  --text-tertiary: rgba(255, 255, 255, 0.4);
  --accent-from: #6366f1;
  --accent-to: #ec4899;
  --accent: #818cf8;
  --accent-strong: #6366f1;
  --accent-soft: rgba(99, 102, 241, 0.18);
  --glow-rgb-1:
    99,
    102,
    241;
  --glow-rgb-2:
    236,
    72,
    153;
  --glow-pos-1: 12% 0%;
  --glow-pos-2: 100% 18%;
  --btn-hover-bg: #4f46e5;
  --btn-active-bg: #4338ca;
  --switch-bg-url: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23818cf8'/%3e%3c/svg%3e");
  --danger: #f87171;
  --success: #4ade80;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 20px 48px rgba(0, 0, 0, 0.55);
  --shadow-glow: 0 8px 20px rgba(99, 102, 241, 0.35);
  --bg-glass: rgba(10, 10, 15, 0.82);
}
[data-theme=disco-inferno] {
  --bg: #0f0808;
  --surface: #1f1210;
  --surface-2: #2a1815;
  --surface-hover: #3a201c;
  --border: rgba(255, 120, 80, 0.12);
  --border-strong: rgba(255, 120, 80, 0.22);
  --text: rgba(255, 235, 220, 0.94);
  --text-secondary: rgba(255, 200, 170, 0.62);
  --text-tertiary: rgba(255, 180, 150, 0.4);
  --accent-from: #f97316;
  --accent-to: #ef4444;
  --accent: #fb923c;
  --accent-strong: #ea580c;
  --accent-soft: rgba(249, 115, 22, 0.18);
  --glow-rgb-1:
    249,
    115,
    22;
  --glow-rgb-2:
    239,
    68,
    68;
  --glow-pos-1: 0% 0%;
  --glow-pos-2: 100% 100%;
  --btn-hover-bg: #d97706;
  --btn-active-bg: #b45309;
  --switch-bg-url: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fb923c'/%3e%3c/svg%3e");
  --danger: #f87171;
  --success: #4ade80;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 20px 48px rgba(0, 0, 0, 0.55);
  --shadow-glow: 0 8px 20px rgba(249, 115, 22, 0.35);
  --bg-glass: rgba(15, 8, 8, 0.82);
}
[data-theme=minty-fresh] {
  --bg: #080f0c;
  --surface: #0f1a14;
  --surface-2: #16261d;
  --surface-hover: #1e3328;
  --border: rgba(80, 200, 150, 0.12);
  --border-strong: rgba(80, 200, 150, 0.22);
  --text: rgba(220, 255, 240, 0.94);
  --text-secondary: rgba(170, 230, 200, 0.62);
  --text-tertiary: rgba(140, 210, 180, 0.4);
  --accent-from: #10b981;
  --accent-to: #06b6d4;
  --accent: #34d399;
  --accent-strong: #059669;
  --accent-soft: rgba(16, 185, 129, 0.18);
  --glow-rgb-1:
    16,
    185,
    129;
  --glow-rgb-2:
    6,
    182,
    212;
  --glow-pos-1: 50% 0%;
  --glow-pos-2: 0% 100%;
  --btn-hover-bg: #047857;
  --btn-active-bg: #065f46;
  --switch-bg-url: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2334d399'/%3e%3c/svg%3e");
  --danger: #f87171;
  --success: #4ade80;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 20px 48px rgba(0, 0, 0, 0.55);
  --shadow-glow: 0 8px 20px rgba(16, 185, 129, 0.35);
  --bg-glass: rgba(8, 15, 12, 0.82);
}
[data-theme=clean-slate] {
  --bg: #111827;
  --surface: #1f2937;
  --surface-2: #374151;
  --surface-hover: #4b5563;
  --border: rgba(255, 255, 255, 0.09);
  --border-strong: rgba(255, 255, 255, 0.16);
  --text: rgba(255, 255, 255, 0.92);
  --text-secondary: rgba(255, 255, 255, 0.58);
  --text-tertiary: rgba(255, 255, 255, 0.36);
  --accent-from: #3b82f6;
  --accent-to: #3b82f6;
  --accent: #60a5fa;
  --accent-strong: #3b82f6;
  --accent-soft: rgba(59, 130, 246, 0.14);
  --glow-rgb-1:
    17,
    24,
    39;
  --glow-rgb-2:
    17,
    24,
    39;
  --glow-pos-1: 0% 0%;
  --glow-pos-2: 100% 100%;
  --btn-hover-bg: #2563eb;
  --btn-active-bg: #1d4ed8;
  --switch-bg-url: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2360a5fa'/%3e%3c/svg%3e");
  --danger: #f87171;
  --success: #4ade80;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.18);
  --shadow-md: 0 2px 6px rgba(0, 0, 0, 0.2);
  --shadow-lg: 0 4px 14px rgba(0, 0, 0, 0.24);
  --shadow-glow: 0 2px 8px rgba(59, 130, 246, 0.18);
  --bg-glass: rgba(17, 24, 39, 0.9);
}
[data-theme=clean-slate] body {
  background: var(--bg);
}
[data-theme=desert-wind] {
  --bg: #130c08;
  --surface: #1e1108;
  --surface-2: #2c1a0c;
  --surface-hover: #3d2510;
  --border: rgba(200, 120, 60, 0.10);
  --border-strong: rgba(200, 120, 60, 0.20);
  --text: rgba(255, 240, 220, 0.94);
  --text-secondary: rgba(220, 190, 160, 0.62);
  --text-tertiary: rgba(200, 170, 140, 0.4);
  --accent-from: #0d9488;
  --accent-to: #0d9488;
  --accent: #2dd4bf;
  --accent-strong: #0d9488;
  --accent-soft: rgba(13, 148, 136, 0.16);
  --glow-rgb-1:
    19,
    12,
    8;
  --glow-rgb-2:
    19,
    12,
    8;
  --glow-pos-1: 0% 0%;
  --glow-pos-2: 100% 100%;
  --btn-hover-bg: #0f766e;
  --btn-active-bg: #115e59;
  --switch-bg-url: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%232dd4bf'/%3e%3c/svg%3e");
  --danger: #f87171;
  --success: #4ade80;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.22);
  --shadow-md: 0 2px 6px rgba(0, 0, 0, 0.24);
  --shadow-lg: 0 4px 14px rgba(0, 0, 0, 0.28);
  --shadow-glow: 0 2px 8px rgba(13, 148, 136, 0.2);
  --bg-glass: rgba(19, 12, 8, 0.9);
}
[data-theme=desert-wind] body {
  background: var(--bg);
}
[data-bs-theme=dark] {
  --bs-body-bg: var(--surface);
  --bs-body-color: var(--text);
  --bs-border-color: var(--border-strong);
  --bs-border-color-translucent: var(--border);
  --bs-secondary-bg: var(--surface-2);
  --bs-tertiary-bg: var(--surface-2);
  --bs-secondary-color: var(--text-secondary);
  --bs-tertiary-color: var(--text-tertiary);
  --bs-emphasis-color: var(--text);
  --bs-link-color: var(--accent);
  --bs-link-color-rgb: var(--glow-rgb-1);
  --bs-link-hover-color: var(--accent-to);
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  background-color: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}
body {
  padding-top: 4rem;
  padding-bottom: 5.5rem;
  min-height: 100vh;
  background:
    radial-gradient(
      circle at var(--glow-pos-1),
      rgba(var(--glow-rgb-1), 0.16),
      transparent 42%),
    radial-gradient(
      circle at var(--glow-pos-2),
      rgba(var(--glow-rgb-2), 0.12),
      transparent 45%),
    var(--bg);
}
body.track-playing {
  padding-bottom: 8rem;
}
@media (max-width: 576px) {
  body {
    padding-top: 3.5rem;
  }
  body.track-playing {
    padding-bottom: 9rem;
  }
}
a {
  color: var(--accent);
}
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: var(--radius-pill);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--surface-hover);
}
.btn {
  border-radius: var(--radius-pill);
}
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--accent-strong);
  --bs-btn-border-color: var(--accent-strong);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--btn-hover-bg);
  --bs-btn-hover-border-color: var(--btn-hover-bg);
  --bs-btn-active-bg: var(--btn-active-bg);
  --bs-btn-active-border-color: var(--btn-active-bg);
  --bs-btn-disabled-bg: var(--accent-strong);
  --bs-btn-disabled-border-color: var(--accent-strong);
  --bs-btn-focus-shadow-rgb: var(--glow-rgb-1);
}
.form-check-input:checked {
  background-color: var(--accent-strong);
  border-color: var(--accent-strong);
}
.form-check-input:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 0.25rem var(--accent-soft);
}
.form-switch .form-check-input:focus {
  --bs-form-switch-bg: var(--switch-bg-url);
}
.btn-close {
  filter: invert(1) grayscale(100%) brightness(1.8);
}
[data-bs-theme=dark] {
  --bs-border-radius: 0.65rem;
  --bs-border-radius-sm: 0.45rem;
  --bs-border-radius-lg: 1rem;
  --bs-border-radius-xl: 1.25rem;
}
body.podcast-playing {
  padding-bottom: 8rem;
}
@media (max-width: 576px) {
  body.podcast-playing {
    padding-bottom: 9rem;
  }
}
.detail-image {
  width: 180px;
  height: 180px;
}
@media (max-width: 768px) {
  .detail-image {
    width: 120px;
    height: 120px;
  }
}
@media (max-width: 480px) {
  .detail-image {
    width: 100px;
    height: 100px;
  }
}
.list-group-item {
  border-color: var(--border);
  transition: background-color 0.16s ease;
}
.list-group-item:not(.bg-primary):hover {
  background-color: var(--surface-hover);
}
.list-group-item.bg-primary {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
}
.badge.bg-secondary {
  background-color: var(--surface-2) !important;
  color: var(--text-secondary);
}
.progress {
  background-color: var(--surface-2);
  border-radius: 999px;
  overflow: hidden;
  height: 0.4rem;
}
.progress-bar.bg-danger {
  background-color: #b3795f !important;
}
.offcanvas {
  box-shadow: var(--shadow-lg);
}
.offcanvas-header {
  border-bottom: 1px solid var(--border);
}
.offcanvas-body {
  padding: 0.5rem 1rem;
}
.btn-outline-primary {
  color: var(--accent);
  border-color: var(--accent);
}
.btn-outline-primary:hover,
.btn-outline-primary.active {
  background-color: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.text-muted {
  color: var(--text-secondary) !important;
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */