/*************************************************************************/
/* MODERN FORMS - Bootstrap 3 compatible                                  */
/*************************************************************************/

/*************************************************************************/
/* BASE CONTROLS                                                          */
/*************************************************************************/

.form-control,
select.form-control,
textarea.form-control,
.bootstrap-select > .btn {
    min-height: 36px;
    padding: 7px 10px;
    color: #394858;
    background-color: #ffffff;
    border: 1px solid #d8e0e7;
    border-radius: 6px;
    box-shadow: none;
    font-size: 0.92em;
    line-height: 1.4;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

textarea.form-control {
    height: auto;
    min-height: 90px;
    resize: vertical;
}

    /*************************************************************************/
    /* FOCUS                                                                  */
    /*************************************************************************/

    .form-control:focus,
    select.form-control:focus,
    textarea.form-control:focus,
    .bootstrap-select.open > .btn,
    .bootstrap-select > .btn:focus {
        color: #263746;
        background-color: #ffffff;
        border-color: var(--panel-accent, #b18849);
        outline: 0;
        box-shadow: 0 0 0 2px rgba(177, 136, 73, 0.12);
    }

/*************************************************************************/
/* PLACEHOLDER                                                            */
/*************************************************************************/

.form-control::placeholder {
    color: #a3adb8;
    opacity: 1;
}

.form-control::-webkit-input-placeholder {
    color: #a3adb8;
}

.form-control::-moz-placeholder {
    color: #a3adb8;
    opacity: 1;
}

.form-control:-ms-input-placeholder {
    color: #a3adb8;
}

/*************************************************************************/
/* LABELS                                                                 */
/*************************************************************************/

.control-label,
.form-group > label,
.form-horizontal .control-label {
    margin-bottom: 5px;
    color: #657181;
    font-size: 0.78em;
    font-weight: 600;
    line-height: 1.35;
}

/*************************************************************************/
/* FORM GROUPS                                                            */
/*************************************************************************/

.form-group {
    margin-bottom: 16px;
}

/*************************************************************************/
/* DISABLED / READONLY                                                    */
/*************************************************************************/

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control,
.bootstrap-select.disabled > .btn,
.bootstrap-select > .btn.disabled {
    color: #8c97a3;
    background-color: #f4f6f8;
    border-color: #e1e6eb;
    box-shadow: none;
    cursor: not-allowed;
    opacity: 1;
}

/*************************************************************************/
/* VALIDATION STATES                                                      */
/*************************************************************************/

.has-error .form-control {
    border-color: #c76a6a;
}

    .has-error .form-control:focus {
        border-color: #b64c4c;
        box-shadow: 0 0 0 2px rgba(182, 76, 76, 0.12);
    }

.has-error .control-label,
.field-validation-error {
    color: #b64c4c;
}

.has-success .form-control {
    border-color: #5a9d78;
}

    .has-success .form-control:focus {
        border-color: #3f8a63;
        box-shadow: 0 0 0 2px rgba(63, 138, 99, 0.12);
    }

/*************************************************************************/
/* HELP / VALIDATION TEXT                                                 */
/*************************************************************************/

.help-block,
.field-validation-error,
.validation-summary-errors {
    font-size: 0.78em;
    line-height: 1.4;
}

.help-block {
    margin-top: 5px;
    margin-bottom: 0;
    color: #8b96a3;
}

.field-validation-error {
    display: block;
    margin-top: 5px;
}

/*************************************************************************/
/* INPUT GROUPS                                                           */
/*************************************************************************/

.input-group-addon {
    color: #657181;
    background-color: #f5f7f9;
    border: 1px solid #d8e0e7;
    text-shadow: none;
}

    /*
 * Bootstrap 3 jointures
 */

    .input-group-addon:first-child {
        border-radius: 6px 0 0 6px;
    }

    .input-group-addon:last-child {
        border-radius: 0 6px 6px 0;
    }

.input-group .form-control:first-child {
    border-radius: 6px 0 0 6px;
}

.input-group .form-control:last-child {
    border-radius: 0 6px 6px 0;
}


/*************************************************************************/
/* SELECT                                                                 */
/*************************************************************************/

select.form-control:not([multiple]) {
    cursor: pointer;
}

/*************************************************************************/
/* CHECKBOXES / RADIOS                                                    */
/*************************************************************************/

.checkbox,
.radio {
    margin-top: 6px;
    margin-bottom: 6px;
}

    .checkbox label,
    .radio label,
    .checkbox-inline,
    .radio-inline {
        color: #4b5563;
        font-size: 0.9em;
        line-height: 1.4;
    }

        .checkbox input[type="checkbox"],
        .radio input[type="radio"],
        .checkbox-inline input[type="checkbox"],
        .radio-inline input[type="radio"] {
            margin-top: 3px;
        }

/*************************************************************************/
/* SIZES                                                                  */
/*************************************************************************/

.form-control.input-sm,
.form-group-sm .form-control {
    min-height: 30px;
    height: 30px;
    padding: 5px 8px;
    font-size: 0.84em;
}

.form-control.input-lg,
.form-group-lg .form-control {
    min-height: 42px;
    height: 42px;
    padding: 9px 12px;
    font-size: 1em;
}

/*************************************************************************/
/* BORDERLESS EXPLICIT OPTION                                             */
/*************************************************************************/

.bordeless {
    border: none !important;
    box-shadow: none !important;
}

/*************************************************************************/
/* STATIC CONTROL                                                         */
/*************************************************************************/

.form-control-static {
    padding-top: 7px;
    padding-bottom: 7px;
    color: #475569;
    font-size: 0.92em;
    line-height: 1.4;
}

/*************************************************************************/
/* RESPONSIVE                                                             */
/*************************************************************************/

@media (max-width: 767px) {

    /*
     * 16px prevents automatic zoom on iOS inputs.
     */
    .form-control,
    select.form-control,
    textarea.form-control,
    .bootstrap-select > .btn {
        font-size: 16px;
    }

    .control-label,
    .form-group > label,
    .form-horizontal .control-label {
        font-size: 0.8em;
    }

    .form-group {
        margin-bottom: 14px;
    }
}

/*************************************************************************/
/* FILE PICKER                                                           */
/*************************************************************************/

.file-picker {
    display: flex;
    align-items: stretch;
    width: 100%;
}

.file-picker-button {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: var(--modal-control-height, 34px);
    margin: 0;
    padding: 6px 11px;
    color: var(--form-text, #465468);
    background-color: var(--form-background-soft, #f5f7f9);
    border: 1px solid var(--form-border, #d9e0e7);
    border-right: 0;
    border-radius: 6px 0 0 6px;
    font-size: var(--modal-control-font-size, 12px);
    font-weight: 500;
    cursor: pointer;
    box-shadow: none;
}

    .file-picker-button:hover,
    .file-picker-button:focus {
        color: var(--form-title, #263746);
        background-color: #eef2f5;
        border-color: #cbd4dd;
    }

    .file-picker-button > input[type="file"] {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        opacity: 0;
        pointer-events: none;
    }

.file-picker-name.form-control {
    flex: 1 1 auto;
    min-width: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}