﻿html, body {
    background-color: white !important;
    height: inherit !important;
}

/*.masthead {
    margin-top: 0px !important;
}*/

/* Speelse koppen */
.inschrijvingen h1, .inschrijvingen h3 {
    color: #0d730d;
    letter-spacing: 1px;
    margin-bottom: 1rem;
    text-align: center;
}

.inschrijvingen h3 {
    font-size: 1.5rem;
    margin-top: 2rem;
    margin-bottom: 1rem;
    text-align: left;
    letter-spacing: 0.5px;
}

/* Formulier met lichte schaduw en afgeronde hoeken */
.inschrijvingen form {
    background: rgba(255,255,255,0.95);
    border-radius: 18px;
    box-shadow: 0 4px 24px rgba(13,115,13,0.10);
    padding: 2rem 1.5rem;
    margin-bottom: 2rem;
}

/* Labels met icoontje */
.inschrijvingen label.control-label:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 8px;
    color: #0d730d;
    font-size: 1.1em;
}

.inschrijvingen label[for="Voornaam"]:before {
    content: "\f007";
}
/* user */
.inschrijvingen label[for="Naam"]:before {
    content: "\f007";
}

.inschrijvingen label[for="Emailadres"]:before {
    content: "\f0e0";
}
/* envelope */
.inschrijvingen label[for="Telefoon"]:before {
    content: "\f095";
}
/* phone */
.inschrijvingen label[for="StraatEnNummer"]:before {
    content: "\f015";
}
/* home */
.inschrijvingen label[for="PostcodeEnGemeente"]:before {
    content: "\f279";
}
/* map-marker-alt */
.inschrijvingen label[for="Volwassenen"]:before,
.inschrijvingen label[for="VolwassenenVegetarisch"]:before {
    content: "\f2c0";
}
/* user-friends */
.inschrijvingen label[for="Kinderen"]:before {
    content: "\f1ae";
}
/* child */
.inschrijvingen label[for="KinderenOnder3Jaar"]:before {
    content: "\f77c";
}
/* baby */
.inschrijvingen label[for="Opmerkingen"]:before {
    content: "\f27a";
}
/* comment */

/* Inputs en textarea met speelse rand */
.inschrijvingen .form-control {
    border-radius: 12px;
    border: 2px solid #0d730d;
    transition: box-shadow 0.2s, border-color 0.2s;
}

    .inschrijvingen .form-control:focus {
        border-color: #388E3C;
        box-shadow: 0 0 0 2px #b6e7b6;
    }

/* Prijsbadges */
.inschrijvingen .badge {
    font-size: 1em;
    border-radius: 8px;
    background: #0d730d;
    color: #fff;
    margin-left: 0.5em;
    vertical-align: middle;
    margin-bottom: 3px;
    margin-top: 5px;
}

/* Totaalrijen speels */
.inschrijvingen .row .font-weight-bold {
    color: #0d730d;
    font-size: 1.1em;
}

/* Submit-knop extra speels */
.inschrijvingen .btn-bekegroen {
    font-size: 1.2em;
    border-radius: 24px;
    padding: 0.7em 2.5em;
    font-weight: bold;
    letter-spacing: 1px;
    box-shadow: 0 2px 8px rgba(13,115,13,0.10);
    transition: background 0.2s, transform 0.1s;
}

    .inschrijvingen .btn-bekegroen:hover {
        background: #095509;
        transform: scale(1.04) rotate(-1deg);
    }

/* Kleine animatie bij focus */
@keyframes wiggle {
    0% {
        transform: rotate(-1deg);
    }

    50% {
        transform: rotate(1deg);
    }

    100% {
        transform: rotate(0);
    }
}

.inschrijvingen .form-control:focus {
    animation: wiggle 0.2s;
}