/**
 * ============================================================
 * MY HERO ACADEMIA THEME - Plus Ultra / Heroic / Dynamic
 * ============================================================
 * Theme ID: mha
 * Design: Heroic energy, One For All lightning, dynamic action aesthetic
 * 
 * COLOR PALETTE (based on anime):
 * - One For All Cyan: #00E5FF (Deku's lightning)
 * - Hero Green: #2E7D32 (Deku's costume/hair)
 * - All Might Gold: #FFD700 (Symbol of Peace)
 * - Danger Red: #E63946 (villains, alerts)
 * - Dark Base: #0D1B2A (deep hero academy)
 * ============================================================
 */

/* Fonts - Bold heroic typography */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

html[data-color="mha"]{ --brand-h:175; }

/* ===== CSS VARIABLES ===== */
html[data-color="mha"] {
  --ofa-cyan: #00E5FF;
  --hero-green: #2E7D32;
  --allmight-gold: #FFD700;
  --danger-red: #E63946;
  --dark-base: #0D1B2A;
  --panel-dark: #1B2838;
  --energy-pink: #FF4081;
}

/* ===== CORE COLOR SYSTEM ===== */
/* Dark Theme (Primary - Hero Academy at night) */
html[data-theme="dark"][data-color="mha"]{
  --bg: #0D1B2A;                    /* Dark Academy */
  --bg-primary: #0D1B2A;
  --bg-secondary: #1B2838;          /* Panel dark */
  --bg-tertiary: #243447;
  --card: rgba(27, 40, 56, 0.9);
  --text: #F0F8FF;                  /* Light heroic white */
  --text-primary: #F0F8FF;
  --text-secondary: #B0C4DE;
  --muted: #7A8FA6;
  --line: rgba(0, 229, 255, 0.3);   /* Cyan glow border */
  --surface-2: #1B2838;
  --surface-3: #243447;
  --accent-primary: #00E5FF;        /* One For All Cyan */
  --accent-secondary: #2E7D32;      /* Hero Green */
  --accent-gold: #FFD700;           /* All Might Gold */
  --accent-danger: #E63946;
  --border-subtle: rgba(0, 229, 255, 0.2);
  --border-strong: #00E5FF;
}

/* Light Theme Variant */
html[data-theme="light"][data-color="mha"]{
  --bg: #E8F4F8;
  --bg-primary: #E8F4F8;
  --bg-secondary: #D0E8F0;
  --bg-tertiary: #B8DCE8;
  --card: rgba(255, 255, 255, 0.95);
  --text: #0D1B2A;
  --text-primary: #0D1B2A;
  --text-secondary: #1B2838;
  --muted: #4A6080;
  --line: rgba(46, 125, 50, 0.3);
  --surface-2: #D0E8F0;
  --surface-3: #B8DCE8;
  --accent-primary: #00ACC1;
  --accent-secondary: #2E7D32;
  --accent-gold: #FFA000;
  --accent-danger: #C62828;
  --border-subtle: rgba(46, 125, 50, 0.2);
  --border-strong: #2E7D32;
}

/* ===== BACKGROUND ===== */
html[data-theme="dark"][data-color="mha"] body{
  background: 
    linear-gradient(135deg, rgba(13, 27, 42, 0.8) 0%, rgba(27, 40, 56, 0.75) 50%, rgba(13, 27, 42, 0.8) 100%),
    url('../backrounds/mha-backround.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

html[data-theme="light"][data-color="mha"] body{
  background: 
    linear-gradient(135deg, rgba(232, 244, 248, 0.85) 0%, rgba(208, 232, 240, 0.8) 50%, rgba(232, 244, 248, 0.85) 100%),
    url('../backrounds/mha-backround.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* Lightning accent line at top */
html[data-color="mha"] body::before{
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, 
    transparent 5%,
    #00E5FF 20%,
    #2E7D32 50%,
    #00E5FF 80%,
    transparent 95%
  );
  z-index: 9999;
  box-shadow: 0 0 10px rgba(0, 229, 255, 0.5);
}

/* ===== TYPOGRAPHY ===== */
/* Headings: Bebas Neue for heroic impact */
html[data-color="mha"] h1,
html[data-color="mha"] h2,
html[data-color="mha"] h3,
html[data-color="mha"] .onboard-title,
html[data-color="mha"] .modal-header strong,
html[data-color="mha"] .kiosk-modal-title{
  font-family: 'Bebas Neue', 'Inter', sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

html[data-color="mha"] .label{
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Body: Inter */
html[data-color="mha"],
html[data-color="mha"] body{
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 500;
  line-height: 1.6;
}

/* Stats: JetBrains Mono */
html[data-color="mha"] .clock,
html[data-color="mha"] #clockOut,
html[data-color="mha"] .countdown,
html[data-color="mha"] #elapsedOut,
html[data-color="mha"] #leftOut,
html[data-color="mha"] #nextInOut,
html[data-color="mha"] code,
html[data-color="mha"] .kbd{
  font-family: 'JetBrains Mono', monospace !important;
  font-weight: 600;
}

/* Clock - One For All Cyan with glow */
html[data-theme="dark"][data-color="mha"] #clockOut{
  color: #00E5FF;
  font-family: 'Bebas Neue', sans-serif !important;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-shadow: 
    0 0 10px rgba(0, 229, 255, 0.6),
    0 0 20px rgba(0, 229, 255, 0.4),
    0 0 30px rgba(0, 229, 255, 0.2);
}

html[data-theme="light"][data-color="mha"] #clockOut{
  color: #00838F;
  font-family: 'Bebas Neue', sans-serif !important;
  font-weight: 400;
  text-shadow: 0 2px 4px rgba(0, 131, 143, 0.2);
}

/* ===== CONTAINER ===== */
html[data-color="mha"] .container{
  border: 2px solid rgba(0, 229, 255, 0.3);
  border-radius: 8px;
  background: rgba(27, 40, 56, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 
    0 4px 24px rgba(0, 0, 0, 0.3),
    0 0 0 1px rgba(0, 229, 255, 0.1);
}

html[data-theme="light"][data-color="mha"] .container{
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(46, 125, 50, 0.3);
  box-shadow: 0 4px 20px rgba(13, 27, 42, 0.15);
}

/* ===== CARDS ===== */
html[data-color="mha"] .card{
  border: 2px solid rgba(0, 229, 255, 0.25);
  border-radius: 8px;
  background: rgba(27, 40, 56, 0.8);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: all 150ms ease-out;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

html[data-color="mha"] .card:hover{
  border-color: #00E5FF;
  transform: translateY(-2px);
  box-shadow: 
    0 4px 16px rgba(0, 0, 0, 0.3),
    0 0 15px rgba(0, 229, 255, 0.2);
}

html[data-theme="light"][data-color="mha"] .card{
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(46, 125, 50, 0.2);
  box-shadow: 0 2px 8px rgba(13, 27, 42, 0.1);
}

html[data-theme="light"][data-color="mha"] .card:hover{
  border-color: #2E7D32;
  box-shadow: 0 4px 16px rgba(46, 125, 50, 0.15);
}

/* Themed cards - Hero Green with cyan glow */
html[data-color="mha"] .themed-card::before{
  background: linear-gradient(135deg, #2E7D32 0%, #1B5E20 100%);
}

html[data-color="mha"] .themed-card{
  color: #FFFFFF;
  border: 2px solid #2E7D32;
  border-radius: 8px;
  box-shadow: 
    0 4px 16px rgba(46, 125, 50, 0.25),
    0 0 20px rgba(0, 229, 255, 0.1);
}

html[data-color="mha"] .themed-card .label,
html[data-color="mha"] .themed-card .muted,
html[data-color="mha"] .themed-card #currentName,
html[data-color="mha"] .themed-card #currentRoom,
html[data-color="mha"] .themed-card #currentTimeRange,
html[data-color="mha"] .themed-card #elapsedOut,
html[data-color="mha"] .themed-card #leftOut,
html[data-color="mha"] .themed-card #nextName,
html[data-color="mha"] .themed-card #nextRoom,
html[data-color="mha"] .themed-card #nextTimeRange,
html[data-color="mha"] .themed-card #nextInOut,
html[data-color="mha"] .themed-card #untilOut{
  color: rgba(255, 255, 255, 0.95) !important;
}

/* ===== PILLS ===== */
html[data-color="mha"] .pill{
  border: 2px solid rgba(0, 229, 255, 0.4);
  background: rgba(27, 40, 56, 0.8);
  color: #00E5FF;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.75em;
  border-radius: 4px;
  transition: all 150ms ease-out;
}

html[data-color="mha"] .pill:hover{
  border-color: #00E5FF;
  box-shadow: 0 0 10px rgba(0, 229, 255, 0.3);
}

html[data-theme="light"][data-color="mha"] .pill{
  background: rgba(46, 125, 50, 0.1);
  border-color: rgba(46, 125, 50, 0.4);
  color: #2E7D32;
}

/* ===== PROGRESS BAR ===== */
html[data-color="mha"] .progress{
  background: linear-gradient(90deg, #2E7D32, #00E5FF);
  border-radius: 4px;
  box-shadow: 0 0 10px rgba(0, 229, 255, 0.4);
}

html[data-color="mha"] .progress-wrap{
  background: rgba(27, 40, 56, 0.5);
  border: 2px solid rgba(0, 229, 255, 0.3);
  border-radius: 6px;
}

/* ===== BUTTONS ===== */
/* Primary: Hero Green, heroic style */
html[data-color="mha"] .btn{
  background: linear-gradient(135deg, #2E7D32, #1B5E20);
  color: #FFFFFF;
  border: 2px solid #00E5FF;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-radius: 6px;
  transition: all 150ms ease-out;
  box-shadow: 
    0 2px 8px rgba(46, 125, 50, 0.3),
    0 0 10px rgba(0, 229, 255, 0.2);
}

html[data-color="mha"] .btn:hover{
  background: linear-gradient(135deg, #388E3C, #2E7D32);
  transform: translateY(-2px);
  box-shadow: 
    0 4px 16px rgba(46, 125, 50, 0.4),
    0 0 20px rgba(0, 229, 255, 0.3);
}

html[data-color="mha"] .btn:active{
  transform: translateY(0);
}

/* Icon buttons */
html[data-color="mha"] .icon-btn{
  border: 2px solid transparent;
  border-radius: 6px;
  transition: all 150ms ease-out;
}

html[data-color="mha"] .icon-btn:hover{
  background: rgba(0, 229, 255, 0.1);
  border-color: rgba(0, 229, 255, 0.4);
  transform: translateY(-2px);
  box-shadow: 0 0 10px rgba(0, 229, 255, 0.2);
}

/* ===== STATUS BADGES ===== */
html[data-color="mha"] .status--current{
  background: linear-gradient(135deg, #2E7D32, #1B5E20);
  color: #FFFFFF;
  border: none;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  border-radius: 4px;
  box-shadow: 0 0 10px rgba(46, 125, 50, 0.4);
}

html[data-color="mha"] .status--next{
  background: rgba(0, 229, 255, 0.15);
  color: #00E5FF;
  border: 2px solid rgba(0, 229, 255, 0.4);
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  border-radius: 4px;
}

html[data-color="mha"] .status--done{
  background: rgba(122, 143, 166, 0.15);
  color: #7A8FA6;
}

/* ===== CHIPS ===== */
html[data-color="mha"] .chip{
  border: 2px solid rgba(0, 229, 255, 0.3);
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  border-radius: 4px;
  background: rgba(27, 40, 56, 0.6);
  transition: all 150ms ease-out;
}

html[data-color="mha"] .chip[aria-pressed="true"]{
  background: rgba(46, 125, 50, 0.2);
  border-color: #2E7D32;
  color: #2E7D32;
  box-shadow: 0 0 10px rgba(46, 125, 50, 0.2);
}

html[data-color="mha"] .chip:hover{
  border-color: #00E5FF;
  color: #00E5FF;
  transform: translateY(-2px);
  box-shadow: 0 0 8px rgba(0, 229, 255, 0.2);
}

html[data-theme="light"][data-color="mha"] .chip{
  background: rgba(255, 255, 255, 0.8);
  border-color: rgba(46, 125, 50, 0.2);
}

/* ===== SCHEDULE TABLE ===== */
html[data-color="mha"] .schedule th{
  border-bottom: 3px solid #2E7D32;
  color: #00E5FF;
  font-family: 'Inter', sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: rgba(27, 40, 56, 0.6);
  text-shadow: 0 0 10px rgba(0, 229, 255, 0.3);
}

html[data-color="mha"] .schedule tr.active{
  background: linear-gradient(90deg, rgba(46, 125, 50, 0.25), rgba(0, 229, 255, 0.1), transparent);
  border-left: 4px solid #2E7D32;
  box-shadow: inset 0 0 20px rgba(0, 229, 255, 0.05);
}

html[data-color="mha"] .schedule td{
  border-bottom: 1px solid rgba(0, 229, 255, 0.1);
  font-family: 'JetBrains Mono', monospace;
}

html[data-color="mha"] .schedule tbody tr{
  background: rgba(27, 40, 56, 0.4);
  transition: all 150ms ease-out;
}

html[data-color="mha"] .schedule tbody tr:hover{
  background: rgba(0, 229, 255, 0.08);
}

html[data-theme="light"][data-color="mha"] .schedule th{
  color: #2E7D32;
  background: rgba(46, 125, 50, 0.05);
  text-shadow: none;
}

html[data-theme="light"][data-color="mha"] .schedule td{
  border-bottom-color: rgba(46, 125, 50, 0.1);
}

html[data-theme="light"][data-color="mha"] .schedule tbody tr{
  background: rgba(255, 255, 255, 0.6);
}

/* ===== DIALOGS/MODALS ===== */
html[data-color="mha"] dialog{
  border: 2px solid rgba(0, 229, 255, 0.4);
  border-radius: 8px;
  background: rgba(13, 27, 42, 0.95);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 
    0 16px 48px rgba(0, 0, 0, 0.4),
    0 0 30px rgba(0, 229, 255, 0.1);
}

html[data-theme="light"][data-color="mha"] dialog{
  background: rgba(232, 244, 248, 0.98);
  border-color: rgba(46, 125, 50, 0.3);
  box-shadow: 0 16px 48px rgba(13, 27, 42, 0.2);
}

html[data-color="mha"] dialog::backdrop{
  background: rgba(13, 27, 42, 0.9);
}

html[data-color="mha"] .modal-header{
  border-bottom: 2px solid rgba(0, 229, 255, 0.3);
}

html[data-color="mha"] .modal-header strong{
  font-family: 'Bebas Neue', sans-serif;
  font-weight: 400;
  color: #00E5FF;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-shadow: 0 0 10px rgba(0, 229, 255, 0.3);
}

html[data-theme="light"][data-color="mha"] .modal-header strong{
  color: #2E7D32;
  text-shadow: none;
}

/* ===== ONBOARDING ===== */
html[data-color="mha"] .onboard-title{
  font-family: 'Bebas Neue', sans-serif !important;
  font-weight: 400 !important;
  color: #00E5FF !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-shadow: 
    0 0 15px rgba(0, 229, 255, 0.5),
    0 0 30px rgba(0, 229, 255, 0.3);
}

html[data-color="mha"] .onboard-card{
  border: 2px solid rgba(0, 229, 255, 0.4);
  background: rgba(13, 27, 42, 0.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 
    0 16px 48px rgba(0, 0, 0, 0.35),
    0 0 30px rgba(0, 229, 255, 0.1);
  border-radius: 8px;
}

html[data-theme="light"][data-color="mha"] .onboard-card{
  background: rgba(232, 244, 248, 0.95);
  border-color: rgba(46, 125, 50, 0.3);
}

html[data-theme="light"][data-color="mha"] .onboard-title{
  color: #2E7D32 !important;
  text-shadow: none !important;
}

/* ===== INPUTS ===== */
html[data-color="mha"] input,
html[data-color="mha"] select,
html[data-color="mha"] textarea{
  border: 2px solid rgba(0, 229, 255, 0.3);
  border-radius: 6px;
  background: rgba(27, 40, 56, 0.8);
  color: #F0F8FF;
  font-family: 'Inter', sans-serif;
  transition: all 150ms ease-out;
}

html[data-color="mha"] input:focus,
html[data-color="mha"] select:focus,
html[data-color="mha"] textarea:focus{
  border-color: #00E5FF;
  outline: none;
  box-shadow: 
    0 0 0 2px rgba(0, 229, 255, 0.2),
    0 0 15px rgba(0, 229, 255, 0.15);
}

html[data-theme="light"][data-color="mha"] input,
html[data-theme="light"][data-color="mha"] select,
html[data-theme="light"][data-color="mha"] textarea{
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(46, 125, 50, 0.25);
  color: #0D1B2A;
}

html[data-theme="light"][data-color="mha"] input:focus,
html[data-theme="light"][data-color="mha"] select:focus,
html[data-theme="light"][data-color="mha"] textarea:focus{
  border-color: #2E7D32;
  box-shadow: 0 0 0 2px rgba(46, 125, 50, 0.15);
}

/* ===== TABS ===== */
html[data-color="mha"] .tabs{
  border-bottom: 2px solid rgba(0, 229, 255, 0.2);
}

html[data-color="mha"] .tab{
  color: #B0C4DE;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  transition: all 150ms ease-out;
}

html[data-color="mha"] .tab:hover{
  color: #00E5FF;
}

html[data-color="mha"] .tab[aria-selected="true"]{
  color: #00E5FF;
  border-bottom: 3px solid #2E7D32;
  text-shadow: 0 0 10px rgba(0, 229, 255, 0.3);
}

/* ===== QUICK ACTIONS ===== */
html[data-color="mha"] .quick-action{
  border: 2px solid rgba(0, 229, 255, 0.3);
  background: rgba(27, 40, 56, 0.6);
  color: #B0C4DE;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  border-radius: 6px;
  transition: all 150ms ease-out;
}

html[data-color="mha"] .quick-action:hover{
  background: rgba(0, 229, 255, 0.1);
  border-color: #00E5FF;
  color: #00E5FF;
  transform: translateY(-2px);
  box-shadow: 0 0 10px rgba(0, 229, 255, 0.2);
}

html[data-color="mha"] .quick-action.danger{
  border-color: rgba(230, 57, 70, 0.4);
  color: #E63946;
}

html[data-color="mha"] .quick-action.danger:hover{
  background: rgba(230, 57, 70, 0.1);
  border-color: #E63946;
  box-shadow: 0 0 10px rgba(230, 57, 70, 0.2);
}

/* ===== SCROLLBAR ===== */
html[data-color="mha"] ::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, #2E7D32, #1B5E20);
  border-radius: 4px;
}

html[data-color="mha"] ::-webkit-scrollbar-track{
  background: rgba(27, 40, 56, 0.5);
}

/* ===== KIOSK MODE ===== */
html[data-color="mha"] .kiosk-modal-content{
  border: 2px solid rgba(0, 229, 255, 0.4);
  background: rgba(13, 27, 42, 0.95);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius: 8px;
  box-shadow: 0 0 40px rgba(0, 229, 255, 0.15);
}

html[data-color="mha"] .kiosk-modal-title{
  font-family: 'Bebas Neue', sans-serif;
  font-weight: 400;
  color: #00E5FF;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-shadow: 0 0 15px rgba(0, 229, 255, 0.4);
}

html[data-color="mha"] .kiosk-key{
  background: rgba(27, 40, 56, 0.9);
  border: 2px solid rgba(0, 229, 255, 0.3);
  color: #F0F8FF;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
  border-radius: 8px;
  transition: all 150ms ease-out;
}

html[data-color="mha"] .kiosk-key:hover{
  background: linear-gradient(135deg, #2E7D32, #1B5E20);
  border-color: #00E5FF;
  color: #FFFFFF;
  transform: translateY(-2px);
  box-shadow: 0 0 15px rgba(0, 229, 255, 0.3);
}

html[data-color="mha"] .kiosk-pin-dot{
  background: rgba(0, 229, 255, 0.1);
  border: 2px solid rgba(0, 229, 255, 0.4);
  border-radius: 50%;
}

html[data-color="mha"] .kiosk-pin-dot.filled{
  background: #2E7D32;
  border-color: #00E5FF;
  box-shadow: 0 0 10px rgba(0, 229, 255, 0.5);
}

/* ===== EDITOR ===== */
html[data-color="mha"] .blocks-container{
  border: 2px dashed rgba(0, 229, 255, 0.3);
  background: rgba(27, 40, 56, 0.4);
  border-radius: 8px;
}

/* ===== DAY OVER MESSAGE ===== */
html[data-color="mha"] .dayover-message{
  border: 2px solid rgba(0, 229, 255, 0.4);
  background: rgba(13, 27, 42, 0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 8px;
  box-shadow: 0 0 30px rgba(0, 229, 255, 0.1);
}

/* ===== LINKS ===== */
html[data-color="mha"] a{
  color: #00E5FF;
  text-decoration: none;
  transition: all 150ms ease-out;
}

html[data-color="mha"] a:hover{
  color: #2E7D32;
  text-shadow: 0 0 8px rgba(0, 229, 255, 0.4);
}

html[data-theme="light"][data-color="mha"] a{
  color: #2E7D32;
}

html[data-theme="light"][data-color="mha"] a:hover{
  color: #1B5E20;
}

/* ===== HELP TEXT ===== */
html[data-color="mha"] .help{
  color: #7A8FA6;
}

/* ===== KBD ===== */
html[data-color="mha"] .kbd{
  background: rgba(27, 40, 56, 0.9);
  border: 2px solid rgba(0, 229, 255, 0.3);
  color: #00E5FF;
  font-family: 'JetBrains Mono', monospace;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* ===== SELECTION ===== */
html[data-color="mha"] ::selection{
  background: rgba(46, 125, 50, 0.4);
  color: #FFFFFF;
}

/* ===== MUTED TEXT COLORS ===== */
html[data-theme="dark"][data-color="mha"] .label{
  color: #00E5FF;
  font-size: 0.8em;
}

html[data-theme="dark"][data-color="mha"] .muted,
html[data-theme="dark"][data-color="mha"] #dateOut{
  color: #B0C4DE;
}

html[data-theme="dark"][data-color="mha"] #schoolState{
  color: #2E7D32;
  border-color: rgba(46, 125, 50, 0.4);
}

html[data-theme="light"][data-color="mha"] .label{
  color: #2E7D32;
}

html[data-theme="light"][data-color="mha"] .muted,
html[data-theme="light"][data-color="mha"] #dateOut{
  color: #4A6080;
}

/* ===== PLUS ULTRA GLOW ANIMATION ===== */
@keyframes mha-energy-pulse {
  0%, 100% {
    box-shadow: 
      0 4px 16px rgba(46, 125, 50, 0.2),
      0 0 20px rgba(0, 229, 255, 0.1);
  }
  50% {
    box-shadow: 
      0 4px 16px rgba(46, 125, 50, 0.3),
      0 0 30px rgba(0, 229, 255, 0.2);
  }
}

html[data-color="mha"] .themed-card{
  animation: mha-energy-pulse 3s ease-in-out infinite;
}