/* ==========================================================================
   EGXHUB - "MIDNIGHT AURORA" identity
   --------------------------------------------------------------------------
   data-theme="aurora" + data-theme-mode="dark" | "light"

   Deliberately unlike the "onyx" base theme in every dimension:

                onyx (base)              aurora (this one)
   shape        small radii, flat       large soft radii, glass panels
   surface      matte opaque            translucent + backdrop blur
   accent       warm gold / bronze      electric violet + cyan
   typography   tight, utilitarian      airy, generous spacing
   texture      none                    aurora bloom + fine grid
   navbar       opaque hairline         gradient glow

   Violet on dark is the signature; light mode is a pale periwinkle
   "dawn" that keeps the same accent family so the brand holds together.
   ========================================================================== */

/* The responsive layer clamps the card radius with !important; it reads this
   variable instead, so the signature rounded shape survives on every screen. */
[data-theme="aurora"] {
    --card-radius: 26px;
    /* Cool near-black, not warm: the accent is violet, so the surface must
       stay neutral-cool or the gold-family warmth would fight it. */
    --bg-base: #0a0817;
    --bg-surface: #120e24;
    --bg-card: #1a1435;
    --bg-card-hover: #241b4a;
    --bg-input: #0c0a1e;
    --bg-glass: rgba(26, 20, 53, 0.68);

    --border-color: #2f2559;
    --border-highlight: #463a7e;
    --border-glow: rgba(139, 92, 246, 0.35);

    --text-primary: #ece9ff;
    --text-secondary: #aaa2d5;
    --text-muted: #7b73aa;
    --text-highlight: #ffffff;

    --bullish-green: #2dd4a7;
    --bullish-bg: rgba(45, 212, 167, 0.13);
    --bullish-border: rgba(45, 212, 167, 0.32);
    --bullish-glow: 0 0 16px rgba(45, 212, 167, 0.24);

    --bearish-red: #fb6f92;
    --bearish-bg: rgba(251, 111, 146, 0.13);
    --bearish-border: rgba(251, 111, 146, 0.32);
    --bearish-glow: 0 0 16px rgba(251, 111, 146, 0.24);

    /* Gold is repurposed as a warm secondary highlight inside a violet world */
    --gold-accent: #ffb86b;
    --gold-bg: rgba(255, 184, 107, 0.12);
    --gold-border: rgba(255, 184, 107, 0.32);
    --gold-glow: 0 0 16px rgba(255, 184, 107, 0.22);

    --cyan-accent: #5ad1f5;
    --cyan-bg: rgba(90, 209, 245, 0.12);
    --cyan-border: rgba(90, 209, 245, 0.32);

    --purple-accent: #8b5cf6;

    /* Generous rounding is the clearest structural break from the base theme */
    --radius-sm: 10px;
    --radius-md: 18px;
    --radius-lg: 28px;
    --radius-pill: 9999px;

    /* Soft, wide shadows instead of the base theme's tight ones */
    --shadow-sm: 0 2px 12px rgba(3, 0, 20, 0.5);
    --shadow-md: 0 10px 30px rgba(3, 0, 20, 0.6);
    --shadow-lg: 0 22px 56px rgba(3, 0, 20, 0.72);
    --shadow-glow: 0 0 40px rgba(139, 92, 246, 0.18);
}

[data-theme="aurora"][data-theme-mode="dark"] body {
    background-color: var(--bg-base);
    background-image:
        radial-gradient(ellipse 65% 42% at 10% -6%, rgba(139, 92, 246, 0.26), transparent 62%),
        radial-gradient(ellipse 60% 40% at 92% 2%, rgba(56, 189, 248, 0.18), transparent 60%),
        radial-gradient(ellipse 85% 48% at 50% 106%, rgba(168, 85, 247, 0.14), transparent 66%),
        linear-gradient(rgba(255, 255, 255, 0.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.022) 1px, transparent 1px);
    background-size: 100% 100%, 100% 100%, 100% 100%, 44px 44px, 44px 44px;
    background-attachment: fixed;
}

/* ---------- Ticker ---------- */
[data-theme="aurora"][data-theme-mode="dark"] .ticker-bar-wrapper {
    background: linear-gradient(180deg, rgba(26, 20, 53, 0.9), rgba(18, 14, 36, 0.9));
    border-bottom: 1px solid var(--border-color);
    box-shadow: 0 2px 26px rgba(139, 92, 246, 0.2);
}

[data-theme="aurora"][data-theme-mode="dark"] .ticker-pulse-label {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.2), rgba(56, 189, 248, 0.14));
    color: var(--purple-accent);
    border-left: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
}

[data-theme="aurora"][data-theme-mode="dark"] .ticker-item {
    background: rgba(139, 92, 246, 0.09);
    border: 1px solid rgba(139, 92, 246, 0.2);
    border-radius: var(--radius-pill);
}

/* ---------- Navbar: gradient glow instead of a hairline ---------- */
[data-theme="aurora"][data-theme-mode="dark"] .main-navbar {
    background: linear-gradient(90deg,
            rgba(139, 92, 246, 0.14) 0%,
            rgba(18, 14, 36, 0.92) 42%,
            rgba(56, 189, 248, 0.12) 100%);
    border-bottom: 1px solid var(--border-color);
    box-shadow: 0 4px 30px rgba(139, 92, 246, 0.16);
    backdrop-filter: blur(18px) saturate(150%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
}

[data-theme="aurora"][data-theme-mode="dark"] .brand-logo-glow {
    background: linear-gradient(135deg, #8b5cf6, #38bdf8);
    box-shadow: 0 0 26px rgba(139, 92, 246, 0.55);
    border-radius: var(--radius-sm);
}

[data-theme="aurora"][data-theme-mode="dark"] .brand-title {
    color: var(--text-highlight);
    letter-spacing: 0.5px;
}

[data-theme="aurora"][data-theme-mode="dark"] .nav-item-link {
    border-radius: var(--radius-pill);
}

[data-theme="aurora"][data-theme-mode="dark"] .nav-item-link:hover,
[data-theme="aurora"][data-theme-mode="dark"] .nav-item-link.active {
    background: rgba(139, 92, 246, 0.14);
}

[data-theme="aurora"][data-theme-mode="dark"] .nav-item-link.active {
    color: var(--purple-accent);
    /* Pill underline rather than the base theme's straight border */
    border-bottom: none;
    box-shadow: inset 0 -2px 0 var(--purple-accent);
}

[data-theme="aurora"][data-theme-mode="dark"] .nav-dropdown-menu,
[data-theme="aurora"][data-theme-mode="dark"] .notif-dropdown-menu,
[data-theme="aurora"][data-theme-mode="dark"] .user-menu-dropdown {
    background: rgba(20, 16, 42, 0.97);
    border-color: var(--border-highlight);
    border-radius: var(--radius-md);
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    box-shadow: 0 22px 56px rgba(3, 0, 20, 0.75), 0 0 0 1px rgba(139, 92, 246, 0.14);
}

[data-theme="aurora"][data-theme-mode="dark"] .user-nav-avatar {
    border-color: var(--purple-accent);
    box-shadow: 0 0 12px rgba(139, 92, 246, 0.35);
}

/* ---------- Cards: translucent glass ---------- */
[data-theme="aurora"][data-theme-mode="dark"] .terminal-card,
[data-theme="aurora"][data-theme-mode="dark"] .post-creation-card {
    background: var(--bg-glass);
    backdrop-filter: blur(16px) saturate(150%);
    -webkit-backdrop-filter: blur(16px) saturate(150%);
    border-color: var(--border-color);
    border-radius: var(--card-radius);
}

[data-theme="aurora"][data-theme-mode="dark"] .terminal-card:hover,
[data-theme="aurora"][data-theme-mode="dark"] .post-creation-card:hover {
    border-color: var(--purple-accent);
    box-shadow: var(--shadow-md), 0 0 30px rgba(139, 92, 246, 0.14);
    transform: translateY(-2px);
}

/* Violet bloom along the top edge */
[data-theme="aurora"][data-theme-mode="dark"] .terminal-card::before,
[data-theme="aurora"][data-theme-mode="dark"] .post-creation-card::before {
    background: linear-gradient(90deg,
            transparent, rgba(139, 92, 246, 0.7), rgba(56, 189, 248, 0.5), transparent);
}

/* ---------- Buttons ---------- */
[data-theme="aurora"][data-theme-mode="dark"] .btn-primary-glow {
    background: linear-gradient(135deg, #8b5cf6, #38bdf8);
    border-radius: var(--radius-pill);
    box-shadow: 0 6px 22px rgba(139, 92, 246, 0.38);
}

[data-theme="aurora"][data-theme-mode="dark"] .btn-primary-glow:hover {
    box-shadow: 0 10px 30px rgba(139, 92, 246, 0.52);
    transform: translateY(-2px);
}

[data-theme="aurora"][data-theme-mode="dark"] .btn-outline {
    border-radius: var(--radius-pill);
}

[data-theme="aurora"][data-theme-mode="dark"] .theme-toggle-btn {
    border-radius: var(--radius-pill);
}

[data-theme="aurora"][data-theme-mode="dark"] .mobile-bottom-dock {
    background: rgba(20, 16, 42, 0.94);
    border-top: 1px solid rgba(139, 92, 246, 0.26);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

/* ==========================================================================
   2. LIGHT - pale periwinkle dawn
   ========================================================================== */
[data-theme="aurora"][data-theme-mode="light"] {
    --bg-base: #eceafb;
    --bg-surface: #ffffff;
    --bg-card: #ffffff;
    --bg-card-hover: #f6f4ff;
    --bg-input: #e4e0f7;
    --bg-glass: rgba(255, 255, 255, 0.82);

    --border-color: #d9d4f3;
    --border-highlight: #bdb4e8;
    --border-glow: rgba(124, 58, 237, 0.3);

    --text-primary: #1b1836;
    --text-secondary: #4d4877;
    --text-muted: #8a84b5;
    --text-highlight: #0b0920;

    --bullish-green: #04795b;
    --bullish-bg: rgba(4, 121, 91, 0.09);
    --bullish-border: rgba(4, 121, 91, 0.3);

    --bearish-red: #be123c;
    --bearish-bg: rgba(190, 18, 60, 0.08);
    --bearish-border: rgba(190, 18, 60, 0.3);

    --gold-accent: #b45309;
    --gold-bg: rgba(180, 83, 9, 0.09);
    --gold-border: rgba(180, 83, 9, 0.3);

    --cyan-accent: #5b21b6;
    --cyan-bg: rgba(91, 33, 182, 0.08);
    --cyan-border: rgba(91, 33, 182, 0.26);

    --purple-accent: #6d28d9;

    --radius-sm: 10px;
    --radius-md: 18px;
    --radius-lg: 28px;

    --shadow-sm: 0 2px 10px rgba(53, 40, 120, 0.08);
    --shadow-md: 0 10px 28px rgba(53, 40, 120, 0.12);
    --shadow-lg: 0 22px 52px rgba(53, 40, 120, 0.16);
    --shadow-glow: 0 0 34px rgba(124, 58, 237, 0.12);
}

[data-theme="aurora"][data-theme-mode="light"] body {
    background-color: var(--bg-base);
    background-image:
        radial-gradient(ellipse 60% 40% at 8% -6%, rgba(139, 92, 246, 0.16), transparent 62%),
        radial-gradient(ellipse 55% 38% at 94% 0%, rgba(56, 189, 248, 0.14), transparent 60%),
        radial-gradient(ellipse 80% 42% at 50% 104%, rgba(168, 85, 247, 0.1), transparent 66%);
    background-attachment: fixed;
}

[data-theme="aurora"][data-theme-mode="light"] .ticker-bar-wrapper {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(246, 244, 255, 0.94));
    border-bottom: 1px solid var(--border-color);
    box-shadow: 0 2px 18px rgba(53, 40, 120, 0.07);
}

[data-theme="aurora"][data-theme-mode="light"] .ticker-pulse-label {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.12), rgba(56, 189, 248, 0.1));
    color: var(--purple-accent);
    border-left: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
}

[data-theme="aurora"][data-theme-mode="light"] .ticker-item {
    background: rgba(139, 92, 246, 0.07);
    border: 1px solid rgba(139, 92, 246, 0.16);
    border-radius: var(--radius-pill);
}

[data-theme="aurora"][data-theme-mode="light"] .main-navbar {
    background: linear-gradient(90deg,
            rgba(139, 92, 246, 0.1) 0%,
            rgba(255, 255, 255, 0.94) 42%,
            rgba(56, 189, 248, 0.1) 100%);
    border-bottom: 1px solid var(--border-color);
    box-shadow: 0 3px 22px rgba(53, 40, 120, 0.08);
    backdrop-filter: blur(16px) saturate(150%);
    -webkit-backdrop-filter: blur(16px) saturate(150%);
}

[data-theme="aurora"][data-theme-mode="light"] .brand-logo-glow {
    background: linear-gradient(135deg, #7c3aed, #0ea5e9);
    box-shadow: 0 0 22px rgba(124, 58, 237, 0.32);
    border-radius: var(--radius-sm);
}

[data-theme="aurora"][data-theme-mode="light"] .brand-title {
    color: var(--text-highlight);
    letter-spacing: 0.5px;
}

[data-theme="aurora"][data-theme-mode="light"] .nav-item-link {
    border-radius: var(--radius-pill);
}

[data-theme="aurora"][data-theme-mode="light"] .nav-item-link:hover,
[data-theme="aurora"][data-theme-mode="light"] .nav-item-link.active {
    background: rgba(139, 92, 246, 0.11);
}

[data-theme="aurora"][data-theme-mode="light"] .nav-item-link.active {
    color: var(--purple-accent);
    border-bottom: none;
    box-shadow: inset 0 -2px 0 var(--purple-accent);
}

[data-theme="aurora"][data-theme-mode="light"] .nav-dropdown-menu,
[data-theme="aurora"][data-theme-mode="light"] .notif-dropdown-menu,
[data-theme="aurora"][data-theme-mode="light"] .user-menu-dropdown {
    background: rgba(255, 255, 255, 0.98);
    border-color: var(--border-highlight);
    border-radius: var(--radius-md);
    backdrop-filter: blur(18px) saturate(150%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    box-shadow: 0 22px 50px rgba(53, 40, 120, 0.16), 0 0 0 1px rgba(139, 92, 246, 0.1);
}

[data-theme="aurora"][data-theme-mode="light"] .user-nav-avatar {
    border-color: var(--purple-accent);
    box-shadow: 0 0 10px rgba(139, 92, 246, 0.25);
}

[data-theme="aurora"][data-theme-mode="light"] .terminal-card,
[data-theme="aurora"][data-theme-mode="light"] .post-creation-card {
    background: var(--bg-card);
    border-color: var(--border-color);
    border-radius: var(--card-radius);
}

[data-theme="aurora"][data-theme-mode="light"] .terminal-card:hover,
[data-theme="aurora"][data-theme-mode="light"] .post-creation-card:hover {
    border-color: var(--purple-accent);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

[data-theme="aurora"][data-theme-mode="light"] .terminal-card::before,
[data-theme="aurora"][data-theme-mode="light"] .post-creation-card::before {
    background: linear-gradient(90deg,
            transparent, rgba(124, 58, 237, 0.55), rgba(14, 165, 233, 0.45), transparent);
}

[data-theme="aurora"][data-theme-mode="light"] .btn-primary-glow {
    background: linear-gradient(135deg, #7c3aed, #0284c7);
    border-radius: var(--radius-pill);
    box-shadow: 0 6px 20px rgba(124, 58, 237, 0.28);
}

[data-theme="aurora"][data-theme-mode="light"] .btn-primary-glow:hover {
    box-shadow: 0 10px 28px rgba(124, 58, 237, 0.4);
    transform: translateY(-2px);
}

[data-theme="aurora"][data-theme-mode="light"] .btn-outline,
[data-theme="aurora"][data-theme-mode="light"] .theme-toggle-btn {
    border-radius: var(--radius-pill);
}

[data-theme="aurora"][data-theme-mode="light"] .mobile-bottom-dock {
    background: rgba(255, 255, 255, 0.94);
    border-top: 1px solid rgba(139, 92, 246, 0.2);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

/* ==========================================================================
   3. AURORA-ONLY ACCENT
   A slow drifting glow, present in this theme and absent from the base one.
   ========================================================================== */
[data-theme="aurora"] body::before {
    content: "";
    position: fixed;
    top: -30vh;
    right: -20vw;
    width: 70vw;
    height: 70vh;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(139, 92, 246, 0.18), transparent 68%);
    pointer-events: none;
    z-index: 0;
    animation: auroraDrift 22s ease-in-out infinite alternate;
}

[data-theme="aurora"][data-theme-mode="light"] body::before {
    background: radial-gradient(circle, rgba(139, 92, 246, 0.12), transparent 68%);
}

@@keyframes auroraDrift {
    from { transform: translate(0, 0) scale(1); }
    to { transform: translate(-12vw, 10vh) scale(1.18); }
}

/* Reduced-motion: keep the colour, drop the movement. */
@media (prefers-reduced-motion: reduce) {
    [data-theme="aurora"] body::before {
        animation: none;
    }
}