:root {
    --primary-color: rgb(0 199 169);
    --secondary-color: rgb(0, 146, 124);
}

body {
    display: flex;
    flex-direction: column;
}

fieldset input, fieldset textarea, fieldset select {
    margin-bottom: 1em;
}

.btn-wrapper {
    display: flex;
    justify-content: flex-end;
}

.btn-next,
.btn-submit {
    margin-left: auto;
}

#btn-add-child {
    margin-left: auto;
}

/* Required field labels */
label[for] {
    position: relative; /* optional, for spacing if needed */
}

label[for]::after {
    content: '*';
    color: red;
    margin-left: 0.25em;
    display: none;
}

/* Show ::after if label is followed by a required input */
label[for]:has(+ input:required)::after,
label[for]:has(+ select:required)::after,
label[for]:has(+ textarea:required)::after {
    display: inline;
}

.rubric {
    margin: 10px 0 10px 0;
}

form.was-submitted input:invalid,
form.was-submitted select:invalid,
form.was-submitted textarea:invalid {
    border: 2px solid red;
    background-color: #ffe6e6;
}

form.was-submitted input:focus:invalid,
form.was-submitted select:focus:invalid,
form.was-submitted textarea:focus:invalid {
    outline: 2px solid darkred;
}

#privacy-notice-checkbox {
    margin-right: auto;
}

#privacy-notice-dialog,
#referrer-guidance-dialog {
    flex-direction: column;
    background-color: white;
    height: 90%;
    width: 90%;
    border: 2px solid rgb(0, 146, 124);
    border-radius: 5px;
    padding: 10px;

    button {
        align-self: center;
        margin-top: 10px;
    }
}