/* ============================================================
   CREATIVE GIRLS THEME — data-app-theme="girls"
   Modern editorial creative studio: electric violet, soft rose, lilac glassmorphism
   High aesthetics, elegant, vibrant, sophisticated
   ============================================================ */

[data-app-theme="girls"] {
    /* Brand Design Tokens */
    --Primary: #9333EA;           /* Electric violet */
    --Primary_rgba: 147, 51, 234;
    --Primary_Dark: #6B21A8;
    --Primary_Dark_rgba: 107, 33, 168;
    --Secondary: #EC4899;         /* Modern rose */
    --Secondary_rgba: 236, 72, 153;
    --Tertiary: #F0ABFC;          /* Soft lilac */
    --Tertiary_rgba: 240, 171, 252;
    --Quaternary: #FDF4FF;        /* Lavender cream */
    --Quaternary_rgba: 253, 244, 255;

    /* Theme Specific Tokens */
    --theme-glow: 0 4px 25px rgba(147, 51, 234, 0.22);
    --theme-border: 1px solid rgba(147, 51, 234, 0.22);
    --theme-card-bg: rgba(255, 252, 255, 0.88);
    --theme-text-primary: #3b0764;
    --theme-text-secondary: #701a75;
}

/* Light / Base Mode for Creative Girls (Lavender Rose Studio) */
[data-app-theme="girls"] body,
[data-app-theme="girls"] main,
[data-app-theme="girls"] .page {
    background:
        radial-gradient(ellipse at 12% 15%, rgba(147, 51, 234, 0.12) 0%, transparent 50%),
        radial-gradient(ellipse at 88% 85%, rgba(236, 72, 153, 0.10) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(240, 171, 252, 0.08) 0%, transparent 60%),
        linear-gradient(150deg, #FDF4FF 0%, #FCE7F3 40%, #F5F3FF 70%, #FDF2F8 100%) !important;
    background-attachment: fixed !important;
    color: var(--theme-text-primary) !important;
}

/* Dark Mode + Creative Girls (Midnight Violet & Neon Rose) */
[data-app-theme="girls"][data-theme="dark"] body,
[data-app-theme="girls"][data-theme="dark"] main,
[data-app-theme="girls"][data-theme="dark"] .page {
    background:
        radial-gradient(ellipse at 15% 15%, rgba(147, 51, 234, 0.22) 0%, transparent 55%),
        radial-gradient(ellipse at 85% 85%, rgba(236, 72, 153, 0.18) 0%, transparent 55%),
        radial-gradient(circle at 50% 40%, rgba(192, 38, 211, 0.12) 0%, transparent 50%),
        linear-gradient(150deg, #180026 0%, #290226 50%, #17002e 100%) !important;
    background-attachment: fixed !important;
    color: #fdf4ff !important;
}

/* Top Navigation Bar */
[data-app-theme="girls"] .top-row {
    background: rgba(255, 250, 255, 0.92) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-bottom: 1px solid rgba(147, 51, 234, 0.2) !important;
    box-shadow: 0 4px 18px rgba(147, 51, 234, 0.08) !important;
}

[data-app-theme="girls"][data-theme="dark"] .top-row {
    background: rgba(35, 2, 45, 0.94) !important;
    border-bottom: 1px solid rgba(147, 51, 234, 0.35) !important;
    box-shadow: 0 4px 22px rgba(0, 0, 0, 0.5) !important;
}

/* Sidebar Drawer */
[data-app-theme="girls"] .sidebar {
    background: linear-gradient(180deg, #fdf4ff 0%, #fae8ff 100%) !important;
    border-left: 1px solid rgba(147, 51, 234, 0.22) !important;
}

[data-app-theme="girls"][data-theme="dark"] .sidebar {
    background: linear-gradient(180deg, #2b0233 0%, #1a0026 100%) !important;
    border-left: 1px solid rgba(147, 51, 234, 0.35) !important;
}

/* Dark Mode Logo for Girls Theme */
[data-app-theme="girls"][data-theme="dark"] .nav-logo,
[data-app-theme="girls"][data-theme="dark"] .responsive-logo {
    content: url('/assets/images/NurzWhite.png') !important;
}

/* Cards & Surface Containers */
[data-app-theme="girls"] .mud-card:not(.course-details),
[data-app-theme="girls"] .rounded-card:not(.course-details),
[data-app-theme="girls"] .rounded-card-100:not(.course-details) {
    background: rgba(255, 252, 255, 0.90) !important;
    border: 1px solid rgba(147, 51, 234, 0.18) !important;
    box-shadow: 0 8px 24px rgba(147, 51, 234, 0.08) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    color: var(--theme-text-primary) !important;
}

[data-app-theme="girls"][data-theme="dark"] .mud-card:not(.course-details),
[data-app-theme="girls"][data-theme="dark"] .rounded-card:not(.course-details),
[data-app-theme="girls"][data-theme="dark"] .rounded-card-100:not(.course-details) {
    background: rgba(42, 5, 58, 0.88) !important;
    border: 1px solid rgba(147, 51, 234, 0.35) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5) !important;
    color: #fdf4ff !important;
}

/* Primary Action Buttons */
[data-app-theme="girls"] .mud-button-filled-primary,
[data-app-theme="girls"] .button-primary,
[data-app-theme="girls"] .bg-primary-100 {
    background: linear-gradient(135deg, #9333EA 0%, #EC4899 100%) !important;
    border: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 16px rgba(147, 51, 234, 0.35) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

[data-app-theme="girls"] .mud-button-filled-primary:hover,
[data-app-theme="girls"] .button-primary:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 6px 24px rgba(236, 72, 153, 0.5), 0 0 15px rgba(147, 51, 234, 0.35) !important;
}

/* Active Tabs & Typography Accents */
[data-app-theme="girls"] .mud-tab.mud-tab-active,
[data-app-theme="girls"] .mud-primary-text {
    color: #9333EA !important;
}

[data-app-theme="girls"][data-theme="dark"] .mud-tab.mud-tab-active,
[data-app-theme="girls"][data-theme="dark"] .mud-primary-text {
    color: #F0ABFC !important;
    text-shadow: 0 0 10px rgba(240, 171, 252, 0.4);
}

[data-app-theme="girls"] .mud-tab-slider {
    background: linear-gradient(90deg, #9333EA, #EC4899) !important;
    height: 3px !important;
}

/* Course Details / Content Cards — Preserving Background Images */
[data-app-theme="girls"] .rounded-card.course-details {
    background-color: rgba(253, 244, 255, 0.85) !important;
    border: 1px solid rgba(147, 51, 234, 0.22) !important;
    color: #6B21A8 !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="girls"]:not([data-theme="dark"]) .rounded-card.course-details:hover {
    background-color: #FDF4FF !important;
    border-color: #9333EA !important;
    box-shadow: 0 8px 24px rgba(147, 51, 234, 0.25) !important;
    transform: translateY(-3px);
}

[data-app-theme="girls"][data-theme="dark"] .rounded-card.course-details {
    background-color: rgba(50, 8, 72, 0.85) !important;
    border: 1px solid rgba(147, 51, 234, 0.40) !important;
    color: #fdf4ff !important;
    background-repeat: no-repeat !important;
    background-position: right top !important;
    background-size: auto 75% !important;
}

[data-app-theme="girls"][data-theme="dark"] .rounded-card.course-details:hover {
    background-color: rgba(75, 12, 105, 0.95) !important;
    border-color: #EC4899 !important;
    box-shadow: 0 10px 30px rgba(147, 51, 234, 0.4) !important;
    transform: translateY(-3px);
}

[data-app-theme="girls"] .rounded-card.course-details.sessions {
    background-image: url('/assets/images/course-details-sessions.png') !important;
}
[data-app-theme="girls"] .rounded-card.course-details.assignments {
    background-image: url('/assets/images/course-details-assignments.png') !important;
}
[data-app-theme="girls"] .rounded-card.course-details.exams {
    background-image: url('/assets/images/course-details-exams.png') !important;
}
[data-app-theme="girls"] .rounded-card.course-details.quizzes {
    background-image: url('/assets/images/course-details-quizes.png') !important;
}
[data-app-theme="girls"] .rounded-card.course-details.live-sessions {
    background-image: url('/assets/images/course-details-live-sessions.png') !important;
}
[data-app-theme="girls"] .rounded-card.course-details.announcements {
    background-image: url('/assets/images/announcements.png') !important;
}
[data-app-theme="girls"] .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="girls"] .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="girls"] .rounded-card.course-details.store {
    background-image: url('/assets/images/trophy.png') !important;
}

[data-app-theme="girls"] .rounded-card.course-details h4,
[data-app-theme="girls"] .rounded-card.course-details h5,
[data-app-theme="girls"] .rounded-card.course-details h6,
[data-app-theme="girls"] .rounded-card.course-details .mud-typography {
    color: #4A044E !important;
    font-weight: 700 !important;
}

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

/* Course Header Info Pills (Level, Board, Group) */
[data-app-theme="girls"] .course-info-pill {
    background: rgba(147, 51, 234, 0.12) !important;
    border: 1px solid rgba(147, 51, 234, 0.28) !important;
}
[data-app-theme="girls"] .course-info-pill-text {
    color: #6B21A8 !important;
    font-weight: 700 !important;
}
[data-app-theme="girls"] .course-info-pill .mud-icon-root {
    color: #9333EA !important;
}

[data-app-theme="girls"][data-theme="dark"] .course-info-pill {
    background: rgba(147, 51, 234, 0.25) !important;
    border: 1px solid rgba(236, 72, 153, 0.40) !important;
}
[data-app-theme="girls"][data-theme="dark"] .course-info-pill-text {
    color: #FDF4FF !important;
}
[data-app-theme="girls"][data-theme="dark"] .course-info-pill .mud-icon-root {
    color: #EC4899 !important;
}

/* Sidebar & Scoring Board Contrast */
[data-app-theme="girls"][data-theme="dark"] .sidebar h4,
[data-app-theme="girls"][data-theme="dark"] .sidebar h5,
[data-app-theme="girls"][data-theme="dark"] .sidebar .mud-typography {
    color: #fdf4ff !important;
}
[data-app-theme="girls"][data-theme="dark"] .scoring-list-name {
    color: #fdf4ff !important;
    font-weight: 600 !important;
}
[data-app-theme="girls"][data-theme="dark"] .scoring-list-order {
    color: #d8b4fe !important;
}

[data-app-theme="girls"]:not([data-theme="dark"]) .sidebar h4,
[data-app-theme="girls"]:not([data-theme="dark"]) .sidebar h5,
[data-app-theme="girls"]:not([data-theme="dark"]) .sidebar .mud-typography {
    color: #3b0764 !important;
}
[data-app-theme="girls"]:not([data-theme="dark"]) .scoring-list-name {
    color: #3b0764 !important;
    font-weight: 600 !important;
}
[data-app-theme="girls"]:not([data-theme="dark"]) .scoring-list-order {
    color: #7e22ce !important;
}

/* Score Podiums */
[data-app-theme="girls"] .rounded-card.score-podium-1 {
    color: #9333EA !important;
    background: rgba(147, 51, 234, 0.18) !important;
    border: 1px solid rgba(147, 51, 234, 0.4) !important;
}
[data-app-theme="girls"] .rounded-card.score-podium-2 {
    color: #701a75 !important;
    background: rgba(148, 163, 184, 0.15) !important;
    border: 1px solid rgba(148, 163, 184, 0.35) !important;
}
[data-app-theme="girls"] .rounded-card.score-podium-3 {
    color: #be185d !important;
    background: rgba(236, 72, 153, 0.15) !important;
    border: 1px solid rgba(236, 72, 153, 0.35) !important;
}

/* Background Opacity Utility Classes */
[data-app-theme="girls"] .bg-primary-10 { background: rgba(147, 51, 234, 0.10) !important; }
[data-app-theme="girls"] .bg-primary-25 { background: rgba(147, 51, 234, 0.25) !important; }
[data-app-theme="girls"] .bg-primary-50 { background: rgba(147, 51, 234, 0.50) !important; }

/* Dark mode text overrides */
[data-app-theme="girls"][data-theme="dark"] .text-gray-900,
[data-app-theme="girls"][data-theme="dark"] .text-gray-800,
[data-app-theme="girls"][data-theme="dark"] .text-gray-700 {
    color: #fdf4ff !important;
}

[data-app-theme="girls"][data-theme="dark"] .text-gray-600,
[data-app-theme="girls"][data-theme="dark"] .text-gray-500,
[data-app-theme="girls"][data-theme="dark"] .text-gray-400 {
    color: #f0abfc !important;
}

/* Store Specific Contrast Rules */
[data-app-theme="girls"][data-theme="dark"] .store-card {
    background: rgba(42, 10, 56, 0.92) !important;
    border: 1px solid rgba(147, 51, 234, 0.40) !important;
    color: #fdf4ff !important;
}
[data-app-theme="girls"][data-theme="dark"] .store-card-title {
    color: #ffffff !important;
}
[data-app-theme="girls"][data-theme="dark"] .store-card-desc {
    color: #f5d0fe !important;
}
[data-app-theme="girls"][data-theme="dark"] .store-card-image-box {
    background: radial-gradient(circle at 50% 45%, rgba(147, 51, 234, 0.25) 0%, rgba(26, 7, 35, 0.9) 100%) !important;
    border-bottom: 1px solid rgba(147, 51, 234, 0.25) !important;
}
[data-app-theme="girls"][data-theme="dark"] .store-hero-header {
    background: rgba(42, 10, 56, 0.9) !important;
    border-color: rgba(147, 51, 234, 0.35) !important;
}
[data-app-theme="girls"][data-theme="dark"] .store-hero-title {
    color: #ffffff !important;
}
[data-app-theme="girls"][data-theme="dark"] .store-hero-subtitle {
    color: #f5d0fe !important;
}
[data-app-theme="girls"][data-theme="dark"] .store-wallet-card {
    background: rgba(147, 51, 234, 0.25) !important;
    border-color: rgba(236, 72, 153, 0.4) !important;
}
[data-app-theme="girls"][data-theme="dark"] .store-modal {
    background: #1a0723 !important;
    border-color: rgba(147, 51, 234, 0.4) !important;
    color: #fdf4ff !important;
}
[data-app-theme="girls"][data-theme="dark"] .modal-header,
[data-app-theme="girls"][data-theme="dark"] .modal-item-summary {
    background: rgba(42, 10, 56, 0.9) !important;
    border-color: rgba(147, 51, 234, 0.3) !important;
}
[data-app-theme="girls"][data-theme="dark"] .modal-title,
[data-app-theme="girls"][data-theme="dark"] .modal-item-title {
    color: #ffffff !important;
}
[data-app-theme="girls"][data-theme="dark"] .modal-item-desc {
    color: #f5d0fe !important;
}
[data-app-theme="girls"][data-theme="dark"] .modal-cost-row {
    color: #fdf4ff !important;
}

/* Daily Streak Badge */
[data-app-theme="girls"] .streak-badge {
    background: linear-gradient(135deg, #9333EA 0%, #EC4899 100%) !important;
    box-shadow: 0 2px 8px rgba(236, 72, 153, 0.45) !important;
}

/* Daily Streak Floating Widget - Girls */
[data-app-theme="girls"] .streak-header-banner {
    background: linear-gradient(135deg, #EC4899 0%, #D946EF 50%, #8B5CF6 100%) !important;
}
[data-app-theme="girls"] .streak-minimized-pill {
    background: linear-gradient(135deg, #EC4899 0%, #8B5CF6 100%) !important;
    box-shadow: 0 10px 25px rgba(236, 72, 153, 0.45) !important;
    border-color: rgba(245, 208, 254, 0.5) !important;
}
[data-app-theme="girls"] .streak-floating-card {
    border-color: rgba(236, 72, 153, 0.4) !important;
    box-shadow: 0 20px 45px -10px rgba(0, 0, 0, 0.22), 0 0 25px rgba(236, 72, 153, 0.25) !important;
}
[data-app-theme="girls"] .streak-speech-bubble {
    background: rgba(253, 242, 248, 0.9) !important;
    border-color: rgba(236, 72, 153, 0.3) !important;
}
[data-app-theme="girls"] .streak-speech-tail {
    background: #fdf2f8 !important;
    border-color: rgba(236, 72, 153, 0.3) !important;
}
[data-app-theme="girls"] .streak-speech-text {
    color: #831843 !important;
}
[data-app-theme="girls"][data-theme="dark"] .streak-speech-text {
    color: #fbcfe8 !important;
}
[data-app-theme="girls"][data-theme="dark"] .streak-speech-tail {
    background: #2d1226 !important;
}
[data-app-theme="girls"] .streak-choice-btn.selected {
    border-color: #ec4899 !important;
    background: rgba(236, 72, 153, 0.14) !important;
    box-shadow: 0 2px 10px rgba(236, 72, 153, 0.2) !important;
}
[data-app-theme="girls"] .streak-choice-btn.selected .streak-choice-badge {
    background: #ec4899 !important;
    color: #ffffff !important;
}
[data-app-theme="girls"] .streak-choice-btn.selected .streak-choice-text {
    color: #9d174d !important;
}
[data-app-theme="girls"][data-theme="dark"] .streak-choice-btn.selected .streak-choice-text {
    color: #fce7f3 !important;
}
[data-app-theme="girls"] .streak-textarea:focus {
    border-color: #ec4899 !important;
    box-shadow: 0 0 0 3px rgba(236, 72, 153, 0.2) !important;
}
[data-app-theme="girls"] .streak-submit-btn,
[data-app-theme="girls"] .streak-success-circle {
    background: linear-gradient(135deg, #EC4899 0%, #8B5CF6 100%) !important;
    box-shadow: 0 4px 14px rgba(236, 72, 153, 0.4) !important;
}
[data-app-theme="girls"] .streak-reward-pill {
    background: rgba(253, 242, 248, 0.9) !important;
    border-color: rgba(236, 72, 153, 0.25) !important;
    color: #9d174d !important;
}
[data-app-theme="girls"][data-theme="dark"] .streak-reward-pill {
    color: #fbcfe8 !important;
}