/*Fonts Padrão*/

/*
    Extra Small ≥ 576px

    sm - Small ≥ 768px
    
    md - Medium ≥ 1024px
    
    lg - Large ≥ 1280px
    
    xl - Extra Large ≥ 1920px
    
    xx - Extra Extra Large ≥ 2560px
*/


@font-face {
    font-family: "Plus Jakarta Sans Regular";
    src: url("fonts/PlusJakartaSans-Regular.ttf") format('truetype');
}

@font-face {
    font-family: "Plus Jakarta Sans Medium";
    src: url("fonts/PlusJakartaSans-Medium.ttf") format('truetype'),
}

:root {
    --primary-orange: #eb5937;
    --primary_orange_rgb: 235, 89, 55;
    --primary-black: #0d0d0d;
    --primary-white: #ffffff;
    --primary-lavender: #e8c4f2;
    --primary-green: #38735d;
    --primary-yellow: #f2b705;
    --primary-gray: #f0F0F0;
    --primary-light_green: #E2F7F0;
    --primary-light_yellow: #FFF8B6;
    --primary-light_blue: #E2F1F7;
    --primary-light_red: #FDE9E7;
    --primary-light_gray: #F8F9FA;
    --primary-dark_gray: #757575;
    --primary-dark_yellow: #f2b705;
    --primary-dark_purple: #7A0A68;
    --primary-dark_green: #38735D;
    --primary-dark_blue: #0B4881;
    --primary-dark_red: #B42318;
    --secondary-lavender: #c7b7eb;

    --primary-orange-light: #fff4f0; /* fundo suave */
    --primary-orange-dark: #c94729; /* se precisar para hover */
    /*Redefinindo esquema de cores do radzen*/
    --rz-primary: var(--primary-orange);
    --rz-secondary: var(--primary-dark_gray);
    /*--rz-secondary: var(--primary-orange);*/
    --rz-datepicker-calendar-selected-hover-background-color: var(--primary-orange);
    --rz-checkbox-checked-color: var(--primary-orange);
    --rz-switch-checked-background-color: var(--primary-orange);
    --rz-paginator-numeric-button-selected-color: var(--primary-dark_gray);
    --rz-paginator-numeric-button-selected-background-color: var(--primary-white);
    --rz-grid-header-background-color: var(--primary-light_gray);
    --rz-grid-header-cell-padding: 1.2rem .8rem;
    --rz-grid-cell-padding: 0.8rem 1.2rem;
    --rz-grid-header-color: var(--primary-orange);
}

body {
    background: none;
}

* {
    font-family: 'Plus Jakarta Sans Regular', sans-serif;
}


.f-color-white {
    color: var(--primary-white);
}

.f-color-black {
    color: var(--primary-black);
}

.f-primary-color {
    color: var(--primary-orange);
}

.f-color-gray {
    color: var(--primary-gray);
}

.f-color-dark-gray {
    color: var(--primary-dark_gray);
}

.f-color-dark-red {
    color: var(--primary-dark_red);
}

.f-color-secondary-gray {
    color: var(--secondary-lavender);
}

.bg-primary-color {
    background-color: var(--primary-orange);
}

.bg-primary-black {
    background-color: var(--primary-black);
}

.bg-primary-white {
    background-color: var(--primary-white);
}

.bg-primary-gray {
    background-color: var(--primary-gray) !important;
}

.bg-primary-dark-gray {
    background-color: var(--primary-dark_gray) !important;
}

.t-align-center {
    text-align: center;
}

.fill-primary-color {
    fill: var(--primary-orange) !important;
}

.fill-primary-white {
    fill: var(--primary-white) !important;
}

.fill-primary-black {
    fill: var(--primary-black) !important;
}

.fill-primary-dark-gray {
    fill: var(--primary-dark_gray) !important;
}

.fill-primary-gray {
    fill: var(--primary-gray) !important;
}

.dark-red-hover {
    transition: 0.6s;
    color: var(--primary-gray);
}

    .dark-red-hover path {
        fill: var(--primary-dark_gray);
    }

    .dark-red-hover:hover {
        span, path {
            color: var(--primary-dark_red) !important;
            fill: var(--primary-dark_red) !important;
        }
    }



.panel-icon {
    width: 25px;
    height: 25px;
    fill: var(--primary-orange) !important;
    display: block;
}


/*Para não cortar valores do eixo y de gráficos*/
.rz-chart svg {
    overflow: visible;
}

/*Para dar opacidade para as barras dos gráficos*/
.rz-column-series path {
    opacity: .8 !important;
}
    /*Para dar opacidade solida para as barras dos gráficos quando estiverem em hover*/
    .rz-column-series path:hover {
        opacity: 1 !important;
    }

/*Força alista de checkboxs ficarem com fonte mais pesada*/
.rz-checkbox {
    font-weight: 500 !important;
}

.no-pointer {
}

    .no-pointer:hover {
        cursor: default;
    }


/*Componentes*/

.btn-std {
    font-weight: 400;
    border-radius: .6rem;
    background-color: var(--primary-orange);
    border: none;
}

.btn-home {
    margin-top: 1rem;
    padding: .4rem .6rem;
    padding-right: .4rem;
    white-space: nowrap;
}

.arrow-icon {
    width: 30px;
    margin-right: .4rem;
}

.expand-arrow-icon {
}

    .expand-arrow-icon:hover {
        cursor: pointer;
    }

.arrow-expanded {
    transform: rotate(0.5turn);
}

.modal-input-field:disabled {
    color: var(--primary-dark_gray) !important;
    background-color: transparent !important;
    opacity: 1 !important;
    border: none !important;
}

.moderator-ui-component {
    padding: .6rem 1rem;
    border-radius: 1rem;
    border: solid 1px var(--primary-gray);
}




/* Botoões de cores personalizadas*/
.color-log {
    border: none;
    border-radius: 2rem;
    text-align: center;
    text-transform: uppercase;
}

.color-log-blue, .color-log-blue span {
    color: var(--primary-dark_blue) !important;
    background-color: var(--primary-light_blue) !important;
}

.color-log-red, .color-log-red span {
    color: var(--primary-dark_red) !important;
    background-color: var(--primary-light_red) !important;
}

.color-log-purple, .color-log-purple span {
    color: var(--primary-dark_purple) !important;
    background-color: var(--primary-lavender) !important;
}

.color-log-green, .color-log-green span, .color-log-green li {
    color: var(--primary-dark_green) !important;
    background-color: var(--primary-light_green) !important;
}

.color-log-yellow, .color-log-yellow span {
    color: var(--primary-orange) !important;
    background-color: var(--primary-light_yellow) !important;
}

.color-log-gray, .color-log-gray span {
    color: var(--primary-dark_gray) !important;
    background-color: var(--primary-gray) !important;
}


/*Inicio Tamanho de fontes*/
.f-size {
    font-size: 20px;
    font-weight: 400;
}

.f-size-sm {
    font-size: 14px;
}

.f-size-lg {
    font-size: 80px;
}

@media(max-width: 768px) {
}


.h1-title-text {
    font-size: xx-large;
    font-family: 'Plus Jakarta Sans Medium';
    margin: 0;
    padding: 0;
}

.h2-title-text {
    font-size: xx-large !important;
    font-weight: 500 !important;
    font-family: 'Plus Jakarta Sans Medium' !important;
    margin: 0;
    padding: 0;
}

.title-text {
    font-family: 'Plus Jakarta Sans Medium' !important;
    font-weight: 500 !important;
    margin: 0;
    padding: 0;
}

.description-text {
    padding: 0;
    margin: 0;
    font-size: large;
}

.sub-description-text {
    padding: 0;
    margin: 0;
    font-size: large;
}


/*Para Telas "Large" o texto é maior*/
@media (min-width:1280px) {
    .description-text {
        font-size: x-large;
    }

    .h1-title-text {
        font-size: xxx-large;
    }
}

/*Para telas muito pequenas (Ex: Galaxy Fold) Ajuste de fonte*/
@media (max-width:300px) {
    .description-text {
        font-size: medium;
    }

    .h1-title-text {
        font-size: x-large;
    }

    .sub-description-text {
        font-size: small;
    }

    .h2-title-text {
        font-size: large;
    }
}

/*Fim Tamanho de fontes*/



/*
    Extra Small ≥ 576px

    sm - Small ≥ 768px
    
    md - Medium ≥ 1024px
    
    lg - Large ≥ 1280px
    
    xl - Extra Large ≥ 1920px
    
    xx - Extra Extra Large ≥ 2560px
*/




.plus-signal {
    fill: var(--primary-white) !important;
}


.hvr-txt-black:hover {
    color: var(--primary-black);
    transition: .6s;
}

    .hvr-txt-black:hover .svg-arrow {
        fill: var(--primary-black) !important;
        transition: .6s;
    }

    .hvr-txt-black:hover .plus-signal {
        fill: var(--primary-black) !important;
        transition: .6s;
    }

.svg-arrow {
    fill: var(--primary-white);
}

.btn-hvr:hover {
    background-color: var(--primary-white);
    color: var(--primary-orange);
    transition: .6s;
}

    .btn-hvr:hover .svg-arrow {
        fill: var(--primary-orange);
        transition: .6s;
    }


.cm-btn {
    color: var(--primary-dark_gray);
}

    .cm-btn .modal-control-icon {
        fill: var(--primary-dark_gray);
    }

    .cm-btn:hover {
        background-color: var(--primary-white);
        color: var(--primary-orange) !important;
        transition: .4s;
    }

        .cm-btn:hover .modal-control-icon {
            fill: var(--primary-orange) !important;
            transition: .4s;
        }

    .cm-btn .modal-control-icon {
        width: 18px !important;
        margin-right: 4px;
    }
/*Soluções*/
.scrollable-row {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 10px;
}

@media (min-width:1280px) {
    .scrollable-inner {
        display: flex;
        justify-content: center !important;
        flex-direction: row;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: nowrap;
        width: 100%;
    }
}

@media (max-width:1280px) {
    .scrollable-inner {
        display: inline-flex;
        justify-content: center;
        gap: 10px;
    }
}

.solucoes-card-container {
    flex-shrink: 0;
    min-width: 250px;
    margin: 0 5px;
}



@media (min-width:768px) {
    .solution-custom-bar {
        right: 0px;
        top: 0px;
    }
}

@media (max-width:768px) {
    .solution-custom-bar {
        bottom: -25%;
        right: 20%;
        transform: rotate(90deg);
    }
}

.rz-dialog-titlebar {
    display: none !important;
}

.rz-dialog-side-titlebar {
    display: none !important;
}
.empty-message {
    width: 100%;
    padding: 1rem 1.5rem;
    border-radius: 8px;
    background-color: var(--primary-orange-light) !important;
    color: var(--primary-orange) !important;
    border: 1px solid var(--primary-orange) !important;
    font-size: 1rem;
    font-weight: 500;
}