/*
    This file is meant to serve as a starter for the CMS Forms Module,
    Please exercise caution in what you style and how you style it.
    As the CMS Forms Module receives updates, you may need to re-download this file to style additional features.
    You may need to use !important in some places to make sure your styles override the CMS Forms Module defaults
*/

/* global items */
[data-el="mc-form-wrapper"] {
    /* the entire form */
    padding: 2rem;
    border-radius: 0.25rem;
    background: #fff;
    background: rgb(var(--white));
    box-shadow: 0 0 1rem 0.5rem rgba(6, 17, 61, 0.125);
    box-shadow: var(--shadow);
    margin: 4rem 0;
    font-family: Montserrat, serif;
    font-family: var(--body);
}

/* Submit button */
[data-el="mc-form-wrapper"] [data-el="mc-form-submit"] {
    /* submit button */
    display: block;
    width: 100%;
    color: #06113d;
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.3;
    text-transform: none;
    padding: 1rem 1.5rem;
    border: 0.0625rem solid #007e87;
    border: 0.0625rem solid rgb(var(--teal));
    border-radius: 0.25rem;
    background: #007e87;
    color: #fff;
    text-align: center;
    text-decoration: none;
}

/* Success and error messages */
[data-el="mc-form-wrapper"] [data-el="mc-form-success"] {
    /* submit success message */
}

[data-el="mc-form-wrapper"] [data-el="mc-form-error"] {
    /* submit error message */
}

[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="element-label"] {
    /* form labels */
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700;
}

[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="element-helper-wrapper"] {
    /* element helper text */
}

/* short text */
[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="text-input"] {
    /* short text */
}

/* long text */
[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="textarea"] {
    /* long text */
}

/* email */
[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="text-input"][type="email"] {
    /* email */
}

/* checkboxes and radios */
[data-el="mc-form-wrapper"] [data-el="options-group-wrapper"] [data-el="options-group-legend"] {
    /* legends for radio, checkboxes */
}


/* checkboxes */
[data-el="mc-form-wrapper"] [data-el="options-group-wrapper"] [data-el="checkbox-group-wrapper"] {
    /* checkboxes wrapper */
}
[data-el="mc-form-wrapper"] [data-el="options-group-wrapper"] [data-el="checkbox-input"] {
    /* individual checkboxes */
}
[data-el="mc-form-wrapper"] [data-el="options-group-wrapper"] [data-el="checkbox-label"] {
    /* individual checkboxes label */
}


/* radios */
[data-el="mc-form-wrapper"] [data-el="options-group-wrapper"] [data-el="radio-group-wrapper"] {
    /* radio wrapper */
}
[data-el="mc-form-wrapper"] [data-el="options-group-wrapper"] [data-el="radio-input"] {
    /* individual radio */
}
[data-el="mc-form-wrapper"] [data-el="options-group-wrapper"] [data-el="radio-label"] {
    /* individual radio labels */
}

/* dropdown */
[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="select-input"] {
    /* dropdown */
}


/* toggle */
[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="toggle-wrapper"] {
    /* toggle wrapper */
}
[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="toggle-wrapper"] [data-el="toggle-input"] {
    /* toggle */
}
[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="toggle-wrapper"] [data-el="toggle-label"] {
    /* toggle label */
}

/* free text */
[data-el="mc-form-wrapper"] [data-el="element-wrapper"] [data-el="html-section"] {
    /* free text */
}

/* date, time, date/time */
[data-el="mc-form-wrapper"] [data-el="element-wrapper"] .react-datepicker-wrapper {
    /* input field */
}