:root {
    --cor-principal: #6B8E6C;
    --cor-secundaria: #eaf4ec;
    --cinza: #B1B2B5;
    --cinza-texto: #757575;
    --cinza-botoes-pagamento: #dee2e6;
    --cor-background: #fafafa;
    --cor-principal-com-transparencia: rgba(107, 142, 108, 0.2);
    --cor-vermelha: #8a0404;
    --cor-vermelha-com-transparencia: rgba(138, 4, 4, 0.2);
    --cor-pedido-espera: #17a2b8;
    --cor-pedido-entrega: #ff9800;
    --cor-pedido-preparo: #b117b8;
    --cor-pedido-detalhe: #1976d2;
    --cor-pedido-finalizado: #7cb342;
    --cor-pedido-cancelado: #b81717;
}

html {
    background-color: #f8f9f9;
}

input.valid.modified:not([type=checkbox]):not([type=radio]) {
    outline: 1px solid #26b050;
    border-radius: 7px;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

.blazored-toast-container.position-topright {
    top: calc(2rem + 50px) !important;
    right: 1rem !important;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.logo-img-loading {
    max-width: 30rem;
    max-height: 30rem;
}

.spinner-loading-app {
    color: var(--cor-principal) !important;
}

code {
    color: #c02d76;
}

.w-90 {
    width: 90% !important;
}

.w-60 {
    width: 60% !important;
}

.w-50 {
    width: 50% !important;
}

.modal-90 {
    max-width: 90% !important;
}

#google-translate-trap,
#input-trap {
    display: none;
}

label.label-transparente {
    background-color: transparent !important;
    color: var(--cinza-texto);
}

.form-com-transparencia > .form-control:focus ~ label::after,
.form-com-transparencia > .form-control:not(:placeholder-shown) ~ label::after {
    background-color: transparent !important;
}

.form-com-transparencia > .form-control:focus {
    box-shadow: 0 0 0 .25rem var(--cor-principal-com-transparencia);
    border: none;
}

h1:focus-visible {
    outline: none !important;
}

.card-loading {
    border-radius: 12px;
}

.blazored-toast-container {
    z-index: 1032 !important;
}

/* Blazored modal */
.bm-container {
    z-index: 1031 !important;
}

.blazored-modal-focus-trap {
    margin-top: 24px;
}

.blazored-modal {
    border-radius: 12px !important;
}

.modal-container {
    background-color: white;
    border-radius: 12px;
    padding: 1.5rem 1.25rem;
    width: 90vw;
    max-width: 400px;
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.2);
    margin: 0 auto;
    min-height: 420px;
}

.btn-close {
    position: absolute !important;
    top: -12px;
    right: -12px;
    width: 32px;
    height: 32px;
    border: 1px solid var(--cinza);
    border-radius: 50%;
}

/* TODO: verificar a necessidade (se a lib suporta sem precisar disso) */
.modal-scroll .modal-body {
    max-height: 70vh;
    overflow-y: auto;
}

/*Radzen datepicker*/
.rz-datepicker > .rz-inputtext:not(:disabled):not(.rz-state-disabled):focus {
    box-shadow: none !important;
    border: 2px solid var(--cor-principal) !important;
}

.rz-dropdown:not(:disabled):not(.rz-state-disabled):focus {
    box-shadow: 0 0 0 1px var(--cor-principal-com-transparencia) !important;
    border: 1px solid var(--cor-principal) !important;
}

.rz-dropdown-items li.rz-state-highlight,
.rz-dropdown-item.rz-state-highlight {
    background-color: var(--cor-principal) !important;
    color: white !important;
}

.rz-dropdown-items li:hover,
.rz-dropdown-item:hover {
    background-color: var(--cor-secundaria) !important;
    color: black !important;
}

.rz-calendar-view td .rz-state-active,
.rz-calendar-view td .rz-state-active.rz-state-focused,
.rz-calendar-view td .rz-state-active.rz-calendar-today.rz-state-focused {
    background-color: var(--cor-principal) !important;
}

.rz-calendar-view td span.rz-state-default:not(.rz-state-active):hover {
    background-color: var(--cor-secundaria) !important;
}

.rz-button.rz-variant-text.rz-secondary:not(.rz-state-disabled):active,
.rz-button.rz-variant-text.rz-secondary:not(.rz-state-disabled):hover {
    color: var(--cor-principal) !important;
    background-color: var(--cor-secundaria) !important;
}

.rz-button.rz-variant-text.rz-secondary.rz-shade-default {
    color: var(--cor-secundaria) !important;
}

#painel-admin .btn-link,
.bm-container .btn-link {
    border: none;
    padding: 6px 10px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#painel-admin .btn-primary-link,
.bm-container .btn-primary-link {
    background-color: var(--cor-principal) !important;
    color: white !important;
    transition: background-color 0.2s ease-in-out;
}

    #painel-admin .btn-primary-link:hover,
    .bm-container .btn-primary-link:hover {
        background-color: #88a88a;
        cursor: pointer;
    }

    #painel-admin .btn-primary-link i,
    .bm-container .btn-primary-link i {
        color: white;
    }

#painel-admin .btn-secondary-link,
.bm-container .btn-secondary-link {
    background-color: white;
    color: var(--cor-principal);
    border-color: var(--cor-principal) !important;
    transition: background-color 0.2s ease-in-out;
}

    #painel-admin .btn-secondary-link:hover,
    .bm-container .btn-secondary-link:hover {
        box-shadow: 0 0 0 .25rem var(--cor-principal-com-transparencia);
    }

    #painel-admin .btn-secondary-link i,
    .bm-container .btn-secondary-link i {
        color: var(--cor-principal);
    }

#painel-admin .btn-danger-link,
.bm-container .btn-danger-link {
    background-color: #b33a3a;
    color: white;
    transition: background-color 0.2s ease-in-out;
}

    #painel-admin .btn-danger-link:hover,
    .bm-container .btn-danger-link:hover {
        background-color: #9e1818;
    }

    #painel-admin .btn-danger-link i,
    .bm-container .btn-danger-link i {
        color: white;
    }

#painel-admin .form-control:focus,
.bm-container .form-control:focus {
    border-color: var(--cor-principal) !important;
    box-shadow: 0 0 0 .25rem var(--cor-principal-com-transparencia) !important;
}

select.select-padrao-painel,
::picker(select) {
    appearance: base-select;
    min-height: 38px;
}

    select.select-padrao-painel::picker-icon {
        display: none !important;
    }

#painel-admin select.select-padrao-painel > option,
.bm-container select.select-padrao-painel > option {
    background-color: var(--cor-background) !important;
    padding-top: 8px;
    padding-bottom: 8px;
}

#painel-admin select.select-padrao-painel option:checked,
.bm-container select.select-padrao-painel option:checked {
    background-color: var(--cor-principal) !important;
    color: white;
}

#painel-admin select.select-padrao-painel option:hover,
.bm-container select.select-padrao-painel option:hover {
    background-color: var(--cor-secundaria) !important;
    color: black;
}

#painel-admin .table-striped > tbody > tr:nth-of-type(odd) > *,
.bm-container .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: var(--cinza-claro) !important;
}

#painel-admin .table-hover tbody tr:hover > *,
.bm-container .table-hover tbody tr:hover > * {
    background-color: var(--cor-secundaria) !important;
}

#painel-admin .form-group,
.bm-container .form-group {
    margin-bottom: 1rem !important;
}

#painel-admin .form-switch .form-check-input:checked,
.bm-container .form-switch .form-check-input:checked {
    background-color: var(--cor-secundaria);
    border-color: var(--cor-principal);
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e %3ccircle r='3' fill='%236b8e6c'/%3e%3c/svg%3e") !important;
}

#painel-admin .form-check-input:focus,
.bm-container .form-check-input:focus {
    border-color: var(--cor-principal);
    box-shadow: 0 0 0 .25rem var(--cor-principal-com-transparencia);
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e %3ccircle r='3' fill='%236b8e6c'/%3e%3c/svg%3e") !important;
}

#painel-admin .form-check-input:checked,
.bm-container .form-check-input:checked {
    background-color: var(--cor-principal);
    border-color: var(--cor-principal);
}

#painel-admin .blazored-typeahead:focus-within,
.bm-container .blazored-typeahead:focus-within {
    box-shadow: 0 0 0 .25rem var(--cor-principal-com-transparencia);
}

#painel-admin .blazored-typeahead__input-icon:focus,
.bm-container .blazored-typeahead__input-icon:focus {
    box-shadow: 0 0 0 .25rem var(--cor-principal-com-transparencia);
}

#painel-admin .blazored-typeahead__results,
.bm-container .blazored-typeahead__results {
    background-color: var(--cor-background) !important;
}

#painel-admin .blazored-typeahead__result:hover,
#painel-admin .blazored-typeahead__result:focus,
.bm-container .blazored-typeahead__result:hover,
.bm-container .blazored-typeahead__result:focus {
    background-color: var(--cor-secundaria);
    border-color: var(--cor-secundaria);
    color: black;
}

#painel-admin .blazored-typeahead__selected-item,
.bm-container .blazored-typeahead__selected-item {
    background-color: var(--cor-principal);
    color: white;
}

#painel-admin .mw-modal {
    max-width: 1090px;
}

#painel-admin a.dropdown-item:focus,
#painel-admin a.dropdown-item:hover,
.bm-container a.dropdown-item:focus,
.bm-container a.dropdown-item:hover {
    background-color: var(--cor-secundaria) !important;
    cursor: pointer;
}

#painel-admin a.dropdown-item:active,
.bm-container a.dropdown-item:active {
    background-color: var(--cor-principal) !important;
    color: white;
}

a:not([class]) {
    color: var(--cor-principal) !important;
    text-decoration: none;
    transition: color 0.2s ease, text-decoration 0.2s ease;
}
    a:not([class]):hover {
        text-decoration: underline;
    }

.sis-option input[type="radio"] {
    accent-color: var(--cor-principal);
}

.cursor-pointer {
    cursor: pointer !important;
}

@media (max-width: 1199px) {
    .app div.rz-popup {
        left: auto !important;
        right: 20px !important;
    }
}

@media screen and (min-width: 1200px) {
    .app div.rz-popup {
        left: auto !important;
        right: calc((100vw - 1024px) / 2 + 20px) !important;
    }
}