/* ============================================================
   SPACE UNIVERSE THEME — data-app-theme="space"
   Deep cosmos: dark purples, nebula cyan glow, cosmic gradients
   ============================================================ */

[data-app-theme="space"] {
    /* Brand Design Tokens */
    --Primary: #7C3AED;           /* Cosmic violet */
    --Primary_rgba: 124, 58, 237;
    --Primary_Dark: #4C1D95;
    --Primary_Dark_rgba: 76, 29, 149;
    --Secondary: #06B6D4;         /* Nebula cyan */
    --Secondary_rgba: 6, 182, 212;
    --Tertiary: #A78BFA;          /* Starlight lilac */
    --Tertiary_rgba: 167, 139, 250;
    --Quaternary: #F59E0B;        /* Star gold */
    --Quaternary_rgba: 245, 158, 11;

    /* Theme Specific Tokens */
    --theme-glow: 0 0 25px rgba(124, 58, 237, 0.45);
    --theme-cyan-glow: 0 0 25px rgba(6, 182, 212, 0.4);
    --theme-border: 1px solid rgba(124, 58, 237, 0.35);
    --theme-glass-bg: rgba(18, 12, 44, 0.78);
    --theme-card-bg: rgba(22, 14, 56, 0.85);
    --theme-text-primary: #f1f0fb;
    --theme-text-secondary: #c4b5fd;
}

/* Light / Base Mode for Space Universe (Cosmic twilight) */
[data-app-theme="space"] body,
[data-app-theme="space"] main,
[data-app-theme="space"] .page {
    background:
        radial-gradient(ellipse at 15% 25%, rgba(124, 58, 237, 0.22) 0%, transparent 50%),
        radial-gradient(ellipse at 85% 75%, rgba(6, 182, 212, 0.18) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(167, 139, 250, 0.08) 0%, transparent 60%),
        linear-gradient(160deg, #0e0926 0%, #1e1346 50%, #150d38 100%) !important;
    background-attachment: fixed !important;
    color: var(--theme-text-primary) !important;
}

/* Dark Mode + Space Universe (Deep Void Cosmos) */
[data-app-theme="space"][data-theme="dark"] body,
[data-app-theme="space"][data-theme="dark"] main,
[data-app-theme="space"][data-theme="dark"] .page {
    background:
        radial-gradient(ellipse at 15% 25%, rgba(124, 58, 237, 0.28) 0%, transparent 55%),
        radial-gradient(ellipse at 85% 75%, rgba(6, 182, 212, 0.20) 0%, transparent 55%),
        radial-gradient(circle at 50% 40%, rgba(147, 51, 234, 0.12) 0%, transparent 50%),
        linear-gradient(165deg, #05030f 0%, #0d0622 45%, #080318 100%) !important;
    background-attachment: fixed !important;
    color: var(--theme-text-primary) !important;
}

/* Top Navigation Bar */
[data-app-theme="space"] .top-row {
    background: rgba(12, 7, 32, 0.92) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.3) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

/* Sidebar Drawer */
[data-app-theme="space"] .sidebar {
    background: linear-gradient(180deg, #0e072b 0%, #170b3b 50%, #0a041f 100%) !important;
    border-left: 1px solid rgba(124, 58, 237, 0.3) !important;
    box-shadow: -4px 0 25px rgba(0, 0, 0, 0.5) !important;
}

/* Logo handling for Space Theme (always dark header) */
[data-app-theme="space"] .nav-logo,
[data-app-theme="space"] .responsive-logo {
    content: url('/assets/images/NurzWhite.png') !important;
}

/* Cards & Surface Containers */
[data-app-theme="space"] .mud-card:not(.course-details),
[data-app-theme="space"] .rounded-card:not(.course-details),
[data-app-theme="space"] .rounded-card-100:not(.course-details) {
    background: var(--theme-card-bg) !important;
    border: var(--theme-border) !important;
    box-shadow: 0 8px 32px rgba(12, 6, 35, 0.6), 0 0 15px rgba(124, 58, 237, 0.15) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    color: var(--theme-text-primary) !important;
}

/* Primary Action Buttons */
[data-app-theme="space"] .mud-button-filled-primary,
[data-app-theme="space"] .button-primary,
[data-app-theme="space"] .bg-primary-100 {
    background: linear-gradient(135deg, #7C3AED 0%, #06B6D4 100%) !important;
    border: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.45) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

[data-app-theme="space"] .mud-button-filled-primary:hover,
[data-app-theme="space"] .button-primary:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 6px 25px rgba(6, 182, 212, 0.55), 0 0 20px rgba(124, 58, 237, 0.4) !important;
}

/* Active Tabs & Typography Accents */
[data-app-theme="space"] .mud-tab.mud-tab-active,
[data-app-theme="space"] .mud-primary-text {
    color: #06B6D4 !important;
    text-shadow: 0 0 10px rgba(6, 182, 212, 0.4);
}

[data-app-theme="space"] .mud-tab-slider {
    background: linear-gradient(90deg, #7C3AED, #06B6D4) !important;
    height: 3px !important;
    box-shadow: 0 0 10px #06B6D4 !important;
}

/* Course Details / Content Cards — Preserving Background Images */
[data-app-theme="space"] .rounded-card.course-details {
    background-color: rgba(22, 14, 56, 0.82) !important;
    border: 1px solid rgba(124, 58, 237, 0.35) !important;
    color: var(--theme-text-primary) !important;
    background-repeat: no-repeat !important;
    background-position: right top !important;
    background-size: auto 75% !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

[data-app-theme="space"] .rounded-card.course-details:hover {
    background-color: rgba(45, 23, 100, 0.90) !important;
    border-color: rgba(6, 182, 212, 0.65) !important;
    box-shadow: 0 10px 30px rgba(124, 58, 237, 0.35), 0 0 20px rgba(6, 182, 212, 0.3) !important;
    transform: translateY(-3px);
}

[data-app-theme="space"] .rounded-card.course-details.sessions {
    background-image: url('/assets/images/course-details-sessions.png') !important;
}
[data-app-theme="space"] .rounded-card.course-details.assignments {
    background-image: url('/assets/images/course-details-assignments.png') !important;
}
[data-app-theme="space"] .rounded-card.course-details.exams {
    background-image: url('/assets/images/course-details-exams.png') !important;
}
[data-app-theme="space"] .rounded-card.course-details.quizzes {
    background-image: url('/assets/images/course-details-quizes.png') !important;
}
[data-app-theme="space"] .rounded-card.course-details.live-sessions {
    background-image: url('/assets/images/course-details-live-sessions.png') !important;
}
[data-app-theme="space"] .rounded-card.course-details.announcements {
    background-image: url('/assets/images/announcements.png') !important;
}
[data-app-theme="space"] .rounded-card.course-details.mark-scheme {
    background-image: url('/assets/images/course-details-mark-scheme.jpg') !important;
    background-size: contain !important;
    background-position: right center !important;
}
[data-app-theme="space"] .rounded-card.course-details.notes {
    background-image: url('/assets/images/course-details-Notes.png') !important;
    background-size: contain !important;
    background-position: right center !important;
}
[data-app-theme="space"] .rounded-card.course-details.store {
    background-image: url('/assets/images/trophy.png') !important;
}

[data-app-theme="space"] .rounded-card.course-details h4,
[data-app-theme="space"] .rounded-card.course-details h5,
[data-app-theme="space"] .rounded-card.course-details h6,
[data-app-theme="space"] .rounded-card.course-details .mud-typography {
    color: #ffffff !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6) !important;
}

/* Course Header Info Pills (Level, Board, Group) */
[data-app-theme="space"] .course-info-pill {
    background: rgba(124, 58, 237, 0.22) !important;
    border: 1px solid rgba(124, 58, 237, 0.45) !important;
    backdrop-filter: blur(8px) !important;
}
[data-app-theme="space"] .course-info-pill-text {
    color: #06B6D4 !important;
    font-weight: 700 !important;
    text-shadow: 0 0 8px rgba(6, 182, 212, 0.4) !important;
}
[data-app-theme="space"] .course-info-pill .mud-icon-root {
    color: #A78BFA !important;
}

/* Sidebar & Scoring Board Contrast */
[data-app-theme="space"] .sidebar h4,
[data-app-theme="space"] .sidebar h5,
[data-app-theme="space"] .sidebar .mud-typography {
    color: #f1f0fb !important;
}
[data-app-theme="space"] .scoring-list-name {
    color: #f1f0fb !important;
    font-weight: 600 !important;
}
[data-app-theme="space"] .scoring-list-order {
    color: #c4b5fd !important;
}
[data-app-theme="space"] .scoring-list-item {
    border-bottom: 1px solid rgba(124, 58, 237, 0.22) !important;
}

/* Score Podiums */
[data-app-theme="space"] .rounded-card.score-podium-1 {
    color: #F59E0B !important;
    background: rgba(124, 58, 237, 0.25) !important;
    border: 1px solid rgba(245, 158, 11, 0.5) !important;
    box-shadow: 0 0 20px rgba(245, 158, 11, 0.25) !important;
}
[data-app-theme="space"] .rounded-card.score-podium-2 {
    color: #c4b5fd !important;
    background: rgba(148, 163, 184, 0.15) !important;
    border: 1px solid rgba(167, 139, 250, 0.35) !important;
}
[data-app-theme="space"] .rounded-card.score-podium-3 {
    color: #fdba74 !important;
    background: rgba(245, 158, 11, 0.12) !important;
    border: 1px solid rgba(245, 158, 11, 0.3) !important;
}

/* Background Opacity Utility Classes */
[data-app-theme="space"] .bg-primary-10 { background: rgba(124, 58, 237, 0.12) !important; }
[data-app-theme="space"] .bg-primary-25 { background: rgba(124, 58, 237, 0.25) !important; }
[data-app-theme="space"] .bg-primary-50 { background: rgba(124, 58, 237, 0.50) !important; }

/* Text Color Classes */
[data-app-theme="space"] .text-gray-900,
[data-app-theme="space"] .text-gray-800,
[data-app-theme="space"] .text-gray-700 {
    color: var(--theme-text-primary) !important;
}

[data-app-theme="space"] .text-gray-600,
[data-app-theme="space"] .text-gray-500,
[data-app-theme="space"] .text-gray-400 {
    color: var(--theme-text-secondary) !important;
}

/* Orbitron Typography for Headings (if font loaded) */
[data-app-theme="space"] h1,
[data-app-theme="space"] h2,
[data-app-theme="space"] h3,
[data-app-theme="space"] .theme-heading {
    letter-spacing: 0.04em;
}

/* Store Specific Cosmic Contrast Rules */
[data-app-theme="space"] .store-hero-header {
    background: rgba(22, 14, 56, 0.82) !important;
    border: 1px solid rgba(168, 85, 247, 0.35) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}
[data-app-theme="space"] .store-hero-badge {
    background: rgba(124, 58, 237, 0.28) !important;
    border: 1px solid rgba(168, 85, 247, 0.5) !important;
}
[data-app-theme="space"] .store-hero-badge-icon,
[data-app-theme="space"] .store-hero-badge-text {
    color: #00F5FF !important;
}
[data-app-theme="space"] .store-hero-title {
    color: #FFFFFF !important;
    text-shadow: 0 2px 10px rgba(124, 58, 237, 0.5);
}
[data-app-theme="space"] .store-hero-subtitle {
    color: #C4B5FD !important;
}

[data-app-theme="space"] .store-wallet-card {
    background: linear-gradient(135deg, rgba(32, 18, 77, 0.92) 0%, rgba(55, 25, 120, 0.92) 100%) !important;
    border: 1px solid rgba(245, 158, 11, 0.5) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4), 0 0 16px rgba(245, 158, 11, 0.25) !important;
}
[data-app-theme="space"] .store-wallet-label {
    color: #FDE68A !important;
}
[data-app-theme="space"] .wallet-number {
    color: #FFD700 !important;
    text-shadow: 0 0 12px rgba(255, 215, 0, 0.4);
}
[data-app-theme="space"] .wallet-currency {
    color: #FCD34D !important;
}
[data-app-theme="space"] .store-wallet-stats {
    color: #E2E8F0 !important;
}
[data-app-theme="space"] .store-expiry-notice {
    background: rgba(124, 58, 237, 0.2) !important;
    border-color: rgba(245, 158, 11, 0.4) !important;
    color: #FDE68A !important;
}

[data-app-theme="space"] .store-tabs .mud-tabs-tabbar {
    border-bottom-color: rgba(168, 85, 247, 0.28) !important;
}
[data-app-theme="space"] .store-tabs .mud-tab {
    color: #C4B5FD !important;
}
[data-app-theme="space"] .store-tabs .mud-tab:hover {
    color: #FFFFFF !important;
}
[data-app-theme="space"] .store-tabs .mud-tab.mud-tab-active {
    color: #00F5FF !important;
    text-shadow: 0 0 10px rgba(0, 245, 255, 0.4);
}
[data-app-theme="space"] .store-tabs .mud-tab-slider {
    background: linear-gradient(90deg, #7C3AED, #00F5FF) !important;
    height: 3px !important;
}

[data-app-theme="space"] .equipped-rewards-strip {
    background: rgba(28, 16, 70, 0.78) !important;
    border: 1px solid rgba(168, 85, 247, 0.35) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
[data-app-theme="space"] .equipped-label {
    color: #D8B4FE !important;
}
[data-app-theme="space"] .equipped-badge {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(168, 85, 247, 0.35) !important;
    color: #F1F5F9 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

[data-app-theme="space"] .filter-chip {
    background: rgba(24, 15, 60, 0.85) !important;
    border: 1px solid rgba(168, 85, 247, 0.32) !important;
    color: #E2E8F0 !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}
[data-app-theme="space"] .filter-chip:hover {
    background: rgba(45, 27, 95, 0.92) !important;
    border-color: rgba(192, 132, 252, 0.6) !important;
    color: #FFFFFF !important;
    box-shadow: 0 0 14px rgba(168, 85, 247, 0.35) !important;
}
[data-app-theme="space"] .filter-chip.active {
    background: linear-gradient(135deg, #7C3AED 0%, #06B6D4 100%) !important;
    border-color: transparent !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 16px rgba(124, 58, 237, 0.5), 0 0 12px rgba(6, 182, 212, 0.35) !important;
}

[data-app-theme="space"] .store-card {
    background: rgba(22, 14, 56, 0.85) !important;
    border: 1px solid rgba(124, 58, 237, 0.32) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    color: #f1f0fb !important;
}
[data-app-theme="space"] .store-card.affordable:hover {
    border-color: #00F5FF !important;
    transform: translateY(-4px) !important;
    box-shadow: 0 20px 40px -4px rgba(124, 58, 237, 0.4), 0 0 24px rgba(0, 245, 255, 0.3) !important;
}
[data-app-theme="space"] .store-card.unaffordable {
    opacity: 0.75 !important;
}
[data-app-theme="space"] .store-card-image-box {
    background: radial-gradient(circle at 50% 45%, rgba(124, 58, 237, 0.35) 0%, rgba(14, 9, 36, 0.95) 75%) !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.25) !important;
}
[data-app-theme="space"] .store-card-title {
    color: #ffffff !important;
}
[data-app-theme="space"] .store-card-desc {
    color: #c4b5fd !important;
}
[data-app-theme="space"] .store-card-price {
    background: rgba(245, 158, 11, 0.16) !important;
    border: 1px solid rgba(245, 158, 11, 0.45) !important;
}
[data-app-theme="space"] .store-card-price .price-val {
    color: #FFD700 !important;
}

[data-app-theme="space"] .store-modal {
    background: #110B2A !important;
    border: 1px solid rgba(168, 85, 247, 0.45) !important;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.8), 0 0 35px rgba(124, 58, 237, 0.3) !important;
    color: #f1f0fb !important;
}
[data-app-theme="space"] .modal-header,
[data-app-theme="space"] .modal-item-summary {
    background: rgba(22, 14, 56, 0.9) !important;
    border-color: rgba(124, 58, 237, 0.3) !important;
}
[data-app-theme="space"] .modal-title,
[data-app-theme="space"] .modal-item-title {
    color: #ffffff !important;
}
[data-app-theme="space"] .modal-item-desc {
    color: #c4b5fd !important;
}
[data-app-theme="space"] .modal-cost-row {
    color: #f1f0fb !important;
}

/* Daily Streak Badge */
[data-app-theme="space"] .streak-badge {
    background: linear-gradient(135deg, #7C3AED 0%, #06B6D4 100%) !important;
    box-shadow: 0 2px 8px rgba(124, 58, 237, 0.5), 0 0 8px rgba(6, 182, 212, 0.4) !important;
}

/* Daily Streak Floating Widget - Space */
[data-app-theme="space"] .streak-header-banner {
    background: linear-gradient(135deg, #7C3AED 0%, #6366F1 50%, #06B6D4 100%) !important;
}
[data-app-theme="space"] .streak-minimized-pill {
    background: linear-gradient(135deg, #7C3AED 0%, #06B6D4 100%) !important;
    box-shadow: 0 10px 25px rgba(124, 58, 237, 0.45) !important;
    border-color: rgba(167, 139, 250, 0.4) !important;
}
[data-app-theme="space"] .streak-floating-card {
    border-color: rgba(124, 58, 237, 0.45) !important;
    box-shadow: 0 20px 45px -10px rgba(0, 0, 0, 0.4), 0 0 25px rgba(124, 58, 237, 0.3) !important;
}
[data-app-theme="space"] .streak-speech-bubble {
    background: rgba(124, 58, 237, 0.12) !important;
    border-color: rgba(124, 58, 237, 0.35) !important;
}
[data-app-theme="space"] .streak-speech-tail {
    background: #ede9fe !important;
    border-color: rgba(124, 58, 237, 0.35) !important;
}
[data-app-theme="space"] .streak-speech-text {
    color: #5b21b6 !important;
}
[data-app-theme="space"][data-theme="dark"] .streak-speech-text {
    color: #c4b5fd !important;
}
[data-app-theme="space"][data-theme="dark"] .streak-speech-tail {
    background: #1e1338 !important;
}
[data-app-theme="space"] .streak-choice-btn.selected {
    border-color: #7c3aed !important;
    background: rgba(124, 58, 237, 0.16) !important;
    box-shadow: 0 2px 10px rgba(124, 58, 237, 0.25) !important;
}
[data-app-theme="space"] .streak-choice-btn.selected .streak-choice-badge {
    background: #7c3aed !important;
    color: #ffffff !important;
}
[data-app-theme="space"] .streak-choice-btn.selected .streak-choice-text {
    color: #6d28d9 !important;
}
[data-app-theme="space"][data-theme="dark"] .streak-choice-btn.selected .streak-choice-text {
    color: #ddd6fe !important;
}
[data-app-theme="space"] .streak-textarea:focus {
    border-color: #7c3aed !important;
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.2) !important;
}
[data-app-theme="space"] .streak-submit-btn,
[data-app-theme="space"] .streak-success-circle {
    background: linear-gradient(135deg, #7C3AED 0%, #06B6D4 100%) !important;
    box-shadow: 0 4px 14px rgba(124, 58, 237, 0.4) !important;
}
[data-app-theme="space"] .streak-reward-pill {
    background: rgba(124, 58, 237, 0.12) !important;
    border-color: rgba(124, 58, 237, 0.25) !important;
    color: #6d28d9 !important;
}
[data-app-theme="space"][data-theme="dark"] .streak-reward-pill {
    color: #c4b5fd !important;
}

/* Space Theme — Notes Page & Text Contrast */
[data-app-theme="space"] .mud-breadcrumbs-separator { color: rgba(226, 232, 240, 0.6) !important; }
[data-app-theme="space"] .mud-breadcrumb-item > a { color: #A78BFA !important; }
[data-app-theme="space"] .mud-breadcrumb-item.mud-disabled > a { color: #06B6D4 !important; font-weight: 700 !important; }
[data-app-theme="space"] .mud-chip-outlined { background: rgba(16, 10, 42, 0.85) !important; border-color: rgba(124, 58, 237, 0.45) !important; color: #cbd5e1 !important; }
[data-app-theme="space"] .mud-chip-outlined .mud-chip-content { color: #cbd5e1 !important; }
[data-app-theme="space"] .note-card { background: rgba(14, 10, 38, 0.92) !important; border: 1px solid rgba(124, 58, 237, 0.35) !important; color: #ffffff !important; }
[data-app-theme="space"] .note-card-title, [data-app-theme="space"] .note-card h3 { color: #ffffff !important; }
[data-app-theme="space"] .note-card-desc, [data-app-theme="space"] .note-card p { color: #94A3B8 !important; }
[data-app-theme="space"] .note-card-banner { background: linear-gradient(135deg, rgba(124, 58, 237, 0.2) 0%, rgba(6, 182, 212, 0.2) 100%) !important; border-bottom: 1px solid rgba(124, 58, 237, 0.25) !important; }
[data-app-theme="space"] .note-card-icon { background: rgba(8, 4, 24, 0.85) !important; border: 1px solid rgba(124, 58, 237, 0.4) !important; color: #A78BFA !important; }
[data-app-theme="space"] .note-card-footer { border-top: 1px solid rgba(124, 58, 237, 0.2) !important; }
[data-app-theme="space"] .notes-search-input, [data-app-theme="space"] .notes-search-box .mud-input-outlined { background: rgba(14, 10, 38, 0.85) !important; border-color: rgba(124, 58, 237, 0.4) !important; }
[data-app-theme="space"] .notes-search-box input { color: #ffffff !important; }
[data-app-theme="space"] .notes-search-box input::placeholder { color: #94A3B8 !important; }
[data-app-theme="space"] .bg-white .text-gray-900, [data-app-theme="space"] .bg-white .note-card-title, [data-app-theme="space"] .bg-white h3 { color: #0f172a !important; }
[data-app-theme="space"] .bg-white .text-gray-500, [data-app-theme="space"] .bg-white .note-card-desc, [data-app-theme="space"] .bg-white p { color: #475569 !important; }

