/* Centralized published appearance layer. Layout and application hooks stay untouched. */
:root[data-theme-ready="true"] {
  color-scheme: light;
  --primary: var(--primary-color);
  --primary-dark: var(--primary-dark-color);
  --secondary: var(--secondary-color);
  --accent: var(--accent-color);
  --background: var(--background-color);
  --surface: var(--surface-color);
  --text: var(--text-color);
  --text-light: color-mix(in srgb, var(--text-color) 72%, transparent);
  --border: color-mix(in srgb, var(--text-color) 18%, transparent);
}

:root[data-theme-mode="dark"] {
  color-scheme: dark;
}

:root[data-theme-ready="true"] body {
  background-color: var(--background-color) !important;
  color: var(--text-color) !important;
  font-family: var(--font-family) !important;
  font-size: var(--base-font-size);
  min-height: 100vh;
}

:root[data-theme-ready="true"] body::before {
  content: "";
  inset: 0;
  pointer-events: none;
  position: fixed;
  z-index: -2;
}

:root[data-background-pattern="dots"] body::before {
  background-image: radial-gradient(color-mix(in srgb, var(--primary-color) 20%, transparent) 1px, transparent 1px);
  background-size: 22px 22px;
}

:root[data-background-pattern="grid"] body::before {
  background-image: linear-gradient(color-mix(in srgb, var(--primary-color) 12%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--primary-color) 12%, transparent) 1px, transparent 1px);
  background-size: 30px 30px;
}

:root[data-background-pattern="waves"] body::before {
  background: radial-gradient(ellipse at 10% 0%, color-mix(in srgb, var(--primary-color) 16%, transparent), transparent 45%), radial-gradient(ellipse at 90% 50%, color-mix(in srgb, var(--secondary-color) 13%, transparent), transparent 44%);
}

:root[data-theme-ready="true"] body::after {
  background-image: var(--theme-page-image);
  background-position: right 5% center;
  background-repeat: no-repeat;
  background-size: min(42vw, 620px) auto;
  content: "";
  inset: 0;
  opacity: .08;
  pointer-events: none;
  position: fixed;
  z-index: -1;
}

:root[data-theme-ready="true"] :is(h1,h2,h3,h4,h5,h6,.section-title) { color: var(--heading-color) !important; }
:root[data-theme-ready="true"] .settings-header :is(h1,h2,h3,p), :root[data-theme-ready="true"] .navbar :is(h1,h2,h3,p) { color: #fff !important; }
:root[data-theme-ready="true"] :is(p,label,li,td,th,.subtitle,.description) { color: inherit; }
:root[data-theme-ready="true"] a { color: var(--primary-color); }

:root[data-theme-ready="true"] :is(.card,.access-card,.feature-card,.learning-message-card,.learning-action-card,.testimonial-card,.lesson-card,.profile-card,.summary-card,.settings-panel,.auth-card,.login-card,.register-card,.panel,.dashboard-card,.stat-box) {
  background: var(--surface-color) !important;
  border-color: color-mix(in srgb, var(--text-color) 16%, transparent) !important;
  border-radius: var(--border-radius) !important;
  box-shadow: var(--card-shadow) !important;
  color: var(--text-color) !important;
}

:root[data-card-style="flat"] :is(.card,.access-card,.feature-card,.learning-action-card,.lesson-card,.settings-panel,.auth-card,.panel) { box-shadow: none !important; }
:root[data-card-style="bordered"] :is(.card,.access-card,.feature-card,.learning-action-card,.lesson-card,.settings-panel,.auth-card,.panel) { border: 2px solid color-mix(in srgb, var(--primary-color) 38%, transparent) !important; box-shadow: none !important; }
:root[data-card-style="glass"] :is(.card,.access-card,.feature-card,.learning-action-card,.lesson-card,.settings-panel,.auth-card,.panel) { backdrop-filter: blur(15px); background: color-mix(in srgb, var(--surface-color) 82%, transparent) !important; }

:root[data-theme-ready="true"] :is(button,.btn,.dashboard-button,input[type="button"],input[type="submit"]) {
  border-radius: var(--button-radius) !important;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
:root[data-theme-ready="true"] :is(button,.btn,.dashboard-button,input[type="submit"]):not(.btn-danger,.danger,.btn-warning,.btn-success,.btn-secondary,.btn-outline) {
  background: var(--theme-button-color) !important;
  border-color: color-mix(in srgb, var(--theme-button-color) 72%, #000) !important;
  color: #fff !important;
}
:root[data-button-style="gradient"] :is(button,.btn,.dashboard-button,input[type="submit"]):not(.btn-danger,.danger,.btn-warning,.btn-success,.btn-secondary,.btn-outline) { background: linear-gradient(135deg,var(--theme-button-color),var(--secondary-color)) !important; }
:root[data-button-style="outline"] :is(button,.btn,.dashboard-button,input[type="submit"]):not(.btn-danger,.danger,.btn-warning,.btn-success,.btn-secondary) { background: transparent !important; border: 2px solid var(--primary-color) !important; color: var(--primary-color) !important; }
:root[data-button-style="soft"] :is(button,.btn,.dashboard-button,input[type="submit"]):not(.btn-danger,.danger,.btn-warning,.btn-success,.btn-secondary) { background: color-mix(in srgb,var(--primary-color) 16%,var(--surface-color)) !important; color: var(--primary-color) !important; }
:root[data-theme-ready="true"] :is(button,.btn,.dashboard-button):hover { filter: brightness(1.08); transform: translateY(-1px); }
:root[data-theme-ready="true"] :is(button,.btn,.dashboard-button,a,input,select,textarea):focus-visible { outline: 3px solid color-mix(in srgb,var(--accent-color) 70%,transparent) !important; outline-offset: 3px; }

:root[data-theme-ready="true"] :is(input,select,textarea) {
  background: var(--surface-color) !important;
  border-color: color-mix(in srgb,var(--text-color) 22%,transparent) !important;
  border-radius: calc(var(--border-radius) * .6) !important;
  color: var(--text-color) !important;
}
:root[data-theme-ready="true"] table { background: var(--surface-color); color: var(--text-color); }
:root[data-theme-ready="true"] thead th { background: color-mix(in srgb,var(--primary-color) 88%,#000) !important; color: #fff !important; position: sticky; top: 0; z-index: 2; }

:root[data-theme-ready="true"] :is(.navbar,.topbar,.dashboard-header,.admin-header,header.page-header) { border-color: color-mix(in srgb,var(--primary-color) 25%,transparent) !important; }
:root[data-navigation-style="solid"] :is(.navbar,.topbar) { background: var(--primary-color) !important; color: #fff !important; }
:root[data-navigation-style="solid"] :is(.navbar,.topbar) a { color: #fff !important; }
:root[data-navigation-style="transparent"] :is(.navbar,.topbar) { background: transparent !important; }
:root[data-navigation-style="glass"] :is(.navbar,.topbar) { backdrop-filter: blur(16px); background: color-mix(in srgb,var(--surface-color) 78%,transparent) !important; }
:root[data-navigation-style="gradient"] :is(.navbar,.topbar) { background: linear-gradient(135deg,var(--primary-color),var(--secondary-color)) !important; color: #fff !important; }
:root[data-navigation-style="gradient"] :is(.navbar,.topbar) a { color: #fff !important; }

:root[data-theme-ready="true"] .hero { background: linear-gradient(135deg,color-mix(in srgb,var(--primary-color) 18%,var(--background-color)),color-mix(in srgb,var(--secondary-color) 15%,var(--background-color))) !important; }
:root[data-theme-ready="true"] .hero::after { background: rgba(15,23,42,var(--hero-overlay)) !important; pointer-events: none; }
:root[data-page-group="homepage"] :is(.about,.testimonials,.paid-lessons-showcase) { background-color: var(--theme-section-background) !important; }
:root[data-page-group="homepage"] .access-section { background-color: var(--theme-access-background) !important; }
:root[data-page-group="homepage"] .features { background-color: var(--theme-features-background) !important; }
:root[data-page-group="homepage"] .learning-opportunities { background-color: var(--theme-learning-background) !important; }
:root[data-home-grade-card-style="flat"] .grade-access-grid .btn { box-shadow:none !important; }
:root[data-home-grade-card-style="bordered"] .grade-access-grid .btn { background:transparent !important;border:2px solid var(--primary-color) !important;color:var(--primary-color) !important;box-shadow:none !important; }
:root[data-home-grade-card-style="glass"] .grade-access-grid .btn { backdrop-filter:blur(12px);background:color-mix(in srgb,var(--surface-color) 74%,transparent) !important;color:var(--primary-color) !important; }
:root[data-home-login-card-style="flat"] .access-card { box-shadow:none !important; }
:root[data-home-login-card-style="bordered"] .access-card { border:2px solid color-mix(in srgb,var(--primary-color) 42%,transparent) !important;box-shadow:none !important; }
:root[data-home-login-card-style="glass"] .access-card { backdrop-filter:blur(14px);background:color-mix(in srgb,var(--surface-color) 78%,transparent) !important; }

:root[data-theme-ready="true"] footer { color: var(--text-color); }
:root[data-footer-style="dark"] footer { background: #0f172a !important; color: #e2e8f0 !important; }
:root[data-footer-style="dark"] footer :is(h1,h2,h3,h4,a,p,li) { color: inherit !important; }
:root[data-footer-style="light"] footer { background: var(--surface-color) !important; color: var(--text-color) !important; }
:root[data-footer-style="gradient"] footer { background: linear-gradient(135deg,var(--primary-color),color-mix(in srgb,var(--primary-color) 55%,#000)) !important; color: #fff !important; }
:root[data-footer-style="minimal"] footer { background: transparent !important; border-top: 1px solid color-mix(in srgb,var(--text-color) 18%,transparent); }

.theme-main-logo { display: block; height: 46px; max-width: 210px; object-fit: contain; width: auto; }
.theme-footer-logo { display: block; margin-bottom: 12px; max-height: 64px; max-width: 190px; object-fit: contain; }
.theme-grade-image { border-radius: var(--border-radius); display: block; margin: 18px auto 0; max-height: 210px; max-width: min(100%,360px); object-fit: contain; }
.hero-image img[data-theme-controlled="true"] { aspect-ratio: 5/6; border-radius: calc(var(--border-radius) * 1.4); height: clamp(390px,52vw,620px); max-width: 100%; object-fit: cover; object-position: center; width: min(100%,520px); }
.theme-auth-logo { position:relative;z-index:2;display:block;width:84px;height:84px;margin-bottom:24px;border:3px solid rgba(255,255,255,.24);border-radius:22px;object-fit:cover;box-shadow:0 14px 28px rgba(15,23,42,.22); }
.theme-auth-illustration { position:absolute;right:-4%;bottom:-5%;z-index:0;width:min(62%,520px);max-height:62%;object-fit:contain;object-position:right bottom;opacity:.2;pointer-events:none;filter:drop-shadow(0 18px 24px rgba(15,23,42,.2)); }
:is(.login-brand,.register-brand)>:not(.theme-auth-illustration){position:relative;z-index:1}
.theme-auth-host{position:relative;overflow:hidden}
.theme-auth-compact>:not(.theme-auth-illustration){position:relative;z-index:1}
.theme-auth-compact .theme-auth-logo{width:72px;height:72px;margin:0 auto 20px;border-color:#dbeafe;border-radius:19px}
.theme-auth-compact .theme-auth-illustration{right:-15%;bottom:-12%;width:70%;max-height:70%;opacity:.07}
.theme-teacher-avatar { border:3px solid color-mix(in srgb,var(--surface-color) 75%,transparent);border-radius:50%;box-shadow:var(--card-shadow);height:72px;object-fit:cover;width:72px; }
:root[data-has-student-avatar="true"] .profile-avatar { background-image:var(--theme-student-avatar) !important;background-position:center;background-size:cover !important;color:transparent !important; }

@media (max-width: 640px) {
  :root[data-theme-ready="true"] body { font-size: max(14px,calc(var(--base-font-size) - 1px)); }
  :root[data-theme-ready="true"] body::after { background-position: center 90%; background-size: 82vw auto; opacity: .05; }
  .theme-main-logo { height: 38px; max-width: 160px; }
  .theme-auth-logo { width:64px;height:64px;margin-bottom:16px;border-radius:18px; }
  .theme-auth-illustration { width:48%;max-height:88%;opacity:.15; }
}

@media (prefers-reduced-motion: reduce) {
  :root[data-theme-ready="true"] *, :root[data-theme-ready="true"] *::before, :root[data-theme-ready="true"] *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}