/* =========================================
   LIGHT THEME (PAPER MODE) — CLEAN FINAL
   ========================================= */

/* =========================================
   1. VARIABLES & RESET
   ========================================= */
   body.quiz-mode.light-mode {
    --bg-dark: #FFD3D5;
    --text-light: #43031f;
    --text-muted: #a77e98;

    --glass-bg: #dbc1d2;
    --glass-border: rgb(205 23 145 / 10%);
    --glass-shadow: 0 4px 6px -1px rgb(135 17 126 / 5%);

    background: var(--bg-dark);
}

/* =========================================
   2. BACKGROUND MODES & THEMES
   ========================================= */
/* Premium Geometric Background (Plans, Profile, Analytics, Checklist) */
html.light-mode body.quiz-mode {
    background-image: 
        /* Layer 1: Edge-Locked SVG Geometric Pattern */
        url("data:image/svg+xml,%3Csvg width='1000' height='1000' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'%3E%3Cg stroke='rgba(150,30,80,0.08)' fill='none'%3E%3C!-- TOP LEFT --%3E%3Ccircle cx='80' cy='80' r='150' stroke-width='1.5'/%3E%3Cpath d='M 40 220 Q 80 180 150 220 T 250 220' stroke-width='2'/%3E%3Ccircle cx='180' cy='100' r='6' fill='rgba(150,30,80,0.15)' stroke='none'/%3E%3Ccircle cx='120' cy='120' r='100' fill='%23fca5b0' opacity='0.25' stroke='none'/%3E%3Cpath d='M 280 80 L 280 100 M 270 90 L 290 90' stroke-width='2'/%3E%3C!-- MIDDLE LEFT --%3E%3Ccircle cx='0' cy='500' r='80' stroke-width='1.5'/%3E%3Crect x='80' y='480' width='20' height='20' transform='rotate(15 90 490)' stroke-width='2'/%3E%3Ccircle cx='130' cy='550' r='4' fill='rgba(150,30,80,0.15)' stroke='none'/%3E%3C!-- BOTTOM LEFT --%3E%3Cpath d='M 0 850 L 150 1000 L 0 1000 Z' stroke-width='1.5'/%3E%3Cpath d='M 80 700 L 80 740 M 60 720 L 100 720' stroke-width='2'/%3E%3C!-- TOP RIGHT --%3E%3Ccircle cx='950' cy='150' r='100' stroke-width='1.5' stroke-dasharray='10 10'/%3E%3Cg fill='rgba(150,30,80,0.15)' stroke='none'%3E%3Ccircle cx='800' cy='50' r='2'/%3E%3Ccircle cx='820' cy='50' r='2'/%3E%3Ccircle cx='840' cy='50' r='2'/%3E%3Ccircle cx='800' cy='70' r='2'/%3E%3Ccircle cx='820' cy='70' r='2'/%3E%3Ccircle cx='840' cy='70' r='2'/%3E%3Ccircle cx='800' cy='90' r='2'/%3E%3Ccircle cx='820' cy='90' r='2'/%3E%3Ccircle cx='840' cy='90' r='2'/%3E%3C/g%3E%3C!-- BOTTOM RIGHT --%3E%3Ccircle cx='900' cy='900' r='200' fill='%23fca5b0' opacity='0.35' stroke='none'/%3E%3Crect x='800' y='750' width='80' height='80' transform='rotate(45 840 790)' stroke-width='1.5'/%3E%3Cpath d='M 920 680 L 920 700 M 910 690 L 930 690' stroke-width='2'/%3E%3Ccircle cx='850' cy='880' r='6' fill='rgba(150,30,80,0.15)' stroke='none'/%3E%3Ccircle cx='960' cy='750' r='8' fill='rgba(150,30,80,0.15)' stroke='none'/%3E%3C/g%3E%3C/svg%3E"),
        /* Layer 2: Your Custom Gradient */
        linear-gradient(135deg, #f5b4b9 0%, #ffc8db 50%, #fca5b0 100%) !important;
    
    background-attachment: fixed !important;
    background-size: 100% 100%, 100% 100% !important; 
    background-position: top left !important;
    background-repeat: no-repeat !important;
}

/* Animated Glowing Orbs */
@media (min-width: 769px) {
    html.light-mode body.quiz-mode::before {
        background: radial-gradient(circle, rgba(235, 43, 116, 0.329) 0%, transparent 60%) !important;
    }
    html.light-mode body.quiz-mode::after {
        background: radial-gradient(circle, rgba(204, 106, 119, 0.6) 0%, transparent 60%) !important;
    }
}

/* =========================================
   3. GLOBAL UTILITIES & TYPOGRAPHY
   ========================================= */
/* Scrollbar */
html.light-mode ::-webkit-scrollbar-thumb { background-color: #c05e6e; border: 3px solid transparent; background-clip: content-box; }
html.light-mode ::-webkit-scrollbar-thumb:hover { background-color: #9f1239; }

/* Strong Font Fix */
body.quiz-mode.light-mode strong, 
body.quiz-mode.light-mode b { color: #931158; }

/* Italics Fix */
body.quiz-mode.light-mode em,
body.quiz-mode.light-mode i,
body.quiz-mode.light-mode .modern-examples li { color: #bf195c; font-weight: 600; }
body.quiz-mode.light-mode .modern-examples li::before { color: #ff096b; }

/* Underline Fix */
body.quiz-mode.light-mode u {color: #bd3f01; font-weight: 600;}
/* Input Placeholders */
html.light-mode input::placeholder { color: rgba(251, 237, 255, 0.363); }


/* =========================================
   4. NAVBAR, MENUS & EXTENSIONS
   ========================================= */
body.quiz-mode.light-mode .navbar { background: #461251; border-bottom: 1px solid #55425245; color: #e7b8df; }
body.quiz-mode.light-mode .nav-extension { width: 100%; background: #360c3fd1; backdrop-filter: blur(15px); border-bottom: 1px solid #b57bb1af; padding: 10px 5%; position: sticky; top: 70px; z-index: 900; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 10px 30px rgb(123 89 122 / 20%); }
body.quiz-mode.light-mode .nav-menu.mobile-open { backdrop-filter: blur(20px); background: rgba(68, 48, 65, 1); box-shadow: rgba(48, 8, 38, 0.5) 0px 20px 50px; border-bottom: 1px solid rgba(172, 89, 175, 0.1); }
body.quiz-mode.light-mode .dropdown-menu { background: rgb(41 15 42 / 90%); }


/* =========================================
   5. SHARED UI: CARDS, MODALS, BUTTONS & FORMS
   ========================================= */
/* Modals */
body.quiz-mode.light-mode .glass-modal { background: #FFD3D5; color: #570d27d9; border: 2px solid #f92830b3; box-shadow: 0 20px 60px rgb(24 7 22 / 54%); }
body.quiz-mode.light-mode .glass-modal h3 { color: #810d5c; }
body.quiz-mode.light-mode .glass-modal p { color: #790053; }
body.quiz-mode.light-mode .glass-textarea { background: #fff0f5; border: 1px solid #55244696; color: #56035b; }

/* Toasts */
html.light-mode .glass-toast { background: rgba(255, 255, 255, 0.95); color: #881337; border: 1px solid #f472b6; box-shadow: 0 10px 40px rgba(190, 24, 93, 0.25); }
html.light-mode .glass-toast.dark-mode { background: #4c0519; color: #fff; border: 1px solid #831843; }

/* Buttons & Badges */
body.quiz-mode.light-mode .badge { background: #ffb1bf; color: #950066; }
body.quiz-mode.light-mode .btn-cancel { padding: 10px 20px; border-radius: 10px; border: none; background: var(--pink); color: #ffffff; cursor: pointer; font-weight: 700; }
body.quiz-mode.light-mode .btn-submit { padding: 10px 20px; border-radius: 10px; border: none; background: var(--pink); color: #ffffff; cursor: pointer; font-weight: 700; }

html.light-mode .focus-btn { background: none; border: none; cursor: pointer; color: #6b82a1; padding: 5px; display: inline-flex; align-items: center; justify-content: center; transition: 0.2s; }
html.light-mode .focus-btn:hover, .focus-active .focus-btn { color: var(--blue); }

html.light-mode .audio-btn { background: none; border: none; cursor: pointer; color: #6b82a1; padding: 5px; display: flex; align-items: center; justify-content: center; transition: 0.2s; }
html.light-mode .audio-btn:hover { color: var(--blue); transform: scale(1.1); }
html.light-mode .report-btn { margin-left: auto; background: none; border: none; cursor: pointer; color: #6b82a1; display: flex; align-items: center; justify-content: center; padding: 5px; transition: 0.2s; }
html.light-mode .report-btn:hover { color: var(--red); transform: scale(1.1); }
body.quiz-mode.light-mode .report-btn { color: #7a508b; }
body.quiz-mode.light-mode .report-btn:hover { color: var(--red); transform: scale(1.1); }

body.light-mode .fav-btn.active svg { fill: var(--blue); stroke: var(--blue); }
html.light-mode .audio-btn.save-btn { background: none; border: none; cursor: pointer; color: #7a508b; padding: 5px; display: flex; align-items: center; justify-content: center; transition: 0.2s; }
html.light-mode .audio-btn.save-btn:hover { color: #ff620e; transform: scale(1.1); }

/* Bookmark (Save) Button - Light Mode (Darker amber for contrast) */
html.light-mode .save-btn.active svg,
body.light-mode .save-btn.active svg { fill: #ff620e; stroke: #ff620e; }


/* =========================================
   6. DICTIONARY & WOTD
   ========================================= */
html.light-mode .def-result-container { background: #f0f1fb; color: #334155; border: 1px solid rgba(0,0,0,0.1); box-shadow: 0 10px 30px rgba(0,0,0,0.2); backdrop-filter: none; }
html.light-mode .def-header { border-bottom: 1px solid rgba(0,0,0,0.08); }
html.light-mode .word-title { color: #0f172a; }
html.light-mode .pronunciation { color: #64748b; }
html.light-mode .def-text { color: #1e293b; }
html.light-mode .meaning-item { border-bottom: 2px dashed rgba(0,0,0,0.15); }
html.light-mode .meaning-item:last-child { border-bottom: none; }

html.light-mode .modern-examples li { color: #3a0229ec; }
html.light-mode .modern-examples li::before { color: #1b1a19ef; }

html.light-mode .root-box { background: #ece6cd; border: 1px dashed #fcd34d; }
html.light-mode .root-box p { color: #92400e; }
html.light-mode body.home-mode .root-box strong { color: #934500; }

html.light-mode .pill-green { background: rgba(16, 185, 129, 0.1); color: #047857; }
html.light-mode .pill-red { background: rgba(244, 63, 94, 0.1); color: #be123c; }

body.light-mode .label-text { font-family: 'Poppins', sans-serif; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: #b45309; }
body.light-mode .editorial-header { border-bottom: 1px solid rgba(77, 83, 92, 0.507); }
html.light-mode .date-text { color: #161c25d6; }

html.light-mode .wordcheck.letter-link { text-decoration: none; color: white; background: rgb(150 137 167 / 51%); width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 6px; font-weight: 500; border: 1px solid rgba(255,255,255,0.4); transition: 0.2s; box-shadow: inset 1px 1px 12px 1px #504a5787}

html.light-mode .wordcheck.letter-link:hover {    background: #fee7ffc9; color: #9d1147; transform: none; box-shadow: inset 0px 0px 4px #9f22a1db; transform: translateY(-5px); }

html.light-mode .wordcheck.letter-link.active {
   background: #fee7ffc9;
   color: #9d1147;
   transform: none;
   box-shadow: inset 0px 0px 4px #9f22a1db;
}
/* =========================================
   7. QUIZ, EXAM & REVIEW UI
   ========================================= */
body.quiz-mode.light-mode .quiz-glass-card { background: #f8fafc; border: 1px solid #e2e8f0; box-shadow: 0 10px 30px rgba(0,0,0,0.05); color: #334155; }
body.quiz-mode.light-mode .question-card { background: #f7d1d7; border: 1px solid #7d445875; box-shadow: 0 12px 9px 1px rgb(35 5 31 / 10%); color: #67062f; backdrop-filter: none; -webkit-backdrop-filter: none; transform: translateZ(0); }

body.quiz-mode.light-mode .card-header { color: #830331; border-bottom: 1px solid #910064; }
body.quiz-mode.light-mode .header-divider { width: 2px; background: rgba(77, 76, 80, 0.2); }
body.quiz-mode.light-mode .question-count { color: #4f0441; }
body.quiz-mode.light-mode .question-instruction { color: #910064; border-bottom: 1px solid rgba(145, 0, 100, 0.2); }
body.quiz-mode.light-mode .question-instruction p { color: #910064; }

html.light-mode .passage-box { background: rgb(146, 62, 147, 0.03); color: #1e293b; border-left: 4px solid #7b1883; box-shadow: 0 0 9px 3px rgb(55 13 69 / 28%); }

body.quiz-mode.light-mode .glass-option-btn { background: #ebbdc42b; border: 1px solid #c9649399; color: #350b29; }
body.quiz-mode.light-mode .glass-option-btn::before { color: #be185d; }
body.quiz-mode.light-mode .glass-option-btn:hover { background: #f9546254; border-color: #af40628a; transform: translateX(5px); }
body.quiz-mode.light-mode .glass-option-btn:hover::before, body.quiz-mode.light-mode .glass-option-btn.selected::before { color: #881337; }
body.quiz-mode.light-mode .glass-option-btn.correct { background: #80d19a8a; border-color: #22c55e; color: #036b2a; }
body.quiz-mode.light-mode .glass-option-btn.wrong { background: #eda0a0; border-color: #ef4444; color: #a31414; }
body.quiz-mode.light-mode .glass-option-btn.selected { background: #f9546254; border-color: #af40628a; color: #370404; box-shadow: 0 0 15px rgb(39 9 28 / 20%); }

.quiz-glass-card.answered .glass-option-btn.correct:hover { background-color: rgb(68 255 193 / 30%); }

body.quiz-mode.light-mode .question-card.status-skipped { border: 2px solid var(--amber); box-shadow: 0 0 15px rgba(245, 158, 11, 0.25); }
body.quiz-mode.light-mode .question-card.status-correct { border: 2px solid var(--green); box-shadow: 0 0 15px rgba(16, 185, 129, 0.25); }
body.quiz-mode.light-mode .question-card.status-wrong { border: 2px solid var(--red); box-shadow: 0 0 15px rgba(244, 63, 94, 0.25); }

body.quiz-mode.light-mode .explanation-box { background: #FFD3D5; border: 1px solid #c59496a6; border-left: 4px solid var(--amber); color: #38083b; box-shadow: 4px 5px 10px rgb(42 35 43 / 12%); }
body.quiz-mode.light-mode .exp-header { color: #915860; }
body.quiz-mode.light-mode .exp-content { color: #41013b; }
body.quiz-mode.light-mode .exp-content li::before { color: #cd5700; } /* <-- Right here! */

body.quiz-mode.light-mode .btn-exit-quiz { background: rgba(223, 187, 219, 0.2); color: rgb(71 7 65); border: 1px solid #8d176a96; box-shadow: 0px 5px 13px #591b4e34; transition: 0.3s; }
body.quiz-mode.light-mode .btn-exit-quiz:hover { background: rgba(192, 132, 186, 0.3); transform: translateY(-2px); }
.submit-exam-btn { background: var(--pink); color: white; border: none; padding: 10px 20px; border-radius: 30px; font-weight: 600; cursor: pointer; box-shadow: 1px 8px 13px rgb(49 7 23 / 22%); transition: 0.2s; }

/* Filter Buttons */
body.quiz-mode.light-mode .badge.filter-btn { background: #d5ecf724; color: #ebdeff; border: 1px solid white; }
body.quiz-mode.light-mode .badge.filter-btn:hover { background: #a645a7; color: #efe5ff; border: 1px solid white; }
body.quiz-mode.light-mode .badge.filter-btn.active { background: #a645a7; color: #efe5ff; border: 1px solid white; }
body.quiz-mode.light-mode .badge.badge-wrong.filter-btn { background: #d5ecf724; color: #ebdeff; border: 1px solid red; }
body.quiz-mode.light-mode .badge.badge-wrong.filter-btn:hover { background: #e7433d; color: #fefeff; }
body.quiz-mode.light-mode .badge.badge-wrong.filter-btn.active { background: #e7433d; color: #fefeff; }
body.quiz-mode.light-mode .badge.badge-skipped.filter-btn { background: #d5ecf724; color: #ebdeff; border: 1px solid var(--amber); }
body.quiz-mode.light-mode .badge.badge-skipped.filter-btn:hover { background: #ac9e36; color: #fefeff; }
body.quiz-mode.light-mode .badge.badge-skipped.filter-btn.active { background: #ac9e36; color: #fefeff; }


/* =========================================
   8. SCOREBOARDS & ANALYTICS
   ========================================= */
body.quiz-mode.light-mode .score-panel { background: #540863; border: 1px solid #de31f34d; color: #ffd7fa; box-shadow: 2px 3px 18px rgb(61 18 67 / 35%); }
body.quiz-mode.light-mode .score-panel-title { color: var(--teal); font-weight: 700; }
body.quiz-mode.light-mode .total-score { color: var(--teal); font-weight: 800; font-size: 1.05rem; }
body.quiz-mode.light-mode .score-val { font-weight: 800; }
body.quiz-mode.light-mode .total-score span { display: block; font-size: 1.8rem; margin-top: 5px; color: #e4d3ff; text-shadow: 0 0 10px rgba(56, 189, 248, 0.5); }
body.quiz-mode.light-mode .text-faded { color: #cd98c6e6; }
body.quiz-mode.light-mode .score-circle-outer { box-shadow: 1px 0px 86px rgba(150, 30, 90, 0.7); }
body.quiz-mode.light-mode #final-score { color: #9fd6f1; }
body.quiz-mode.light-mode .score-total { color: #313e52; opacity: 0.8; }
body.quiz-mode.light-mode .score-total { color: #e3f0ff; opacity: 0.99; } /* Double declaration maintained per rules */

body.quiz-mode.light-mode .show-scorecard-btn { background: rgb(173 45 91 / 4%); border: 1px solid rgb(239 66 196 / 20%); color: #590b40; padding: 12px 25px; border-radius: 30px; cursor: pointer; font-weight: 600; transition: all 0.2s; text-decoration: none; display: inline-block; box-shadow: 1px 8px 13px #21031340; }
body.quiz-mode.light-mode .show-scorecard-btn:hover { transform: translateY(-5px); }

/* Analytics Dashboard Elements */
html.light-mode .stats-grid .glass-card { background: #510c5fe8; box-shadow: 0 10px 30px rgba(0,0,0,0.05); color: #cdddf3; }
html.light-mode .glass-card.analytics-card, body.light-mode .glass-card.analytics-card { background: #510c5fe8; }
html.light-mode .stats-grid .stat-label { color: #f3f8ff; }
html.light-mode .stats-grid .text-amber { color: #ff9e30; } 
html.light-mode .stats-grid .text-gold { color: #b6f05ac2; } 
html.light-mode .stats-grid .text-teal { color: #2ed6c8; } 
html.light-mode .stats-grid .text-red { color: #ee3563; } 
html.light-mode .stats-grid .text-blue { color: #4cb7f1; } 

/* Analytics Specific Light Overrides */
html.light-mode .master-progress-bg { background: rgba(0,0,0,0.1); }

/* Light & Blue Mode Overrides for Vocab Badge */
html.light-mode .vocab-badge {
   background: rgba(16, 185, 129, 0.15);
   color: #047857;
   border-color: rgba(16, 185, 129, 0.3);
   box-shadow: 0 4px 15px rgba(16, 185, 129, 0.2);
}
html.theme-blue .vocab-badge {
   background: rgba(2, 132, 199, 0.15);
   color: #0369a1;
   border-color: rgba(2, 132, 199, 0.3);
   box-shadow: 0 4px 15px rgba(2, 132, 199, 0.2);
}

html.light-mode .auc-label {
   color: #90dcff;
}
/* =========================================
   9. CHECKLIST & WORDCHECK
   ========================================= */
html.light-mode .checklist-search-group { background: rgb(51 43 51 / 19%); border: 1px solid rgb(31 19 37 / 6%); }
html.light-mode .checklist-search-group { background: rgb(51 43 51 / 7%); border: 1px solid rgb(31 19 37 / 22%); }
html.light-mode .checklist-search-group input::placeholder { color: rgba(76, 53, 83, 0.534); }
html.light-mode .check-item.checked-active { background: rgb(98 195 163 / 58%); border-color: var(--green); }

html.light-mode .checklist-search-input { color: #43123e; }
html.light-mode .check-item.checked-active .word-text { color: #32433c; }
html.light-mode .word-text { color: rgb(41 36 43 / 89%); }
html.light-mode .check-item { border: 1px solid rgb(18 2 22 / 22%); }
html.light-mode .custom-box { border: 2px solid rgb(116 90 123 / 38%); }
html.light-mode .wordcheck-score-panel { background: rgb(63 50 71 / 91%); }
html.light-mode .page-btn { background: rgb(27 17 39 / 48%); border: 1px solid rgb(48 27 65 / 18%); color: white; }
html.light-mode .page-info { color: rgb(20 7 22 / 89%); }

/* WordCheck Filter Action Bar Light Overrides */
html.light-mode .checklist-action-bar { background: rgba(0, 0, 0, 0.02); border-color: rgba(0, 0, 0, 0.05); box-shadow: inset 0 2px 10px rgba(0,0,0,0.02); }
html.light-mode .filter-pill { background: rgba(255, 255, 255, 0.5); color: #475569; border-color: rgba(0, 0, 0, 0.1); }
html.light-mode .filter-pill:hover { background: white; color: #0f172a; }
html.light-mode .filter-pill.active {
   background: #7b135fdb;
   color: white;
   box-shadow: none;
}
html.light-mode .filter-pill.pill-checked.active { background: #10b981; color: white; }
html.light-mode .filter-pill.pill-unchecked.active { background: #f43f5e; color: white; }
html.light-mode .bulk-toggle-btn { color: #334155; border-color: rgba(0, 0, 0, 0.3); }
html.light-mode .bulk-toggle-btn:hover { background: rgba(0, 0, 0, 0.05); border-color: #334155; border-style: solid; }

/* WordCheck Filter Action Bar Blue Overrides */
html.theme-blue .filter-pill.active { background: #0284c7; }
html.theme-blue .filter-pill.pill-checked.active { background: #059669; }
html.theme-blue .filter-pill.pill-unchecked.active { background: #e11d48; }

/* =========================================
   11. PROFILE SETTINGS
   ========================================= */
html.light-mode .profile-card-large { background: rgba(255, 211, 211, 0.65); border: 1px solid rgba(35, 21, 47, 0.32); }
html.light-mode .p-col-left { background: rgba(57, 44, 61, 1); border-right: 1px solid rgba(0, 0, 0, 0.1); }
html.light-mode .p-col-mid { border-right: 1px solid rgba(0, 0, 0, 0.1); }
html.light-mode .p-divider { background: rgba(0, 0, 0, 0.1); }
html.light-mode .p-section-title { color: #b45309; }
html.light-mode .p-label { color: #64748b; }
html.light-mode .p-val { color: #0f172a; }
html.light-mode .btn-glassy-profile { background: rgba(0, 0, 0, 0.05); border: 1px solid rgba(0, 0, 0, 0.2); color: #0f172a; }
html.light-mode .btn-glassy-profile:hover { background: rgba(0, 0, 0, 0.1); border-color: rgba(0, 0, 0, 0.4); color: #000; }
html.light-mode .edit-overlay { background: rgba(68, 55, 71, 0.81); }


/* =========================================
   12. PLANS & CHECKOUT
   ========================================= */
html.light-mode .plan-card { background: #3d0029b5; backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); border: 1px solid rgba(255, 255, 255, 0.1); border-left: 4px solid var(--plan-color); box-shadow:3px 3px 13px 0px rgb(0 0 0 / 57%); border-radius: 20px; display: flex; overflow: hidden; position: relative; transition: all 0.3s ease; min-height: 180px; color: white; }
html.light-mode .plan-card:hover { transform: translateY(-10px); box-shadow: 0 10px 40px rgba(44, 31, 41, 0.664); border-color: rgba(26, 31, 37, 0.329); border-left-color: var(--plan-color); }
html.light-mode .plan-left { background: rgba(63, 34, 56); border-right: 1px solid rgb(54, 27, 48); }
html.light-mode .plan-header { border-bottom: 1px solid rgb(0, 0, 0, 0.1); }
html.light-mode .plan-title{ text-shadow: -1px 1px 1px rgba(7, 4, 14, 0.2); }
html.light-mode .plan-price { color: #f1d9d8; }
html.light-mode .plan-label { color: #f5e3f9; }
html.light-mode .plan-val { color: #efd4f5; }
html.light-mode .btn-buy-plan { align-self: flex-end; color: #fce8ff; box-shadow: 0 0 10px var(--plan-color-glow); border: 1px solid var(--plan-color); }
html.light-mode .btn-buy-plan:hover { background: var(--plan-color); border-color: var(--plan-color); color: #fff; }

html.light-mode .checkout-wrapper .glass-card, html.light-mode .checkout-wrapper .main-card { background: #510c5fe8; border: 1px solid rgba(0, 0, 0, 0.4); box-shadow: 3px 10px 20px 1px rgba(0, 0, 0, 0.4); }

/* Default (Dark Mode) - Left intact per instructions */
.checkout-heading { margin-bottom: 20px; color: #f0f7ff; }
html.light-mode .checkout-heading, body.light-mode .checkout-heading { color: #fff0f0; }

html.light-mode .success-glass-card, body.light-mode .success-glass-card { background: #55424bed; border: 1px solid rgba(0, 0, 0, 0.4); box-shadow: 3px 10px 20px 1px rgba(0, 0, 0, 0.4); }
html.light-mode .success-glass-card .start-btn { border: 1px solid rgb(237 246 255 / 18%); border-top: 1px solid rgba(255, 255, 255, 0.4); color: white; }


/* =========================================
   13. ADMIN & MAINTAINER DASHBOARD
   ========================================= */
html.light-mode .auc-card { box-shadow: -2px 1px 25px rgb(37 44 55 / 29%); }

body.quiz-mode.light-mode #admin-shortcuts.glass-card { background: #510c5fe8; backdrop-filter: blur(12px); max-width: 1100px; border: 1px solid var(--glass-border); border-radius: 20px; padding: 2rem; box-shadow: var(--glass-shadow); text-align: center; color: white; width: 100%; margin-bottom: 20px; }
body.light-mode #admin-shortcuts strong { color: #ffca66; }