.formText {
    width: 100%;
    outline: none;
    padding: 10px;
    border: var(--form_borderWidth) var(--form_borderStyle) var(--form_borderColor);
    border-radius: var(--form_borderRadius);
    background-color: var(--form_backgroundColor);
    font-family: var(--form_font), sans-serif;
    scroll-behavior: auto;
    color: var(--form_textColor);
    transition: border-color var(--durationS) var(--course), background-color var(--durationS) var(--course), color var(--durationS) var(--course);
}

.formText:hover, .formText:checked, .formText:active, .formText:focus {
    border-color: var(--form_borderColorHover);
    background-color: var(--form_backgroundColorHover);
    color: var(--form_textColorHover);
    transition: border-color var(--durationS) var(--course), background-color var(--durationS) var(--course), color var(--durationS) var(--course);
}

.formText:-webkit-autofill, .formText:-webkit-autofill:focus {
    border-color: var(--form_borderColorHover);
    box-shadow: 0 50px var(--form_backgroundColorHover) inset;
    -webkit-text-fill-color: var(--form_textColorHover);
}

.formTextarea {
    width: 100%;
    outline: none;
    resize: none;
    padding: 10px;
    border: var(--form_borderWidth) var(--form_borderStyle) var(--form_borderColor);
    border-radius: var(--form_borderRadius);
    background-color: var(--form_backgroundColor);
    font-family: var(--form_font), sans-serif;
    color: var(--form_textColor);
    transition: border-color var(--durationS) var(--course), background-color var(--durationS) var(--course), color var(--durationS) var(--course);
}

.formTextarea:hover, .formTextarea:checked, .formTextarea:active, .formTextarea:focus {
    border-color: var(--form_borderColorHover);
    background-color: var(--form_backgroundColorHover);
    color: var(--form_textColorHover);
    transition: border-color var(--durationS) var(--course), background-color var(--durationS) var(--course), color var(--durationS) var(--course);
}

.formOption {
    padding: 10px 5px;
    background-color: var(--form_backgroundColor);
    font-family: var(--form_font), sans-serif;
    color: var(--form_textColor);
    transition: background-color var(--durationS) var(--course), color var(--durationS) var(--course);
}

.formOption:active, .formOption:focus {
    background-color: var(--form_backgroundColorHover);
    color: var(--form_textColorHover);
    transition: background-color var(--durationS) var(--course), color var(--durationS) var(--course);
}

.formOption:hover, .formOption:checked {
    background-color: var(--form_backgroundColorChecked);
}

.formCheckbox, .formRadio {
    appearance: none;
    outline: none;
    border: var(--form_borderWidth) var(--form_borderStyle) var(--form_borderColor);
    background-color: var(--form_backgroundColor);
    transition: border-color var(--durationS) var(--course), background-color var(--durationS) var(--course);
}

.formCheckbox {
    border-radius: var(--form_borderRadius);
}

.formRadio {
    border-radius: var(--borderRadiusRound);
}

.formCheckbox:hover, .formCheckbox:active, .formCheckbox:focus, .formRadio:hover, .formRadio:active, .formRadio:focus {
    border-color: var(--form_borderColorHover);
    transition: border-color var(--durationS) var(--course), background-color var(--durationS) var(--course);
}

.formCheckbox:checked, .formRadio:checked {
    border-color: var(--form_borderColorHover);
    background-color: var(--form_borderColorHover);
    transition: border-color var(--durationS) var(--course), background-color var(--durationS) var(--course);
}

.formCheckbox + label, .formRadio + label {
    display: flex;
    align-items: center;
    padding-left: 10px;
    color: var(--form_textColor);
    transition: color var(--durationS) var(--course);
}

.formCheckbox:hover + label, .formRadio:hover + label, .formCheckbox + label:hover, .formRadio + label:hover {
    color: var(--form_textColorHover);
    transition: color var(--durationS) var(--course);
}

.formLabel, .formFileButton {
    display: block;
    width: 100%;
    overflow: hidden;
    outline: none;
    padding: 10px;
    border: var(--form_borderWidth) var(--form_borderStyle) var(--form_borderColor);
    border-radius: var(--form_borderRadius);
    background-color: var(--form_backgroundColor);
    font-family: var(--form_font), sans-serif;
    color: var(--form_textColor);
    transition: border-color var(--durationS) var(--course), background-color var(--durationS) var(--course), color var(--durationS) var(--course);
}

.formLabel:hover, .formLabel:active, .formLabel:checked, .formLabel:focus, .formFileButton:hover, .formFileButton:active, .formFileButton:checked, .formFileButton:focus {
    border-color: var(--form_borderColorHover);
    background-color: var(--form_backgroundColorHover);
    color: var(--form_textColorHover);
    transition: border-color var(--durationS) var(--course), background-color var(--durationS) var(--course), color var(--durationS) var(--course);
}

.formFileButton {
    position: relative;
    width: 100%;
    height: calc(100px + 2 * var(--form_borderWidth));
    padding-right: 110px;
}

.formFileButton > picture > img, .formFileButton > svg {
    position: absolute;
    top: 0;
    right: 0;
    width: 100px;
    height: 100px;
    object-fit: cover;
}

.formInputBlock > .formInputBlockValues {
    display: flex;
    margin: var(--marginS) 0;
}

.grecaptcha-badge {
    display: none;
}

form:disabled, form:disabled + p, form:disabled + label, .formTextarea:disabled, select:disabled, option:disabled, button:disabled {
    opacity: var(--opacityMiddle);
    cursor: not-allowed;
}

input[type='file'], input[type='color'] {
    display: none;
}

@media (prefers-color-scheme: dark) {
    .formText, .formLabel, .formFileButton, .formTextarea {
        border-color: var(--form_borderColorD);
        background-color: var(--form_backgroundColorD);
        color: var(--form_textColorD);
    }

    .formText:hover, .formText:checked, .formText:active, .formText:focus, .formLabel:hover, .formLabel:active, .formLabel:checked, .formLabel:focus, .formFileButton:hover, .formFileButton:active, .formFileButton:checked, .formFileButton:focus, .formTextarea:hover, .formTextarea:checked, .formTextarea:active, .formTextarea:focus {
        border-color: var(--form_borderColorHoverD);
        background-color: var(--form_backgroundColorHoverD);
        color: var(--form_textColorHoverD);
    }

    .formText:-webkit-autofill, .formText:-webkit-autofill:focus {
        border-color: var(--form_borderColorHoverD);
        box-shadow: 0 50px var(--form_backgroundColorHoverD) inset;
        -webkit-text-fill-color: var(--form_textColorHoverD);
    }

    .formOption {
        background-color: var(--form_backgroundColorD);
        color: var(--form_textColorD);
    }

    .formOption:active, .formOption:focus {
        background-color: var(--form_backgroundColorHoverD);
        color: var(--form_textColorHoverD);
    }

    .formOption:hover, .formOption:checked {
        background-color: var(--form_backgroundColorCheckedD);
    }

    .formCheckbox, .formRadio {
        border-color: var(--form_borderColorD);
        background-color: var(--form_backgroundColorD);
    }

    .formCheckbox:hover, .formCheckbox:active, .formCheckbox:focus, .formRadio:hover, .formRadio:active, .formRadio:focus {
        border-color: var(--form_borderColorHoverD);
    }

    .formCheckbox:checked, .formRadio:checked {
        border-color: var(--form_borderColorHoverD);
        background-color: var(--form_borderColorHoverD);
    }

    .formCheckbox + label, .formRadio + label {
        color: var(--form_textColorD);
    }

    .formCheckbox:hover + label, .formRadio:hover + label, .formCheckbox + label:hover, .formRadio + label:hover {
        color: var(--form_textColorHoverD);
    }

    ::-webkit-calendar-picker-indicator {
        -webkit-filter: invert(1);
        filter: invert(1);
    }
}

@media only screen and (max-width: 500px) {
    .formText, .formLabel, .formTextarea, .formFileButton {
        font-size: 12px;
    }

    .formTextarea {
        height: 120px;
    }

    .formCheckbox, .formRadio {
        height: calc(12px + 2 * var(--form_borderWidth));
        width: calc(12px + 2 * var(--form_borderWidth));
    }
}

@media only screen and (min-width: 501px) and (max-width: 1000px) {
    .formText, .formLabel, .formTextarea, .formFileButton {
        font-size: 13px;
    }

    .formTextarea {
        height: 130px;
    }

    .formCheckbox, .formRadio {
        height: calc(13px + 2 * var(--form_borderWidth));
        width: calc(13px + 2 * var(--form_borderWidth));
    }
}

@media only screen and (min-width: 1001px) {
    .formText, .formLabel, .formTextarea, .formFileButton {
        font-size: 14px;
    }

    .formTextarea {
        height: 140px;
    }

    .formCheckbox, .formRadio {
        height: calc(14px + 2 * var(--form_borderWidth));
        width: calc(14px + 2 * var(--form_borderWidth));
    }
}