/*
 * EducTools Accessibility Contrast Layer v4.21.3
 * Loaded after the visual themes so text remains readable on dark/gradient surfaces.
 */
:root{
  --et-on-dark:#ffffff;
  --et-on-dark-soft:#f2edff;
  --et-on-dark-muted:#ded7f5;
  --et-focus-ring:#ffd85f;
}

/* Reusable opt-in surface for new components. */
[data-et-contrast="dark"]{
  color:var(--et-on-dark)!important;
}
[data-et-contrast="dark"] :is(h1,h2,h3,h4,h5,h6,strong,b){
  color:var(--et-on-dark)!important;
  -webkit-text-fill-color:var(--et-on-dark)!important;
}
[data-et-contrast="dark"] :is(p,small,.muted){
  color:var(--et-on-dark-soft)!important;
  -webkit-text-fill-color:var(--et-on-dark-soft)!important;
}
[data-et-contrast="dark"] a:focus-visible,
[data-et-contrast="dark"] button:focus-visible{
  outline-color:var(--et-focus-ring)!important;
}

/* Payment QR card: the Modern theme globally colors headings dark, so restore
   a high-contrast foreground on the purple payment surface. */
.theme-modern .payment-qr-display-card{
  color:var(--et-on-dark)!important;
}
.theme-modern .payment-qr-display-card :is(h1,h2,h3,h4,h5,h6,strong,b){
  color:var(--et-on-dark)!important;
  -webkit-text-fill-color:var(--et-on-dark)!important;
  text-shadow:0 1px 2px rgba(18,8,58,.24);
}
.theme-modern .payment-qr-display-card :is(p,small){
  color:var(--et-on-dark-soft)!important;
  -webkit-text-fill-color:var(--et-on-dark-soft)!important;
}
.theme-modern .payment-qr-display-card .payment-qr-kicker{
  color:#e7e1ff!important;
  -webkit-text-fill-color:#e7e1ff!important;
}
.theme-modern .payment-qr-display-card .payment-safe-badge{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:rgba(255,255,255,.17)!important;
  border-color:rgba(255,255,255,.34)!important;
}
.theme-modern .payment-qr-display-card .payment-qr-amount-pill span{
  color:#eee9ff!important;
  -webkit-text-fill-color:#eee9ff!important;
}
.theme-modern .payment-qr-display-card .payment-verification-note,
.theme-modern .payment-qr-display-card .payment-qr-empty-state p{
  color:#f5f1ff!important;
  -webkit-text-fill-color:#f5f1ff!important;
}

/* Other known dark promotional and AI surfaces. */
.theme-modern :is(.home-promotion-banner,.admin-ai-game-hero,.short-pro .sp-hero) :is(h1,h2,h3,h4,h5,h6,strong,b){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.theme-modern :is(.home-promotion-banner,.admin-ai-game-hero,.short-pro .sp-hero)>p,
.theme-modern :is(.home-promotion-banner,.admin-ai-game-hero,.short-pro .sp-hero) :is(.hero-copy,.hero-description){
  color:rgba(255,255,255,.88)!important;
  -webkit-text-fill-color:rgba(255,255,255,.88)!important;
}

/* Explicit foregrounds for gradient controls that previously relied on an
   inherited color. Do not target every button because some primary-looking
   controls intentionally use a white background. */
.theme-modern :is(.nav-cta,.header-signup,.modern-primary-button,.payment-submit-button,.auth-submit-button,.social-btn.facebook){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.theme-modern :is(.nav-cta,.header-signup,.modern-primary-button,.payment-submit-button,.auth-submit-button,.social-btn.facebook) :is(span,strong,small,i,svg){
  color:inherit!important;
  -webkit-text-fill-color:currentColor!important;
}

/* Dark-mode hero cards must not inherit a low-contrast purple heading. */
html[data-theme="dark"] .theme-modern :is(.studio-hero,.modern-home-hero,.home-v493-hero,.home-v495-hero) :is(h1,h2,h3,h4,h5,h6,strong,b){
  color:#f8f9ff!important;
  -webkit-text-fill-color:#f8f9ff!important;
}
html[data-theme="dark"] .theme-modern :is(.studio-hero,.modern-home-hero,.home-v493-hero,.home-v495-hero) p{
  color:#c3cada!important;
  -webkit-text-fill-color:#c3cada!important;
}

/* Ensure status/ribbon labels on saturated backgrounds stay readable. */
.theme-modern :is(.game-package-popular,.admin-visual-statuses .paused,.status-pill.on-dark){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}