/*
 * Qué Tan Mexicano Eres — Seasonal Theme Layer
 * Loaded after mexican-kids-theme.css.
 * The Seasonal Theme Engine toggles html[data-qtmx-season="<theme>"].
 */

/* =========================================================
   HALLOWEEN — 2026
   Active: 2026-10-01 00:01 through 2026-10-31 23:59:59
   Time zone: America/Mexico_City
   ========================================================= */

html[data-qtmx-season="halloween"]{
  --mx-purple:#6a39a5;
  --mx-purple-dark:#29123d;
  --mx-purple-ink:#1b0d29;
  --mx-pink:#f47a1f;
  --mx-pink-dark:#c84e12;
  --mx-yellow:#f6c85f;
  --mx-yellow-dark:#d89a27;
  --mx-orange:#f47a1f;
  --mx-orange-dark:#c84e12;
  --mx-red:#f05c64;
  --mx-red-dark:#b93642;
  --mx-green:#a8d848;
  --mx-green-dark:#658d24;
  --mx-teal:#c5e86c;
  --mx-teal-dark:#7ba32d;
  --mx-sky:#e6f39b;
  --mx-cream:#f6e8d5;
  --mx-cream-2:#fff7e9;
  --mx-brown:#21122f;
  --mx-brown-soft:#533a61;
  --mx-shadow:0 14px 30px rgba(16,11,24,.24);
  --mx-shadow-soft:0 8px 18px rgba(16,11,24,.16);
}

html[data-qtmx-season="halloween"],
html[data-qtmx-season="halloween"] body{
  background:
    radial-gradient(circle at 14% 8%,rgba(244,122,31,.20),transparent 24%),
    radial-gradient(circle at 86% 12%,rgba(168,216,72,.10),transparent 26%),
    radial-gradient(circle at 50% 100%,rgba(106,57,165,.26),transparent 34%),
    linear-gradient(180deg,#100b18 0%,#21122f 50%,#3d1d5a 100%)!important;
  color:#21122f!important;
}

html[data-qtmx-season="halloween"] .app-shell,
html[data-qtmx-season="halloween"] .app,
html[data-qtmx-season="halloween"] .profile-app{
  background:
    radial-gradient(circle at 12% 13%,rgba(255,255,255,.34) 0 3px,transparent 4px),
    radial-gradient(circle at 86% 16%,rgba(244,122,31,.12),transparent 24%),
    radial-gradient(circle at 14% 82%,rgba(168,216,72,.10),transparent 27%),
    linear-gradient(180deg,#fff7e9 0%,#f6e8d5 52%,#ead6bf 100%)!important;
  box-shadow:0 28px 75px rgba(16,11,24,.42),inset 0 2px 0 rgba(255,255,255,.72)!important;
}

html[data-qtmx-season="halloween"] .app-shell:before,
html[data-qtmx-season="halloween"] .app:before,
html[data-qtmx-season="halloween"] .profile-app:before{
  opacity:.36!important;
  background:
    linear-gradient(90deg,rgba(41,18,61,.15) 0 7%,transparent 7% 93%,rgba(244,122,31,.11) 93% 100%),
    radial-gradient(ellipse at 8% 38%,rgba(244,122,31,.18),transparent 16%),
    radial-gradient(ellipse at 92% 33%,rgba(168,216,72,.14),transparent 17%),
    radial-gradient(ellipse at 8% 72%,rgba(106,57,165,.12),transparent 18%),
    radial-gradient(ellipse at 92% 70%,rgba(244,122,31,.12),transparent 18%)!important;
}

html[data-qtmx-season="halloween"] .papel{
  filter:drop-shadow(0 4px 8px rgba(16,11,24,.24))!important;
}
html[data-qtmx-season="halloween"] .papel span:nth-child(5n+1){background:#29123d!important}
html[data-qtmx-season="halloween"] .papel span:nth-child(5n+2){background:#6a39a5!important}
html[data-qtmx-season="halloween"] .papel span:nth-child(5n+3){background:#f47a1f!important}
html[data-qtmx-season="halloween"] .papel span:nth-child(5n+4){background:#a8d848!important}
html[data-qtmx-season="halloween"] .papel span:nth-child(5n){background:#f6c85f!important}

html[data-qtmx-season="halloween"] .app-shell:after,
html[data-qtmx-season="halloween"] .app:after,
html[data-qtmx-season="halloween"] .profile-app:after{
  opacity:.72!important;
  background:
    radial-gradient(circle at 14px 8px,#f47a1f 0 4px,#ffe1a8 4px 6px,transparent 7px) 0 0/46px 27px repeat-x!important;
  filter:drop-shadow(0 4px 7px rgba(244,122,31,.22))!important;
}

/* Typography */
html[data-qtmx-season="halloween"] .hero-title,
html[data-qtmx-season="halloween"] .question,
html[data-qtmx-season="halloween"] .result-title,
html[data-qtmx-season="halloween"] .login-card h2,
html[data-qtmx-season="halloween"] .content h1,
html[data-qtmx-season="halloween"] .brand-title,
html[data-qtmx-season="halloween"] .section-heading h2,
html[data-qtmx-season="halloween"] .state-card strong,
html[data-qtmx-season="halloween"] .hero-copy h1,
html[data-qtmx-season="halloween"] .title,
html[data-qtmx-season="halloween"] .done h2{
  color:#29123d!important;
  text-shadow:0 2px 0 rgba(255,255,255,.58)!important;
}
html[data-qtmx-season="halloween"] .hero-title span,
html[data-qtmx-season="halloween"] .result-kicker,
html[data-qtmx-season="halloween"] .eyebrow,
html[data-qtmx-season="halloween"] .section-kicker,
html[data-qtmx-season="halloween"] .kicker,
html[data-qtmx-season="halloween"] .username{
  color:#c84e12!important;
}
html[data-qtmx-season="halloween"] .hero-copy,
html[data-qtmx-season="halloween"] .footer-note,
html[data-qtmx-season="halloween"] .question-count,
html[data-qtmx-season="halloween"] .tip,
html[data-qtmx-season="halloween"] .credit,
html[data-qtmx-season="halloween"] .result-desc,
html[data-qtmx-season="halloween"] .seo-home,
html[data-qtmx-season="halloween"] .seo-home p,
html[data-qtmx-season="halloween"] .hobbies-copy,
html[data-qtmx-season="halloween"] .empty-copy,
html[data-qtmx-season="halloween"] .hero-copy p,
html[data-qtmx-season="halloween"] .sub,
html[data-qtmx-season="halloween"] .count,
html[data-qtmx-season="halloween"] .done p{
  color:#533a61!important;
}

/* Brand */
html[data-qtmx-season="halloween"] .brand-pill{
  background:linear-gradient(180deg,#f47a1f,#c84e12)!important;
  color:#fff!important;
  box-shadow:0 5px 0 #7e2c0a,0 10px 18px rgba(126,44,10,.18)!important;
}
html[data-qtmx-season="halloween"] .seal{
  background:radial-gradient(circle at 34% 28%,#fff7c7 0%,#f6c85f 54%,#f47a1f 100%)!important;
  box-shadow:0 7px 0 #c84e12,0 14px 24px rgba(200,78,18,.18)!important;
}

/* Cards and surfaces */
html[data-qtmx-season="halloween"] .level-card,
html[data-qtmx-season="halloween"] .country-card,
html[data-qtmx-season="halloween"] .question-card,
html[data-qtmx-season="halloween"] .map-card,
html[data-qtmx-season="halloween"] .login-card,
html[data-qtmx-season="halloween"] .seo-home,
html[data-qtmx-season="halloween"] .card,
html[data-qtmx-season="halloween"] .hero-card,
html[data-qtmx-season="halloween"] .stat,
html[data-qtmx-season="halloween"] .notice,
html[data-qtmx-season="halloween"] .qtmx-friend-panel,
html[data-qtmx-season="halloween"] .qtmx-friend-row,
html[data-qtmx-season="halloween"] .person{
  border-color:rgba(255,255,255,.88)!important;
}
html[data-qtmx-season="halloween"] .level-card,
html[data-qtmx-season="halloween"] .country-card,
html[data-qtmx-season="halloween"] .question-card,
html[data-qtmx-season="halloween"] .card,
html[data-qtmx-season="halloween"] .hero-card,
html[data-qtmx-season="halloween"] .person,
html[data-qtmx-season="halloween"] .qtmx-friend-row{
  background:linear-gradient(180deg,rgba(255,250,242,.96),rgba(246,232,213,.91))!important;
  box-shadow:0 5px 0 rgba(244,122,31,.25),0 12px 22px rgba(33,18,47,.11)!important;
}
html[data-qtmx-season="halloween"] .level-card:active,
html[data-qtmx-season="halloween"] .country-card:active{
  box-shadow:0 2px 0 rgba(244,122,31,.28),0 6px 11px rgba(33,18,47,.10)!important;
}
html[data-qtmx-season="halloween"] .level-card strong,
html[data-qtmx-season="halloween"] .country-card strong,
html[data-qtmx-season="halloween"] .person-copy strong,
html[data-qtmx-season="halloween"] .qtmx-friend-person strong{
  color:#29123d!important;
}

/* Game icons */
html[data-qtmx-season="halloween"] .level-card[data-level="easy"] .num{
  background:linear-gradient(180deg,#a8d848,#658d24)!important;
  box-shadow:0 4px 0 #48651a,0 8px 12px rgba(33,18,47,.12)!important;
}
html[data-qtmx-season="halloween"] .level-card[data-level="medium"] .num{
  background:linear-gradient(180deg,#f6c85f,#f47a1f)!important;
  box-shadow:0 4px 0 #c84e12,0 8px 12px rgba(33,18,47,.12)!important;
}
html[data-qtmx-season="halloween"] .level-card[data-level="hard"] .num,
html[data-qtmx-season="halloween"] .country-card .num,
html[data-qtmx-season="halloween"] .person-avatar,
html[data-qtmx-season="halloween"] .qtmx-friend-avatar,
html[data-qtmx-season="halloween"] .avatar-fallback{
  background:linear-gradient(180deg,#6a39a5,#29123d)!important;
  box-shadow:0 4px 0 #160a21,0 8px 12px rgba(33,18,47,.14)!important;
}

/* Answers */
html[data-qtmx-season="halloween"] .answer{
  background:linear-gradient(180deg,#fffaf2,#f6e8d5)!important;
  color:#29123d!important;
  box-shadow:0 4px 0 #d8bea1,0 8px 14px rgba(33,18,47,.08)!important;
}
html[data-qtmx-season="halloween"] .answer:active{
  box-shadow:0 2px 0 #d8bea1,0 5px 9px rgba(33,18,47,.08)!important;
}
html[data-qtmx-season="halloween"] .answer.correct{
  border-color:#a8d848!important;
  background:linear-gradient(180deg,#f8ffe9,#ddf3ad)!important;
  color:#314211!important;
  box-shadow:0 4px 0 #7ba32d,0 8px 14px rgba(73,101,22,.10)!important;
}
/* Wrong answers remain red for usability. */
html[data-qtmx-season="halloween"] .answer.wrong{
  border-color:#ef8d93!important;
  background:linear-gradient(180deg,#fff5f5,#ffdddd)!important;
  color:#9b2930!important;
}

/* Actions */
html[data-qtmx-season="halloween"] .next-btn,
html[data-qtmx-season="halloween"] .primary,
html[data-qtmx-season="halloween"] .login-submit,
html[data-qtmx-season="halloween"] .action.primary,
html[data-qtmx-season="halloween"] .small-btn.primary,
html[data-qtmx-season="halloween"] .next,
html[data-qtmx-season="halloween"] .accept,
html[data-qtmx-season="halloween"] .qtmx-friend-accept{
  background:linear-gradient(180deg,#f47a1f,#c84e12)!important;
  color:#fff!important;
  box-shadow:0 5px 0 #7e2c0a,0 10px 17px rgba(126,44,10,.18)!important;
}
html[data-qtmx-season="halloween"] .secondary,
html[data-qtmx-season="halloween"] .action.secondary,
html[data-qtmx-season="halloween"] .reject,
html[data-qtmx-season="halloween"] .qtmx-friend-reject{
  background:linear-gradient(180deg,#dff2a8,#a8d848)!important;
  color:#29123d!important;
  box-shadow:0 5px 0 #658d24,0 10px 17px rgba(73,101,22,.14)!important;
}
html[data-qtmx-season="halloween"] .next-btn:active,
html[data-qtmx-season="halloween"] .primary:active,
html[data-qtmx-season="halloween"] .secondary:active,
html[data-qtmx-season="halloween"] .login-submit:active,
html[data-qtmx-season="halloween"] .action:active,
html[data-qtmx-season="halloween"] .small-btn:active,
html[data-qtmx-season="halloween"] .next:active{
  box-shadow:0 2px 0 #29123d,0 5px 9px rgba(33,18,47,.11)!important;
}

/* Progress */
html[data-qtmx-season="halloween"] .progress,
html[data-qtmx-season="halloween"] .progress-track{
  background:rgba(106,57,165,.12)!important;
  border-color:rgba(255,255,255,.88)!important;
  box-shadow:inset 0 2px 5px rgba(33,18,47,.08)!important;
}
html[data-qtmx-season="halloween"] .progress>div,
html[data-qtmx-season="halloween"] .progress-fill{
  background:repeating-linear-gradient(-45deg,#f47a1f 0 13px,#f6c85f 13px 26px)!important;
  box-shadow:inset 0 -2px 0 rgba(126,44,10,.18)!important;
}

/* Home, map, user bar */
html[data-qtmx-season="halloween"] .seo-home,
html[data-qtmx-season="halloween"] .map-card,
html[data-qtmx-season="halloween"] .login-card,
html[data-qtmx-season="halloween"] .notice{
  background:linear-gradient(180deg,rgba(255,247,233,.97),rgba(246,232,213,.94))!important;
  box-shadow:0 10px 22px rgba(33,18,47,.12)!important;
}
html[data-qtmx-season="halloween"] .seo-home h2{color:#29123d!important}
html[data-qtmx-season="halloween"] .seo-home a,
html[data-qtmx-season="halloween"] .fallback a{
  background:linear-gradient(180deg,#fff7e9,#f1dbc3)!important;
  color:#29123d!important;
  box-shadow:0 3px 0 #d8bea1!important;
}
html[data-qtmx-season="halloween"] .progress-copy{
  background:linear-gradient(180deg,#6a39a5,#29123d)!important;
  box-shadow:0 5px 0 #160a21,0 12px 22px rgba(33,18,47,.20)!important;
}
html[data-qtmx-season="halloween"] .progress-copy span{color:#f6c85f!important}
html[data-qtmx-season="halloween"] .legend{color:#533a61!important}
html[data-qtmx-season="halloween"] .legend .done{background:#f47a1f!important}
html[data-qtmx-season="halloween"] .legend .pending{background:#dff2a8!important;border:1px solid #a8d848!important}
html[data-qtmx-season="halloween"] .fallback a.done{
  background:linear-gradient(180deg,#f47a1f,#c84e12)!important;
  color:#fff!important;
  box-shadow:0 3px 0 #7e2c0a!important;
}
html[data-qtmx-season="halloween"] .userbar{
  background:rgba(255,247,233,.91)!important;
  border-color:rgba(255,255,255,.90)!important;
  box-shadow:0 5px 0 rgba(244,122,31,.16),0 10px 18px rgba(33,18,47,.09)!important;
}
html[data-qtmx-season="halloween"] .userbar-name[data-profile-link]{
  color:#29123d!important;
  background:linear-gradient(180deg,#fffaf2,#f2dfca)!important;
  box-shadow:0 3px 0 #d8bea1,0 6px 10px rgba(33,18,47,.07)!important;
}
html[data-qtmx-season="halloween"] .userbar-points{color:#c84e12!important}
html[data-qtmx-season="halloween"] .qtmx-audio-toggle{
  background:linear-gradient(180deg,#6a39a5,#29123d)!important;
  box-shadow:0 4px 0 #160a21,0 8px 14px rgba(33,18,47,.22)!important;
}

/* Login */
html[data-qtmx-season="halloween"] .login-gate{
  background:
    radial-gradient(circle at 22% 10%,rgba(244,122,31,.20),transparent 28%),
    radial-gradient(circle at 78% 18%,rgba(168,216,72,.10),transparent 32%),
    linear-gradient(180deg,#100b18 0%,#21122f 44%,#3d1d5a 100%)!important;
}
html[data-qtmx-season="halloween"] .login-card{
  background:linear-gradient(180deg,rgba(255,247,233,.99),rgba(246,232,213,.97))!important;
  box-shadow:0 7px 0 rgba(244,122,31,.22),0 24px 48px rgba(16,11,24,.28)!important;
}
html[data-qtmx-season="halloween"] .login-fields input,
html[data-qtmx-season="halloween"] .hobbies-editor textarea{
  background:#fffaf2!important;
  box-shadow:inset 0 2px 5px rgba(33,18,47,.04),0 3px 0 #d8bea1!important;
}
html[data-qtmx-season="halloween"] .login-fields input:focus,
html[data-qtmx-season="halloween"] .hobbies-editor textarea:focus{
  border-color:#f47a1f!important;
  box-shadow:0 0 0 4px rgba(244,122,31,.12),0 3px 0 #d8bea1!important;
}

/* Profile */
html[data-qtmx-season="halloween"] .profile-app{
  background:
    radial-gradient(circle at 86% 14%,rgba(244,122,31,.14),transparent 24%),
    radial-gradient(circle at 12% 86%,rgba(168,216,72,.10),transparent 27%),
    linear-gradient(180deg,#fff7e9 0%,#f6e8d5 55%,#ead6bf 100%)!important;
}
html[data-qtmx-season="halloween"] .brand-title,
html[data-qtmx-season="halloween"] .hero-copy h1,
html[data-qtmx-season="halloween"] .section-heading h2,
html[data-qtmx-season="halloween"] .stat strong{
  color:#29123d!important;
}
html[data-qtmx-season="halloween"] .hero-card{
  background:linear-gradient(145deg,rgba(255,250,242,.97),rgba(246,232,213,.94))!important;
  box-shadow:0 5px 0 #d8bea1,0 15px 27px rgba(33,18,47,.11)!important;
}
html[data-qtmx-season="halloween"] .level-pill{
  background:linear-gradient(180deg,#6a39a5,#29123d)!important;
  box-shadow:0 3px 0 #160a21!important;
}
html[data-qtmx-season="halloween"] .stat{
  background:linear-gradient(180deg,#fffaf2,#f2dfca)!important;
  box-shadow:0 4px 0 rgba(244,122,31,.16),0 8px 14px rgba(33,18,47,.07)!important;
}
html[data-qtmx-season="halloween"] .stat:nth-child(1){background:linear-gradient(180deg,#fff8e8,#f6c85f)!important}
html[data-qtmx-season="halloween"] .stat:nth-child(2){background:linear-gradient(180deg,#fff2e4,#f4b67f)!important}
html[data-qtmx-season="halloween"] .stat:nth-child(3){background:linear-gradient(180deg,#f5edff,#cdb5e8)!important}
html[data-qtmx-season="halloween"] .stat:nth-child(4){background:linear-gradient(180deg,#f3fadf,#cfe98f)!important}
html[data-qtmx-season="halloween"] .count-badge,
html[data-qtmx-season="halloween"] .counter{
  background:linear-gradient(180deg,#f6c85f,#f47a1f)!important;
  color:#29123d!important;
  box-shadow:0 3px 0 #c84e12!important;
}
html[data-qtmx-season="halloween"] .mini-stats div{
  background:linear-gradient(180deg,#fffaf2,#f2dfca)!important;
  box-shadow:0 3px 0 #d8bea1!important;
}
html[data-qtmx-season="halloween"] .tag{
  background:linear-gradient(180deg,#eef8cb,#d5eca3)!important;
  color:#40581a!important;
}
html[data-qtmx-season="halloween"] .empty-tag{
  background:linear-gradient(180deg,#f5edff,#e3d6ef)!important;
  color:#533a61!important;
}
html[data-qtmx-season="halloween"] .profile-footer a{
  background:linear-gradient(180deg,#f47a1f,#c84e12)!important;
  box-shadow:0 4px 0 #7e2c0a,0 9px 15px rgba(126,44,10,.17)!important;
}

/* Keep motion respectful for users who request reduced motion. */
@media(prefers-reduced-motion:reduce){
  html[data-qtmx-season="halloween"] *,
  html[data-qtmx-season="halloween"] *:before,
  html[data-qtmx-season="halloween"] *:after{
    scroll-behavior:auto!important;
  }
}