/* ============================================
   NNHF Wedstrijden – Frontend Styles v1.3
   Ontworpen voor GeneratePress (Pro)
   ============================================ */

/* ─── Tabel wrapper ─── */
.nnhf-wedstrijden-wrap {
    width: 100%;
    margin: 1.5em 0;
}

/* ─── Tabel: geen randen ─── */
.nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel {
    width: 100%;
    border-collapse: collapse;
    border: none !important;
    border-spacing: 0;
    font-size: inherit;
    line-height: 1.6;
    table-layout: auto;
}

.nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel th,
.nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel td {
    border: none !important;
    padding: 0.6em 1em 0.6em 0;
    text-align: left;
    vertical-align: middle;
    background: none !important;
}

/* ─── Header ─── */
.nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel thead th {
    font-weight: 600;
    border-bottom: 2px solid currentColor !important;
    opacity: 0.85;
    white-space: nowrap;
}

/* ─── Rijen: subtiele scheiding ─── */
.nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody tr {
    border-bottom: 1px solid rgba(0, 0, 0, 0.07) !important;
}

.nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody tr:last-child {
    border-bottom: none !important;
}

/* ─── Kolom breedtes (desktop) ─── */
.nnhf-col-datum {
    white-space: nowrap;
    width: 12%;
}
.nnhf-col-vereniging {
    width: 22%;
}
.nnhf-col-wedstrijd {
    width: 32%;
}
.nnhf-col-info,
.nnhf-col-uitslagen {
    width: 12%;
    text-align: center;
}

.nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel thead .nnhf-col-info,
.nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel thead .nnhf-col-uitslagen {
    text-align: center;
}

/* ─── Knoppen ─── */
.nnhf-btn {
    display: inline-block;
    padding: 0.35em 1em;
    border-radius: 3px;
    font-size: 0.85em;
    font-weight: 500;
    text-decoration: none !important;
    text-align: center;
    transition: background-color 0.2s ease, color 0.2s ease;
    white-space: nowrap;
    line-height: 1.4;
}

.nnhf-btn-info {
    background-color: var(--gp-button-bg, #0073aa);
    color: var(--gp-button-text, #ffffff) !important;
}
.nnhf-btn-info:hover,
.nnhf-btn-info:focus {
    background-color: var(--gp-button-bg-hover, #005a87);
    color: var(--gp-button-text-hover, #ffffff) !important;
    text-decoration: none !important;
}

.nnhf-btn-uitslagen {
    background-color: var(--gp-button-bg, #0073aa);
    color: var(--gp-button-text, #ffffff) !important;
    opacity: 0.85;
}
.nnhf-btn-uitslagen:hover,
.nnhf-btn-uitslagen:focus {
    background-color: var(--gp-button-bg-hover, #005a87);
    color: var(--gp-button-text-hover, #ffffff) !important;
    opacity: 1;
    text-decoration: none !important;
}

/* ─── Geen wedstrijden melding ─── */
.nnhf-geen-wedstrijden {
    font-style: italic;
    opacity: 0.7;
}

/* ============================================
   RESPONSIVE: Mobiel (max 768px)
   Tabel wordt volledig gestapeld,
   geen tabelstructuur meer.
   ============================================ */
@media screen and (max-width: 768px) {

    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel,
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel thead,
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody,
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tr,
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel th,
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        border: none !important;
        text-align: left !important;
    }

    /* Verberg de header-rij */
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel thead {
        display: none !important;
    }

    /* Elke rij wordt een kaart */
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody tr {
        padding: 1em 0 !important;
        margin-bottom: 0.5em !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
    }

    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody tr:last-child {
        border-bottom: none !important;
        margin-bottom: 0 !important;
    }

    /* Cellen: label + waarde op één regel */
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody td {
        padding: 0.2em 0 !important;
        white-space: normal !important;
    }

    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody td::before {
        content: attr(data-label) ": ";
        font-weight: 600;
    }

    /* Knoppen-cellen: geen label tonen, knoppen naast elkaar */
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody td.nnhf-col-info,
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody td.nnhf-col-uitslagen {
        display: inline-block !important;
        width: auto !important;
        padding: 0.4em 0.5em 0.4em 0 !important;
    }

    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody td.nnhf-col-info::before,
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody td.nnhf-col-uitslagen::before {
        content: none;
    }

    /* Verberg lege cellen op mobiel */
    .nnhf-wedstrijden-wrap table.nnhf-wedstrijden-tabel tbody td:empty {
        display: none !important;
        padding: 0 !important;
    }
}