/* ****************************************
 * ** Import Fonts
 * ****************************************/

    @import url(https://fonts.googleapis.com/css?family=Inter&display=swap);

    body, .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, .text-xl, .text-lg {
    font-family: 'Inter';
    }
 


/* ****************************************
 * ** Override common controls for light mode
 * ****************************************/
a,
a:focus,
a:hover {
    color: #5F37D2;
}

a.disabled {
    color: #5F37D2;
    opacity: 0.5;
}

.alert.alert-info {
    background: #5F37D2;
    color: #FFFFFF;
}

.form-control:focus,
.form-control:hover:not(:disabled):focus,
.has-float-label .btn-group button:focus,
.ui-select-bootstrap > .ui-select-match:focus {
    border-color: #5F37D2;
}

.btn-primary,
.btn-primary:active,
.btn-primary:active:hover,
.btn-primary:active:focus,
.btn-primary:focus,
.btn-primary:hover,
.btn-primary[disabled],
.btn-primary[disabled]:hover {
    border-color: #5F37D2;
    border-style: solid;
}

.btn[disabled] {
    opacity: 0.5;
}

.btn[disabled]:hover {
    opacity: 0.6;
}

.btn-cancel,
.btn-link {
    background: none;
    color: #5F37D2;
}

.btn-cancel:active,
.btn-cancel:active:hover,
.btn-cancel:active:focus,
.btn-cancel:focus,
.btn-cancel:hover,
.btn-cancel[disabled]:hover,
.btn-link:active,
.btn-link:active:hover,
.btn-link:active:focus,
.btn-link:focus,
.btn-link:hover,
.btn-link[disabled]:hover {
    color: #5F37D2;
    text-decoration: underline;
}

.has-float-label .btn-group .btn .open > .dropdown-toggle.btn-default {
    border-color: #5F37D2;
}

.dropdown-menu > .active > a {
    background-color: #5F37D2;
}

o-integer-input .o-integer-input .form-control,
o-integer-input .o-integer-input .form-control:hover:not(:disabled),
o-integer-input .o-integer-input .input-group-addon {
    border-color: #5F37D2;
}

o-integer-input .o-integer-input.disabled .form-control,
o-integer-input .o-integer-input.disabled .input-group-addon {
    border-color: #eee;
}

.pretty input:checked~.state.p-primary-o label:before,
.pretty.p-toggle .state.p-primary-o label:before {
    border-color: #5F37D2;
}

.pretty.p-default:not(.p-fill) input:checked~.state.p-primary-o label:after,
.pretty input:checked~.state.p-primary label:after,
.pretty.p-toggle .state.p-primary label:after {
    background-color: #5F37D2 !important; /* Must be important because pretty.css defines it as such */
}

.x:hover:before,
.x:hover:after {
    background-color: #5F37D2;
    opacity: 1;
}

/* ****************************************
 * ** displayMode
 * ****************************************/
#widget-container,
.form-control,
.panel {
    background-color: #fff;
}

#widget-container,
fieldset legend,
h1, h2, h3, h4, h5, h6,
.form-control,
.has-float-label > label,
.has-float-label > span {
    color: #000;
}


/** Chat dark mode styles **/
html[ng-app="outseta.widget.chat"] div#widget-container div#wrap div.widget,
html[ng-app="outseta.widget.chat"] textarea {
    background-color: #fff;
}


/* ****************************************
 * ** fieldStyle
 * ****************************************/


/* ****************************************
 * ** borderWidth
 * ****************************************/

    .btn,
    .btn:active,
    .btn:active:hover,
    .btn:active:focus,
    .btn:focus,
    .btn:hover,
    .btn[disabled] {
        border-width: 3px;
    }

    .btn-cancel,
    .btn-cancel:active,
    .btn-cancel:active:hover,
    .btn-cancel:active:focus,
    .btn-cancel:focus,
    .btn-cancel:hover,
    .btn-cancel[disabled]
    .btn-link,
    .btn-link:active,
    .btn-link:active:hover,
    .btn-link:active:focus,
    .btn-link:focus,
    .btn-link:hover,
    .btn-link[disabled] {
        border-width: 0;
    }



    .form-control,
    .form-control:hover:not(:disabled),
    .has-float-label .btn-group button,
    .input-group .form-control,
    .input-group .input-group-addon,
    o-integer-input .o-integer-input input.form-control,
    o-integer-input .o-integer-input input.form-control:hover,
    o-integer-input .o-integer-input input.form-control:focus,
    o-integer-input .o-integer-input input.form-control:hover:not(:disabled):focus,
    .stripe-control {
        border-width: 3px;
    }

    .form-control:focus,
    .form-control:hover:not(:disabled):focus,
    .has-float-label .btn-group button:focus {
        border-width: 3px;
    }

    .has-float-label .form-control:placeholder-shown:not(:focus) + * {
        top: 18px;
    }

    .has-float-label > label,
    .has-float-label > span {
        left: 19px;
        top: 12px;
    }



/* ****************************************
 * ** buttonStyle
 * ****************************************/
.btn-danger,
.btn-danger:active,
.btn-danger:active:hover,
.btn-danger:active:focus,
.btn-danger:focus,
.btn-danger:hover,
.btn-danger[disabled],
.btn-danger[disabled]:hover {
        background-color: #FFFFFF;
        color: #d9534f;
}

.btn-primary,
.btn-primary:active,
.btn-primary:active:hover,
.btn-primary:active:focus,
.btn-primary:focus,
.btn-primary:hover,
.btn-primary[disabled],
.btn-primary[disabled]:hover {
        background-color: #FFFFFF;
        color: #5F37D2;
}

.is-loading .sk-fading-circle .sk-circle:before {
    background-color: #5F37D2;
}


/* ****************************************
 * ** cornerShape (must be after borderWidth)
 * ****************************************/

    .btn,
    .btn-group > .btn {
        border-radius: 8px;
        font-size: 16px;
        font-weight: 600;
        line-height: 24px;
        padding: 8px 16px;
    }
 


/* ****************************************
 * ** Define classes
 * ****************************************/
.w-bg-color-dark,
.w-bg-color-dark:hover {
    background-color: #5F37D2 !important;
}

.w-border-color-dark {
    border-color: #5F37D2 !important;
}

.w-color-light {
    color: #FFFFFF !important;
}

.w-color-dark {
    color: #5F37D2 !important;
}

.w-color-dark-hover {
    color: #000 !important;
}

.w-color-dark-hover:hover {
    color: #5F37D2 !important;
}

.w-fill-dark {
    fill: #5F37D2 !important;
}


/* ****************************************
 * ** Identity Server overrides
 * ****************************************/

body .page-consent h1,
body .page-consent h1 small {
    color: #000;
}

body .page-consent #current-user {
    border-color: rgba(0, 0, 0, 0.1);
}

body .page-consent #current-user svg path {
    fill: #000;
    fill-opacity: 0.6;
}