:root {
    --main: #0062FF;
    --blueDark: #011936;
    --cyan: #80D3DF;
    --cyanText: #61EBFF;
    --purple: #AD84F9;
    --purpleText: #BF9CFF;
    --pink: #FF637D;
    --pinkText: #FF9EAD;
    --green: #AFCC4E;
    --greenText: #E0FF7A;
    --red: #c94645;
}

.loader {
    /*    position: fixed;
    left: 0px;
    top: 0px;*/
    width: 300px;
    height: 300px;
    z-index: 9999;
    background: url('../images/loading.gif') 50% 50% no-repeat rgb(249,249,249);
}

.message {
    overflow-y: hidden;
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100vw;
    height: 100vh;
    z-index: 9999;
    background: rgba(0,0,0,0.5);
}

html, body {
    height: 100%;
}

app {
    display: block;
    height: 100%;
}

.header-logo {
    flex-shrink: 0;
    border-radius: 0rem;
    background-image: url('../images/logotipo_bom-demais.svg');
    background-size: contain;
    background-repeat: no-repeat;
    width: 150px;
    height: 32px;
    /*    flex-shrink: 0;
    background-color: currentColor;
    -webkit-mask: url('../images/logotipo_bom-demais.svg');
    mask: url('../images/logotipo_bom-demais.svg');
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 180px;
    height: 24px;*/
}

#blazor-error-ui {
    background: inherit;
    bottom: 0;
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 100001;
}

.bg-bomdmais {
    background-color: #0062FF;
    color: white;
}

.cardEx {
    box-shadow: 5px 5px 6px #0000000D;
    border: 1px solid #D0DAE5;
    border-radius: 60px 60px 24px 24px !important;
}

.linkCard {
    color: #6D6D6D !important
}

.titleCard {
    font-weight: bold;
    text-align: center;
}


.cardStep {
    border-radius: 2rem !important;
    color: var(--main);
    border: 1px solid #D0DAE5 !important;
    padding: 0.5rem;
    margin-bottom: 1rem;
}

    .cardStep.active {
        border: 1px solid var(--main) !important;
    }

    .cardStep i {
        background-color: white;
        border: 1px solid #D0DAE5;
        border-radius: 1rem;
        width: 30px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .cardStep i.active {
            border: 1px solid var(--main) !important;
        }

.cardStepIcon {
    margin: auto;
    margin-bottom: -1.4rem;
}

.planItems {
    height: 200px;
    max-height: 250px;
    overflow-y: auto;
}



.pvText, .dropdown-header, .dropdown-item {
    color: var(--main) !important;
}

.pvText-Cyan {
    color: var(--cyanText);
}

.pvText-Purple {
    color: var(--purpleText);
}

.pvText-Pink {
    color: var(--pinkText);
}

.pvText-Green {
    color: var(--greenText);
}

.pvBg-Cyan {
    background-color: var(--cyan);
    color: white;
}

.pvBg-Purple {
    background-color: var(--purple);
    color: white;
}

.pvBg-Pink {
    background-color: var(--pink);
    color: white;
}


.pvBg-Green {
    background-color: var(--green) !important;
    color: white;
}

.pvBg-Red {
    background-color: var(--red) !important;
    color: white;
}

.pvBg-Light {
    background-color: #EFF2F5;
}

.pvBg {
    background-color: var(--main);
    color: white !important;
}

.buttonPlus {
    width: 24px;
    height: 24px;
    justify-content: center;
    align-items: center;
    border-radius: 12px;
    margin-right: 0.5rem
}

.validation-message {
    color: red;
}

.rounded-4{
    border-radius: 1rem!important;
}

.pointer{
    cursor: pointer!important;
}