/*html {
   font-size: 14px;
}*/

#crmcarecloud-api-url, #crmcarecloud-api-token {
    width: 100%;
    max-width: 800px;
}

/*.vuetify-component .theme--light.v-application {
    background: transparent;
}*/

body:not(.logged-in-carecloud) .show-when-customer-is-logged {
    display: none!important;
    visibility: hidden!important;
    opacity: 0!important;
}

body.logged-in-carecloud .hide-when-customer-is-logged {
    display: none!important;
    visibility: hidden!important;
    opacity: 0!important;
}

.carecloud-login-link + ul {
    display: none!important;
    visibility: hidden!important;
    opacity: 0!important;
}

.form-error {
    background-color: rgba(128, 128, 128, 0.1);
    padding: 0.75em 1em;
    border-left: solid red 4px;
    border-radius: .3em;
    margin: 0.75em 0;
}

.message-error {
    background-color: rgba(255, 34, 22, 0.1);
    padding: 0.75em 1em;
    border: solid #ff0000 1px;
    border-radius: .3em;
    margin: 0.75em 0;
}

.message-error h4 {
    color: red;
    margin: 0;
    font-size: 1.1em;
}

.vuetify-component {
    container-type: inline-size;
}

@container (max-width: 650px) {
    .vuetify-component .col-sm-3,
    .vuetify-component .col-sm-4,
    .vuetify-component .col-sm-6,
    .vuetify-component .col-sm-12,
    .vuetify-component .col-md-3,
    .vuetify-component .col-md-4,
    .vuetify-component .col-md-6,
    .vuetify-component .col-md-12,
    .vuetify-component .col-lg-3,
    .vuetify-component .col-lg-4,
    .vuetify-component .col-lg-6,
    .vuetify-component .col-lg-12,
    .vuetify-component .col-xl-3,
    .vuetify-component .col-xl-4,
    .vuetify-component .col-xl-6,
    .vuetify-component .col-xl-12 {
        flex: 0 0 100%!important;
        max-width: 100%!important;
    }

    .vuetify-component .col-md,
    .vuetify-component .col-lg,
    .vuetify-component .col-xl {
        flex-basis: 0!important;
        flex-grow: 1!important;
        max-width: 100%!important;
    }

    .vuetify-component .col-md-auto,
    .vuetify-component .col-lg-auto,
    .vuetify-component .col-xl-auto {
        flex: 0 0 auto!important;
        width: auto!important;
        max-width: 100%!important;
    }
}

@container (min-width: 650px) {
    .vuetify-component .col-sm-3,
    .vuetify-component .col-md-3,
    .vuetify-component .col-lg-3,
    .vuetify-component .col-xl-3 {
        flex: 0 0 25%!important;
        max-width: 25%!important;
    }

    .vuetify-component .col-sm-4,
    .vuetify-component .col-md-4,
    .vuetify-component .col-lg-4,
    .vuetify-component .col-xl-4 {
        flex: 0 0 33.3333333333%!important;
        max-width: 33.3333333333%!important;
    }

    .vuetify-component .col-sm-6,
    .vuetify-component .col-md-6,
    .vuetify-component .col-lg-6,
    .vuetify-component .col-xl-6 {
        flex: 0 0 50%!important;
        max-width: 50%!important;
    }
}