html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

@media (min-width: 992px) {
    .modal-fullscreen {
        width: 90%;
        max-width: 90%;
        margin: auto;
    }
}

@media (max-width: 576px) {
    .btn {
        font-size: 0.9rem;
        padding: 0.4rem 0.8rem;
    }
}

.modal-backdrop {
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1040; /* Backdrop padrão */
}

.modal-backdrop-secondary {
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1060; /* Acima do backdrop padrão */
}

.modal.fade.show {
    z-index: 1050; /* Modal padrão visível */
}

.modal-confirmacao {
    z-index: 1070 !important; /* Modal de confirmação */
}

.itens-modal-body {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: auto;
    max-height: 80vh;
}

.modal-itens {
    display: flex;
    flex-direction: column;
    height: 100vh; /* Altura da viewport */
}

.modal-footer {
    flex: 0 0 auto;
    border-top: none !important
}

.modal-header {
    flex: 0 0 auto;
    border-bottom: none !important
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: none;
}

html {
    position: relative;
    min-height: 100%;
}

/*body {
    margin-bottom: 60px;
}
*/
.fs60px {
    font-size: 60px;
}

.text-bold {
    font-weight: bold;
}

.text-darkGrey {
    color: darkslategray;
}

.selected {
    background-color: #8a8888;
    cursor: pointer;
    font-weight: bold
}

tbody tr:hover {
    cursor: pointer;
}

td button {
    margin: 0;
    padding: 0;
}

.btn-black {
    background-color: black;
    color: white;
}

.btn-light-grey {
    background-color: #D3D3D3;
    color: #000000;
}

.btn-dark-grey {
    background-color: #808080;
    color: #ffffff;
}


.btn.btn-outline-secondary {
    color: #6c757d;
}

    .btn.btn-outline-secondary.btn-secondary {
        color: #fff;
    }

    .btn.btn-outline-secondary:hover {
        color: #fff;
    }

.badge-warning {
    background-color: #ffc107; /* Amarelo */
}

.badge-orange {
    background-color: #fd7e14; /* Laranja */
}

.badge-danger {
    background-color: #dc3545; /* Vermelho */
}

.badge-success {
    background-color: #28a745; /* Verde */
}

.validation-summary-errors ul li {
    color: #dc3545;
}


.material-symbols-rounded {
    color: #6c757d;
}

select:disabled {
    background-color: #e9ecef; /* Cinza claro */
    color: #6c757d; /* Cinza escuro */
    cursor: not-allowed; /* Cursor de bloqueado */
    opacity: 0.6;
}

a[data-bs-toggle="popover"] {
    cursor: pointer !important;
}


.right-side {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: nowrap;
}

.name-company,
.store,
.user {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.nav-company {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0; /* essencial para o ellipsis funcionar em flex */
}

.company-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
    max-width: 220px; /* ajuste conforme o espaço que pode ocupar */
}

.material-icons.caret {
    font-size: 23px;
    margin-left: 0px;
}

.dropdown-menu .drop-user {
    padding: 12px 16px;
    border-bottom: 1px solid #e9ecef;
}

.drop-links a {
    display: flex;
    gap: 8px;
    padding: 6px 12px;
    align-items: center;
    text-decoration: none;
    color: inherit;
}

.right-side .dropdown-menu {
    min-width: 220px;
    padding: 10px;
}

.right-side .drop-user {
    padding: 5px 12px;
}

.right-side .drop-links a,
.right-side .drop-btn a {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
}
.dropdown-menu {
    max-width: 260px;
    width: max-content;
    min-width: 200px;
    right: 0; /* força alinhamento à direita do botão */
    left: auto !important;
    transform: translateX(-10px); /* opcional: leve ajuste para caber melhor */
    white-space: normal;
    word-break: break-word;
}
.drop-user {
    padding: 10px;
    max-width: 240px;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: break-word;
    text-align: left;
}

.fin-two-col {
    margin-top: .10rem;
}

.fin-group {
    border: 0 solid rgba(0,0,0,.08);
    border-radius: .5rem;
    padding: .75rem .85rem;
    background: #fff;
}

.fin-inline-group {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
}

.fin-section-title {
    font-weight: 600;
    font-size: .95rem;
    color: #333;
}

    .fin-section-title .kv-label {
        font-weight: 700;
        font-size: .8rem;
        color: #666;
        margin-bottom: .25rem;
    }

.fin-total {
    text-align: right;
    min-width: 240px;
}

.fin-separator {
    border-top: 1px solid rgba(0, 128, 0, 0.15); /* verde bem claro */
    margin: .6rem 0 .9rem 0;
}

.fin-field {
    margin-bottom: .65rem;
}

/* Label menor já existe; só reforço altura/line-height para alinhar */
.simple2-labelMenor {
    font-size: .8rem;
    font-weight: 600;
    color: #555;
    margin-bottom: .25rem;
    line-height: 1.1;
    display: inline-block;
}

/* Padroniza inputs compactos */
.form-control-sm,
.form-select-sm {
    min-height: 2rem;
}

/* Grid da coluna 2 (parcelas) — linhas com leve divisão */
.parcela-row {
    border-bottom: 1px dashed rgba(0,0,0,.06);
    padding-bottom: .4rem;
}

    .parcela-row:last-child {
        border-bottom: 0;
    }
    /* Consistência de alinhamento vertical dos rótulos na coluna 2 */
    .parcela-row .simple2-labelMenor {
        margin-bottom: .35rem;
    }

/* Correções de largura para inputs curtos sem quebrar responsividade */
.w-80 {
    width: 80px;
}

.w-120 {
    width: 120px;
}

.w-180 {
    width: 180px;
}

.w-200 {
    width: 200px;
}

/* Estado de leitura — aparência de label em branco, texto preto, negrito */
.fin-input-plain[readonly],
.fin-input-plain-label {
    border: none;
    background-color: #fff !important; /* Fundo branco */
    padding-left: 0;
    color: #000 !important; /* Texto preto */
    font-weight: bold; /* Negrito */
    font-size: 1.2rem;
    cursor: default;
    box-shadow: none;
}

.fin-input-plain[readonly] {
    text-align: left !important; /* Alinha à esquerda, sobrepõe .text-end */
}

    .fin-input-plain[readonly]:focus,
    .fin-input-plain-label:focus {
        background-color: #fff !important;
        color: #000 !important;
        box-shadow: none;
    }

/* Título de seção da coluna 1 em grid simples para alinhar rótulo + input */
.fin-formrow {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: end;
    gap: .75rem;
}

/* Em telas menores, quebra para 1 coluna */
@@media (max-width: 991.98px) {
    .fin-formrow {
        grid-template-columns: 1fr;
    }

    .fin-total {
        text-align: left;
        min-width: 0;
    }
}

/* Label "Valor Total (R$)" na MESMA linha, sem quebra */
.kv-label {
    font-weight: 600;
    font-size: 1.2rem;
    color: #000;
    white-space: nowrap; /* Não quebra linha */
    margin: 0; /* Remove margens extras */
    line-height: 1.2; /* Ajusta altura */
}

/* Classe utilitária opcional caso use container próprio sem Bootstrap */
.fin-inline-nowrap {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: nowrap; /* impede quebra entre label e input */
}

/* Acessibilidade: foco */
.form-control:focus,
.form-select:focus,
.btn:focus {
    box-shadow: 0 0 0 .15rem rgba(13,110,253,.15);
}

/* —— AFINES DE UI/UX (somente apresentação) —— */
.page-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: 1rem;
}

    .page-title .icon {
        width: 38px;
        height: 38px;
        border-radius: 10px;
        background: #e9f7ef;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        color: #168f4e;
    }

.filters-card {
    background: #fff;
    border: 1px solid #eaecef;
    border-radius: 14px;
    box-shadow: 0 4px 14px rgba(16,24,40,.04);
}

    .filters-card .form-label {
        font-size: .825rem;
        color: #475467;
        margin-bottom: .25rem
    }

.filters-actions {
    gap: .5rem
}


.btn-ghost {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    color: #111827
}

.chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .35rem .6rem;
    border-radius: 999px;
    font-size: .8rem;
    border: 1px solid #e5e7eb;
    background: #fff;
    color: #111827
}

    .chip .dot {
        width: 8px;
        height: 8px;
        border-radius: 999px;
        background: #16a34a
    }

/* —— Chips diferenciados —— */
.chip-data {
    background: #e0f2fe; /* azul claro */
    color: #075985; /* azul escuro */
    border: 1px solid #7dd3fc;
}

.chip-label-data {
    color: #0c4a6e; /* azul mais forte */
    font-weight: 700;
}

.chip-caixa {
    background: #dcfce7; /* verde claro */
    color: #166534; /* verde escuro */
    border: 1px solid #86efac;
}

.chip-label-caixa {
    color: #14532d; /* verde mais forte */
    font-weight: 700;
}

.result-card {
    background: #fff;
    border: 1px solid #eaecef;
    border-radius: 14px;
    box-shadow: 0 4px 14px rgba(16,24,40,.04)
}

    .result-card .card-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
        padding: 1rem 1rem .5rem
    }

    .result-card .meta {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem
    }

.table-nova {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0
}

    .table-nova thead th {
        position: sticky;
        top: 0;
        background: #f9fafb;
        z-index: 1;
        font-weight: 600;
        font-size: .85rem;
        padding: .625rem .75rem;
        border-bottom: 1px solid #e5e7eb;
        color: #111827
    }

    .table-nova tbody td {
        padding: .6rem .75rem;
        border-bottom: 1px solid #eef2f7;
        vertical-align: middle
    }

    .table-nova tr:hover td {
        background: #fbfcfe
    }

.text-money {
    text-align: right;
    font-variant-numeric: tabular-nums
}

.badge-es {
    font-size: .75rem;
    padding: .15rem .45rem;
    border-radius: 6px;
    font-weight: 600
}

.badge-e {
    background: #e9f7ef;
    color: #15803d;
    border: 1px solid #c9efd9
}

.badge-s {
    background: #fef3f2;
    color: #b42318;
    border: 1px solid #ffd4ce
}

.empty-state {
    border: 1px dashed #d0d5dd;
    border-radius: 14px;
    padding: 1.25rem;
    background: #fcfcfd;
    color: #667085;
    text-align: center
}

.accordion-button-custom {
    background: transparent;
    border: none;
    padding: 0;
    font-weight: 700;
    color: #0f172a;
}

    .accordion-button-custom .sub {
        display: block;
        font-weight: 400;
        font-size: .85rem;
        color: #6b7280
    }

.totais-row {
    background: #fafafa;
    font-weight: 700
}

.table-wrap {
    border: 1px solid #eaecef;
    border-radius: 12px;
    overflow: hidden
}

.tools {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap
}

    .tools .btn {
        padding: .45rem .7rem;
        border-radius: 10px
    }

.muted {
    color: #6b7280
}

.btn-expand {
    background: #dcfce7; /* verde claro */
    border: 1px solid #86efac;
    color: #166534;
}

    .btn-expand:hover {
        background: #bbf7d0;
    }

.btn-collapse {
    background: #fff7ed; /* laranja claro */
    border: 1px solid #fdba74;
    color: #9a3412;
}

    .btn-collapse:hover {
        background: #fed7aa;
    }

/* ==== COLUNAS DE MOEDA ==== */
.table-nova .col-money {
    width: 12ch; /* comporta 1.111.111,11 */
    max-width: 12ch;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.table-nova th.col-money {
    text-align: center;
}

.table-nova td.col-money {
    text-align: right;
}

/* ==== Badge de total ao lado do título (mostra só quando o collapse estiver FECHADO) ==== */
.total-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin-left: .75rem;
    padding: .15rem .5rem;
    border-radius: 999px;
    font-weight: 600;
    font-size: .825rem;
    border: 1px solid #eaecef;
    background: #f8fafc;
    color: #0f172a;
    white-space: nowrap;
}

    .total-badge .label {
        opacity: .85;
        font-weight: 500;
    }