:root {
    --jc-blue: 13, 110, 253;
    --jc-indigo: 102, 16, 242;
    --jc-purple: 111, 66, 193;
    --jc-pink: 214, 51, 132;
    --jc-red: 220, 53, 69;
    --jc-orange: 253, 126, 20;
    --jc-yellow: 255, 193, 7;
    --jc-green: 25, 135, 84;
    --jc-teal: 32, 201, 151;
    --jc-cyan: 13, 202, 240;
    --jc-white: 255, 255, 255;
    --jc-gray: 108, 117, 125;
    --jc-gray-dark: 52, 58, 64;
    --jc-primary: 13, 110, 253;
    --jc-secondary: 108, 117, 125;
    --jc-success: 25, 135, 84;
    --jc-info: 13, 202, 240;
    --jc-warning: 255, 193, 7;
    --jc-danger: 220, 53, 69;
    --jc-light: 248, 249, 250;
    --jc-dark: 33, 37, 41;
    --jc-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
}

/* ****************************************************************************************************** */

html,
body {
    width: 100%;
    height: 100%;
    padding: 0px;
    margin: 0px;
}

a,
tr,
td,
li,
.Titulo,
button,
i,
.par,
.impar,
#Mensagens {
    cursor: pointer;
}

i:after:not(.limpo) {
    content: " ";
    white-space: pre;
}

td>i:after {
    content: none !important;
    white-space: pre;
}

.col-minima {
    width: 1%;
    white-space: nowrap;
}

/* *********************************************************************** */

.nav-link:not(:last-child) {
    padding: 0 !important;
    padding-right: 1rem !important;
}

.nav-link:last-child {
    padding: 0 !important;
}

.nav-item:not(:last-child) {
    padding: 0 !important;
    padding-right: 1rem !important;
}

.nav-item:last-child {
    padding: 0 !important;
}

.nav-item.dropdown {
    padding: 0 !important;
}

.dropdown-toggle::after {
    margin-left: 0 !important;
}

#Menu>li>a::after {
    content: none !important;
}

#Menu>li>a>i::after {
    content: none !important;
}

/* *********************************************************************** */

.ulMenu {
    padding: 0rem;
    user-select: none;
}

.ulMenu>li {
    font-weight: normal;
    list-style-type: none;
    padding: .25rem;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.ulMenu>li:hover:not(.selecionado) {
    backdrop-filter: invert(0.5);
    /* filter: invert(1); */
    text-shadow: 0px 0px 1px black;
}

.card[class="vidro"] .ulMenu>li.selecionado {
    backdrop-filter: brightness(.8);
    filter: invert(1);
}

.card:not([class^="vidro"]) .ulMenu>li.selecionado {
    backdrop-filter: brightness(.8);
    filter: none;
}

.ulMenu>li.marcas {
    display: grid;
    grid-template-columns: 10px 1fr;
}


/**********************************************************************
tableJC - Tabela com cabeçalho fixo
***********************************************************************/

.tableJC {
    user-select: none;
    vertical-align: middle;
}

.tableJC>thead>tr>th {
    position: sticky !important;
    top: 0 !important;
    white-space: nowrap;
}

.tableJC>tbody>tr:hover:not(.selecionado) {
    backdrop-filter: invert(0.3);
    text-shadow: 0px 0px 1px black;
}

.tableJC>tbody>tr:hover:not(.selecionado) i {
    text-shadow: 0px 0px 1px black, 0px 0px 3px white;
}


.card:not([class="vidro"]) .tableJC>tbody>tr.selecionado {
    backdrop-filter: brightness(.8);
    filter: invert(1);
}

.card:not([class="vidro"]) .tableJC>tbody>tr.selecionado i {
    filter: invert(1);
    text-shadow: 0px 0px 1px black, 0px 0px 3px white;
}

.card[class^="vidro"] .tableJC>tbody>tr.selecionado {
    backdrop-filter: brightness(.8);
    filter: none;
}

/* *********************************************************************** 
Card 
*********************************************************************** */

.card-header {
    min-height: 40px;
    padding: .25rem;
    padding-left: .75rem;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 1fr;
    grid-column-gap: .25rem;
    align-items: center;
}

.card-header>titulo {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.card-header>barra {
    display: flex;
    align-items: center;
    flex-direction: row;
}

.card-header>barra>i {
    margin-right: .5rem !important;
}

.card-header>barra>i:after {
    content: none !important;
}

.card-body {
    overflow-y: auto;
    padding: 0px;
}

.card-footer {
    padding: .50rem;
}

.card-footer>*:not(:first-of-type) {
    margin-right: .25rem;
}

.aguarde>.modal-dialog>.modal-content i:after {
    content: none !important;
}

.aguarde>.modal-dialog>.modal-content {
    width: fit-content;
    margin: auto;
}

/* ***********************************************************************
bootbox
*********************************************************************** */

.bootbox.secondary {
    background-color: rgba(var(--jc-dark), .9);
}

.bootbox.centralizado>.modal-dialog {
    height: calc(100% - 64px - .50rem) !important;
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bootbox.formulario>.modal-dialog {
    max-width: 100% !important;
    max-height: 100% !important;
    width: 100% !important;
    height: max-content !important;
    margin: 0px;
    padding: .50rem;
}

.bootbox.pdf .modal-body {
    padding: .25rem;
    padding-bottom: 0rem;
}

.bootbox.p-0 .modal-body {
    padding: 0px;
}

.alert>.modal-dialog>.modal-content {
    background-color: rgb(var(--jc-warning));
    color: rgb(var(--jc-dark));
}

.danger>.modal-dialog>.modal-content {
    background-color: rgb(var(--jc-danger));
    color: rgb(var(--jc-light));
}

.info>.modal-dialog>.modal-content {
    background-color: rgb(var(--jc-info));
    color: rgb(var(--jc-light));
}

.bootbox-close-button {
    background-color: inherit !important;
    color: inherit !important;
    border: none !important;
    box-shadow: none !important;
}

.bboxPainel80>:not(.modal-sm).modal-dialog {
    max-width: 80% !important;
}

.modal-overflow>.modal-dialog>.modal-content>.modal-body {
    max-height: calc(100vh - 200px) !important;
    overflow-y: auto !important;
}

/**********************************************************************
Componentes externos
***********************************************************************/

.dropstart .dropdown-toggle::before {
    display: none;
}

.datepicker,
.datepicker-days>.table-condensed {
    margin: auto !important;
}

.tooltip-inner {
    text-align: left !important;
}

fieldset>.input-group:not(:last-child) {
    margin-bottom: .25rem;
}

.form-floating:not(:last-child) {
    margin-bottom: .25rem;
}

.trumbowyg-editor-visible {
    height: -webkit-fill-available;
}

.trumbowyg-editor {
    height: calc(100% - 38px) !important;
}

/***********************************************************************
Padroes do sistema
***********************************************************************/

#AreaDeTrabalho {
    width: inherit;
    height: inherit;
    border: none;
    overflow: auto;
    background: transparent;
}

rodape {
    padding: .25rem;
    border-radius: 0 !important;
}

.Principal {
    background-image: url('../<?php echo $app->backgroundImg ?>');
    overflow: hidden;
    display: grid;
    grid-template-rows: auto 1fr auto;
    <?php echo $app->backgroundCSS ?>
}

.janela {
    background: transparent;
    padding: .25rem;
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: 100%;
    gap: 0px;
    /* padding: 0px; */
}

.janelaCentro {
    /* --bs-bg-opacity: 1; */
    background-color: transparent !important;
    align-items: center !important;
    justify-content: center !important;
    display: flex !important;
}

.janela.dark>header {
    background-color: rgba(25, 25, 25, 1);
    color: white;
}

.janela.dark>div:first-child {
    background-color: rgba(25, 25, 25, 1);
    color: white;
}

.janela.dark>div {
    background-color: rgba(32, 32, 32, 1);
    color: white;
}

.janela.dark .popover {
    background-color: rgba(var(--jc-light), .5) !important;
    color: rgba(var(--jc-dark), 1) !important;
    font-weight: bolder !important;
    backdrop-filter: blur(5px) !important;
    box-shadow: 0rem 0rem .25rem rgba(var(--jc-dark), .50) !important;
}

.scrollJC {
    overflow-y: overlay !important;
}

.scrollJC::-webkit-scrollbar {
    display: none;
    width: 5px;
}

.scrollJC::-webkit-scrollbar-thumb {
    /* background: rgba(255, 255, 255, 0.5); */
    background: currentColor;
    opacity: 0.5;
    backdrop-filter: invert(1);
}

.scrollJC:hover::-webkit-scrollbar {
    display: initial;
}

.modal-header {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;
    --bs-text-opacity: 1;
    color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
}

.modal-footer {
    padding: .5rem;
}

.modal-80>.modal-dialog {
    max-width: 80% !important;
}

.campoJSON>table>tbody>tr>td,
.campoJSON>table>tbody>tr {
    border: none;
}

.campoJSON>table>tbody>tr:not(:first-child)>td {
    padding-top: 0px;
}

.campoJSON>table>tbody>tr>td {
    background-color: silver;
}

.jcElipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

select.jcSelect{
    border: 0!important;
    border-radius: 0!important;
    padding: 0!important;
    height: 100%!important;
    width: 100%!important;
    background-color: transparent!important;
}

/* select.jcSelect>option[selected] {
    background-color: yellow;
} */

select.jcSelect>option[selected]::before {
    content: '✓ ';
}