/* NexusFM - Ana Stil Dosyası */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}

/* ==========================================
   SITE TOP BAR
   ========================================== */
.site-topbar {
    width: 100%;
    background: #0a0f1e;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    font-size: 0.85rem;
    color: #94a3b8;
    position: relative;
    z-index: 70;
}

.site-topbar-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 40px;
    gap: 1rem;
}

/* Sol bölüm sola yasla */
.topbar-contact {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    justify-content: flex-start;
}

/* Sağ bölüm sağa yasla */
.topbar-social {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    justify-content: flex-end;
}


.topbar-contact-item {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    color: #94a3b8;
    text-decoration: none;
    transition: color 0.2s;
    white-space: nowrap;
    font-size: 0.8rem;
}

.topbar-contact-item:hover { color: #c4b5fd; }

.topbar-icon {
    width: 13px;
    height: 13px;
    flex-shrink: 0;
    opacity: 0.7;
}

/* Orta: Menü Linkleri */
.topbar-nav {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex: 1;
    justify-content: center;
}

.topbar-nav-link {
    padding: 0.2rem 0.75rem;
    border-radius: 4px;
    color: #94a3b8;
    text-decoration: none;
    font-size: 0.8rem;
    font-weight: 500;
    transition: all 0.2s;
    white-space: nowrap;
    position: relative;
}

.topbar-nav-link::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%) scaleX(0);
    width: 60%;
    height: 1px;
    background: linear-gradient(to right, #FACC15, #06B6D4);
    transition: transform 0.25s ease;
}

.topbar-nav-link:hover {
    color: #e2e8f0;
}

.topbar-nav-link:hover::after {
    transform: translateX(-50%) scaleX(1);
}



.topbar-social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: rgba(255,255,255,0.06);
    color: #94a3b8;
    text-decoration: none;
    transition: all 0.2s;
}

.topbar-social-link:hover {
    background: rgba(250, 204, 21, 0.25);
    color: #c4b5fd;
    transform: translateY(-1px);
}

/* Topbar SVG boyut kilidi - genişlemeyi engeller */
.site-topbar svg,
.topbar-social-link svg,
.topbar-contact-item svg {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px;
    min-height: 16px;
    max-width: 16px;
    max-height: 16px;
    flex-shrink: 0;
    display: inline-block;
}

/* Responsive: Gizle küçük ekranlarda */
@media (max-width: 640px) {
    .topbar-contact { gap: 0.75rem; }
    .topbar-contact-item span { display: none; }
    .topbar-nav { display: none; }
    .site-topbar-inner { justify-content: space-between; }
}

@media (max-width: 480px) {
    .topbar-contact .topbar-contact-item:last-child { display: none; }
}


/* Glass Panels */
.glass-panel{background:rgba(255,255,255,0.7);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(0,0,0,0.05)}
.dark .glass-panel{background:rgba(15,23,42,0.8);border:1px solid rgba(255,255,255,0.08)}
.glass-card{background:rgba(255,255,255,0.9);border:1px solid rgba(0,0,0,0.05);backdrop-filter:blur(8px);border-radius:1rem;transition:all .3s ease}
.dark .glass-card{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1)}
.glass-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(0,0,0,0.15)}
.dark .glass-card:hover{box-shadow:0 20px 40px rgba(0,0,0,0.4)}

/* Gradient Text */
.gradient-text{background:linear-gradient(135deg,#FACC15,#06B6D4,#EC4899);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradientShift 4s ease infinite}
@keyframes gradientShift{0%,100%{background-position:0% center}50%{background-position:100% center}}

/* Neon & Glow */
.neon-shadow{box-shadow:0 0 20px rgba(250,204,21,0.4),0 0 60px rgba(250,204,21,0.15)}
.glow-cyan{box-shadow:0 0 20px rgba(6,182,212,0.4)}
.glow-pink{box-shadow:0 0 20px rgba(236,72,153,0.4)}

/* Navigation */
.nav-link{padding:.5rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:500;transition:all .2s;position:relative}
.nav-link:hover{background:rgba(250,204,21,0.1);color:#FACC15}
.nav-link::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%) scaleX(0);width:60%;height:2px;background:linear-gradient(to right,#FACC15,#06B6D4);border-radius:1px;transition:transform .3s ease}
.nav-link:hover::after{transform:translateX(-50%) scaleX(1)}

/* Line Clamp */
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* Pagination */
.pagination{display:flex;gap:.25rem;list-style:none;justify-content:center;flex-wrap:wrap}
.pagination li a{padding:.5rem .75rem;border-radius:.5rem;font-size:.875rem;background:#1e293b;color:#94a3b8;text-decoration:none;transition:all .2s}
.pagination li.active a,.pagination li a:hover{background:#FACC15;color:#fff;transform:scale(1.05)}

/* Player bar offset */
body{padding-bottom:5rem}

/* Animations */
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideInLeft{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}
@keyframes pulse-soft{0%,100%{opacity:1}50%{opacity:.6}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes spin-slow{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

@keyframes bounceSubtle {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

.animate-bounce-subtle { animation: bounceSubtle 2s ease-in-out infinite; }
.animate-fade-in-up{animation:fadeInUp .6s ease forwards}
.animate-fade-in{animation:fadeIn .5s ease forwards}
.animate-slide-left{animation:slideInLeft .5s ease forwards}
.animate-pulse-soft{animation:pulse-soft 2s ease-in-out infinite}
.animate-float{animation:float 3s ease-in-out infinite}
.animate-spin-slow{animation:spin-slow 10s linear infinite}

/* Staggered reveal */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}
.reveal-delay-3{transition-delay:.3s}
.reveal-delay-4{transition-delay:.4s}

/* Scrollbar */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#475569;border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:#64748b}
.dark ::-webkit-scrollbar-thumb{background:#334155}

/* Selection */
::selection{background:rgba(250,204,21,0.3);color:#fff}

/* Image hover zoom */
.img-zoom{overflow:hidden;border-radius:1rem}
.img-zoom img{transition:transform .5s ease}
.img-zoom:hover img{transform:scale(1.05)}

/* Card shine effect */
.shine-effect{position:relative;overflow:hidden}
.shine-effect::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.08),transparent);transition:left .5s}
.shine-effect:hover::before{left:100%}

/* Badge */
.badge{display:inline-flex;align-items:center;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600;letter-spacing:.025em}
.badge-live{background:rgba(239,68,68,0.15);color:#f87171;animation:pulse-soft 1.5s ease-in-out infinite}
.badge-new{background:rgba(250,204,21,0.15);color:#FACC15}

/* Hero particles (decorative) */
.hero-particle{position:absolute;width:4px;height:4px;border-radius:50%;background:rgba(250,204,21,0.4)}
.hero-particle:nth-child(1){top:20%;left:10%;animation:float 4s ease-in-out infinite}
.hero-particle:nth-child(2){top:60%;right:15%;animation:float 5s ease-in-out infinite .5s}
.hero-particle:nth-child(3){bottom:20%;left:30%;animation:float 6s ease-in-out infinite 1s}

/* Toast notifications */
.toast{position:fixed;top:24px;right:24px;padding:16px 24px;border-radius:12px;color:#fff;font-size:14px;font-weight:500;z-index:9999;transform:translateX(120%);transition:transform .4s cubic-bezier(.68,-.55,.27,1.55);box-shadow:0 10px 30px rgba(0,0,0,.3)}
.toast.show{transform:translateX(0)}
.toast-success{background:linear-gradient(135deg,#059669,#10b981)}
.toast-error{background:linear-gradient(135deg,#dc2626,#ef4444)}
.toast-info{background:linear-gradient(135deg,#FACC15,#06B6D4)}

/* Audio equalizer bars animation */
.eq-bar{display:inline-block;width:3px;margin:0 1px;background:linear-gradient(to top,#FACC15,#06B6D4);border-radius:2px;animation:eq-dance 1s ease-in-out infinite}
.eq-bar:nth-child(1){animation-delay:-.4s}
.eq-bar:nth-child(2){animation-delay:-.2s;height:16px}
.eq-bar:nth-child(3){animation-delay:-.1s}
.eq-bar:nth-child(4){animation-delay:-.3s;height:12px}
@keyframes eq-dance{0%,100%{height:8px}50%{height:20px}}

/* Rich Text Content (CKEditor Fix) */
.rich-content { line-height: 1.8; font-size: 1.05rem; }
.rich-content p { margin-bottom: 1.5rem; }
.rich-content h1, .rich-content h2, .rich-content h3, .rich-content h4 { font-weight: 800; margin-top: 2.5rem; margin-bottom: 1.25rem; line-height: 1.2; color: #1e293b; }
.dark .rich-content h1, .dark .rich-content h2, .dark .rich-content h3, .dark .rich-content h4 { color: #f8fafc; }
.rich-content h1 { font-size: 2.5rem; }
.rich-content h2 { font-size: 2rem; }
.rich-content h3 { font-size: 1.5rem; }
.rich-content ul { list-style-type: disc; margin-left: 1.5rem; margin-bottom: 1.5rem; }
.rich-content ol { list-style-type: decimal; margin-left: 1.5rem; margin-bottom: 1.5rem; }
.rich-content li { margin-bottom: 0.6rem; }
/* Rich Content End */

/* AESTHETIC PLAYER BAR */
.player-badge-aesthetic {
    @apply px-3 py-1 rounded-full text-[10px] font-bold uppercase tracking-wider;
    background: #fff0f0;
    color: #ff3b30;
    border: 1px solid rgba(255, 59, 48, 0.1);
}

.player-main-btn-circular {
    @apply w-14 h-14 rounded-full flex items-center justify-center transition-all bg-[#ff3b30] text-white relative z-10;
    box-shadow: 0 8px 25px rgba(255, 59, 48, 0.35);
}
.player-main-btn-circular:hover {
    @apply scale-110 shadow-[0_12px_30px_rgba(255,59,48,0.45)];
}

.volume-slider-red {
    @apply w-24 h-1 bg-slate-100 dark:bg-slate-800 rounded-full appearance-none cursor-pointer;
}
.volume-slider-red::-webkit-slider-thumb {
    @apply w-3.5 h-3.5 bg-[#ff3b30] rounded-full appearance-none transition-transform;
    box-shadow: 0 0 10px rgba(255, 59, 48, 0.3);
}
.volume-slider-red::-webkit-slider-thumb:hover {
    @apply scale-125;
}

.cover-art-wrapper {
    @apply w-14 h-14 rounded-full border-[3px] border-white dark:border-white/10 overflow-hidden shadow-lg relative;
}


.rich-content img { border-radius: 1.5rem; margin-top: 2rem; margin-bottom: 2rem; max-width: 100%; height: auto; box-shadow: 0 20px 50px rgba(0,0,0,0.1); }
.rich-content a { color: #FACC15; text-decoration: underline; font-weight: 600; }
.rich-content blockquote { border-left: 4px solid #FACC15; padding: 1.5rem 2rem; background: rgba(250,204,21,0.05); border-radius: 0 1rem 1rem 0; font-style: italic; margin: 2rem 0; position: relative; }
.rich-content table { width: 100%; border-collapse: collapse; margin-bottom: 1.5rem; }
.rich-content table td, .rich-content table th { border: 1px solid rgba(0,0,0,0.1); padding: 0.75rem; }
.dark .rich-content table td, .dark .rich-content table th { border-color: rgba(255,255,255,0.1); }

/* ==========================================
   ULTRA LUXURY PLAYER BAR STYLES
   ========================================== */
.volume-slider-premium {
    -webkit-appearance: none;
    appearance: none;
    background: rgba(255, 255, 255, 0.05);
    height: 4px;
    border-radius: 10px;
    outline: none;
    cursor: pointer;
    transition: all 0.3s;
}

.volume-slider-premium:hover {
    background: rgba(255, 255, 255, 0.1);
}

.volume-slider-premium::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 12px;
    height: 12px;
    background: #fff;
    border: 2px solid #FACC15;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(250, 204, 21, 0.5);
    transition: all 0.2s;
}

.volume-slider-premium::-webkit-slider-thumb:hover {
    transform: scale(1.3);
    box-shadow: 0 0 15px rgba(250, 204, 21, 0.8);
}

@keyframes playerGlow {
    0% { box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.3); }
    50% { box-shadow: 0 -15px 50px rgba(250, 204, 21, 0.1); }
    100% { box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.3); }
}

#playerBar {
    border-top: 1px solid rgba(255, 255, 255, 0.03);
    animation: playerGlow 6s infinite ease-in-out;
}

/* Metadata Spin Animation on Play */
.cover-art-spin {
    animation: spinRotate 15s linear infinite;
}

@keyframes spinRotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Luxury Ticker Bar */
.site-luxury-bar {
    z-index: 65;
}

/* Mobile responsive fixes */
@media (max-width: 768px) {
    #playerBar {
        padding: 0.75rem 1rem;
    }
}

/* ==========================================
   LUXURY TICKER BAR & ANIMATIONS
   ========================================== */
.site-luxury-bar {
    z-index: 65;
}

@keyframes ticker {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}

#ticker-container {
    display: inline-flex;
    animation: ticker 20s linear infinite;
    padding-left: 100%; /* Start from outside */
}

#ticker-container:hover {
    animation-play-state: paused;
}

/* Premium Button Glow */
.neon-shadow-violet {
    box-shadow: 0 0 20px rgba(250, 204, 21, 0.3), 0 0 40px rgba(250, 204, 21, 0.1);
}

/* Smooth Modal Backdrop */
#messageModal {
    transition: opacity 0.3s ease;
}