/* =====================================================================
   Platform seasonal themes (homepage / catalog / account / legal)

   Four professional, culture-inspired identities that rotate quarterly:
     q1 Sakura Dawn   · spring · soft pink + indigo (cherry blossom)
     q2 Indigo Voyage · summer · deep indigo + teal (ai dye, discovery)
     q3 Harvest Gold  · autumn · gold + vermilion (calligraphy, scholarship)
     q4 Midnight Lantern · winter · slate + warm gold (lantern-lit study)

   Scope: ONLY platform pages + navbar/footer via body[data-platform-theme].
   Course pages (dashboard/lessons) are untouched, so each course keeps its
   own look once the learner is inside it.
   ===================================================================== */

/* ---- Shared: a soft, full-page ambient background for platform pages ---- */
body[data-platform-theme] {
  background:
    radial-gradient(1100px 520px at 12% -8%, var(--pt-glow-a), transparent 60%),
    radial-gradient(900px 480px at 105% 8%, var(--pt-glow-b), transparent 55%),
    var(--pt-bg);
  background-attachment: fixed;
}

/* Platform hero blocks pick up the seasonal gradient + a subtle motif. */
body[data-platform-theme] .catalog__title,
body[data-platform-theme] .course-hero,
body[data-platform-theme] .auth,
body[data-platform-theme] .page--legal .legal__title {
  position: relative;
}

/* The course landing hero gets a themed gradient panel. */
body[data-platform-theme] .course-hero {
  background: var(--pt-hero);
  border: 1px solid var(--pt-border);
  border-radius: var(--radius-lg);
  padding: 1.5rem 1.5rem 1.25rem;
  overflow: hidden;
}
body[data-platform-theme] .course-hero::after {
  content: var(--pt-motif);
  position: absolute; right: 0.75rem; top: 0.4rem;
  font-size: 3.2rem; line-height: 1; opacity: 0.12; pointer-events: none;
  font-family: var(--font-jp);
}

/* Themed accent on the catalog heading + a thin seasonal underline. */
body[data-platform-theme] .catalog__title {
  padding-bottom: 0.5rem;
}
body[data-platform-theme] .catalog__title::after {
  content: ''; display: block; width: 64px; height: 4px; margin-top: 0.5rem;
  border-radius: 999px; background: var(--pt-accent-grad);
}

/* Course cards adopt a subtle seasonal top accent + hover glow. */
body[data-platform-theme] .course-card { border-top: 3px solid var(--pt-accent); }
body[data-platform-theme] .course-card:hover { border-color: var(--pt-accent); box-shadow: 0 12px 28px var(--pt-shadow); }

/* Navbar brand + sign-in accent follow the season (chrome only). */
body[data-platform-theme] .navbar { border-bottom: 2px solid var(--pt-border); }
body[data-platform-theme] .navbar__signin { border-color: var(--pt-accent); color: var(--pt-accent); }
body[data-platform-theme] .navbar__signin:hover { background: var(--pt-accent); color: #fff; }

/* Primary buttons on platform pages take the seasonal accent. */
body[data-platform-theme] .page--catalog .btn--primary,
body[data-platform-theme] .page--course .btn--primary,
body[data-platform-theme] .page--account .btn--primary,
body[data-platform-theme] .page--legal .btn--primary {
  background: var(--pt-accent);
  border-color: var(--pt-accent);
}
body[data-platform-theme] .page--catalog .btn--primary:hover,
body[data-platform-theme] .page--course .btn--primary:hover,
body[data-platform-theme] .page--account .btn--primary:hover,
body[data-platform-theme] .page--legal .btn--primary:hover {
  filter: brightness(0.94);
}

/* A small seasonal label the platform can show if desired. */
body[data-platform-theme] .season-tag {
  display: inline-block; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--pt-accent);
}

/* ============================ Q1 · Sakura Dawn ============================ */
body[data-platform-theme="q1"] {
  --pt-bg: #fbf7f9;
  --pt-glow-a: rgba(247, 161, 196, 0.28);
  --pt-glow-b: rgba(67, 97, 238, 0.16);
  --pt-hero: linear-gradient(135deg, rgba(247,161,196,0.20), rgba(124,58,237,0.12));
  --pt-accent: #d6608f;
  --pt-accent-grad: linear-gradient(90deg, #f7a1c4, #7c3aed);
  --pt-border: rgba(214, 96, 143, 0.30);
  --pt-shadow: rgba(214, 96, 143, 0.20);
  --pt-motif: "\6625"; /* 春 spring */
}

/* ========================== Q2 · Indigo Voyage =========================== */
body[data-platform-theme="q2"] {
  --pt-bg: #f4f7fb;
  --pt-glow-a: rgba(67, 97, 238, 0.22);
  --pt-glow-b: rgba(42, 157, 143, 0.20);
  --pt-hero: linear-gradient(135deg, rgba(67,97,238,0.18), rgba(42,157,143,0.14));
  --pt-accent: #3949ab;
  --pt-accent-grad: linear-gradient(90deg, #4361ee, #2a9d8f);
  --pt-border: rgba(57, 73, 171, 0.28);
  --pt-shadow: rgba(57, 73, 171, 0.20);
  --pt-motif: "\6D77"; /* 海 sea / voyage */
}

/* ========================== Q3 · Harvest Gold ============================ */
body[data-platform-theme="q3"] {
  --pt-bg: #fbf8f2;
  --pt-glow-a: rgba(244, 185, 66, 0.26);
  --pt-glow-b: rgba(228, 87, 46, 0.16);
  --pt-hero: linear-gradient(135deg, rgba(244,185,66,0.22), rgba(228,87,46,0.12));
  --pt-accent: #c0791f;
  --pt-accent-grad: linear-gradient(90deg, #f4b942, #e4572e);
  --pt-border: rgba(192, 121, 31, 0.30);
  --pt-shadow: rgba(192, 121, 31, 0.20);
  --pt-motif: "\7A4B"; /* 秋 autumn */
}

/* ========================= Q4 · Midnight Lantern ========================= */
body[data-platform-theme="q4"] {
  --pt-bg: #f3f4f7;
  --pt-glow-a: rgba(244, 185, 66, 0.18);
  --pt-glow-b: rgba(31, 41, 55, 0.14);
  --pt-hero: linear-gradient(135deg, rgba(31,41,55,0.14), rgba(244,185,66,0.16));
  --pt-accent: #b8860b;
  --pt-accent-grad: linear-gradient(90deg, #1f2937, #f4b942);
  --pt-border: rgba(31, 41, 55, 0.24);
  --pt-shadow: rgba(31, 41, 55, 0.22);
  --pt-motif: "\51AC"; /* 冬 winter */
}

/* Dark mode: keep the seasonal accents but darken the ambient background so
   the platform still reads well when the learner prefers dark. */
body[data-theme="dark"][data-platform-theme] {
  --pt-bg: #12151b;
}
body[data-theme="dark"][data-platform-theme] .course-card { background: var(--card-bg); }

@media (prefers-reduced-motion: reduce) {
  body[data-platform-theme] { background-attachment: scroll; }
}