/* ==========================================================================
   ACCADEMICA GLOBAL THEME
   Mirrors the Flutter AppColorsExtension used by the product.
   Loaded last on every Italian marketing page so the entire project shares
   the same light/dark visual language.
   ========================================================================== */

:root {
  color-scheme: light;

  /* Flutter light theme */
  --app-bkg-primary: #FFFFFF;
  --app-bkg-secondary: #F6F5F1;
  --app-bkg-dialog: #FFFFFF;
  --app-border-primary: #F3F3F7;
  --app-border-secondary: #DAD6C6;
  --app-card-primary: #FFFFFF;
  --app-card-secondary: #FAFAFA;
  --app-card-hover: #EBE8E8;
  --app-low-opacity-primary: #FFF1DE;
  --app-primary: #FF8928;
  --app-primary-rgb: 255, 137, 40;
  --app-dark-primary: #FFAC4B;
  --app-light-primary: #FFDEAF;
  --app-text-primary: #111828;
  --app-text-secondary: #2E2E2E;
  --app-text-muted: #ABABAB;
  --app-btn-primary: #FFD08B;
  --app-btn-on-primary: #111828;
  --app-btn-dark-dynamic: #EAE7D9;
  --app-dynamic-primary: #111828;
  --app-text-field-border: #F0F0F0;
  --app-text-field-fill: #FFFFFF;
  --app-hover-primary: #1E294D;
  --app-on-primary: #FFFFFF;
  --app-divider: #EBEBEB;
  --app-hint-text: #646284;
  --app-error: #FF8C84;
  --app-splash: rgba(241, 241, 244, .933);

  --theme-nav-bg: rgba(255, 255, 255, .92);
  --theme-panel-bg: rgba(255, 255, 255, .98);
  --theme-soft-panel: rgba(255, 241, 222, .55);
  --theme-shadow: 0 24px 70px rgba(17, 24, 40, .08);
  --theme-shadow-soft: 0 12px 34px rgba(17, 24, 40, .055);
  --theme-shadow-card: 0 8px 0 rgba(17, 24, 40, .025), 0 22px 55px rgba(17, 24, 40, .055);

  /* Compatibility aliases used by the existing marketing system */
  --mk-ink: var(--app-text-primary);
  --mk-ink-2: var(--app-text-primary);
  --mk-ink-soft: var(--app-text-secondary);
  --mk-muted: var(--app-text-muted);
  --mk-white: var(--app-card-primary);
  --mk-paper: var(--app-bkg-primary);
  --mk-page-soft: var(--app-card-secondary);
  --mk-surface: var(--app-card-secondary);
  --mk-surface-2: var(--app-bkg-secondary);
  --mk-line: var(--app-divider);
  --mk-line-strong: var(--app-border-secondary);
  --mk-primary: var(--app-primary);
  --mk-primary-dark: var(--app-primary);
  --mk-primary-deep: var(--app-hover-primary);
  --mk-primary-soft: var(--app-low-opacity-primary);
  --mk-primary-softer: color-mix(in srgb, var(--app-low-opacity-primary) 48%, var(--app-card-primary));
  --mk-blue: var(--app-primary);
  --mk-blue-dark: var(--app-primary);
  --mk-blue-soft: var(--app-low-opacity-primary);
  --mk-green: var(--app-primary);
  --mk-green-dark: var(--app-primary);
  --mk-green-soft: var(--app-low-opacity-primary);
  --mk-orange: var(--app-primary);
  --mk-orange-dark: var(--app-primary);
  --mk-orange-soft: var(--app-low-opacity-primary);
  --mk-yellow: var(--app-dark-primary);
  --mk-yellow-soft: var(--app-low-opacity-primary);
  --mk-pink: var(--app-primary);
  --mk-shadow: var(--theme-shadow);
  --mk-shadow-soft: var(--theme-shadow-soft);
  --mk-shadow-card: var(--theme-shadow-card);

  /* Blog aliases */
  --blog-ink: var(--app-text-primary);
  --blog-copy: var(--app-text-secondary);
  --blog-muted: var(--app-text-muted);
  --blog-primary: var(--app-primary);
  --blog-primary-dark: var(--app-primary);
  --blog-primary-soft: var(--app-low-opacity-primary);
  --blog-line: var(--app-divider);
  --blog-surface: var(--app-card-secondary);
  --blog-shadow: var(--theme-shadow-soft);

  /* Pricing aliases */
  --p-primary: var(--app-primary);
  --p-primary-dark: var(--app-primary);
  --p-primary-soft: var(--app-low-opacity-primary);
  --p-orange: var(--app-primary);
  --p-orange-soft: var(--app-low-opacity-primary);
  --p-green: var(--app-primary);
  --p-green-soft: var(--app-low-opacity-primary);
  --p-ink: var(--app-text-primary);
  --p-ink-soft: var(--app-text-secondary);
  --p-muted: var(--app-text-muted);
  --p-line: var(--app-divider);
  --p-surface: var(--app-card-primary);
  --p-cream: var(--app-bkg-secondary);
  --p-shadow: var(--theme-shadow);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --app-bkg-primary: #202022;
  --app-bkg-secondary: #171717;
  --app-bkg-dialog: #202022;
  --app-border-primary: #2D2D2D;
  --app-border-secondary: #212B43;
  --app-card-primary: #202022;
  --app-card-secondary: #171717;
  --app-card-hover: #EBE8E8;
  --app-low-opacity-primary: #1A1C23;
  --app-primary: #FF9C4A;
  --app-primary-rgb: 255, 156, 74;
  --app-dark-primary: #FFAC4B;
  --app-light-primary: #F0D0A0;
  --app-text-primary: #FFFFFF;
  --app-text-secondary: #EAEAEA;
  --app-text-muted: #B8BABF;
  --app-btn-primary: #FF9C4A;
  --app-btn-on-primary: #171717;
  --app-btn-dark-dynamic: #121624;
  --app-dynamic-primary: #FF8928;
  --app-text-field-border: #302F2F;
  --app-text-field-fill: #1B1B1E;
  --app-hover-primary: #1E294D;
  --app-on-primary: #FFFFFF;
  --app-divider: #3A3A3A;
  --app-hint-text: #6C6C6C;
  --app-error: #D03728;
  --app-splash: #171717;
  --theme-nav-bg: rgba(32, 32, 34, .92);
  --theme-panel-bg: rgba(32, 32, 34, .98);
  --theme-soft-panel: rgba(255, 156, 74, .07);
  --theme-shadow: 0 24px 70px rgba(0, 0, 0, .28);
  --theme-shadow-soft: 0 12px 34px rgba(0, 0, 0, .20);
  --theme-shadow-card: 0 8px 0 rgba(0,0,0,.08), 0 22px 55px rgba(0,0,0,.22);
}

/*
   Marketing pages intentionally default to the light Accademica theme.
   Dark mode is opt-in with <html data-theme="dark">.
   This avoids mixing dark text tokens with legacy light-only illustrations/cards
   when the operating system is set to dark mode.
*/

/* --------------------------------------------------------------------------
   Shared marketing surfaces
   -------------------------------------------------------------------------- */
html, body { background: var(--app-bkg-primary); color: var(--app-text-primary); }
body.marketing-page { background: var(--app-bkg-primary); color: var(--app-text-primary); }
body.marketing-page :focus-visible { outline-color: rgba(var(--app-primary-rgb), .34); }

.mk-nav {
  border-color: var(--app-border-primary);
  background: var(--theme-nav-bg);
  box-shadow: var(--theme-shadow-soft);
}
.mk-nav-link, .mk-nav-dropdown > summary { color: var(--app-text-secondary); }
.mk-nav-panel, .mk-mobile-menu {
  border-color: var(--app-divider);
  background: var(--theme-panel-bg);
  box-shadow: var(--theme-shadow);
}
.mk-nav-panel a:hover, .mk-mobile-menu a:hover { background: var(--app-card-secondary); }
.mk-nav-icon, .mk-card-icon { background: var(--app-low-opacity-primary) !important; color: var(--app-primary) !important; }
.mk-nav-cta, .mk-mobile-menu .mk-mobile-cta {
  background: var(--app-btn-primary);
  color: var(--app-btn-on-primary) !important;
  box-shadow: 0 10px 24px rgba(var(--app-primary-rgb), .16);
}
.mk-nav-cta:hover, .mk-mobile-menu .mk-mobile-cta:hover { background: var(--app-light-primary); }
.mk-menu-toggle { background: var(--app-low-opacity-primary); color: var(--app-primary); }

.mk-section--cream,
.mk-section--soft,
.mk-section--tools,
.mk-section--faq,
.mk-proof-strip,
.choice-guide-section { background: var(--app-bkg-secondary) !important; }
.mk-section--source {
  background: radial-gradient(circle at 85% 10%, rgba(var(--app-primary-rgb), .10), transparent 28%), var(--app-bkg-secondary) !important;
}

.mk-eyebrow, .mini-label, .section-index {
  border-color: color-mix(in srgb, var(--app-primary) 24%, transparent) !important;
  background: var(--app-low-opacity-primary) !important;
  color: var(--app-primary) !important;
}
.mk-eyebrow::before { background: var(--app-primary); box-shadow: 0 0 0 4px rgba(var(--app-primary-rgb), .11); }
.mk-hero h1 em, .mk-section-heading em, .pricing-hero h1 em { color: var(--app-primary) !important; }
.mk-lead, .mk-section-copy { color: var(--app-text-secondary); }

.mk-btn--dark, .mk-btn--orange {
  background: var(--app-btn-primary);
  color: var(--app-btn-on-primary) !important;
  box-shadow: 0 14px 30px rgba(var(--app-primary-rgb), .16);
}
.mk-btn--dark:hover, .mk-btn--orange:hover { background: var(--app-light-primary); }
.mk-btn--light, .mk-btn--secondary {
  border-color: var(--app-divider);
  background: var(--app-card-primary);
  color: var(--app-text-primary);
  box-shadow: var(--theme-shadow-soft);
}

.mk-card, .mk-media-card, .mk-dashboard, .mk-ui-panel, .mk-placeholder,
.mk-faq details, .mk-story-card, .mk-tool-card, .mk-audience-card {
  border-color: var(--app-divider) !important;
  background-color: var(--app-card-primary) !important;
  color: var(--app-text-primary);
  box-shadow: var(--theme-shadow-soft);
}
.mk-card p, .mk-media-card p, .mk-fineprint, .mk-floating-note, .mk-faq p { color: var(--app-text-secondary); }
.mk-card--dark, .mk-card--snap-feature {
  background: var(--app-hover-primary) !important;
  color: #FFFFFF !important;
}
.mk-card--dark p, .mk-card--snap-feature p { color: rgba(255,255,255,.78) !important; }

.mk-floating-note { border-color: var(--app-divider); background: var(--theme-panel-bg); box-shadow: var(--theme-shadow-soft); }
.mk-visual-frame {
  border-color: var(--app-divider) !important;
  background: radial-gradient(circle at 16% 12%, rgba(var(--app-primary-rgb), .11), transparent 34%), var(--app-card-secondary) !important;
  box-shadow: var(--theme-shadow);
}
.mk-bar-track, .mk-mini-track, .mk-progress-track, .mk-pass-mini-line, .mk-answer-bars i { background: var(--app-divider) !important; }
.mk-bar-fill, .mk-mini-track span, .mk-pass-mini-line span { background: var(--app-primary) !important; }

.mk-footer { border-color: var(--app-divider); background: var(--app-bkg-secondary) !important; }
.mk-footer, .mk-footer a { color: var(--app-text-secondary); }
.mk-footer-title, .mk-footer .mk-logo { color: var(--app-text-primary); }
.mk-cta-band {
  border-color: color-mix(in srgb, var(--app-primary) 20%, var(--app-divider)) !important;
  background: var(--app-low-opacity-primary) !important;
  color: var(--app-text-primary) !important;
}

/* Home 2.1: remove the old purple/blue visual system without flattening layout. */
.mk-hero::before, .mk-hero::after { opacity: .75; }
.mk-home-hero, .mk-hero { background-color: var(--app-bkg-primary); }
.mk-start-card, .mk-source-card, .mk-loop-card, .mk-tool-bento > *, .mk-pass-mini {
  border-color: var(--app-divider) !important;
  background-color: var(--app-card-primary) !important;
}
.mk-start-card.is-primary, .mk-start-card:hover, .mk-source-card:hover {
  border-color: color-mix(in srgb, var(--app-primary) 34%, var(--app-divider)) !important;
}
.mk-source-proof, .mk-trust-card, .mk-step-number, .mk-process-number { background: var(--app-low-opacity-primary) !important; }
.mk-final-cta {
  border-color: color-mix(in srgb, var(--app-primary) 20%, var(--app-divider)) !important;
  background: linear-gradient(135deg, var(--app-text-primary), color-mix(in srgb, var(--app-text-primary) 84%, var(--app-primary))) !important;
}
.mk-final-cta h2 em { color: var(--app-light-primary) !important; }

/* Blog */
body.blog-page, .blog-hero, .article { background: var(--app-bkg-primary) !important; color: var(--app-text-primary); }
.navbar { border-color: var(--app-border-primary) !important; background: var(--theme-nav-bg) !important; box-shadow: var(--theme-shadow-soft) !important; }
.nav-link { color: var(--app-text-secondary) !important; }
.nav-link:hover, .nav-link.active { background: var(--app-low-opacity-primary) !important; color: var(--app-primary) !important; }
.nav-cta, .mobile-cta { background: var(--app-btn-primary) !important; color: var(--app-btn-on-primary) !important; box-shadow: 0 10px 24px rgba(var(--app-primary-rgb), .16) !important; }
.mobile-menu { border-color: var(--app-divider) !important; background: var(--theme-panel-bg) !important; box-shadow: var(--theme-shadow) !important; }
.blog-listing { background: var(--app-bkg-secondary) !important; }
.b-card, .article__quote-badge { border-color: var(--app-divider) !important; background: var(--app-card-primary) !important; }
.b-card__img, .article__checklist { background: var(--app-card-secondary) !important; }
.article__quote, .footer-cta-section { border-color: color-mix(in srgb, var(--app-primary) 22%, var(--app-divider)) !important; background: var(--app-low-opacity-primary) !important; }
.reading-progress { background: var(--app-divider) !important; }
.reading-progress__bar { background: var(--app-primary) !important; }
footer > div { background: var(--app-bkg-secondary) !important; }

/* Form fields and transactional pages */
input, textarea, select {
  border-color: var(--app-text-field-border);
  background: var(--app-text-field-fill);
  color: var(--app-text-primary);
}
input::placeholder, textarea::placeholder { color: var(--app-hint-text); }

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) img:not([src*="logo"]) { opacity: .96; }
  html:not([data-theme="light"]) .mk-btn--light { box-shadow: none; }
  html:not([data-theme="light"]) .mk-final-cta { background: var(--app-bkg-secondary) !important; }
}