/* ==========================================================================
   SMILECHAT CORE COSMIC THEME STYLE 🪐 - VERSI BRANDING SUPER GLOW
   ========================================================================== */

:root {
    --cosmic-cyan: #00f0ff;
    --cosmic-pink: #ff00ea;
    --bg-dark: #11111b;
    --panel-dark: #181825;
    --border-cosmic: rgba(0, 240, 255, 0.3);
    
    /* Variable Glow Khusus */
    --brand-glow: 0 0 20px #00f0ff, 0 0 40px rgba(0, 240, 255, 0.6);
    --btn-glow: 0 0 12px rgba(0, 240, 255, 0.3);
}

/* Override Khusus Saat Tema Terang Aktif */
.light-theme {
    --brand-glow: 0 0 20px #f59e0b, 0 0 35px rgba(245, 158, 11, 0.5);
    --btn-glow: 0 0 12px rgba(245, 158, 11, 0.2);
}

/* Base Body Hack */
body {
    background-color: var(--bg-dark);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    margin: 0;
    padding: 0;
}

/* Master Class Glowing Identity */
.brand-super-glow {
    font-size: 1.5rem !important; /* Gedein ukuran bray! */
    font-weight: 900 !important;
    letter-spacing: 2px;
    background: linear-gradient(135deg, #00f0ff 0%, #00a8ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(var(--brand-glow));
}
.light-theme .brand-super-glow {
    background: linear-gradient(135deg, #df8e1d 0%, #fe8019 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.logo-glow {
    filter: drop-shadow(var(--brand-glow));
}

.btn-all-glow {
    box-shadow: var(--btn-glow);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-all-glow:hover {
    box-shadow: var(--brand-glow);
}

/* Efek Tulisan Berkedip Taktis (Blink Text) */
.blink-text {
    animation: cosmicBlink 1.5s infinite ease-in-out;
}
@keyframes cosmicBlink {
    0%, 100% { opacity: 0.4; text-shadow: 0 0 5px var(--cosmic-cyan); }
    50% { opacity: 1; text-shadow: 0 0 15px var(--cosmic-cyan); }
}

/* Transisi Fade In Item Pas Load Sesi Chat */
.fade-in-item {
    animation: fadeIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    opacity: 0;
}
@keyframes fadeIn { to { opacity: 1; } }

/* Custom Scrollbar Universal */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--bg-dark); }
::-webkit-scrollbar-thumb { background: #45475a; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--cosmic-cyan); }