/**
 * WK 2026 – Speelmodus-cards: één TOTO-groen, leesbare inhoud (NL + BE).
 * Overschrijft premium dark-card tekst uit poule-controls.css.
 */

body.wk-poule-page.wk-land-national {
    --wk-toto-green-grad: linear-gradient(180deg, #22c55e 0%, #16a34a 52%, #15803d 100%);
    --wk-toto-green-line: #16a34a;
    --wk-toto-green-line-dark: #15803d;
    --wk-toto-green-surface: linear-gradient(180deg, #ffffff 0%, #ecfdf5 55%, #f0fdf4 100%);
    --wk-toto-green-tint: #ecfdf5;
    --wk-toto-green-soft: #e8eef3;
    --wk-card-unified-border: var(--wk-toto-green-line-dark);
    --wk-card-unified-bg: var(--wk-toto-green-surface);
    --wk-card-unified-shadow: 0 2px 0 #d1fae5, 0 10px 24px rgba(21, 128, 61, 0.08);
}

/* Sectie-wrapper */
body.wk-poule-page.wk-land-national .wk-play-modes--pro {
    background: #fff !important;
    border: 2px solid #e2e8f0 !important;
    border-top: 3px solid var(--wk-toto-green-line) !important;
    border-radius: 14px !important;
    box-shadow: var(--wk-card-unified-shadow) !important;
    padding: 1.2rem 1rem 1.3rem !important;
}

body.wk-poule-page.wk-land-national .wk-play-modes--pro .wk-play-modes-head p:not(.wk-play-modes-deck-kicker) {
    max-width: 36rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    color: #334155 !important;
}

body.wk-poule-page.wk-land-national .wk-play-modes-grid--4 {
    gap: 0.85rem !important;
}

/* —— NL: vier lichte groen-getinte kaarten (BE: play-modes-be-unified.css) —— */
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--solo,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--gezin,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--gezin.wk-play-mode-card--premium,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--school,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--school.wk-play-mode-card--premium,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--werk,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--werk.wk-play-mode-card--premium {
    border: 3px solid var(--wk-toto-green-line) !important;
    background: var(--wk-card-unified-bg) !important;
    box-shadow: var(--wk-card-unified-shadow) !important;
    border-radius: 12px !important;
    padding: 1rem 0.95rem 0.95rem !important;
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card::before,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--premium::before {
    display: none !important;
    content: none !important;
}

/* Typografie in cards — NL licht vlak */
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card > h3,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--premium > h3 {
    color: #0f172a !important;
    text-shadow: none !important;
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card .wk-play-mode-lead,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--premium .wk-play-mode-lead {
    color: #334155 !important;
    text-shadow: none !important;
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card .wk-play-mode-lead strong,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--premium .wk-play-mode-lead strong {
    color: #0f172a !important;
    font-weight: 700 !important;
    text-shadow: none !important;
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card .wk-play-mode-list--checks li,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--premium .wk-play-mode-list--checks li {
    color: #1e293b !important;
    text-shadow: none !important;
}

/* Kaartkop: ⚽ gecentreerd bovenaan (uniform voor solo, gezin, school, werk) */
body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 3rem !important;
    height: 3rem !important;
    margin: 0 auto 0.45rem !important;
    padding: 0 !important;
    font-size: 1.45rem !important;
    line-height: 1 !important;
    border-radius: 50% !important;
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card .wk-play-mode-icon {
    background: #fff !important;
    border: 2px solid var(--wk-toto-green-soft) !important;
    box-shadow:
        0 2px 8px rgba(21, 128, 61, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin: 0 0 0.75rem;
    padding: 0 0 0.7rem;
    text-align: center;
    border-bottom: 1px solid var(--wk-toto-green-soft);
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card__head .wk-play-mode-eyebrow {
    margin: 0 0 0.25rem !important;
    font-size: 0.65rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    color: #64748b !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card__head > h2,
body.wk-poule-page.wk-land-national .wk-play-mode-card__head > h3 {
    margin: 0 !important;
    width: 100%;
    text-align: center !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card__head > h2,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card__head > h3 {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
}

/* Geen dubbele bal naast de titel (poule.css ::before) */
body.wk-poule-page.wk-land-national .wk-play-mode-card > h3::before,
body.wk-poule-page.wk-land-national .wk-play-mode-card > h2::before,
body.wk-poule-page.wk-land-national .wk-play-mode-card__head > h3::before,
body.wk-poule-page.wk-land-national .wk-play-mode-card__head > h2::before {
    content: none !important;
    display: none !important;
    margin: 0 !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    text-align: left !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-cta {
    margin-top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card--solo .wk-play-mode-tag {
    align-self: center;
    text-align: center;
}

/* Iconen & tags */

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card .wk-play-mode-tag,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--premium .wk-play-mode-tag {
    background: var(--wk-toto-green-tint) !important;
    border: 1px solid var(--wk-toto-green-soft) !important;
    color: #14532d !important;
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card .wk-play-mode-tag strong,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--premium .wk-play-mode-tag strong {
    color: #14532d !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-eyebrow {
    color: #64748b !important;
}

/* Checklijst */
body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-list--checks li::before,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-list--checks li::before {
    background: var(--wk-toto-green-grad) !important;
    color: #fff !important;
    box-shadow: none !important;
}

/* Demo-blokken */
body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-demo-board,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-demo-board,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--gezin.wk-play-mode-card--premium .wk-play-mode-demo-board,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--school.wk-play-mode-card--premium .wk-play-mode-demo-board,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--werk.wk-play-mode-card--premium .wk-play-mode-demo-board {
    background: #fff !important;
    border: 1px solid var(--wk-toto-green-soft) !important;
    border-radius: 8px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-demo-label,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-demo-label,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--gezin.wk-play-mode-card--premium .wk-play-mode-demo-label {
    color: #166534 !important;
    font-weight: 700 !important;
    text-shadow: none !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-demo-row,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-demo-row,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--gezin.wk-play-mode-card--premium .wk-play-mode-demo-row {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    color: #1e293b !important;
    text-shadow: none !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-demo-row .wk-demo-name,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-demo-name,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-demo-row .wk-demo-name,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--gezin.wk-play-mode-card--premium .wk-play-mode-demo-row .wk-demo-name {
    color: #0f172a !important;
    font-weight: 600 !important;
    text-shadow: none !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-demo-pts,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-demo-pts,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-demo-row .wk-demo-pts,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--gezin.wk-play-mode-card--premium .wk-play-mode-demo-row .wk-demo-pts {
    color: var(--wk-toto-green-line-dark) !important;
    font-weight: 800 !important;
    text-shadow: none !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-demo-total,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-demo-total,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--gezin.wk-play-mode-card--premium .wk-play-mode-demo-total {
    background: var(--wk-toto-green-tint) !important;
    border: 1px solid var(--wk-toto-green-soft) !important;
    color: #0f172a !important;
    box-shadow: none !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-demo-total .wk-demo-name,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-demo-total .wk-demo-name,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--gezin.wk-play-mode-card--premium .wk-play-mode-demo-total .wk-demo-name {
    color: #0f172a !important;
    text-shadow: none !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-demo-total .wk-demo-pts,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-demo-total .wk-demo-pts,
body.wk-poule-page.wk-land-national.wk-land-be .wk-play-mode-card--gezin.wk-play-mode-card--premium .wk-play-mode-demo-total .wk-demo-pts {
    color: var(--wk-toto-green-line-dark) !important;
}

body.wk-poule-page.wk-land-national .wk-play-mode-card .wk-play-mode-demo-note,
body.wk-poule-page.wk-land-national .wk-play-mode-card--premium .wk-play-mode-demo-note {
    background: #fff !important;
    border: 1px solid #e2e8f0 !important;
    color: #475569 !important;
    font-weight: 500 !important;
}

/* —— NL: alle knoppen dezelfde groene CTA (BE: goud in play-modes-be-unified.css) —— */
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card .wk-play-mode-cta,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--solo .wk-play-mode-cta--solo,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--gezin .wk-play-mode-cta--premium,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--school .wk-play-mode-cta--premium,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--school .wk-play-mode-cta--school,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--werk .wk-play-mode-cta--premium,
body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card--werk .wk-play-mode-cta--werk {
    background: var(--wk-toto-green-grad) !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    box-shadow: 0 3px 12px rgba(22, 163, 74, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    min-height: 42px !important;
    padding: 0.5rem 0.75rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    text-shadow: none !important;
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-play-mode-card .wk-play-mode-cta:hover {
    filter: brightness(1.05);
    transform: translateY(-1px);
    color: #fff !important;
}

/* Witte secties: groene accent */
/* sectie-accent: zie wk-2026-premium-atmosphere.css (NL oranje / BE goud / play-modes groen) */

body.wk-poule-page.wk-land-national.wk-land-be .wk-section-head {
    border-bottom-color: var(--wk-toto-green-soft) !important;
}

body.wk-poule-page.wk-land-national.wk-land-nl .wk-info-card,
body.wk-poule-page.wk-land-national.wk-land-be .wk-info-card {
    border-left: 3px solid var(--wk-toto-green-line) !important;
    border-color: #e2e8f0 !important;
    border-left-color: var(--wk-toto-green-line) !important;
}

@media (min-width: 900px) {
    body.wk-poule-page.wk-land-national .wk-play-modes-grid--4 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* School-/werkpoule (geen land-national): zelfde kaartkop */
body.wk-poule-page .wk-play-mode-card__head .wk-play-mode-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 3rem !important;
    height: 3rem !important;
    margin: 0 auto 0.45rem !important;
    font-size: 1.45rem !important;
    line-height: 1 !important;
    border-radius: 50% !important;
}

body.wk-poule-page .wk-play-mode-card__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 0.75rem;
    padding-bottom: 0.7rem;
    border-bottom: 1px solid #e2e8f0;
}

body.wk-poule-page .wk-play-mode-card__head > h2::before,
body.wk-poule-page .wk-play-mode-card__head > h3::before {
    content: none !important;
    display: none !important;
}
