/**
 * Classic-layout, oranje UI-tint vervangen door stadion-grasgroen.
 * Het logo blijft oranje — daar zit geen CSS-kleur op.
 *
 * THEME=classic in .env = originele oranje layout.
 */

body.theme-accent {
  --bg: #f4f7f4;
  --bg-soft: #fafcfb;
  --surface: #ffffff;
  --surface-warm: #eef6f0;
  --text: #1f2933;
  --muted: #5b6b60;
  --accent: #1f7a45;
  --accent-dark: #165c34;
  --accent-soft: #d8f0e1;
  --brand-orange: #3d9b5c;
  --brand-orange-deep: #1f7a45;
  --brand-orange-soft: #eef8f1;
  --brand-gray: #3d3d3d;
  --border: #d0e0d4;
  --shadow: 0 16px 40px rgba(31, 122, 69, 0.09);
  background:
    radial-gradient(circle at top left, rgba(31, 122, 69, 0.12), transparent 32rem),
    linear-gradient(180deg, var(--bg) 0%, #ffffff 52%, var(--bg-soft) 100%);
}

body.theme-accent .site-header {
  box-shadow: 0 8px 28px rgba(31, 122, 69, 0.07);
}

body.theme-accent .faq-toc,
body.theme-accent .faq-cta,
body.theme-accent .hero,
body.theme-accent .hero-pill,
body.theme-accent .hero-stat,
body.theme-accent .hero-next-match,
body.theme-accent .hero-checklist,
body.theme-accent .home-steps,
body.theme-accent .step-card,
body.theme-accent .cl-schedule-wait {
  border-color: #b5d4be;
}

body.theme-accent .faq-cta,
body.theme-accent .hero,
body.theme-accent .home-steps,
body.theme-accent .faq-page .faq-cta {
  box-shadow: 0 10px 24px rgba(31, 122, 69, 0.08);
}

body.theme-accent .faq-item[open] {
  box-shadow: 0 10px 24px rgba(31, 122, 69, 0.1);
}

body.theme-accent .hero {
  background:
    radial-gradient(circle at 92% 8%, rgba(31, 122, 69, 0.14), transparent 40%),
    linear-gradient(135deg, #ffffff 0%, var(--brand-orange-soft) 55%, #d8f0e1 100%);
  border-color: #b5d4be;
  box-shadow: 0 14px 36px rgba(31, 122, 69, 0.1);
}

body.theme-accent .hero-pill,
body.theme-accent .hero-stat {
  border-color: #b5d4be;
  box-shadow: 0 4px 12px rgba(31, 122, 69, 0.05);
}

body.theme-accent .hero-pill-icon {
  border-color: #8fbf9a;
}

body.theme-accent .hero-checklist li.is-todo .hero-check-icon {
  border-color: #8fbf9a;
}

body.theme-accent .home-steps {
  background:
    radial-gradient(circle at 0% 100%, rgba(31, 122, 69, 0.1), transparent 45%),
    linear-gradient(180deg, #ffffff 0%, var(--brand-orange-soft) 100%);
  border-color: #b5d4be;
}

body.theme-accent .step-card {
  border-color: #b5d4be;
  box-shadow: 0 8px 22px rgba(31, 122, 69, 0.08);
}

body.theme-accent .step-scores li {
  border-color: #8fbf9a;
}

body.theme-accent .faq-cta {
  background:
    radial-gradient(circle at 100% 0%, rgba(31, 122, 69, 0.12), transparent 55%),
    linear-gradient(180deg, #ffffff 0%, var(--brand-orange-soft) 100%);
  border-color: #b5d4be;
}

body.theme-accent .faq-toc {
  background: rgba(238, 248, 241, 0.75);
}

body.theme-accent .home-bonus-banner {
  background: linear-gradient(135deg, #eef8f1 0%, #d8f0e1 100%);
  border-color: #8fbf9a;
  box-shadow: 0 4px 16px rgba(31, 122, 69, 0.12);
}

body.theme-accent .home-bonus-banner-eyebrow {
  color: var(--accent-dark);
}

body.theme-accent .home-badges-banner {
  background:
    radial-gradient(circle at 90% 50%, rgba(31, 122, 69, 0.14), transparent 55%),
    linear-gradient(135deg, var(--brand-orange-soft) 0%, var(--surface) 100%);
  border-color: var(--accent-soft);
}

body.theme-accent .btn-primary {
  box-shadow: 0 8px 20px rgba(31, 122, 69, 0.24);
}

body.theme-accent input:focus,
body.theme-accent select:focus,
body.theme-accent textarea:focus {
  outline-color: rgba(31, 122, 69, 0.18);
}

body.theme-accent .data-table th {
  color: #14532d;
}

body.theme-accent .data-table tr:nth-child(even) td {
  background: #f3f8f4;
}

body.theme-accent .data-table th .th-sort--active {
  color: #1f7a45;
}

body.theme-accent .schedule-row--round-label,
body.theme-accent .schedule-round-label--above-day,
body.theme-accent .data-table.schedule-table tr.schedule-round-banner-row td.schedule-round-banner-cell {
  background: #8fbf9a;
  color: #14532d;
}

body.theme-accent .home-wk-countdown {
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(61, 155, 92, 0.22), transparent 70%),
    linear-gradient(165deg, #0a2e18 0%, #165c34 42%, #1f7a45 100%);
  border-color: #3d9b5c;
}

body.theme-accent .ranking-row--me {
  background: var(--brand-orange-soft);
}

body.theme-accent .standings-table tbody tr:nth-child(-n+2) td {
  background: rgba(238, 248, 241, 0.7);
}

body.theme-accent .cl-schedule-wait {
  border-color: #b5d4be;
}