/* Basic styles */
.tdrr-rl-player{
    --tdrr-primary: #cc0000;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .6rem .8rem;
    border-radius: 12px;
    background: #0f172a;
    color: #fff;
    box-shadow: 0 8px 24px rgba(0,0,0,.2);
    max-width: 780px;
    margin: 10px auto;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}
.tdrr-rl-left{display:flex;align-items:center;gap:.75rem;min-width:0}
.tdrr-rl-right{display:flex;align-items:center;gap:.5rem}
.tdrr-rl-title-wrap{min-width:0}
.tdrr-rl-station{font-weight:700;line-height:1;}
.tdrr-rl-now{font-size:.9rem;color:#e2e8f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:50vw}
.tdrr-rl-btn{
    background: var(--tdrr-primary);
    color:#fff;border:0;border-radius:10px;padding:.5rem .65rem;cursor:pointer;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,.25);
}
.tdrr-rl-btn:hover{filter:brightness(1.05)}
.tdrr-rl-volume{width:150px}
.tdrr-rl-icon{font-size:16px;display:inline-block;vertical-align:middle}
.tdrr-rl-player .tdrr-rl-audio{display:none}

/* Floating mode */
.tdrr-rl-floating{
    position: fixed !important;
    right: 16px;
    bottom: 16px;
    margin: 0 !important;
    z-index: 99999;
    width: min(92vw, 360px);
    cursor: move;
}

/* Responsive */
@media (max-width: 540px){
    .tdrr-rl-now{max-width:40vw}
    .tdrr-rl-volume{width:100px}
}

.tdrr-rl-logo{width:32px;height:32px;object-fit:contain;border-radius:6px;background:#ffffff14;padding:4px}


/* ===== Neumorphism Theme (auto light/dark) ===== */
.tdrr-rl-player{
  --tdrr-card-bg: var(--tdrr-auto-bg, #e8edf6);
  --tdrr-shadow-light: rgba(255,255,255,.75);
  --tdrr-shadow-dark: rgba(0,0,0,.18);
  border-radius: 18px;
  background: var(--tdrr-card-bg);
  box-shadow:
    8px 8px 18px var(--tdrr-shadow-dark),
    -8px -8px 18px var(--tdrr-shadow-light);
  color: #0f172a;
}
.tdrr-theme-dark .tdrr-rl-player{
  --tdrr-card-bg: var(--tdrr-auto-bg, #0f172a);
  --tdrr-shadow-light: rgba(255,255,255,.08);
  --tdrr-shadow-dark: rgba(0,0,0,.7);
  color: #e2e8f0;
}
/* Header with station name on single line */
.tdrr-rl-title-wrap{display:flex;flex-direction:column}
.tdrr-rl-station{font-weight:800;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tdrr-rl-now{margin-top:.15rem;opacity:.85}
/* Controls in one row */
.tdrr-rl-left{gap:.6rem}
.tdrr-rl-right{gap:.5rem}
.tdrr-rl-btn{border-radius:12px}
/* Bigger logo */
.tdrr-rl-logo{width:44px;height:44px;border-radius:12px;background:#ffffff26;padding:6px}
.tdrr-theme-dark .tdrr-rl-logo{background:#ffffff14}
/* Slider style */
.tdrr-rl-volume{appearance:none;height:6px;border-radius:6px;background:#cbd5e1;outline:none}
.tdrr-theme-dark .tdrr-rl-volume{background:#263045}
.tdrr-rl-volume::-webkit-slider-thumb{appearance:none;width:16px;height:16px;border-radius:50%;background:var(--tdrr-primary);box-shadow:0 2px 4px rgba(0,0,0,.25)}
/* Compact mobile tweaks */
@media (max-width:540px){
  .tdrr-rl-now{display:none}
  .tdrr-rl-logo{width:38px;height:38px}
}

.tdrr-logo-sm .tdrr-rl-logo{width:32px;height:32px}
.tdrr-logo-md .tdrr-rl-logo{width:40px;height:40px}
.tdrr-logo-lg .tdrr-rl-logo{width:48px;height:48px}

/* Title size classes */
.tdrr-title-sm .tdrr-rl-station{font-size:1rem}
.tdrr-title-md .tdrr-rl-station{font-size:1.12rem}
.tdrr-title-lg .tdrr-rl-station{font-size:1.25rem}
.tdrr-title-xl .tdrr-rl-station{font-size:1.4rem}

/* Mobile variants (applied via JS on small screens) */
@media (max-width:600px){
  .tdrr-mtitle-xs .tdrr-rl-station{font-size:.9rem}
  .tdrr-mtitle-sm .tdrr-rl-station{font-size:1rem}
  .tdrr-mtitle-md .tdrr-rl-station{font-size:1.12rem}
  .tdrr-mtitle-lg .tdrr-rl-station{font-size:1.25rem}
}

/* Marquee style for station title */
.tdrr-rl-station.tdrr-marquee{
  position:relative; overflow:hidden; white-space:nowrap;
}
.tdrr-rl-station.tdrr-marquee > span{
  display:inline-block; padding-left:100%;
  animation: tdrr-station-marquee 12s linear infinite;
}
@keyframes tdrr-station-marquee{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-100%); }
}

/* Neon effect for station title */
.tdrr-neon-title .tdrr-rl-station{
  --tdrr-neon-color: #22d3ee;
  --tdrr-neon-blur1: 6px;
  --tdrr-neon-blur2: 14px;
  text-shadow:
    0 0 var(--tdrr-neon-blur1) var(--tdrr-neon-color),
    0 0 var(--tdrr-neon-blur2) var(--tdrr-neon-color);
}
.tdrr-neon-title.tdrr-neon-high .tdrr-rl-station{
  --tdrr-neon-blur1: 8px; --tdrr-neon-blur2: 20px;
}
.tdrr-neon-title.tdrr-neon-ultra .tdrr-rl-station{
  --tdrr-neon-blur1: 12px; --tdrr-neon-blur2: 28px;
}
/* Pulse */
@keyframes tdrrNeonPulse { 
  0%,100% { opacity: 1; } 
  50% { opacity: .85; } 
}
.tdrr-neon-title.tdrr-neon-pulse .tdrr-rl-station{ animation: tdrrNeonPulse 2.2s ease-in-out infinite; }