/* ==========================================================================
   Kampidoe Reservatie — stap 2: gegevens invullen
   Tabellen blijven <table> in de markup, maar herschikken op smalle
   schermen naar gestapelde label/veld-paren.
   ========================================================================== */

.kampidoe-app #step2_data h3 { margin: 0 0 var(--kd-space-2) 0; }
.kampidoe-app #step2_data > p { margin: 0 0 var(--kd-space-3) 0; }

.kampidoe-app #step2_data table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 var(--kd-space-3) 0;
}

.kampidoe-app #step2_data table tr {
    border-bottom: 1px solid var(--kd-line);
}

.kampidoe-app #step2_data table tr:last-child {
    border-bottom: none;
}

.kampidoe-app #step2_data table tr td.info-label {
    width: 38%;
    padding: 12px 16px 12px 0;
    vertical-align: middle;
    font-weight: 500;
    color: var(--kd-pine-dark);
}

.kampidoe-app #step2_data table tr td.info-label span {
    display: block;
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 400;
    color: var(--kd-muted);
    margin-top: 2px;
}

.kampidoe-app #step2_data table tr td.input-field {
    padding: 10px 0;
    vertical-align: middle;
}

.kampidoe-app #step2_data table tr td input,
.kampidoe-app #step2_data table tr td select {
    width: 100%;
    max-width: 340px;
}

.kampidoe-app #step2_data textarea#organisation_goal,
.kampidoe-app #step2_data textarea#remarks {
    width: 100%;
    max-width: 100%;
    min-height: 110px;
}

.kampidoe-app #step2_data table tr td label.error {
    margin-top: 4px;
}

@media (max-width: 700px) {
    .kampidoe-app #step2_data table,
    .kampidoe-app #step2_data table tbody,
    .kampidoe-app #step2_data table tr,
    .kampidoe-app #step2_data table tr td {
        display: block;
        width: 100%;
    }

    .kampidoe-app #step2_data table tr {
        padding: var(--kd-space-2) 0;
    }

    .kampidoe-app #step2_data table tr td.info-label {
        padding: 0 0 6px 0;
    }

    .kampidoe-app #step2_data table tr td.input-field {
        padding: 0;
    }

    .kampidoe-app #step2_data table tr td input,
    .kampidoe-app #step2_data table tr td select {
        max-width: 100%;
    }
}