/**
 * Aurora Night — shared look for the learner pages (20261010).
 *
 * Library: accredify_create_product/aurora. Pages opt in by carrying the
 * class "acx-aurora" on their full-page root (/products, /my-products,
 * /practice-exam/{id}/sat/start|take|results, /results/details). Each
 * module's own css/aurora.css then restyles its components with the tokens
 * below. Everything is scoped under .acx-aurora, so nothing else changes.
 *
 * Look: deep night-sky background with soft indigo / sky / teal / violet
 * glows and a faint band of graduates with caps in the air across the top;
 * content sits on frosted, see-through "glass" panels with a light sheen.
 * Reading and Writing = sky blue, Math = indigo, your notes = gold,
 * correct / incorrect = green / red.
 */
.acx-aurora {
  /* Glass */
  --ax-glass: linear-gradient(135deg, rgba(255, 255, 255, .15), rgba(255, 255, 255, .04));
  --ax-glass-strong: linear-gradient(135deg, rgba(255, 255, 255, .20), rgba(255, 255, 255, .07));
  --ax-glass-border: rgba(255, 255, 255, .20);
  --ax-glass-shadow: 0 10px 40px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .30);
  --ax-blur: blur(20px) saturate(150%);
  --ax-radius: 18px;
  --ax-sheen: linear-gradient(115deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, 0) 72%, rgba(255, 255, 255, .06));
  /* Text */
  --ax-text: #ffffff;
  --ax-muted: rgba(255, 255, 255, .70);
  --ax-faint: rgba(255, 255, 255, .45);
  --ax-line: rgba(255, 255, 255, .10);
  --ax-line-strong: rgba(255, 255, 255, .20);
  --ax-link: #7dd3fc;
  /* Section colours */
  --ax-rw: #38bdf8;   --ax-rw-ink: #7dd3fc;   --ax-rw-tint: rgba(14, 165, 233, .14);  --ax-rw-head: linear-gradient(135deg, rgba(14, 165, 233, .55), rgba(14, 165, 233, .18));
  --ax-math: #818cf8; --ax-math-ink: #c7d2fe; --ax-math-tint: rgba(99, 102, 241, .16); --ax-math-head: linear-gradient(135deg, rgba(99, 102, 241, .60), rgba(99, 102, 241, .20));
  --ax-gold: #fbbf24; --ax-gold-ink: #fde68a; --ax-gold-tint: rgba(245, 158, 11, .12); --ax-gold-head: linear-gradient(135deg, rgba(245, 158, 11, .50), rgba(245, 158, 11, .18));
  --ax-green: #4ade80; --ax-green-ink: #bbf7d0; --ax-green-tint: rgba(34, 197, 94, .10); --ax-green-head: linear-gradient(135deg, rgba(34, 197, 94, .45), rgba(34, 197, 94, .15));
  --ax-red: #f87171;   --ax-red-ink: #fecaca;   --ax-red-tint: rgba(244, 63, 94, .10);  --ax-red-head: linear-gradient(135deg, rgba(244, 63, 94, .50), rgba(244, 63, 94, .15));
  --ax-amber: #fbbf24;
  --ax-pink-ink: #fbcfe8; --ax-pink-tint: rgba(236, 72, 153, .16);
  /* Accents */
  --ax-primary: linear-gradient(135deg, #0ea5e9, #6366f1);
  --ax-primary-glow: 0 6px 20px rgba(99, 102, 241, .45);
  --ax-gold-btn: linear-gradient(135deg, #f59e0b, #fbbf24);
  --ax-table-head: linear-gradient(90deg, rgba(99, 102, 241, .35), rgba(14, 165, 233, .25));
  --ax-title: linear-gradient(180deg, #ffffff, #c7e3ff);

  position: relative;
  color: var(--ax-text);
  /* The graduates band is the first background layer (fade baked into the
     SVG), so no pseudo-element or stacking context is needed and fixed
     overlays/modals inside the page still stack against the site header. */
  background:
    url(../images/aurora-graduates.svg) center top / 100% 560px no-repeat,
    radial-gradient(900px 700px at 8% 8%, rgba(79, 70, 229, .55), transparent 70%),
    radial-gradient(800px 600px at 92% 4%, rgba(14, 165, 233, .50), transparent 70%),
    radial-gradient(1000px 800px at 78% 55%, rgba(20, 184, 166, .26), transparent 70%),
    radial-gradient(900px 800px at 5% 80%, rgba(124, 58, 237, .40), transparent 70%),
    #0a1124 !important;
}

/* Reusable glass panel (modules may also apply the tokens to their own classes). */
.acx-aurora .ax-glass {
  position: relative;
  background: var(--ax-glass);
  -webkit-backdrop-filter: var(--ax-blur); backdrop-filter: var(--ax-blur);
  border: 1px solid var(--ax-glass-border);
  border-radius: var(--ax-radius);
  box-shadow: var(--ax-glass-shadow);
  color: var(--ax-text);
}

/* Browsers without backdrop-filter: a solid, still readable panel. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .acx-aurora { --ax-glass: rgba(22, 30, 60, .92); --ax-glass-strong: rgba(28, 38, 72, .94); }
}
/* Visitors who ask for less transparency get solid panels too. */
@media (prefers-reduced-transparency: reduce) {
  .acx-aurora { --ax-glass: rgba(22, 30, 60, .96); --ax-glass-strong: rgba(28, 38, 72, .97); --ax-blur: none; }
}
@media (max-width: 768px) {
  .acx-aurora { background-size: 100% 380px, auto, auto, auto, auto !important; }
}

/* KaTeX maths follows the surrounding text colour on every Aurora page
   (several module stylesheets paint all descendants black) (20261010). */
.acx-aurora .katex,
.acx-aurora .katex * { color: inherit !important; }