/* form styling */
.form-container h3 {
    margin-bottom: 20px;
}

.form-container .infobox:after {
    top: unset;
    bottom: 30%;
}

.form-container .infobox .form-box {
    border-radius: var(--radius-lg);
    background: var(--white);
    padding: 20px;
    z-index: 1;
    position: relative;
}

/* Form inputs styling */
.form-container .form-control {
    border-radius: var(--radius-sm);
    border: 1px solid var(--primary-100);
    padding: 8px 12px;
    background-color: var(--white);
    color: var(--support-700);
}

.form-container .form-control:focus {
    outline: none;
    border-color: var(--primary-500);
    box-shadow: 0 0 0 1px rgba(255, 115, 24, 0.1);
}

.form-container textarea.form-control {
    min-height: 100px;
    resize: vertical;
}

/* Labels styling */
.form-container label {
    display: block;
    margin-bottom: 4px;
    color: var(--primary-500);
    font-weight: 500;
}

/* Checkbox and Radio inputs - adjust styling */
.form-container input[type="checkbox"],
.form-container input[type="radio"] {
    width: auto;
    height: auto;
    margin-right: 8px;
    border-radius: 4px;
}

.form-container input[type="checkbox"] {
    border-radius: 4px;
}

/* For checkbox/radio, labels might be displayed inline by CouchCMS */
.form-container input[type="checkbox"] + label,
.form-container input[type="radio"] + label {
    display: inline-block;
    margin-bottom: 0;
    margin-left: 0;
    font-weight: 400;
    color: var(--support-700);
}

.form-container .col-md-12,
.form-container .col-md-6,
.form-container .col-md-4,
.form-container .col-md-3 {
    margin-bottom: 15px;
}

/* Select dropdown styling */
.form-container select.form-control {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23808080' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 35px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.form-container select.form-control:focus {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23FF7318' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
}

.form-container .buttonset {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-top: 20px;
}

@media (min-width: 992px) and (max-width: 1199px) {
    .form-container div#recaptcha_k_0 {
        transform: scale(0.8);
        margin-left: -31px;
    }
}

@media (max-width: 991px) {
    .form-container .buttonset {
        flex-direction: column;
        align-items: left;
        justify-content: center;
    }
}

@media (max-width: 767px) {
    .form-container .button {
        margin-top: 30px;;
    }
}