html {
      font-size: 19px !important;
    }
    /* ═══════ DESIGN SYSTEM TOKENS ═══════ */
    :root {
      --bg-deep: #0B0F19;
      --surface-1: rgba(17, 24, 39, 0.92);
      --surface-2: rgba(31, 41, 55, 0.7);
      --surface-3: rgba(55, 65, 81, 0.35);
      --glass-border: rgba(255, 255, 255, 0.06);
      --glass-border-hover: rgba(99, 102, 241, 0.3);
      --accent: #6366F1;
      --accent-light: #818CF8;
      --accent-glow: rgba(99, 102, 241, 0.15);
      --accent-dim: #4F46E5;
      --success: #10B981;
      --warning: #F59E0B;
      --danger: #EF4444;
      --text-primary: #F9FAFB;
      --text-secondary: #9CA3AF;
      --text-muted: #6B7280;
      --radius-sm: 8px;
      --radius-md: 12px;
      --radius-lg: 16px;
      --radius-xl: 24px;
    }

    /* ═══════ GLASS PANELS ═══════ */
    .glass-panel {
      background: var(--surface-1);
      backdrop-filter: blur(24px) saturate(180%);
      border: 1px solid var(--glass-border);
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255,255,255,0.03);
    }
    .glass-card {
      background: var(--surface-3);
      border: 1px solid var(--glass-border);
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .glass-card:hover {
      background: rgba(30, 35, 60, 0.6);
      border-color: var(--glass-border-hover);
      box-shadow: 0 4px 20px var(--accent-glow);
      transform: translateY(-1px);
    }

    /* ═══════ SIDEBAR BUTTON ═══════ */
    .sidebar-btn {
      transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
      position: relative;
    }
    .sidebar-btn::before {
      content: '';
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%) scaleY(0);
      width: 3px;
      height: 60%;
      border-radius: 0 4px 4px 0;
      background: var(--accent);
      transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .sidebar-btn.active::before {
      transform: translateY(-50%) scaleY(1);
    }

    /* ═══════ KPI CARD ═══════ */
    .kpi-card {
      background: linear-gradient(135deg, rgba(16, 20, 42, 0.8), rgba(22, 28, 52, 0.4));
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-lg);
      padding: 1.25rem;
      transition: all 0.3s ease;
    }
    .kpi-card:hover {
      border-color: rgba(99, 102, 241, 0.2);
      box-shadow: 0 4px 24px var(--indigo-glow);
    }

    /* ═══════ TABLE STYLES ═══════ */
    .data-table {
      width: 100%;
      text-align: left;
      font-size: 0.75rem;
    }
    .data-table thead {
      background: rgba(255,255,255,0.03);
      border-bottom: 1px solid var(--glass-border);
    }
    .data-table th {
      padding: 0.75rem 1rem;
      font-size: 0.625rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      color: var(--text-muted);
    }
    .data-table td {
      padding: 0.75rem 1rem;
      border-bottom: 1px solid rgba(255,255,255,0.03);
    }
    .data-table tbody tr {
      transition: background 0.2s ease;
    }
    .data-table tbody tr:hover {
      background: rgba(255,255,255,0.02);
    }

    /* ═══════ FORM INPUTS ═══════ */
    .input-field {
      background: rgba(0, 0, 0, 0.25);
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: var(--radius-sm);
      padding: 0.5rem 0.75rem;
      font-size: 0.75rem;
      color: var(--text-primary);
      outline: none;
      transition: border-color 0.2s ease, box-shadow 0.2s ease;
      width: 100%;
    }
    .input-field:focus {
      border-color: rgba(99, 102, 241, 0.4);
      box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.08);
    }
    .input-field::placeholder {
      color: var(--text-muted);
    }

    /* ═══════ BUTTONS ═══════ */
    .btn-primary {
      background: linear-gradient(135deg, var(--accent), var(--accent-dim));
      color: #FFFFFF;
      font-weight: 700;
      border-radius: var(--radius-md);
      padding: 0.5rem 1.25rem;
      font-size: 0.7rem;
      transition: all 0.2s ease;
      box-shadow: 0 2px 12px var(--accent-glow);
    }
    .btn-primary:hover {
      box-shadow: 0 4px 20px rgba(99, 102, 241, 0.35);
      transform: translateY(-1px);
    }
    .btn-secondary {
      background: rgba(99, 102, 241, 0.12);
      color: #A5B4FC;
      font-weight: 700;
      border: 1px solid rgba(99, 102, 241, 0.2);
      border-radius: var(--radius-md);
      padding: 0.5rem 1.25rem;
      font-size: 0.7rem;
      transition: all 0.2s ease;
    }
    .btn-secondary:hover {
      background: rgba(99, 102, 241, 0.2);
      border-color: rgba(99, 102, 241, 0.4);
    }
    .btn-danger {
      background: rgba(239, 68, 68, 0.1);
      color: #FCA5A5;
      font-weight: 700;
      border: 1px solid rgba(239, 68, 68, 0.2);
      border-radius: var(--radius-md);
      padding: 0.5rem 1.25rem;
      font-size: 0.7rem;
      transition: all 0.2s ease;
    }
    .btn-danger:hover {
      background: rgba(239, 68, 68, 0.25);
      border-color: rgba(239, 68, 68, 0.4);
    }

    /* ═══════ BADGES ═══════ */
    .badge {
      display: inline-flex;
      align-items: center;
      padding: 0.15rem 0.5rem;
      border-radius: 9999px;
      font-size: 0.6rem;
      font-weight: 700;
      letter-spacing: 0.03em;
      text-transform: uppercase;
    }
    .badge-success { background: rgba(16, 185, 129, 0.12); color: #6EE7B7; border: 1px solid rgba(16, 185, 129, 0.2); }
    .badge-warning { background: rgba(245, 158, 11, 0.12); color: #FCD34D; border: 1px solid rgba(245, 158, 11, 0.2); }
    .badge-danger  { background: rgba(239, 68, 68, 0.12); color: #FCA5A5; border: 1px solid rgba(239, 68, 68, 0.2); }
    .badge-info    { background: rgba(99, 102, 241, 0.12); color: #A5B4FC; border: 1px solid rgba(99, 102, 241, 0.2); }
    .badge-pink    { background: rgba(236, 72, 153, 0.12); color: #F9A8D4; border: 1px solid rgba(236, 72, 153, 0.2); }

    /* ═══════ TOGGLE SWITCH ═══════ */
    .toggle-switch {
      width: 2rem;
      height: 1.1rem;
      border-radius: 9999px;
      background: #1E293B;
      cursor: pointer;
      appearance: none;
      position: relative;
      transition: background 0.3s ease;
    }
    .toggle-switch::before {
      content: '';
      position: absolute;
      width: 0.85rem;
      height: 0.85rem;
      border-radius: 50%;
      background: white;
      top: 50%;
      left: 0.12rem;
      transform: translateY(-50%);
      transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .toggle-switch:checked {
      background: var(--accent);
    }
    .toggle-switch:checked::before {
      transform: translateY(-50%) translateX(0.9rem);
    }

    /* ═══════ SCROLLBARS ═══════ */
    .custom-scroll::-webkit-scrollbar {
      width: 4px;
    }
    .custom-scroll::-webkit-scrollbar-track {
      background: transparent;
    }
    .custom-scroll::-webkit-scrollbar-thumb {
      background: rgba(255,255,255,0.08);
      border-radius: 4px;
    }
    .custom-scroll::-webkit-scrollbar-thumb:hover {
      background: rgba(255,255,255,0.15);
    }
    .no-scrollbar::-webkit-scrollbar { display: none; }
    .no-scrollbar { scrollbar-width: none; }

    /* ═══════ ANIMATIONS ═══════ */
    @keyframes shake {
      0%, 100% { transform: translateX(0); }
      25% { transform: translateX(-5px); }
      75% { transform: translateX(5px); }
    }
    .animate-shake { animation: shake 0.3s ease-in-out; }

    @keyframes fadeInUp {
      from { opacity: 0; transform: translateY(12px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .fade-in-up {
      animation: fadeInUp 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    }

    @keyframes gradient-shift {
      0%, 100% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
    }
    .gradient-animate {
      background-size: 200% 200%;
      animation: gradient-shift 6s ease infinite;
    }

    @keyframes pulse-ring {
      0% { box-shadow: 0 0 0 0 rgba(0, 229, 163, 0.4); }
      70% { box-shadow: 0 0 0 6px rgba(0, 229, 163, 0); }
      100% { box-shadow: 0 0 0 0 rgba(0, 229, 163, 0); }
    }
    .pulse-ring { animation: pulse-ring 2s infinite; }

    /* ═══════ DEVICE FRAME ═══════ */
    .device-notch {
      width: 120px;
      height: 28px;
      background: #000;
      border-radius: 0 0 18px 18px;
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      z-index: 30;
    }
    .device-notch::after {
      content: '';
      width: 48px;
      height: 4px;
      background: rgba(255,255,255,0.08);
      border-radius: 4px;
      position: absolute;
      bottom: 6px;
      left: 50%;
      transform: translateX(-50%);
    }
    .home-indicator {
      width: 120px;
      height: 4px;
      background: rgba(255,255,255,0.15);
      border-radius: 4px;
      position: absolute;
      bottom: 6px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 30;
    }

    /* ═══════ LABEL ═══════ */
    .label {
      display: block;
      font-size: 0.55rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--text-muted);
      margin-bottom: 0.35rem;
    }

    /* ═══════ SECTION HEADER ═══════ */
    .section-title {
      font-size: 0.95rem;
      font-weight: 800;
      color: var(--text-primary);
      letter-spacing: -0.01em;
    }
    .section-subtitle {
      font-size: 0.7rem;
      color: var(--text-secondary);
      margin-top: 0.15rem;
    }

    /* ═══════ GRADIENT TEXT ═══════ */
    .gradient-text {
      background: linear-gradient(135deg, var(--accent-light), #A5B4FC);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    /* ═══════ LIGHT MODE OVERRIDES FOR MOBILE/TABLET ═══════ */
    .light-theme {
      background-color: #F8FAFC !important;
      color: #1E293B !important;
    }
    
    /* Device frame background */
    .light-theme.bg-\[\#0d1020\] {
      background-color: #FFFFFF !important;
      border-color: #E2E8F0 !important;
      box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.08) !important;
    }
    
    /* App viewport background - targeted directly via custom class */
    .light-theme .light-theme-bg {
      background-color: #F8FAFC !important;
    }
    
    /* Mock Phone top status bar */
    .light-theme .bg-slate-950\/40 {
      background-color: #F1F5F9 !important;
      color: #475569 !important;
      border-bottom: 1px solid rgba(0, 0, 0, 0.03) !important;
    }
    
    /* Mock Phone Notch/details */
    .light-theme .bg-slate-900 {
      background-color: #E2E8F0 !important;
    }
    
    /* Gradient headers in light mode - beautiful pastel gradient */
    .light-theme .bg-gradient-to-br.from-\[\#1e1b4b\].to-\[\#312e81\] {
      background: linear-gradient(135deg, #EEF2FF, #E0E7FF) !important;
    }
    
    /* Text color overrides */
    .light-theme h1, .light-theme h2, .light-theme h3, .light-theme h4, .light-theme h5, .light-theme h6 {
      color: #0F172A !important;
    }
    
    /* Target all text utility classes for readable dark color on light background */
    .light-theme .text-white:not(button):not(.btn-primary):not(.btn-secondary):not(.btn-danger):not(i):not(.badge) {
      color: #0F172A !important;
    }
    
    .light-theme .text-slate-300:not(button):not(i):not(.badge) {
      color: #334155 !important;
    }
    
    .light-theme .text-slate-400:not(button):not(i):not(.badge) {
      color: #475569 !important;
    }
    
    .light-theme .text-slate-500:not(button):not(i):not(.badge) {
      color: #64748B !important;
    }
    
    /* Glass cards and panels in light mode - clear, soft reflections */
    .light-theme .glass-card,
    .light-theme [class*="glass-card"] {
      background: rgba(255, 255, 255, 0.75) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
      border: 1px solid rgba(0, 0, 0, 0.08) !important;
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.02) !important;
    }
    
    .light-theme .glass-panel,
    .light-theme [class*="glass-panel"] {
      background: rgba(255, 255, 255, 0.85) !important;
      backdrop-filter: blur(16px) !important;
      -webkit-backdrop-filter: blur(16px) !important;
      border: 1px solid rgba(0, 0, 0, 0.07) !important;
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.03) !important;
    }
    
    /* Background panels and blocks - override dark transparencies using attribute selectors */
    .light-theme [class*="bg-white/5"],
    .light-theme [class*="bg-white\\/5"],
    .light-theme [class*="bg-white/3"],
    .light-theme [class*="bg-white\\/3"] {
      background-color: rgba(255, 255, 255, 0.85) !important;
      border: 1px solid rgba(0, 0, 0, 0.06) !important;
    }
    
    .light-theme [class*="bg-slate-900/40"],
    .light-theme [class*="bg-slate-900\\/40"],
    .light-theme [class*="bg-slate-900/50"],
    .light-theme [class*="bg-slate-900\\/50"],
    .light-theme [class*="bg-black/40"],
    .light-theme [class*="bg-black\\/40"],
    .light-theme [class*="bg-black/30"],
    .light-theme [class*="bg-black\\/30"] {
      background-color: #FFFFFF !important;
      border: 1px solid rgba(0, 0, 0, 0.07) !important;
    }
    
    .light-theme [class*="border-white/5"],
    .light-theme [class*="border-white\\/5"],
    .light-theme [class*="border-white/10"],
    .light-theme [class*="border-white\\/10"] {
      border-color: rgba(0, 0, 0, 0.07) !important;
    }
    
    /* Inputs, selects, and textareas */
    .light-theme input,
    .light-theme select,
    .light-theme textarea {
      background-color: #FFFFFF !important;
      color: #0F172A !important;
      border: 1px solid #CBD5E1 !important;
    }
    
    .light-theme input::placeholder,
    .light-theme textarea::placeholder {
      color: #94A3B8 !important;
    }
    
    /* Table divider lines */
    .light-theme [class*="divide-white/5"] > * + *,
    .light-theme [class*="divide-white\\/5"] > * + *,
    .light-theme [class*="divide-white/10"] > * + *,
    .light-theme [class*="divide-white\\/10"] > * + * {
      border-color: rgba(0, 0, 0, 0.06) !important;
    }
    
    /* Color accent overrides for legibility on light background */
    .light-theme .text-indigo-300,
    .light-theme .text-indigo-400 {
      color: #3730A3 !important; /* indigo-800 */
    }
    
    .light-theme .text-pink-300 {
      color: #9D174D !important; /* pink-800 */
    }
    
    .light-theme .text-amber-300 {
      color: #92400E !important; /* amber-800 */
    }
    
    .light-theme .text-red-300,
    .light-theme .text-red-400 {
      color: #DC2626 !important;
    }
    
    .light-theme .text-emerald-300,
    .light-theme .text-emerald-400 {
      color: #065F46 !important; /* emerald-800 */
    }
    
    .light-theme [class*="bg-indigo-950/30"],
    .light-theme [class*="bg-indigo-950\\/30"] {
      background-color: rgba(79, 70, 229, 0.05) !important;
      border: 1px solid rgba(79, 70, 229, 0.12) !important;
    }
    
    .light-theme [class*="bg-red-500/10"],
    .light-theme [class*="bg-red-500\\/10"] {
      background-color: rgba(220, 38, 38, 0.05) !important;
    }
    
    .light-theme [class*="bg-emerald-500/20"],
    .light-theme [class*="bg-emerald-500\\/20"] {
      background-color: rgba(5, 150, 105, 0.06) !important;
    }
    
    .light-theme [class*="bg-red-500/20"],
    .light-theme [class*="bg-red-500\\/20"] {
      background-color: rgba(220, 38, 38, 0.06) !important;
    }
    
    .light-theme [class*="bg-amber-500/20"],
    .light-theme [class*="bg-amber-500\\/20"],
    .light-theme [class*="bg-amber-500/25"],
    .light-theme [class*="bg-amber-500\\/25"] {
      background-color: rgba(217, 119, 6, 0.06) !important;
    }
    
    /* Device buttons and settings toggles */
    .light-theme [class*="bg-accent/15"],
    .light-theme [class*="bg-accent\\/15"],
    .light-theme [class*="bg-accent/20"],
    .light-theme [class*="bg-accent\\/20"] {
      background-color: rgba(99, 102, 241, 0.06) !important;
      color: #4F46E5 !important;
    }
    
    .light-theme [class*="border-accent/30"],
    .light-theme [class*="border-accent\\/30"] {
      border-color: rgba(99, 102, 241, 0.15) !important;
    }
    
    .light-theme .bg-\[\#121425\] {
      background-color: #FFFFFF !important;
      border-color: rgba(0, 0, 0, 0.06) !important;
    }
    
    /* Bottom tab bar overrides */
    .light-theme .absolute.bottom-0.inset-x-0 {
      background-color: rgba(255, 255, 255, 0.85) !important;
      backdrop-filter: blur(20px) !important;
      -webkit-backdrop-filter: blur(20px) !important;
      border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
    }
    
    .light-theme .absolute.bottom-0.inset-x-0 button {
      color: #64748B !important;
    }
    
    .light-theme .absolute.bottom-0.inset-x-0 button.text-accent {
      color: #4F46E5 !important;
    }
    
    /* Apple Pay button shadow and style */
    .light-theme button.bg-white {
      background-color: #000000 !important;
      color: #FFFFFF !important;
    }
    
    /* GPay button shadow and style */
    .light-theme button.bg-slate-900 {
      background-color: #FFFFFF !important;
      color: #000000 !important;
      border: 1px solid #CBD5E1 !important;
    }
    
    /* Fix minor age migration panel background */
    .light-theme .bg-red-500\/10.border-red-500\/20 {
      background-color: rgba(220, 38, 38, 0.03) !important;
      border-color: rgba(220, 38, 38, 0.1) !important;
    }
    
    /* WhatsApp chat container */
    .light-theme .bg-\[\#0c1317\] {
      background-color: #F0F2F5 !important;
      border-color: rgba(0, 0, 0, 0.05) !important;
    }
    
    .light-theme .bg-\[\#075e54\] {
      background-color: #008069 !important;
    }
    
    .light-theme .bg-\[\#1e2428\] {
      background-color: #F0F2F5 !important;
    }
    
    .light-theme .bg-\[\#2a2f32\] {
      background-color: #FFFFFF !important;
      border: 1px solid rgba(0, 0, 0, 0.08) !important;
    }
    
    .light-theme button.bg-\[\#075e54\] {
      background-color: #008069 !important;
    }

    /* Clean, light gradients for cards in light theme - using attribute substring matching to bypass # and bracket parsing bugs */
    .light-theme [class*="from-indigo-950"][class*="to-pink-950"] {
      background: linear-gradient(135deg, #F5F3FF, #FFF1F2) !important;
      border-color: rgba(219, 39, 119, 0.15) !important;
    }
    
    .light-theme [class*="from-indigo-950"][class*="to-pink-950"] h4,
    .light-theme [class*="from-indigo-950"][class*="to-pink-950"] p {
      color: #1E293B !important;
    }
    
    .light-theme [class*="from-[#1E3C72]"][class*="to-[#2A5298]"],
    .light-theme [class*="from-\[\#1E3C72\]"][class*="to-\[\#2A5298\]"] {
      background: linear-gradient(135deg, #E0E7FF, #C7D2FE) !important;
      border: 1px solid rgba(79, 70, 229, 0.1) !important;
      box-shadow: 0 4px 16px rgba(99, 102, 241, 0.05) !important;
    }
    
    .light-theme [class*="from-[#1E3C72]"][class*="to-[#2A5298]"] h4,
    .light-theme [class*="from-\[\#1E3C72\]"][class*="to-\[\#2A5298\]"] h4 {
      color: #312E81 !important;
    }
    
    .light-theme [class*="from-[#1E3C72]"][class*="to-[#2A5298]"] p,
    .light-theme [class*="from-\[\#1E3C72\]"][class*="to-\[\#2A5298\]"] p {
      color: #4338CA !important;
    }

    /* Dojo Deuda card overrides in light theme */
    .light-theme [class*="from-red-950/40"][class*="to-slate-950"],
    .light-theme [class*="from-red-950\\/40"][class*="to-slate-950"] {
      background: linear-gradient(135deg, #FEF2F2, #FEE2E2) !important;
      border-color: rgba(239, 68, 68, 0.15) !important;
    }
    
    .light-theme [class*="from-red-950/40"][class*="to-slate-950"] span,
    .light-theme [class*="from-red-950\\/40"][class*="to-slate-950"] span {
      color: #7F1D1D !important;
    }
    
    .light-theme [class*="from-red-950/40"][class*="to-slate-950"] h4,
    .light-theme [class*="from-red-950\\/40"][class*="to-slate-950"] h4 {
      color: #B91C1C !important;
    }

    /* Profesor / Instructor specific light theme card overrides */
    .light-theme [class*="from-orange-950"][class*="to-slate-950"] {
      background: linear-gradient(135deg, #FFF7ED, #FFEDD5) !important;
      border-color: rgba(249, 115, 22, 0.25) !important;
    }
    
    .light-theme [class*="from-orange-950"][class*="to-slate-950"] p {
      color: #9A3412 !important; /* naranja-800 */
    }
    
    .light-theme [class*="from-orange-950"][class*="to-slate-950"] h4 {
      color: #7C2D12 !important; /* naranja-900 */
    }

    /* Safety Alert and Medical alerts light theme fixes */
    .light-theme .text-red-200 {
      color: #991B1B !important; /* rojo-800 */
    }
    
    .light-theme .text-amber-200 {
      color: #92400E !important; /* amber-800 */
    }
    
    .light-theme [class*="bg-amber-500/10"],
    .light-theme [class*="bg-amber-500\\/10"] {
      background-color: rgba(217, 119, 6, 0.05) !important;
    }

     /* Sponsor Real-Time Preview Container, Ads & Memberships light theme overrides */
     .light-theme [class*="from-indigo-950"],
     .light-theme [class*="from-indigo-950"] {
       background: linear-gradient(135deg, #EEF2FF, #E0E7FF) !important;
       border-color: rgba(99, 102, 241, 0.22) !important;
       box-shadow: 0 4px 16px rgba(99, 102, 241, 0.04) !important;
     }
     
     .light-theme [class*="from-indigo-950"] h4,
     .light-theme [class*="from-indigo-950"] h5,
     .light-theme [class*="from-indigo-950"] p,
     .light-theme [class*="from-indigo-950"] span:not(.badge),
     .light-theme [class*="from-indigo-950"] div {
       color: #1E293B !important;
     }
     
     .light-theme [class*="from-indigo-950"] i {
       color: #4F46E5 !important;
     }

     /* Digital Credentials in Profile views */
     .light-theme [class*="from-[#121629]"][class*="to-[#0A0D1B]"],
     .light-theme [class*="from-\[\#121629\]"][class*="to-\[\#0A0D1B\]"],
     .light-theme [class*="from-[#1E3C72]"][class*="to-[#2A5298]"],
     .light-theme [class*="from-\[\#1E3C72\]"][class*="to-\[\#2A5298\]"] {
       background: linear-gradient(135deg, #EEF2FF, #E0E7FF) !important;
       border-color: rgba(99, 102, 241, 0.25) !important;
       box-shadow: 0 10px 25px rgba(99, 102, 241, 0.08) !important;
     }
     
     .light-theme [class*="from-[#121629]"] *,
     .light-theme [class*="from-\[\#121629\]"] *,
     .light-theme [class*="from-[#1E3C72]"] *,
     .light-theme [class*="from-\[\#1E3C72\]"] * {
       color: #1E293B !important;
     }

     /* Background container boxes & session cards */
     .light-theme [class*="bg-indigo-950/20"],
     .light-theme [class*="bg-indigo-950\\/20"],
     .light-theme [class*="bg-indigo-950/30"],
     .light-theme [class*="bg-indigo-950\\/30"],
     .light-theme [class*="bg-slate-900/50"],
     .light-theme [class*="bg-slate-900\\/50"],
     .light-theme [class*="bg-slate-900/40"],
     .light-theme [class*="bg-slate-900\\/40"],
     .light-theme [class*="bg-black/20"],
     .light-theme [class*="bg-black\\/20"],
     .light-theme [class*="bg-black/30"],
     .light-theme [class*="bg-black\\/30"],
     .light-theme [class*="bg-black/40"],
     .light-theme [class*="bg-black\\/40"] {
       background-color: #FFFFFF !important;
       border: 1px solid rgba(0, 0, 0, 0.08) !important;
       background-image: none !important;
     }
     
     .light-theme [class*="bg-indigo-950/20"] *,
     .light-theme [class*="bg-indigo-950\\/20"] *,
     .light-theme [class*="bg-indigo-950/30"] *,
     .light-theme [class*="bg-indigo-950\\/30"] *,
     .light-theme [class*="bg-slate-900/50"] *,
     .light-theme [class*="bg-slate-900\\/50"] *,
     .light-theme [class*="bg-slate-900/40"] *,
     .light-theme [class*="bg-slate-900\\/40"] *,
     .light-theme [class*="bg-black/20"] *,
     .light-theme [class*="bg-black\\/20"] *,
     .light-theme [class*="bg-black/30"] *,
     .light-theme [class*="bg-black\\/30"] *,
     .light-theme [class*="bg-black/40"] *,
     .light-theme [class*="bg-black\\/40"] * {
       color: #1E293B !important;
     }

     /* Specific orange highlights in Teacher Schedule/Agenda */
     .light-theme [class*="bg-orange-500/10"],
     .light-theme [class*="bg-orange-500\\/10"] {
       background-color: rgba(249, 115, 22, 0.08) !important;
       border-color: rgba(249, 115, 22, 0.22) !important;
     }
     .light-theme [class*="bg-orange-500/15"],
     .light-theme [class*="bg-orange-500\\/15"],
     .light-theme [class*="bg-orange-500/20"],
     .light-theme [class*="bg-orange-500\\/20"] {
       background-color: rgba(249, 115, 22, 0.12) !important;
       border-color: rgba(249, 115, 22, 0.25) !important;
     }
     .light-theme [class*="text-orange-300"],
     .light-theme [class*="text-orange-400"] {
       color: #C2410C !important;
     }

     /* Attendance mini-chart colors for light theme */
     .light-theme [class*="bg-red-500/30"],
     .light-theme [class*="bg-red-500\\/30"] {
       background-color: rgba(239, 68, 68, 0.25) !important;
     }
     .light-theme [class*="bg-accent/70"],
     .light-theme [class*="bg-accent\\/70"] {
       background-color: rgba(99, 102, 241, 0.75) !important;
     }
      
      /* Force white background for weekly chart card */
      .light-theme [class*="bg-white/5"],
      .light-theme [class*="bg-white\\/5"] {
        background-color: #FFFFFF !important;
        border: 1px solid rgba(0, 0, 0, 0.08) !important;
      }

      /* Amber-950 Representative profile card and general amber light theme overrides */
      .light-theme [class*="from-amber-950"],
      .light-theme [class*="from-amber-950"] {
        background: linear-gradient(135deg, #FEF3C7, #FDE68A) !important;
        border-color: rgba(217, 119, 6, 0.25) !important;
        box-shadow: 0 4px 16px rgba(217, 119, 6, 0.05) !important;
      }
      
      .light-theme [class*="from-amber-950"] h4,
      .light-theme [class*="from-amber-950"] h5,
      .light-theme [class*="from-amber-950"] p,
      .light-theme [class*="from-amber-950"] span:not(.badge),
      .light-theme [class*="from-amber-950"] div {
        color: #78350F !important;
      }
      
      .light-theme [class*="from-amber-950"] i {
        color: #D97706 !important;
      }

      /* Red-950/40 Medical alerts and text-red-200 contrast fixes in light theme */
      .light-theme [class*="bg-red-950/40"],
      .light-theme [class*="bg-red-950\\/40"] {
        background-color: rgba(239, 68, 68, 0.08) !important;
        border-color: rgba(239, 68, 68, 0.22) !important;
      }
      
      .light-theme [class*="bg-red-950/40"] *,
      .light-theme [class*="bg-red-950\\/40"] * {
        color: #991B1B !important;
      }
      
      .light-theme .text-red-200,
      .light-theme .text-red-300 {
        color: #B91C1C !important;
      }