/**
 * @file
 * Styles for webforms
*/
form label{
    font-weight: 400;
}
input:not([type="submit"]), select, textarea{
    border: 2px solid;
    border-color: #b6baba;
    font-weight: 300;
}
input:not([type="submit"]), textarea{
    padding: 0.3rem 0.5rem;
}
select{
    padding: 0.15rem 0.5rem;
}
input[type="submit"]{
    cursor: pointer;
    background-color: var(--black);
    color: var(--white);
    border-radius: 0;
    border: var(--border-width) solid var(--black);
    padding: 0.5rem 1.5rem;
    transition: var(--three-sec-trans);
}
input[type="submit"]:hover, input[type="submit"]:focus{
    background-color: transparent;
    color: var(--black);
}
/*=== Field Set Treatments ===*/
fieldset{
    border-color: var(--black);
}
fieldset legend{
    padding: 0.2rem 1rem;
    font-size: var(--large-font-size);
    font-weight: var(--semi-bold-weight);
}
/*=== Webform Styles ===*/
form.webform-submission-form .js-webform-flexbox{
    gap: var(--spacing-20);
}
/* Background color section */
form.webform-submission-form .wp-block-group.has-background{
    padding: var(--spacing-20);
    border-radius: 1rem;
}
/* 2 cols layouts */
.webform-options-display-two-columns{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
    column-count: unset;
    gap: var(--spacing-40);
}
@media screen and (min-width: 1050px){
    .webform-options-display-two-columns > .form-item{
        min-width: calc(50% - var(--spacing-40));
        width: calc(50% - var(--spacing-40));
    }
}
/*=== Webform Confirmation Modal ===*/
.webform-confirmation-modal{
    background: var(--white);
    color: var(--black);
    border-radius: 1rem;
    box-shadow: 4px -4px 10px 0px rgba(0, 0, 0, 0.10);
}
/* Title bar */
.webform-confirmation-modal .ui-dialog-titlebar{
    border-radius: 1rem 1rem 0 0;
    background: var(--sage);
    text-align: center;
}
.webform-confirmation-modal .ui-dialog-title{
    font-family: var(--heading-font);
    font-weight: var(--semi-bold-weight);
    color: var(--black);
    font-size: var(--med-font-size);
}
/* Content */
.webform-confirmation-modal .webform-confirmation-modal--content{
    font-family: var(--body-font);
    font-weight: var(--reg-weight);
    color: var(--black);
    font-size: var(--body-font-size);
}
/*=== Setting flex for regulated containers inline ===*/
.container-inline > .webform-flex .js-form-item{
    margin-top: 0;
}
.container-inline{
    margin-bottom: 0.5rem;
}