/* ============================================================
   COURSE LANDING  —  accent unification
   The shared landing template (templates/courses/landing.html) is
   {{ course.color }}-driven (coral for solo-builder, etc.). The relaunch
   uses one studio indigo accent site-wide, so this re-points every
   per-course memphis accent utility to var(--accent). Scoped to
   .course-landing; the .lw-* grammar swaps live in the template.
   ============================================================ */

.course-landing :is(
  .text-memphis-coral, .text-memphis-teal, .text-memphis-pink,
  .text-memphis-purple, .text-memphis-yellow) { color: var(--accent); }

.course-landing :is(
  .border-memphis-coral, .border-memphis-teal, .border-memphis-pink,
  .border-memphis-purple, .border-memphis-yellow) {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
}

/* Solid accent fills (checkmark / number circles / fallback avatars) */
.course-landing :is(
  .bg-memphis-coral, .bg-memphis-teal, .bg-memphis-pink,
  .bg-memphis-purple, .bg-memphis-yellow) { background-color: var(--accent); color: #fff; }

/* Faint section-background tints → a clean studio band */
.course-landing :is(
  .bg-memphis-coral\/5, .bg-memphis-teal\/5, .bg-memphis-pink\/5,
  .bg-memphis-purple\/5, .bg-memphis-yellow\/5) { background-color: var(--surface-2); }

.course-landing :is(
  .bg-memphis-coral\/10, .bg-memphis-teal\/10, .bg-memphis-pink\/10,
  .bg-memphis-purple\/10, .bg-memphis-yellow\/10) {
  background-color: color-mix(in srgb, var(--accent) 10%, transparent);
}

.course-landing :is(
  .bg-memphis-coral\/20, .bg-memphis-teal\/20, .bg-memphis-pink\/20,
  .bg-memphis-purple\/20, .bg-memphis-yellow\/20) {
  background-color: color-mix(in srgb, var(--accent) 16%, transparent);
}

/* Gradient placeholder (no-thumbnail courses) */
.course-landing :is(
  .from-memphis-coral\/30, .from-memphis-teal\/30, .from-memphis-pink\/30,
  .from-memphis-purple\/30, .from-memphis-yellow\/30) {
  --tw-gradient-from: color-mix(in srgb, var(--accent) 30%, transparent) var(--tw-gradient-from-position);
}
.course-landing :is(
  .to-memphis-coral\/10, .to-memphis-teal\/10, .to-memphis-pink\/10,
  .to-memphis-purple\/10, .to-memphis-yellow\/10) {
  --tw-gradient-to: color-mix(in srgb, var(--accent) 10%, transparent) var(--tw-gradient-to-position);
}