/* ConfiguraÃ§Ã£o geral */

body{
    font-family: Arial, sans-serif;
    background-image: url('../imagem/fundo.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height:100vh;
    margin:0;
    padding:0;
}

.bem-vindo{
    color:#49f3e3;
    font-size:22px;
    font-weight:bold;

    text-shadow:
        1px 1px 4px #000;
}

/* Menu principal */

.menu{
    display:flex;
    gap:20px;
    margin-top:30px;
    flex-wrap:wrap;
    justify-content:center;
}

.menu a{
    text-decoration:none;
}

.menu button{
    width:200px;
    height:60px;
    font-size:16px;
}

/* Container principal */

.container{
    width:95%;
    max-width:100%;
    margin:30px auto;
    padding:20px;
    display:flex;
    flex-direction:column;
    align-items:center;
    overflow:visible;
    box-sizing:border-box;
}

/* FormulÃ¡rios */

form{
    border:1px solid #ccc;
    border-radius:10px;
    padding:20px;
    width:300px;
    background:rgba(255,255,255,0.90);
}

/* Inputs */

input,
select{
    width:100%;
    padding:8px;
    margin-top:5px;
    margin-bottom:15px;
    box-sizing:border-box;
}

/* BotÃµes */

button{
    border:none;
    border-radius:8px;
    background:#f5f5f5;
    font-size:18px;
    font-weight:bold;

    box-shadow:
        0 0 10px rgba(0,229,255,.7);
}

/* Mensagens */

.msg{
    color:green;
    background:#e7ffe7;
    padding:10px;
    border-radius:5px;
    margin-bottom:20px;
    text-align:center;
}

/* BotÃ£o sair */

.logout{
    position:fixed;
    top:20px;
    right:20px;
    z-index:1000;
}

.logout button{
    width:auto;
    padding:8px 15px;
}

/* TÃ­tulos */

h1,h2,h3{
      color:#FFFFFF;
    font-size:55px;
    font-weight:bold;

    text-shadow:
        0 0 5px #00e5ff,
        0 0 10px #00e5ff,
        2px 2px 5px #000;
}

/* Ãrea de scroll das tabelas */

.scroll-tabela{
    width:100%;
    overflow-x:auto;
    overflow-y:auto;
    max-height:70vh;
    margin-bottom:20px;
}

/* Tabelas */

.tabela{
    width:100%;
    table-layout: fixed;
    width: 100%;
    border-collapse:collapse;
    background:rgba(255,255,255,0.95);
    font-size:12px;
}
.tabela td{
    overflow-wrap: break-word;
}
.tabela th{
    background:#f2f2f2;
    font-weight:bold;
    position:sticky;
    top:0;
}

.tabela th,
.tabela td{
    border:1px solid #ddd;
    padding:6px;
    text-align:center;

    white-space: normal;        /* permite quebra */
    word-wrap: break-word;      /* quebra palavras grandes */
    word-break: break-word;     /* forÃ§a quebra se necessÃ¡rio */
}

.tabela tr:nth-child(even){
    background:#f9f9f9;
}

.tabela tr:hover{
    background:#efefef;
}


/* BotÃµes relatÃ³rio */

.acoes-relatorio{
    display:flex;
    justify-content:center;
    gap:15px;
    margin-bottom:20px;
    flex-wrap:wrap;
}

/* forÃ§a o <a> a virar botÃ£o */

.acoes-relatorio a.btn-relatorio{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;

    width:180px;
    height:45px;

    background-color:#070d12 !important;
    color:#FFFFFF !important;

    text-decoration:none !important;

    font-size:16px;
    font-weight:bold;

    border-radius:8px;
    border:none;

    cursor:pointer;

    box-shadow:
        0 0 10px rgba(0,229,255,.7);

    transition:all .3s ease;
}

.acoes-relatorio a.btn-relatorio:hover{

    background-color:#1565c0 !important;

    transform:translateY(-3px);

    box-shadow:
        0 0 10px #00e5ff,
        0 0 20px rgba(0,229,255,.5);
}

/* Filtro de datas */

.filtro-data{
    width:100%;
    display:flex;
    justify-content:center;
    margin-bottom:25px;
}

.filtro-data form{
    width:auto;
    display:flex;
    align-items:flex-end;
    gap:20px;
    flex-wrap:wrap;

    background:rgba(255,255,255,0.95);

    padding:15px 25px;
    border-radius:10px;

    box-shadow:
    0 0 10px rgba(0,0,0,.3);
}

.campo-data{
    display:flex;
    flex-direction:column;
}

.campo-data label{
    margin-bottom:5px;
    font-weight:bold;
}

.campo-data input{
    width:180px;
}

.campo-botao{
    display:flex;
    align-items:flex-end;
}

.campo-botao button{
    width:auto;
    padding:10px 25px;
}

/* Painel licenÃ§a */

.painel-licenca{

display:flex;
justify-content:center;
align-items:center;
gap:20px;

margin-bottom:30px;
flex-wrap:wrap;
}

.dias-licenca{

padding:12px 20px;

background:#1e293b;
color:#fff;

border-radius:8px;

font-size:18px;
font-weight:bold;

box-shadow:
0 0 10px rgba(0,0,0,.3);
}

.expirando{

background:#b71c1c;

animation:piscando 1s infinite;

}

.btn-licenca{

padding:12px 20px;

background:#1565c0;

color:#fff;
text-decoration:none;

font-weight:bold;

border-radius:8px;

transition:.3s;
}

.btn-licenca:hover{

transform:translateY(-2px);

box-shadow:
0 0 10px #00e5ff;
}

@keyframes piscando{

50%{
opacity:.5;
}

}
/*filtro relatorios */

/* filtro relatorios */

form.filtro-relatorio{
    width:auto !important;
    min-width:900px;
    display:flex !important;
    flex-direction:row !important;
    align-items:flex-end !important;
    justify-content:center;
    gap:20px;
    flex-wrap:wrap;

    background:rgba(255,255,255,0.95);
    padding:15px 25px;
    border-radius:10px;
}

.grupo-data,
.grupo-dias{
    display:flex !important;
    flex-direction:row !important;
    gap:10px;
    align-items:flex-end;
}

.campo-filtro{
    display:flex;
    flex-direction:column;
}

.campo-filtro label{
    font-weight:bold;
    margin-bottom:5px;
}

.campo-filtro input{
    width:160px !important;
    height:36px;
    padding:6px 10px;
    margin-bottom:0;
}

.campo-filtro button{
    height:36px;
    padding:0 20px;
}

/* ===========================
   RODAPÃ‰ MDFRELATORIOS
=========================== */

.footer-mdf {
    margin-top: 50px;
    padding: 25px;

    background: rgba(0,0,0,0.35);

    backdrop-filter: blur(8px);

    border-top: 1px solid rgba(255,255,255,.15);

    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;

    gap: 20px;

    color: #FFF;
}

.footer-box {
    min-width: 220px;
}

.footer-logo h3 {
    color: #00d4ff;
    font-size: 28px;
    margin-bottom: 5px;
}

.footer-logo span {
    color: #7ed6ff;
    font-size: 18px;
}

.footer-box p {
    font-size: 14px;
    line-height: 1.6;
    color: #d9e6ff;
}

.footer-copy {
    text-align: center;
    padding: 15px;

    font-size: 13px;

    color: #9eb4d8;

    letter-spacing: 1px;
}
.topo-mdf {
    width: 100%;
    padding: 18px 35px;
    background: rgba(2, 12, 35, .95);
    border-bottom: 1px solid rgba(0, 195, 255, .35);
    box-shadow: 0 0 25px rgba(0, 195, 255, .25);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    color: #fff;
}

.topo-logo {
    display: flex;
    align-items: center;
    gap: 18px;
}

.logo-icone {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00d5ff, #114eff);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
    box-shadow: 0 0 20px rgba(0, 225, 255, .6);
}

.topo-logo h1 {
    font-size: 30px;
    margin: 0;
    color: #fff;
}

.topo-logo h1 span {
    color: #00eaff;
}

.topo-logo small {
    font-size: 16px;
    background: rgba(255,255,255,.12);
    padding: 3px 8px;
    border-radius: 8px;
}

.topo-logo p {
    margin: 2px 0;
    color: #cbd8ff;
    font-size: 14px;
}

.topo-licenca {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(8, 31, 70, .85);
    border: 1px solid rgba(0, 195, 255, .35);
    border-radius: 16px;
    padding: 12px 28px;
    font-size: 18px;
}

.topo-licenca span {
    display: block;
    color: #fff;
}

.topo-licenca strong {
    color: #25ff78;
}

.btn-atualizar,
.btn-sair {
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    border-radius: 14px;
    padding: 14px 28px;
}

.btn-atualizar {
    background: linear-gradient(135deg, #008cff, #0057ff);
    box-shadow: 0 0 18px rgba(0, 140, 255, .55);
}

.btn-sair {
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.25);
}

@media(max-width: 900px) {
    .topo-mdf {
        flex-direction: column;
        text-align: center;
    }

    .topo-logo {
        flex-direction: column;
    }
}
/* ===========================
   RESET GERAL
=========================== */
* {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    font-family: "Segoe UI", Arial, sans-serif;
    background:
        linear-gradient(rgba(0, 35, 90, .80), rgba(0, 35, 90, .80)),
        url("../IMG/fundo_mdf.png");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color: #fff;
}

/* ===========================
   TOPO MDF
=========================== */
.topo-mdf {
    width: 100%;
    padding: 18px 35px;
    background: rgba(2, 12, 35, .95);
    border-bottom: 1px solid rgba(0, 195, 255, .35);
    box-shadow: 0 0 25px rgba(0, 195, 255, .25);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    color: #fff;
}

.topo-logo {
    display: flex;
    align-items: center;
    gap: 18px;
}

.logo-icone {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00d5ff, #114eff);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
    box-shadow: 0 0 20px rgba(0, 225, 255, .6);
}

.topo-logo h1 {
    font-size: 30px;
    margin: 0;
    color: #fff;
}

.topo-logo h1 span {
    color: #00eaff;
}

.topo-logo small {
    font-size: 16px;
    background: rgba(255,255,255,.12);
    padding: 3px 8px;
    border-radius: 8px;
}

.topo-logo p {
    margin: 2px 0;
    color: #cbd8ff;
    font-size: 14px;
}

.topo-licenca {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(8, 31, 70, .85);
    border: 1px solid rgba(0, 195, 255, .35);
    border-radius: 16px;
    padding: 12px 28px;
    font-size: 18px;
}

.topo-licenca strong {
    color: #25ff78;
}

.btn-atualizar,
.btn-sair {
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    border-radius: 14px;
    padding: 14px 28px;
}

.btn-atualizar {
    background: linear-gradient(135deg, #008cff, #0057ff);
    box-shadow: 0 0 18px rgba(0, 140, 255, .55);
}

.btn-sair {
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.25);
}

/* ===========================
   CENTRAL RELATÃ“RIOS
=========================== */
.container-relatorios {
    padding: 45px 55px 20px;
}

.titulo-relatorios {
    text-align: center;
    margin-bottom: 45px;
}

.icone-titulo {
    font-size: 58px;
    margin-bottom: 10px;
}

.titulo-relatorios h1 {
    font-size: 55px;
    margin: 0;
    color: #fff;
    text-shadow: 0 0 18px rgba(0, 229, 255, .75);
}

.titulo-relatorios p {
    font-size: 22px;
    color: #d8e3ff;
    margin-top: 10px;
}

/* ===========================
   CARDS
=========================== */
.grid-relatorios {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 26px;
}

.card-relatorio {
    width: 260px;
    min-height: 125px;
    background: linear-gradient(145deg, #ffffff, #eef4ff);
    color: #111 !important;
    border-radius: 22px;
    padding: 25px;
    text-decoration: none !important;
    display: flex;
    align-items: center;
    gap: 18px;
    box-shadow:
        0 10px 0 rgba(10, 42, 112, .55),
        0 20px 30px rgba(0,0,0,.35);
    transition: .25s;
}

.card-relatorio:hover {
    transform: translateY(-8px);
    box-shadow:
        0 12px 0 rgba(0, 195, 255, .5),
        0 0 30px rgba(0, 229, 255, .6);
}

.card-relatorio span {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
}

.card-icone {
    min-width: 62px;
    height: 62px;
    border-radius: 16px;
    color: white;
    font-size: 31px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 18px rgba(0,0,0,.35);
}

.azul { background: linear-gradient(135deg, #00a2ff, #004cff); }
.roxo { background: linear-gradient(135deg, #9b35ff, #4b20ff); }
.verde { background: linear-gradient(135deg, #22dd55, #009b45); }
.laranja { background: linear-gradient(135deg, #ffc400, #ff5a00); }
.ciano { background: linear-gradient(135deg, #18d7d7, #008ca8); }
.rosa { background: linear-gradient(135deg, #ff42b3, #d90075); }

/* ===========================
   BOTÃƒO VOLTAR
=========================== */
.area-voltar {
    text-align: center;
    margin: 35px 0;
}

.btn-voltar {
    display: inline-block;
    padding: 12px 40px;
    border-radius: 15px;
    background: rgba(2, 18, 55, .9);
    border: 1px solid rgba(0, 195, 255, .45);
    color: white !important;
    font-size: 22px;
    font-weight: bold;
    text-decoration: none !important;
    box-shadow: 0 0 18px rgba(0,195,255,.3);
}

/* ===========================
   RODAPÃ‰
=========================== */
.footer-mdf {
    margin: 25px 40px 10px;
    padding: 28px 35px;
    background: rgba(2, 13, 39, .85);
    border: 1px solid rgba(0, 195, 255, .45);
    border-radius: 24px;
    box-shadow: 0 0 30px rgba(0, 195, 255, .25);
    display: grid;
    grid-template-columns: 1.4fr 1.2fr 1.1fr 1.3fr;
    gap: 25px;
    align-items: center;
    color: #fff;
}

.footer-box {
    border-right: 1px solid rgba(0, 229, 255, .35);
    padding-right: 25px;
}

.footer-box:last-child {
    border-right: none;
}

.footer-logo h3 {
    font-size: 31px;
    margin: 0;
    color: #fff;
}

.footer-logo h3 span {
    color: #00eaff;
}

.footer-logo p,
.footer-box p {
    color: #d5e1ff;
    font-size: 16px;
    line-height: 1.5;
}

.footer-box strong {
    color: #00eaff;
}

.footer-copy {
    text-align: center;
    padding: 16px;
    color: #d5e1ff;
    font-size: 16px;
}

.footer-copy strong {
    color: #00eaff;
}
/* ===========================
   TABELAS DOS RELATÃ“RIOS
=========================== */

.tabela-container,
.table-container,
.relatorio-tabela {
    width: 100%;
    overflow-x: auto;
    margin-top: 25px;
    background: rgba(255, 255, 255, 0.96);
    border-radius: 16px;
    padding: 15px;
}

table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    color: #1f2937;
    font-size: 13px;
}

table thead th {
    background: linear-gradient(135deg, #003c8f, #006fe6);
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 10px 8px;
    border: 1px solid #d1d5db;
    text-align: center;
    white-space: nowrap;
}

table tbody td {
    color: #111827;
    background: #ffffff;
    padding: 9px 8px;
    border: 1px solid #d1d5db;
    text-align: center;
    font-size: 13px;
    white-space: nowrap;
}

table tbody tr:nth-child(even) td {
    background: #f3f6fb;
}

table tbody tr:hover td {
    background: #e8f2ff;
    color: #000;
}

/* Evita texto branco herdado do body */
table,
table th,
table td,
table a,
table span,
table strong {
    color: #111827 !important;
}

/* CabeÃ§alho continua branco */
table thead th,
table thead th span,
table thead th strong {
    color: #ffffff !important;
}
/* ===========================
   FILTROS DOS RELATÃ“RIOS
=========================== */

form label,
.filtros label,
.filtro label,
.form-filtros label {
    color: #111827 !important;
    font-weight: 700;
}

form span,
.filtros span,
.filtro span,
.form-filtros span {
    color: #111827 !important;
}

form input,
form select,
.filtros input,
.filtros select,
.form-filtros input,
.form-filtros select {
    color: #111827 !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 8px 10px;
}

form input::placeholder {
    color: #6b7280 !important;
}

/* =============
    FILTROS ESCUROS OU TRANSPARENTES
    */
.filtros,
.filtro,
.form-filtros,
form {
    background: rgba(255, 255, 255, 0.95);
    color: #111827 !important;
    padding: 15px;
    border-radius: 12px;
}
.msg-sucesso,
.alerta-sucesso {
    position: fixed;
    top: 120px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;

    background: transparent;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    text-align: center;
}
/* ===========================
   CORREÃ‡ÃƒO TELA LOGIN
   NÃƒO DEIXA A MENSAGEM MOVER O FORM
=========================== */

html,
body {
    width: 100%;
    overflow-x: hidden;
}

.msg-sucesso {
    position: fixed !important;
    top: 285px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 99999 !important;

    background: transparent !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: bold !important;
    text-align: center !important;

    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;

    pointer-events: none;
}

/* FORMULÃRIO DO LOGIN FIXO */
.login-form-area {
    position: absolute !important;
    left: 30px !important;
    top: 450px !important;
    z-index: 50 !important;
}

.login-form-area form {
    width: 330px !important;
    margin: 0 !important;
}
/* CORREÃ‡ÃƒO LOGIN */

.container-login {
    position: relative;
    display: block !important;
    margin: 0 !important;
    padding-top: 100px !important;
}

.container-login h2 {
    text-align: center;
    margin-bottom: 50px;
}

.login-form-area {
    position: absolute !important;
    left: 25px !important;
    top: 250px !important;
    z-index: 20 !important;
}

.login-form-area form {
    width: 330px !important;
    margin: 0 !important;
}

.aviso-legal-login {
    width: calc(100% - 140px);
    margin: 20px 70px 30px 70px;
    background: #f8f9fa;
    border: 1px solid #ddd;
    padding: 15px;
    font-size: 12px;
    color: #444;
}

.login-form-area {
    position: fixed !important;
    left: 30px !important;
    top: 450px !important;
    z-index: 50 !important;
}

.aviso-legal-login {
    position: relative !important;
    width: calc(100% - 140px) !important;
    margin: 40px 70px 30px 70px !important;
    background: rgba(255,255,255,0.95) !important;
    color: #111 !important;
    border: 1px solid #ddd !important;
    padding: 15px !important;
    font-size: 12px !important;
    border-radius: 0 !important;
    z-index: 1 !important;
}

.conteudo-central {
    width: 100%;
    min-height: calc(100vh - 120px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.container-formulario {
    width: 100%;
    display: flex;
    justify-content: center;
}

.card-formulario {
    width: 520px;
    background: #fff;
    border-radius: 12px;
    padding: 35px;
    box-shadow: 0 10px 30px rgba(0,0,0,.35);
}

.card-formulario h2{
    text-align: center;
    margin-bottom: 25px;
    color: #003366;
    font-size: 28px;
    font-weight: bold;
}
 .container-log {
        width: 95%;
        margin: 25px auto;
        background: #fff;
        padding: 25px;
        border-radius: 10px;
    }

    .titulo-log {
        color: #00d9ff;
        text-shadow: 2px 2px 5px #000;
        font-size: 34px;
        margin-bottom: 20px;
    }

    .grid-info {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 10px;
        margin-bottom: 20px;
    }

 .info-box{
    background:#ffffff;
    border:1px solid #cfcfcf;
    border-left:5px solid #1f4e79;
    border-radius:8px;
    padding:12px;
    min-height:70px;

    color:#222;
    font-size:14px;

    box-shadow:0 2px 6px rgba(0,0,0,.10);

    opacity:1 !important;
}
.info-box strong{
    display:block;
    margin-bottom:6px;

    color:#1f4e79;
    font-size:13px;
    font-weight:bold;
}

    .log-box {
        width: 100%;
        max-width: 100%;
        height: 650px;
        background: #111;
        color: #00ff00;
        padding: 15px;
        border-radius: 8px;
        overflow: auto;
        font-family: Consolas, monospace;
        font-size: 13px;
        white-space: pre;
        box-sizing: border-box;
    }

    .btn-voltar {
        background: #1f4e79;
        color: #fff;
        padding: 9px 14px;
        border-radius: 6px;
        text-decoration: none;
        display: inline-block;
        margin-bottom: 15px;
    }

    .container-opentext {
    width: 95%;
    margin: 30px auto;
    background: rgba(255,255,255,.96);
    padding: 30px;
    border-radius: 12px;
}

.titulo-opentext {
    text-align: center;
    margin-bottom: 35px;
}

.form-opentext {
    width: auto !important;
    max-width: 1000px;
    margin: 0 auto 20px auto;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.form-opentext .campo {
    display: flex;
    flex-direction: column;
}

.form-opentext input,
.form-opentext select {
    width: 170px !important;
}

.area-importar {
    text-align: center;
    margin-bottom: 20px;
}

.btn-importar {
    background: #1f7a32;
    color: #fff !important;
    padding: 10px 18px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: bold;
}
.logo-cliente {
    max-width: 180px;
    max-height: 70px;
    object-fit: contain;
}
.container-relatorio {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
}

.form-filtros-relatorio {
    display: flex;
    gap: 12px;
    align-items: end;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.form-filtros-relatorio label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-weight: 600;
}

.form-filtros-relatorio input {
    min-width: 160px;
    padding: 8px;
}

.area-tabela-relatorio {
    width: 100%;
    overflow-x: auto;
    margin-bottom: 28px;
}

.tabela-relatorio {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.tabela-relatorio th,
.tabela-relatorio td {
    border: 1px solid #ddd;
    padding: 7px 8px;
    white-space: nowrap;
}

.tabela-relatorio th {
    background: #f3f4f6;
    font-weight: 700;
    text-align: left;
}

.texto-direita {
    text-align: right;
}

.saldo-positivo {
    color: #166534;
    font-weight: 700;
}

.saldo-negativo {
    color: #b91c1c;
    font-weight: 700;
}

.alerta-erro {
    padding: 12px;
    background: #fee2e2;
    border: 1px solid #fca5a5;
    color: #991b1b;
    margin-bottom: 16px;
}

.alerta-vazio {
    padding: 12px;
    background: #f3f4f6;
    border: 1px solid #ddd;
    margin-bottom: 16px;
}

.tabela-relatorio thead th {
    background: #f3f4f6;
    color: #111827;
    font-weight: 700;
    opacity: 1;
}

.tabela-relatorio thead {
    opacity: 1;
}
.topo-mdf,
.topo-mdf * {
    opacity: 1;
    color: inherit;
}

.topo-mdf h1,
.topo-mdf p,
.topo-mdf span,
.topo-mdf strong {
    color: #ffffff;
    opacity: 1;
}

.container-relatorio .tabela-relatorio thead th {
    background-color: #e5e7eb !important;
    color: #111827 !important;
    font-weight: 700 !important;
    opacity: 1 !important;
    text-shadow: none !important;
    filter: none !important;
}

.container-relatorio .tabela-relatorio thead th * {
    color: #111827 !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

.container-relatorio h3 {
    color: #111827 !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    text-shadow: none !important;
    margin: 25px 0 12px 0;
}

.grafico-variacao-filial {
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12);
    color: #111827;
    margin: 20px 0 28px;
    padding: 18px;
}

.cabecalho-grafico-filial {
    align-items: flex-start;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    margin-bottom: 12px;
}

.cabecalho-grafico-filial h3 {
    color: #111827 !important;
    font-size: 22px !important;
    margin: 0 !important;
    text-shadow: none !important;
}

.cabecalho-grafico-filial span {
    color: #4b5563;
    font-size: 13px;
    font-weight: 600;
    text-align: right;
}

.legenda-grafico-filial {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 14px;
}

.legenda-grafico-filial span {
    align-items: center;
    color: #374151;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    gap: 6px;
}

.legenda-grafico-filial i {
    border-radius: 999px;
    display: inline-block;
    height: 10px;
    width: 10px;
}

.legenda-crescimento,
.barra-grafico.crescimento {
    background: #16a34a;
}

.legenda-reducao,
.barra-grafico.reducao {
    background: #dc2626;
}

.legenda-estavel,
.barra-grafico.estavel {
    background: #64748b;
}

.lista-grafico-filial {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.linha-grafico-filial {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(180px, 300px) minmax(180px, 1fr) 90px;
}

.nome-filial-grafico {
    color: #111827;
    font-size: 13px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.barra-grafico-wrapper {
    background: #e5e7eb;
    border-radius: 999px;
    height: 18px;
    overflow: hidden;
}

.barra-grafico {
    border-radius: 999px;
    height: 100%;
    min-width: 0;
}

.valor-grafico-filial {
    font-size: 13px;
    font-weight: 800;
    text-align: right;
}

@media (max-width: 800px) {
    .cabecalho-grafico-filial {
        display: block;
    }

    .cabecalho-grafico-filial span {
        display: block;
        margin-top: 6px;
        text-align: left;
    }

    .linha-grafico-filial {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .valor-grafico-filial {
        text-align: left;
    }
}

/* ===========================
   BANCO DE HORAS - FILTROS E VOLTAR
   Adicionar no final de CSS/estilo.css
=========================== */

body .conteudo-central {
    align-items: flex-start !important;
}

body .conteudo-central .container-relatorio {
    width: 100% !important;
    max-width: 1600px !important;
    margin: 0 auto !important;
    padding: 25px 20px !important;
}

body .conteudo-central .area-filtros-banco-horas {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 15px auto 18px auto !important;
}

body .conteudo-central .form-filtros-banco-horas {
    width: auto !important;
    max-width: 1280px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: flex-end !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
    background: rgba(255,255,255,.96) !important;
    border: 1px solid #d1d5db !important;
    border-radius: 14px !important;
    padding: 18px 22px !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.18) !important;
}

body .conteudo-central .form-filtros-banco-horas label {
    min-width: 145px !important;
    max-width: 190px !important;
    color: #111827 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

body .conteudo-central .form-filtros-banco-horas input,
body .conteudo-central .form-filtros-banco-horas select {
    width: 100% !important;
    min-width: 145px !important;
    height: 38px !important;
    margin: 5px 0 0 0 !important;
}

body .conteudo-central .form-filtros-banco-horas .btn-pesquisar {
    height: 38px !important;
    padding: 0 28px !important;
    margin: 0 !important;
    cursor: pointer !important;
}

body .conteudo-central .area-voltar-relatorio {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    margin: 0 auto 25px auto !important;
}

body .conteudo-central .btn-voltar-relatorios {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 11px 26px !important;
    border-radius: 10px !important;
    background: #1f4e79 !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: 0 0 12px rgba(0,195,255,.35) !important;
}

body .conteudo-central .btn-voltar-relatorios:hover {
    background: #1565c0 !important;
    transform: translateY(-2px);
}

@media (max-width: 800px) {
    body .conteudo-central .form-filtros-banco-horas {
        width: 100% !important;
        align-items: stretch !important;
    }

    body .conteudo-central .form-filtros-banco-horas label {
        width: 100% !important;
        max-width: none !important;
    }
}
/* css para relatorios de atestados medicos*/

        .relatorio-atestados {
            width: 95%;
            max-width: 1500px;
            margin: 25px auto;
        }

        .cabecalho-relatorio {
            background: #fff;
            border-radius: 12px;
            padding: 20px;
            margin-bottom: 18px;
            box-shadow: 0 2px 8px rgba(0,0,0,.08);
        }

        .cabecalho-relatorio h2 {
            margin: 0 0 6px 0;
            color: #1f2937;
        }

        .cabecalho-relatorio p {
            margin: 0;
            color: #6b7280;
        }

        .form-filtros {
            background: #fff;
            border-radius: 12px;
            padding: 18px;
            margin-bottom: 18px;
            display: flex;
            gap: 15px;
            align-items: end;
            justify-content: center;
            flex-wrap: wrap;
            box-shadow: 0 2px 8px rgba(0,0,0,.08);
        }

        .campo-filtro {
            display: flex;
            flex-direction: column;
            gap: 5px;
        }

        .campo-filtro label {
            font-weight: 600;
            color: #374151;
        }

        .campo-filtro input {
            padding: 9px 10px;
            border: 1px solid #d1d5db;
            border-radius: 8px;
            min-width: 170px;
        }

        .acoes-filtro {
            display: flex;
            gap: 10px;
            flex-wrap: wrap;
        }

        .btn-mdf {
            border: none;
            border-radius: 8px;
            padding: 10px 14px;
            cursor: pointer;
            font-weight: 600;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
        }

        .btn-primary-mdf {
            background: #2563eb;
            color: #fff;
        }

        .btn-secondary-mdf {
            background: #f3f4f6;
            color: #111827;
        }

        .btn-success-mdf {
            background: #16a34a;
            color: #fff;
        }

        .btn-danger-mdf {
            background: #dc2626;
            color: #fff;
        }

        .cards-indicadores {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
            gap: 14px;
            margin-bottom: 18px;
        }

        .card-indicador {
            background: #fff;
            border-radius: 12px;
            padding: 18px;
            box-shadow: 0 2px 8px rgba(0,0,0,.08);
        }

        .card-indicador span {
            display: block;
            color: #6b7280;
            font-size: 13px;
            margin-bottom: 8px;
        }

        .card-indicador strong {
            display: block;
            color: #111827;
            font-size: 26px;
        }

        .secao-card {
            background: #fff;
            border-radius: 12px;
            padding: 18px;
            margin-bottom: 18px;
            box-shadow: 0 2px 8px rgba(0,0,0,.08);
        }

        .secao-card h3 {
            margin: 0 0 15px 0;
            color: #1f2937;
        }

        .grafico-barras {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .linha-grafico {
            display: grid;
            grid-template-columns: minmax(180px, 280px) 1fr 80px;
            gap: 10px;
            align-items: center;
        }

        .nome-loja-grafico {
            font-size: 13px;
            font-weight: 600;
            color: #374151;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .barra-fundo {
            background: #e5e7eb;
            border-radius: 999px;
            height: 18px;
            overflow: hidden;
        }

        .barra-percentual {
            background: linear-gradient(90deg, #60a5fa, #2563eb);
            height: 100%;
            border-radius: 999px;
            min-width: 2px;
        }

        .percentual-grafico {
            text-align: right;
            font-weight: 700;
            color: #111827;
        }

        .tabela-mdf {
            width: 100%;
            border-collapse: collapse;
            font-size: 13px;
        }

        .tabela-mdf th {
            background: #f3f4f6;
            color: #111827;
            text-align: left;
            padding: 9px;
            border-bottom: 1px solid #e5e7eb;
            white-space: nowrap;
        }

        .tabela-mdf td {
            padding: 8px 9px;
            border-bottom: 1px solid #e5e7eb;
            color: #374151;
        }

        .tabela-mdf tbody tr:hover {
            background: #f9fafb;
        }

        .texto-direita {
            text-align: right;
        }

        .texto-centro {
            text-align: center;
        }

        .detalhe-loja {
            border: 1px solid #e5e7eb;
            border-radius: 10px;
            margin-bottom: 12px;
            overflow: hidden;
        }

        .detalhe-loja summary {
            padding: 13px 15px;
            background: #f9fafb;
            cursor: pointer;
            font-weight: 700;
            color: #111827;
        }

        .detalhe-conteudo {
            padding: 12px;
            overflow-x: auto;
        }

        .alerta-erro {
            background: #fee2e2;
            color: #991b1b;
            border: 1px solid #fecaca;
            border-radius: 10px;
            padding: 14px;
            margin-bottom: 18px;
        }

        .sem-dados {
            background: #f9fafb;
            border: 1px dashed #d1d5db;
            border-radius: 10px;
            padding: 18px;
            color: #6b7280;
            text-align: center;
        }

        @media (max-width: 800px) {
            .linha-grafico {
                grid-template-columns: 1fr;
            }

            .percentual-grafico {
                text-align: left;
            }
        }
/* ==========================================================
   PADRÃƒO ÃšNICO DE FILTROS DOS RELATÃ“RIOS MDF
   Base visual: form-filtros-banco-horas
   ExceÃ§Ã£o: login permanece com layout prÃ³prio
========================================================== */

/* Ãrea externa dos filtros */
body :not(.container-login):not(.login-form-area) > .area-filtros-relatorio,
body .area-filtros-relatorio,
body .area-filtros-banco-horas,
body .filtro-data {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 15px auto 18px auto !important;
}

/* FormulÃ¡rios de filtro dos relatÃ³rios */
body form.form-filtros,
body form.form-filtros-banco-horas,
body form.form-filtros-relatorio,
body form.filtro-relatorio,
body .filtro-data form,
body .form-opentext {
    width: calc(100% - 40px) !important;
    max-width: 1280px !important;
    min-width: 0 !important;

    margin: 0 auto 18px auto !important;

    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: flex-end !important;
    gap: 14px !important;
    flex-wrap: wrap !important;

    background: rgba(255, 255, 255, .96) !important;
    color: #111827 !important;

    border: 1px solid #d1d5db !important;
    border-radius: 14px !important;

    padding: 18px 22px !important;

    box-shadow: 0 4px 14px rgba(0,0,0,.18) !important;
}

/* Preserva login */
body .container-login form,
body .login-form-area form,
body form.login-form,
body form.form-login {
    width: 330px !important;
    max-width: 330px !important;
    display: block !important;
    flex-direction: initial !important;
    align-items: initial !important;
    justify-content: initial !important;
    gap: initial !important;
    flex-wrap: initial !important;
}

/* Labels dos filtros */
body form.form-filtros label,
body form.form-filtros-banco-horas label,
body form.form-filtros-relatorio label,
body form.filtro-relatorio label,
body .filtro-data form label,
body .form-opentext label,
body .form-opentext .campo,
body .campo-filtro {
    min-width: 145px !important;
    max-width: 190px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;

    color: #111827 !important;
    font-size: 13px !important;
    font-weight: 700 !important;

    margin: 0 !important;
    gap: 5px !important;
}

/* Inputs e selects dos filtros */
body form.form-filtros input,
body form.form-filtros select,
body form.form-filtros-banco-horas input,
body form.form-filtros-banco-horas select,
body form.form-filtros-relatorio input,
body form.form-filtros-relatorio select,
body form.filtro-relatorio input,
body form.filtro-relatorio select,
body .filtro-data form input,
body .filtro-data form select,
body .form-opentext input,
body .form-opentext select,
body .campo-filtro input,
body .campo-filtro select {
    width: 100% !important;
    min-width: 145px !important;
    height: 38px !important;

    margin: 0 !important;
    padding: 7px 10px !important;

    color: #111827 !important;
    background: #ffffff !important;

    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;

    font-size: 14px !important;
    font-weight: 500 !important;

    box-sizing: border-box !important;
}

/* Ãrea dos botÃµes */
body form.form-filtros .acoes-filtro,
body form.form-filtros-banco-horas .acoes-filtro,
body form.form-filtros-relatorio .acoes-filtro,
body form.filtro-relatorio .acoes-filtro,
body .campo-botao,
body .campo-botao-filtro {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: 10px !important;

    height: 38px !important;
    margin: 0 !important;
}

/* BotÃ£o consultar */
body form.form-filtros button,
body form.form-filtros .btn-pesquisar,
body form.form-filtros-banco-horas button,
body form.form-filtros-banco-horas .btn-pesquisar,
body form.form-filtros-relatorio button,
body form.form-filtros-relatorio .btn-pesquisar,
body form.filtro-relatorio button,
body form.filtro-relatorio .btn-pesquisar,
body .filtro-data form button {
    height: 38px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 28px !important;
    margin: 0 !important;

    border: none !important;
    border-radius: 8px !important;

    background: #1f4e79 !important;
    color: #ffffff !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    text-decoration: none !important;

    cursor: pointer !important;

    box-shadow: 0 0 12px rgba(0,195,255,.35) !important;
}

/* Links usados como botÃ£o */
body form.form-filtros a,
body form.form-filtros-banco-horas a,
body form.form-filtros-relatorio a,
body form.filtro-relatorio a,
body .btn-voltar-relatorios {
    height: 38px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 18px !important;
    margin: 0 !important;

    border-radius: 8px !important;

    color: #111827 !important;
    background: transparent !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    text-decoration: none !important;

    box-shadow: none !important;
}

/* Hover */
body form.form-filtros button:hover,
body form.form-filtros .btn-pesquisar:hover,
body form.form-filtros-banco-horas button:hover,
body form.form-filtros-banco-horas .btn-pesquisar:hover,
body form.form-filtros-relatorio button:hover,
body form.form-filtros-relatorio .btn-pesquisar:hover,
body form.filtro-relatorio button:hover,
body form.filtro-relatorio .btn-pesquisar:hover {
    background: #1565c0 !important;
    transform: translateY(-2px);
}

/* Responsivo */
@media (max-width: 800px) {
    body form.form-filtros,
    body form.form-filtros-banco-horas,
    body form.form-filtros-relatorio,
    body form.filtro-relatorio,
    body .filtro-data form,
    body .form-opentext {
        width: calc(100% - 24px) !important;
        align-items: stretch !important;
    }

    body form.form-filtros label,
    body form.form-filtros-banco-horas label,
    body form.form-filtros-relatorio label,
    body form.filtro-relatorio label,
    body .filtro-data form label,
    body .form-opentext label,
    body .form-opentext .campo,
    body .campo-filtro {
        width: 100% !important;
        max-width: none !important;
    }

    body .campo-botao,
    body .campo-botao-filtro,
    body form.form-filtros .acoes-filtro {
        width: 100% !important;
        height: auto !important;
        justify-content: center !important;
    }
}

/* ==========================================================
   AJUSTE BOTÃƒO VOLTAR NOS FILTROS DOS RELATÃ“RIOS
   MantÃ©m o padrÃ£o visual do form-filtros-banco-horas
========================================================== */

body form.form-filtros .btn-voltar-filtro,
body form.form-filtros-banco-horas .btn-voltar-filtro,
body form.form-filtros-relatorio .btn-voltar-filtro,
body form.filtro-relatorio .btn-voltar-filtro {
    height: 38px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 26px !important;
    margin: 0 !important;

    border-radius: 8px !important;
    border: none !important;

    background: #1f4e79 !important;
    color: #ffffff !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    text-decoration: none !important;

    cursor: pointer !important;

    box-shadow: 0 0 12px rgba(0,195,255,.35) !important;
}

body form.form-filtros .btn-voltar-filtro:hover,
body form.form-filtros-banco-horas .btn-voltar-filtro:hover,
body form.form-filtros-relatorio .btn-voltar-filtro:hover,
body form.filtro-relatorio .btn-voltar-filtro:hover {
    background: #1565c0 !important;
    color: #ffffff !important;
    transform: translateY(-2px);
}

/* ==========================================================
   FORÃ‡A VISUAL DE BOTÃƒO PARA VOLTAR DENTRO DOS FILTROS
========================================================== */

body form.form-filtros a.btn-voltar-filtro,
body form.form-filtros a.btn-voltar-relatorios,
body form.form-filtros a.btn-secondary-mdf,
body form.form-filtros .acoes-filtro a,
body form.form-filtros .campo-botao-filtro a {
    height: 38px !important;
    min-width: 120px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 26px !important;
    margin: 0 !important;

    border-radius: 8px !important;
    border: none !important;

    background: #1f4e79 !important;
    color: #ffffff !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    text-decoration: none !important;

    cursor: pointer !important;

    box-shadow: 0 0 12px rgba(0,195,255,.35) !important;
}

body form.form-filtros a.btn-voltar-filtro:hover,
body form.form-filtros a.btn-voltar-relatorios:hover,
body form.form-filtros a.btn-secondary-mdf:hover,
body form.form-filtros .acoes-filtro a:hover,
body form.form-filtros .campo-botao-filtro a:hover {
    background: #1565c0 !important;
    color: #ffffff !important;
    transform: translateY(-2px);
}
/* MDF_RETORNO_BANCARIO_CSS_INICIO
   Estilos do relatÃ³rio/importaÃ§Ã£o/comprovante de retorno bancÃ¡rio.
   Manter este bloco dentro do CSS Ãºnico do projeto: CSS/estilo.css
*/

.painel-retorno {
    width: min(1200px, 96%);
    margin: 20px auto;
    box-sizing: border-box;
}

.container-retorno {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
}

.card-formulario-retorno {
    width: 100%;
    max-width: 1200px;
    box-sizing: border-box;
    overflow: visible;
}

.bloco-retorno {
    width: 100%;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.96);
    border-radius: 12px;
    padding: 20px;
    margin: 18px auto;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.bloco-retorno h3 {
    margin-top: 0;
    margin-bottom: 12px;
}

.form-importacao-retorno {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: flex-end;
    margin-top: 12px;
}

.form-importacao-retorno .campo {
    margin: 0;
}

.campo-retorno-competencia {
    min-width: 180px;
    max-width: 220px;
}

.campo-retorno-botao {
    display: flex;
    align-items: flex-end;
}

.tabela-responsiva {
    width: 100%;
    overflow-x: auto;
    box-sizing: border-box;
}

.tabela-retorno {
    width: 100%;
    min-width: 850px;
    border-collapse: collapse;
    margin-top: 15px;
    font-size: 13px;
    background: #fff;
}

.tabela-retorno th,
.tabela-retorno td {
    border: 1px solid #ddd;
    padding: 8px;
    vertical-align: middle;
}

.tabela-retorno th {
    background: rgba(0, 0, 0, 0.08);
    font-weight: bold;
    text-align: left;
    white-space: nowrap;
}

.tabela-retorno td {
    color: inherit;
}

.acoes-retorno {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin: 12px 0;
}

.resumo-importacao-retorno {
    margin: 8px 0 16px 0;
}

.resumo-importacao-retorno p {
    margin: 5px 0;
}

.botoes-retorno-importacao {
    margin-top: 20px;
}

.btn-importar-retorno,
.btn-pdf-retorno {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    white-space: nowrap;
}

.msg-erro-retorno {
    color: #b00020;
    font-weight: bold;
    margin: 10px 0;
}

.direita {
    text-align: right;
}

.centro {
    text-align: center;
}

.status-ok {
    color: #057a20;
    font-weight: bold;
}

.status-erro,
.status-ocorrencia {
    color: #b00020;
    font-weight: bold;
}

.status-aviso {
    color: #a66a00;
    font-weight: bold;
}

.quebra-pagina {
    page-break-after: always;
}

.quebra-pagina-antes {
    page-break-before: always;
}

.comprovante-retorno {
    width: 100%;
    border: 1px solid #333;
    padding: 14px;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #000;
    background: #fff;
}

.comprovante-retorno table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
}

.comprovante-retorno td,
.comprovante-retorno th {
    border: 1px solid #aaa;
    padding: 6px;
    vertical-align: top;
}

.comprovante-retorno .sem-borda td {
    border: none;
}

.comprovante-retorno .cabecalho-comprovante td {
    text-align: center;
}

.comprovante-retorno .titulo-principal {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 3px;
}

.comprovante-retorno .subtitulo {
    font-size: 13px;
    margin-bottom: 2px;
}

.comprovante-retorno .via {
    font-size: 11px;
}

.comprovante-retorno .linha-separadora {
    border-top: 1px solid #777;
    margin: 10px 0;
    height: 0;
}

.comprovante-retorno .label {
    font-weight: bold;
}

.comprovante-retorno .secao {
    font-weight: bold;
    background: #e5e5e5;
}

@media (max-width: 900px) {
    .painel-retorno,
    .container-retorno,
    .card-formulario-retorno,
    .bloco-retorno {
        width: 96%;
        max-width: 96%;
    }

    .form-importacao-retorno {
        align-items: stretch;
    }

    .campo-retorno-competencia,
    .campo-retorno-botao,
    .btn-importar-retorno {
        width: 100%;
        max-width: 100%;
    }
}
/* ==========================================================
   RETORNO BANCÃRIO / COMPROVANTE DE PAGAMENTO
   Colar no final do CSS Ãºnico: CSS/estilo.css
   NÃ£o usar <style> nem style="" nos arquivos PHP.
========================================================== */

.comprovante-retorno {
    width: 100%;
    border: 1px solid #333;
    padding: 14px;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #000;
    background: #fff;
}

.comprovante-retorno table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    background: #fff;
}

.comprovante-retorno td,
.comprovante-retorno th {
    border: 1px solid #aaa;
    padding: 6px;
    vertical-align: top;
    color: #000 !important;
    background: #fff;
    white-space: normal;
}

.comprovante-retorno .sem-borda td {
    border: none;
}

.comprovante-retorno .cabecalho-comprovante td {
    text-align: center;
}

.comprovante-retorno .titulo-principal {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 3px;
}

.comprovante-retorno .subtitulo {
    font-size: 13px;
    margin-bottom: 2px;
}

.comprovante-retorno .via {
    font-size: 11px;
}

.comprovante-retorno .linha-separadora {
    border-top: 1px solid #777;
    margin: 10px 0;
    height: 0;
}

.comprovante-retorno .label {
    font-weight: bold;
}

.comprovante-retorno .secao {
    font-weight: bold;
    background: #e5e5e5 !important;
}

.quebra-pagina {
    page-break-after: always;
}

.quebra-pagina-antes {
    page-break-before: always;
}
/* ==========================================================
   RETORNO BANCARIO / COMPROVANTE DE PAGAMENTO
   Colar no final do CSS unico: CSS/estilo.css
   Layout de referencia: comprovante Santander / primeira versao validada.
   Nao manter regras visuais dentro dos arquivos PHP.
========================================================== */

body.comprovante-pdf {
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
    background-image: none !important;
    color: #000000 !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
}

body.comprovante-pdf .comprovante-retorno {
    width: 100% !important;
    border: 1px solid #333333 !important;
    padding: 14px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
    color: #000000 !important;
    background: #ffffff !important;
}

body.comprovante-pdf .comprovante-retorno table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
    color: #000000 !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
}

body.comprovante-pdf .comprovante-retorno td,
body.comprovante-pdf .comprovante-retorno th {
    border: 1px solid #aaaaaa !important;
    padding: 6px !important;
    vertical-align: top !important;
    color: #000000 !important;
    background: #ffffff !important;
    white-space: normal !important;
    text-align: left !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

body.comprovante-pdf .comprovante-retorno .sem-borda td,
body.comprovante-pdf .comprovante-retorno .cabecalho-comprovante td {
    border: none !important;
    background: #ffffff !important;
}

body.comprovante-pdf .comprovante-retorno .cabecalho-comprovante td {
    text-align: center !important;
}

body.comprovante-pdf .comprovante-retorno .titulo-principal {
    color: #000000 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    margin: 0 0 3px 0 !important;
    padding: 0 !important;
    text-align: center !important;
    text-shadow: none !important;
}

body.comprovante-pdf .comprovante-retorno .subtitulo {
    color: #000000 !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    margin: 0 0 2px 0 !important;
    padding: 0 !important;
    text-align: center !important;
    text-shadow: none !important;
}

body.comprovante-pdf .comprovante-retorno .via {
    color: #000000 !important;
    font-size: 11px !important;
    line-height: 1.1 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    text-shadow: none !important;
}

body.comprovante-pdf .comprovante-retorno .linha-separadora {
    border-top: 1px solid #777777 !important;
    height: 0 !important;
    line-height: 0 !important;
    margin: 10px 0 !important;
    padding: 0 !important;
}

body.comprovante-pdf .comprovante-retorno .label {
    color: #000000 !important;
    font-weight: 700 !important;
}

body.comprovante-pdf .comprovante-retorno .secao {
    color: #000000 !important;
    font-weight: 700 !important;
    background: #e5e5e5 !important;
}

body.comprovante-pdf .quebra-pagina {
    page-break-after: always !important;
}

body.comprovante-pdf .quebra-pagina-antes {
    page-break-before: always !important;
}

/* MDF_RETORNO_BANCARIO_CSS_FIM */
/* ==========================================================
   CONTRACHEQUE PDF MDF - INICIO
   Layout usado pelo PDF do contracheque e pelo comprovante
   anexado ao final do contracheque.
========================================================== */

.nome-funcionario-consulta {
    display: block;
    margin-top: 30px;
    min-height: 18px;
    color: #0056b3;
    font-weight: bold;
}

.nome-funcionario-consulta.erro {
    color: #dc2626;
}

.pdf-contracheque-body {
    background: #ffffff !important;
    color: #000000 !important;
    font-family: "Times New Roman", serif !important;
    font-size: 10px !important;
    margin: 0;
    padding: 0;
}

.contracheque-pdf {
    width: 100%;
    border: 2px solid #000;
    page-break-after: auto;
    color: #000;
    background: #fff;
}

.quebra-pagina {
    page-break-after: always;
}

.quebra-pagina-antes {
    page-break-before: always;
    height: 0;
    margin: 0;
    padding: 0;
}

.contracheque-pdf table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    color: #000;
    font-size: 10px;
}

.contracheque-pdf td,
.contracheque-pdf th {
    border: 1px solid #000;
    padding: 3px;
    vertical-align: top;
    color: #000;
    background: #fff;
}

.contracheque-pdf .titulo {
    text-align: center;
    font-size: 11px;
    font-weight: normal;
    padding: 6px;
}

.contracheque-pdf .label,
.comprovante-retorno .label {
    font-weight: bold;
}

.contracheque-pdf .cinza {
    background: #bfbfbf;
}

.contracheque-pdf .direita,
.comprovante-retorno .direita {
    text-align: right;
}

.contracheque-pdf .centro {
    text-align: center;
}

.contracheque-pdf .eventos th {
    background: #bfbfbf;
    font-weight: normal;
    color: #000;
}

.contracheque-pdf .area-eventos {
    height: 145px;
}

.contracheque-pdf .liquido {
    background: #d9d9d9;
    font-weight: bold;
}

.contracheque-pdf .col-codigo {
    width: 10%;
}

.contracheque-pdf .col-descricao {
    width: 45%;
}

.contracheque-pdf .col-referencia,
.contracheque-pdf .col-provento,
.contracheque-pdf .col-desconto {
    width: 15%;
}

/* ==========================================================
   CONTRACHEQUE PDF MDF - INICIO
   Layout usado pelo PDF do contracheque e pelo comprovante
   anexado ao final do contracheque.
========================================================== */

.nome-funcionario-consulta {
    display: block;
    margin-top: 30px;
    min-height: 18px;
    color: #0056b3;
    font-weight: bold;
}

.nome-funcionario-consulta.erro {
    color: #dc2626;
}

.pdf-contracheque-body {
    background: #ffffff !important;
    color: #000000 !important;
    font-family: "Times New Roman", serif !important;
    font-size: 10px !important;
    margin: 0;
    padding: 0;
}

.pagina-contracheque {
    width: 100%;
    page-break-inside: avoid;
    break-inside: avoid;
}

.contracheque-pdf {
    width: 100%;
    border: 2px solid #000;
    page-break-inside: avoid;
    break-inside: avoid;
    color: #000;
    background: #fff;
}

.quebra-pagina,
.quebra-pagina-pdf {
    display: block;
    clear: both;
    height: 1px;
    line-height: 1px;
    font-size: 1px;
    margin: 0;
    padding: 0;
    page-break-after: always;
    break-after: page;
}

.quebra-pagina-antes {
    display: block;
    clear: both;
    height: 1px;
    line-height: 1px;
    font-size: 1px;
    margin: 0;
    padding: 0;
    page-break-before: always;
    break-before: page;
}

.contracheque-pdf table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    color: #000;
    font-size: 10px;
}

.contracheque-pdf td,
.contracheque-pdf th {
    border: 1px solid #000;
    padding: 3px;
    vertical-align: top;
    color: #000;
    background: #fff;
}

.contracheque-pdf .titulo {
    text-align: center;
    font-size: 11px;
    font-weight: normal;
    padding: 6px;
}

.contracheque-pdf .label,
.comprovante-retorno .label {
    font-weight: bold;
}

.contracheque-pdf .cinza {
    background: #bfbfbf;
}

.contracheque-pdf .direita,
.comprovante-retorno .direita {
    text-align: right;
}

.contracheque-pdf .centro {
    text-align: center;
}

.contracheque-pdf .eventos th {
    background: #bfbfbf;
    font-weight: normal;
    color: #000;
}

.contracheque-pdf .area-eventos {
    height: 145px;
}

.contracheque-pdf .liquido {
    background: #d9d9d9;
    font-weight: bold;
}

.contracheque-pdf .col-codigo {
    width: 10%;
}

.contracheque-pdf .col-descricao {
    width: 45%;
}

.contracheque-pdf .col-referencia,
.contracheque-pdf .col-provento,
.contracheque-pdf .col-desconto {
    width: 15%;
}

/* Comprovante bancÃ¡rio anexado ao contracheque */
.comprovante-retorno {
    width: 100%;
    border: 1px solid #333;
    padding: 14px;
    box-sizing: border-box;
    background: #fff;
    color: #000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    page-break-inside: avoid;
    break-inside: avoid;
}

.comprovante-retorno table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    background: #fff;
    color: #000;
}

.comprovante-retorno td,
.comprovante-retorno th {
    border: 1px solid #aaa;
    padding: 6px;
    vertical-align: top;
    color: #000;
    background: #fff;
}

.comprovante-retorno .sem-borda td {
    border: none;
}

.comprovante-retorno .cabecalho-comprovante td {
    text-align: center;
}

.comprovante-retorno .titulo-principal {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 3px;
}

.comprovante-retorno .subtitulo {
    font-size: 13px;
    margin-bottom: 2px;
}

.comprovante-retorno .via {
    font-size: 11px;
}

.comprovante-retorno .linha-separadora {
    border-top: 1px solid #777;
    margin: 10px 0;
    height: 0;
}

.comprovante-retorno .secao {
    font-weight: bold;
    background: #e5e5e5;
}

/* ==========================================================
   CONTRACHEQUE PDF MDF - FIM
========================================================== */

/* ==========================================================
   CONTRACHEQUE - BOTÃ•ES DO FORMULÃRIO
   Usa o botÃ£o Voltar no mesmo padrÃ£o visual dos relatÃ³rios MDF
========================================================== */

.card-formulario .botoes-formulario {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 18px;
}

.card-formulario .botoes-formulario .btn-gerar,
.card-formulario .botoes-formulario .btn-voltar-filtro,
.card-formulario .botoes-formulario a.btn-voltar-filtro {
    width: 100%;
    max-width: 260px;
    min-height: 40px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 10px 22px;
    margin: 0;

    border: none;
    border-radius: 8px;

    background: #1f4e79;
    color: #ffffff !important;

    font-size: 15px;
    font-weight: 700;
    text-decoration: none !important;

    cursor: pointer;

    box-shadow: 0 0 12px rgba(0,195,255,.35);
}

.card-formulario .botoes-formulario .btn-gerar:hover,
.card-formulario .botoes-formulario .btn-voltar-filtro:hover,
.card-formulario .botoes-formulario a.btn-voltar-filtro:hover {
    background: #1565c0;
    color: #ffffff !important;
    transform: translateY(-2px);
}
/* ================================================================
   MÃ“DULO CENTRAL NFS-e
   Todo o layout do mÃ³dulo deve permanecer neste arquivo central.
   ================================================================ */

body .conteudo-central.nfse-conteudo {
    align-items: flex-start;
    padding: 28px 18px 50px;
    box-sizing: border-box;
}

.nfse-container {
    width: min(1200px, 100%);
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.nfse-card {
    width: 100%;
    padding: 26px;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
    box-sizing: border-box;
}

.nfse-card h2,
.nfse-card h3 {
    margin-top: 0;
    color: #003366;
}

.nfse-card h2 {
    margin-bottom: 6px;
    font-size: 30px;
}

.nfse-card h3 {
    margin-bottom: 20px;
    font-size: 23px;
}

.nfse-cabecalho {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.nfse-cabecalho p {
    margin: 0;
    color: #555;
}

.nfse-status-preparacao {
    flex: 0 0 auto;
    padding: 8px 13px;
    border: 1px solid #d99a22;
    border-radius: 20px;
    background: #fff5dc;
    color: #7b4b00;
    font-size: 13px;
    font-weight: bold;
}

.nfse-acoes-topo,
.nfse-acoes-formulario,
.nfse-acoes-tabela {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.nfse-acoes-topo {
    margin: 18px 0;
}

.nfse-acoes-topo .btn-voltar,
.nfse-acoes-topo .btn-pesquisar,
.nfse-acoes-formulario .btn-pesquisar {
    margin: 0;
}

.nfse-aviso,
.mensagem-alerta,
.mensagem-sucesso {
    padding: 13px 15px;
    border-radius: 8px;
    line-height: 1.5;
}

.nfse-aviso,
.mensagem-alerta {
    border-left: 5px solid #d99a22;
    background: #fff8e7;
    color: #6c4700;
}

.mensagem-sucesso {
    margin: 14px 0;
    border-left: 5px solid #27864a;
    background: #eaf8ef;
    color: #176231;
}

body .nfse-formulario {
    width: 100%;
    max-width: none;
    grid-template-columns: repeat(2, minmax(240px, 1fr));
    margin: 0;
}

body .nfse-formulario textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #bbb;
    border-radius: 6px;
    box-sizing: border-box;
    resize: vertical;
    font-family: inherit;
    font-size: 14px;
}

.nfse-campo-largo {
    grid-column: 1 / -1;
}

.nfse-sem-registros {
    padding: 24px !important;
    text-align: center;
    color: #666;
}

.nfse-card small {
    display: block;
    margin-top: 3px;
    color: #666;
}

.nfse-acoes-tabela .btn-acao {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 5px 10px;
    border-radius: 5px;
    background: #1f4e79;
    color: #fff;
    text-decoration: none;
    font-size: 12px;
    font-weight: bold;
}

.nfse-acoes-tabela .btn-acao:hover {
    background: #163a5b;
}

@media (max-width: 760px) {
    .nfse-cabecalho {
        flex-direction: column;
    }

    body .nfse-formulario {
        grid-template-columns: 1fr;
    }

    .nfse-campo-largo {
        grid-column: auto;
    }

    .nfse-card {
        padding: 18px;
    }
}


/* ================================================================
   NFS-e V4 â€” BOTÃ•ES E CARTÃ•ES PADRONIZADOS
   Regras centralizadas. NÃ£o inserir estilos nos arquivos PHP.
   ================================================================ */
body .conteudo-central.nfse-conteudo .nfse-card {
    width: 100%;
    padding: 26px;
    border-radius: 12px;
    background: #ffffff !important;
    color: #333333 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
    box-sizing: border-box;
}

body .conteudo-central.nfse-conteudo .nfse-card h2,
body .conteudo-central.nfse-conteudo .nfse-card h3 {
    color: #003366 !important;
    text-shadow: none !important;
}

body .conteudo-central.nfse-conteudo .nfse-card p,
body .conteudo-central.nfse-conteudo .nfse-card label,
body .conteudo-central.nfse-conteudo .nfse-card td,
body .conteudo-central.nfse-conteudo .nfse-card th {
    color: #333333;
}

body .btn-nfse,
body a.btn-nfse {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 10px 18px !important;
    margin: 0 !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    cursor: pointer !important;
    transition: background .2s ease, border-color .2s ease, transform .2s ease !important;
}

body .btn-nfse-voltar,
body a.btn-nfse-voltar {
    border-color: #1497c9 !important;
    background: #1f4e79 !important;
    color: #ffffff !important;
    box-shadow: 0 0 12px rgba(0, 195, 255, .25) !important;
}

body .btn-nfse-secundario,
body a.btn-nfse-secundario {
    border-color: #1f4e79 !important;
    background: #ffffff !important;
    color: #1f4e79 !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .12) !important;
}

body .btn-nfse-voltar:hover,
body a.btn-nfse-voltar:hover {
    background: #1565c0 !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

body .btn-nfse-secundario:hover,
body a.btn-nfse-secundario:hover {
    background: #1f4e79 !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}


/* ============================================================
   Ferramenta: atualizaÃ§Ã£o da estrutura do banco
   ============================================================ */
.pagina-ferramenta-estrutura {
    background: #f3f4f6;
    color: #111827;
}

.pagina-ferramenta-estrutura .ferramenta-estrutura-card {
    margin-bottom: 16px;
}

.pagina-ferramenta-estrutura pre {
    overflow-x: auto;
    white-space: pre-wrap;
    padding: 10px;
    border-radius: 8px;
    background: #111827;
    color: #f9fafb;
    font-size: 12px;
}

.pagina-ferramenta-estrutura .ferramenta-estrutura-btn-aplicar {
    background: #dc2626;
}

/* ========================================================================== 
   NFS-e â€” validaÃ§Ã£o interna local
   ========================================================================== */
.nfse-status-validacao {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 13px;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .04em;
}

.nfse-validacao-ok {
    background: #dff4e7;
    color: #17653a;
}

.nfse-validacao-erro {
    background: #fde4e4;
    color: #9c2525;
}

.nfse-resumo-validacao {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 22px 0;
}

.nfse-resumo-validacao > div {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 18px;
    border: 1px solid #dce4ee;
    border-radius: 14px;
    background: #f8fafc;
}

.nfse-resumo-validacao strong {
    font-size: 1.8rem;
}

.nfse-resumo-validacao span,
.nfse-dados-validacao span {
    color: #607086;
    font-size: .84rem;
}

.nfse-lista-validacao {
    display: grid;
    gap: 12px;
}

.nfse-item-validacao {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px;
    border: 1px solid #dce4ee;
    border-left-width: 5px;
    border-radius: 12px;
    background: #fff;
}

.nfse-item-validacao > span {
    flex: 0 0 auto;
    min-width: 52px;
    padding: 5px 8px;
    border-radius: 8px;
    text-align: center;
    font-size: .72rem;
    font-weight: 800;
}

.nfse-item-validacao h4 {
    margin: 0 0 5px;
}

.nfse-item-validacao p {
    margin: 0;
    color: #607086;
}

.nfse-item-ok { border-left-color: #319b5f; }
.nfse-item-ok > span { background: #dff4e7; color: #17653a; }
.nfse-item-aviso { border-left-color: #d49a24; }
.nfse-item-aviso > span { background: #fff1c9; color: #795400; }
.nfse-item-erro { border-left-color: #c74747; }
.nfse-item-erro > span { background: #fde4e4; color: #9c2525; }

.nfse-dados-validacao {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.nfse-dados-validacao > div {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 16px;
    border: 1px solid #dce4ee;
    border-radius: 12px;
    background: #f8fafc;
}

@media (max-width: 760px) {
    .nfse-resumo-validacao,
    .nfse-dados-validacao {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================================
   IDENTIDADE INSTITUCIONAL MDF â€” V13
   Layout centralizado. NÃ£o adicionar CSS nas pÃ¡ginas PHP.
   ========================================================================== */

body .institucional-conteudo {
    display: block;
    width: min(1240px, calc(100% - 36px));
    margin: 34px auto 64px;
    padding: 0;
    color: #17243a;
}

.institucional-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 18px;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 16px;
    background: rgba(5, 25, 52, .88);
    box-shadow: 0 12px 34px rgba(0, 0, 0, .18);
}

.institucional-nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 16px;
    border-radius: 10px;
    color: #dcecff !important;
    text-decoration: none !important;
    font-size: .92rem;
    font-weight: 750;
    transition: background .2s ease, color .2s ease, transform .2s ease;
}

.institucional-nav-link:hover,
.institucional-nav-link-ativo {
    background: #1484c7;
    color: #fff !important;
    transform: translateY(-1px);
}

.institucional-nav-voltar {
    margin-left: auto;
    border: 1px solid rgba(255, 255, 255, .2);
}

.institucional-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(300px, .55fr);
    gap: 34px;
    align-items: center;
    overflow: hidden;
    padding: clamp(34px, 6vw, 76px);
    border-radius: 28px;
    background:
        radial-gradient(circle at 90% 5%, rgba(57, 203, 239, .22), transparent 30%),
        linear-gradient(135deg, #071c37 0%, #103c68 58%, #0b5675 100%);
    color: #fff;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}

.institucional-etiqueta {
    display: inline-flex;
    margin-bottom: 20px;
    padding: 8px 13px;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    color: #d8f7ff;
    font-size: .82rem;
    font-weight: 750;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.institucional-marca {
    margin: 0 0 14px;
    color: #60dbf3;
    font-size: .88rem;
    font-weight: 900;
    letter-spacing: .2em;
}

body .institucional-hero h1 {
    max-width: 840px;
    margin: 0;
    color: #fff !important;
    text-shadow: none !important;
    font-size: clamp(2.25rem, 5.2vw, 4.9rem) !important;
    line-height: 1.03;
    letter-spacing: -.045em;
}

.institucional-resumo {
    max-width: 790px;
    margin: 26px 0 0;
    color: rgba(255, 255, 255, .84);
    font-size: 1.1rem;
    line-height: 1.75;
}

.institucional-acoes {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 32px;
}

.institucional-hero-painel {
    display: grid;
    gap: 12px;
}

.institucional-hero-painel > div {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 19px 22px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 16px;
    background: rgba(255, 255, 255, .08);
    backdrop-filter: blur(8px);
}

.institucional-hero-painel strong {
    color: #60dbf3;
    font-size: 1.35rem;
}

.institucional-hero-painel span {
    color: #fff;
    font-weight: 750;
}

.institucional-declaracao {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 30px;
    align-items: center;
    margin-top: 22px;
    padding: 30px 36px;
    border-left: 5px solid #1aa9d8;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 16px 44px rgba(5, 25, 52, .13);
}

.institucional-declaracao span {
    color: #0a4c78;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.institucional-declaracao p {
    margin: 0;
    color: #45556d;
    font-size: 1.08rem;
    line-height: 1.72;
}

.institucional-secao {
    margin-top: 24px;
    padding: clamp(28px, 5vw, 52px);
    border: 1px solid #dce5ef;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 16px 44px rgba(5, 25, 52, .11);
}

.institucional-secao-escura {
    border-color: transparent;
    background: linear-gradient(145deg, #0a2442, #123f68);
    color: #fff;
}

.institucional-cabecalho-secao {
    max-width: 810px;
    margin-bottom: 30px;
}

.institucional-cabecalho-secao > span,
.institucional-capa-interna > span {
    display: block;
    margin-bottom: 8px;
    color: #1685b9;
    font-size: .82rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.institucional-secao-escura .institucional-cabecalho-secao > span {
    color: #60dbf3;
}

body .institucional-cabecalho-secao h2,
body .institucional-capa-interna h1,
body .institucional-assinatura h2 {
    margin: 0 0 12px;
    color: #113b63 !important;
    text-shadow: none !important;
    letter-spacing: -.025em;
}

body .institucional-cabecalho-secao h2 {
    font-size: clamp(1.8rem, 3.4vw, 3rem) !important;
}

.institucional-secao-escura .institucional-cabecalho-secao h2,
.institucional-secao-escura .institucional-cabecalho-secao p {
    color: #fff !important;
}

.institucional-cabecalho-secao p {
    margin: 0;
    color: #64748a;
    line-height: 1.7;
}

.institucional-grade {
    display: grid;
    gap: 18px;
}

.institucional-grade-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.institucional-grade-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.institucional-grade-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.institucional-card,
.institucional-card-valor,
.institucional-card-modulo,
.institucional-roadmap-card {
    padding: 25px;
    border: 1px solid #dce5ef;
    border-radius: 18px;
    background: #f8fafc;
}

.institucional-card-destaque {
    border-color: #b6dff0;
    background: linear-gradient(145deg, #eef9fd, #fff);
}

.institucional-numero {
    display: inline-flex;
    margin-bottom: 26px;
    color: #1685b9;
    font-size: 1.5rem;
    font-weight: 900;
}

body .institucional-card h3,
body .institucional-card-modulo h3 {
    margin: 0 0 10px;
    color: #183d61 !important;
    text-shadow: none !important;
}

.institucional-card p,
.institucional-card-valor p,
.institucional-card-modulo p {
    margin: 0;
    color: #64748a;
    line-height: 1.65;
}

.institucional-card-valor strong {
    display: block;
    margin-bottom: 9px;
    color: #164f78;
}

.institucional-card-modulo {
    border-color: rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .07);
}

.institucional-card-modulo > span {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    margin-bottom: 22px;
    border-radius: 14px;
    background: #1aa9d8;
    color: #fff;
    font-size: 1.35rem;
    font-weight: 900;
}

.institucional-secao-escura .institucional-card-modulo h3,
.institucional-secao-escura .institucional-card-modulo p {
    color: #fff !important;
}

.institucional-secao-escura .institucional-card-modulo p {
    opacity: .75;
}

.institucional-fluxo {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr) 26px
        minmax(0, 1fr) 26px
        minmax(0, 1fr) 26px
        minmax(0, 1fr) 26px
        minmax(0, 1fr);
    gap: 12px;
    align-items: stretch;
}

.institucional-fluxo > article {
    display: flex;
    min-width: 0;
    min-height: 250px;
    padding: 22px;
    border: 1px solid #dce5ef;
    border-radius: 16px;
    background: #f8fafc;
    flex-direction: column;
}

.institucional-fluxo > article strong {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    margin-bottom: 20px;
    border-radius: 10px;
    background: #1685b9;
    color: #fff;
}

body.pagina-institucional .institucional-fluxo > article h3 {
    max-width: 100%;
    margin: 0 0 10px;
    color: #153e62 !important;
    font-size: 1.18rem !important;
    font-weight: 850;
    line-height: 1.25;
    overflow-wrap: break-word;
    text-shadow: none !important;
}

.institucional-fluxo > article p {
    margin: 0;
    color: #64748a;
    line-height: 1.55;
}

.institucional-fluxo > span {
    display: grid;
    place-items: center;
    align-self: stretch;
    color: #1685b9;
    font-size: 1.5rem;
    font-weight: 900;
}

.institucional-pergunta {
    margin-top: 24px;
    padding: clamp(34px, 6vw, 68px);
    border-radius: 24px;
    background: linear-gradient(135deg, #071c37, #124c73);
    color: #fff;
    text-align: center;
    box-shadow: 0 20px 55px rgba(0, 0, 0, .25);
}

.institucional-pergunta > span {
    color: #60dbf3;
    font-size: .8rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.institucional-pergunta blockquote {
    max-width: 920px;
    margin: 22px auto;
    font-size: clamp(1.65rem, 4vw, 3.25rem);
    font-weight: 850;
    line-height: 1.25;
}

.institucional-pergunta p {
    margin: 0;
    color: rgba(255, 255, 255, .72);
}

.institucional-assinatura {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 24px;
    padding: 32px 36px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 16px 44px rgba(5, 25, 52, .11);
}

.institucional-assinatura span {
    color: #1685b9;
    font-weight: 900;
    letter-spacing: .12em;
}

.institucional-assinatura p {
    margin: 6px 0 0;
    color: #64748a;
}

.institucional-capa-interna {
    padding: clamp(36px, 6vw, 72px);
    border-radius: 26px;
    background:
        radial-gradient(circle at top right, rgba(96, 219, 243, .18), transparent 32%),
        linear-gradient(135deg, #071c37, #124c73);
    color: #fff;
    box-shadow: 0 20px 55px rgba(0, 0, 0, .23);
}

body .institucional-capa-interna h1 {
    max-width: 920px;
    color: #fff !important;
    font-size: clamp(2rem, 4.6vw, 4.2rem) !important;
}

.institucional-capa-interna p {
    max-width: 800px;
    margin: 20px 0 0;
    color: rgba(255, 255, 255, .8);
    line-height: 1.7;
}

.institucional-linha-tempo {
    position: relative;
    display: grid;
    gap: 22px;
}

.institucional-linha-tempo::before {
    content: "";
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 108px;
    width: 2px;
    background: #cfe2ee;
}

.institucional-linha-tempo > article {
    position: relative;
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr);
    gap: 42px;
    align-items: start;
}

.institucional-linha-tempo > article > span {
    padding-top: 15px;
    color: #1685b9;
    font-size: .8rem;
    font-weight: 900;
    text-align: right;
    text-transform: uppercase;
}

.institucional-linha-tempo > article > div {
    position: relative;
    padding: 24px 28px;
    border: 1px solid #dce5ef;
    border-radius: 17px;
    background: #f8fafc;
}

.institucional-linha-tempo > article > div::before {
    content: "";
    position: absolute;
    top: 25px;
    left: -29px;
    width: 13px;
    height: 13px;
    border: 4px solid #fff;
    border-radius: 50%;
    background: #1685b9;
    box-shadow: 0 0 0 2px #bcdce9;
}

.institucional-linha-tempo h2 {
    margin: 0 0 8px;
    color: #153e62;
    font-size: 1.2rem;
}

.institucional-linha-tempo p {
    margin: 0;
    color: #64748a;
    line-height: 1.65;
}

.institucional-linha-tempo-compacta {
    gap: 14px;
}

.institucional-roadmap-card > span {
    display: inline-flex;
    margin-bottom: 16px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #e7f4fa;
    color: #146c98;
    font-size: .76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.institucional-roadmap-card h2 {
    margin: 0 0 18px;
    color: #153e62;
}

.institucional-roadmap-card ul {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.institucional-roadmap-card li {
    position: relative;
    padding-left: 24px;
    color: #526177;
    line-height: 1.5;
}

.institucional-roadmap-card li::before {
    content: "âœ“";
    position: absolute;
    left: 0;
    color: #1685b9;
    font-weight: 900;
}

.institucional-roadmap-concluido {
    border-color: #a8dcc0;
    background: #f1fbf5;
}

.institucional-roadmap-andamento {
    border-color: #f0cf80;
    background: #fffaf0;
}

.institucional-status-sistema {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 15px;
}

.institucional-status-sistema article {
    padding: 22px;
    border: 1px solid #dce5ef;
    border-radius: 15px;
    background: #f8fafc;
}

.institucional-status-sistema span {
    display: block;
    margin-bottom: 7px;
    color: #728097;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.institucional-status-sistema strong {
    color: #153e62;
}

/*
 * ProteÃ§Ã£o do institucional contra a regra global de tÃ­tulos do sistema.
 * MantÃ©m os textos dentro dos cards e remove o brilho aplicado aos relatÃ³rios.
 */
body.pagina-institucional .institucional-conteudo h1,
body.pagina-institucional .institucional-conteudo h2,
body.pagina-institucional .institucional-conteudo h3 {
    text-shadow: none !important;
}

body.pagina-institucional .institucional-card h3,
body.pagina-institucional .institucional-card-modulo h3 {
    font-size: 1.22rem !important;
    line-height: 1.3;
}

body.pagina-institucional .institucional-roadmap-card h2 {
    color: #153e62 !important;
    font-size: 1.38rem !important;
    line-height: 1.3;
    text-shadow: none !important;
}

body.pagina-institucional .institucional-linha-tempo h2 {
    color: #153e62 !important;
    font-size: 1.2rem !important;
    line-height: 1.35;
    text-shadow: none !important;
}

/* Footer institucional no mesmo alinhamento e largura do conteÃºdo. */
body.pagina-institucional .footer-mdf {
    width: min(1240px, calc(100% - 36px));
    margin: 0 auto 10px;
    box-sizing: border-box;
}

body.pagina-institucional .footer-copy {
    width: min(1240px, calc(100% - 36px));
    margin: 0 auto;
    box-sizing: border-box;
}

body.pagina-institucional .footer-logo h3 {
    max-width: 100%;
    color: #fff !important;
    font-size: 1.7rem !important;
    line-height: 1.2;
    overflow-wrap: anywhere;
    text-shadow: none !important;
}

@media (max-width: 1040px) {
    .institucional-hero {
        grid-template-columns: 1fr;
    }

    .institucional-grade-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .institucional-fluxo {
        grid-template-columns: 1fr;
    }

    .institucional-fluxo > article {
        min-height: 0;
    }

    .institucional-fluxo > span {
        transform: rotate(90deg);
        text-align: center;
    }

    body.pagina-institucional .footer-mdf {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.pagina-institucional .footer-box:nth-child(2) {
        border-right: none;
    }

    .institucional-status-sistema {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    body .institucional-conteudo {
        width: min(100% - 18px, 1240px);
        margin-top: 18px;
    }

    body.pagina-institucional .footer-mdf,
    body.pagina-institucional .footer-copy {
        width: min(100% - 18px, 1240px);
    }

    body.pagina-institucional .footer-mdf {
        grid-template-columns: 1fr;
        padding: 24px;
    }

    body.pagina-institucional .footer-box,
    body.pagina-institucional .footer-box:nth-child(2) {
        border-right: none;
        padding-right: 0;
    }

    .institucional-nav-voltar {
        width: 100%;
        margin-left: 0;
    }

    .institucional-hero,
    .institucional-capa-interna,
    .institucional-secao,
    .institucional-pergunta,
    .institucional-assinatura {
        border-radius: 18px;
    }

    .institucional-declaracao,
    .institucional-grade-2,
    .institucional-grade-3,
    .institucional-grade-4,
    .institucional-status-sistema {
        grid-template-columns: 1fr;
    }

    .institucional-assinatura {
        align-items: flex-start;
        flex-direction: column;
    }

    .institucional-linha-tempo::before {
        left: 8px;
    }

    .institucional-linha-tempo > article {
        grid-template-columns: 1fr;
        gap: 8px;
        padding-left: 28px;
    }

    .institucional-linha-tempo > article > span {
        padding-top: 0;
        text-align: left;
    }

    .institucional-linha-tempo > article > div::before {
        top: 24px;
        left: -27px;
    }
}

/* ========================================================================== 
   NFS-e V15 â€” certificado digital A1 em homologaÃ§Ã£o
   ========================================================================== */
.nfse-certificado-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 13px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .04em;
}

.nfse-certificado-ok {
    border-color: #75b98c;
    background: #dff4e7;
    color: #17653a;
}

.nfse-certificado-aviso,
.nfse-certificado-pendente {
    border-color: #e0b75f;
    background: #fff1c9;
    color: #795400;
}

.nfse-certificado-erro {
    border-color: #df8a8a;
    background: #fde4e4;
    color: #9c2525;
}

.nfse-certificado-mensagem {
    margin: 20px 0;
    padding: 14px 16px;
    border-left: 5px solid currentColor;
    border-radius: 10px;
    line-height: 1.5;
}

.nfse-certificado-dados {
    margin: 20px 0;
}

.nfse-certificado-dados strong {
    overflow-wrap: anywhere;
}

/* ==========================================================
   MDF NFS-e V17 â€” Assinatura digital local da DPS
   ========================================================== */
.nfse-form-assinatura {
    margin-top: 18px;
}

.nfse-assinatura-dados {
    margin-top: 20px;
}

.nfse-hash-xml {
    overflow-wrap: anywhere;
    word-break: break-word;
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.82rem;
}

.nfse-status-assinatura-ok {
    display: block;
    width: max-content;
    margin-top: 5px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #dff4e7;
    color: #17653a;
    font-weight: 700;
    line-height: 1.2;
}

/* NFS-e V17: aÃ§Ãµes POST exibidas no mesmo alinhamento dos botÃµes. */
.nfse-form-acao-inline {
    display: inline-flex;
    margin: 0;
}

.nfse-form-acao-inline .btn-nfse {
    border: 0;
    cursor: pointer;
    font: inherit;
}

/* ==========================================================
   MDF NFS-e V18 â€” transmissÃ£o em ProduÃ§Ã£o Restrita
   ========================================================== */
.nfse-aviso-homologacao {
    margin: 18px 0;
    padding: 15px 17px;
    border: 1px solid #dfb85c;
    border-left-width: 5px;
    border-radius: 12px;
    background: #fff6d9;
    color: #674900;
    line-height: 1.5;
}

.nfse-card-transmissao {
    margin-top: 22px;
}

.nfse-endpoint-homologacao {
    display: grid;
    gap: 4px;
    margin: 14px 0 18px;
    padding: 13px 15px;
    border: 1px solid #b8cfdf;
    border-radius: 11px;
    background: #eef6fb;
}

.nfse-endpoint-homologacao span,
.nfse-endpoint-homologacao small {
    color: #38586d;
}

.nfse-endpoint-homologacao strong {
    color: #123f5b;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.nfse-btn-transmitir {
    border: 0;
    cursor: pointer;
    font: inherit;
}

.nfse-retorno-api-dados,
.nfse-autorizacao-dados {
    margin-top: 20px;
}

.nfse-retorno-api-dados strong,
.nfse-autorizacao-dados strong {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.nfse-mensagens-api {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.nfse-mensagens-api h4 {
    margin: 0;
}

.nfse-mensagens-api article {
    display: grid;
    gap: 3px;
    padding: 12px 14px;
    border: 1px solid #cfd9df;
    border-radius: 10px;
    background: #f7fafc;
}

.nfse-mensagens-api article strong,
.nfse-mensagens-api article span,
.nfse-mensagens-api article small {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.nfse-mensagens-api-erro article {
    border-color: #df9999;
    background: #fff0f0;
    color: #8d2626;
}

.nfse-mensagens-api-alerta article {
    border-color: #e0bd6f;
    background: #fff7df;
    color: #6c5008;
}

@media (max-width: 760px) {
    .nfse-endpoint-homologacao,
    .nfse-aviso-homologacao {
        padding: 12px;
    }

    .nfse-form-acao-inline,
    .nfse-form-acao-inline .btn-nfse,
    .nfse-btn-transmitir {
        width: 100%;
    }
}

/* ========================================================================== 
   MDF V20 â€” dados cadastrais do prÃ³prio cliente
   A pÃ¡gina consulta e atualiza somente o ID_CLIENTE existente na sessÃ£o.
   ========================================================================== */
.dados-cliente-container {
    width: min(1050px, 100%);
}

.dados-cliente-identificacao {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 12px;
    margin: 0 0 20px;
}

.dados-cliente-identificacao > div {
    min-width: 0;
    padding: 13px 15px;
    border: 1px solid #d6dee8;
    border-radius: 9px;
    background: #f7f9fc;
}

.dados-cliente-identificacao span,
.dados-cliente-identificacao strong {
    display: block;
}

.dados-cliente-identificacao span {
    margin-bottom: 4px;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.dados-cliente-identificacao strong {
    overflow-wrap: anywhere;
    color: #1f2937;
    font-size: 15px;
}

body form.form-filtros-banco-horas.dados-cliente-formulario {
    width: 100% !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(230px, 1fr)) !important;
    align-items: end !important;
    justify-content: stretch !important;
    gap: 16px !important;
    margin: 0 !important;
}

body form.form-filtros-banco-horas.dados-cliente-formulario label {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}

body form.form-filtros-banco-horas.dados-cliente-formulario input {
    min-width: 0 !important;
}

body form.form-filtros-banco-horas.dados-cliente-formulario .dados-cliente-campo-largo {
    grid-column: 1 / -1;
}

.dados-cliente-acoes {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 4px;
}

body form.form-filtros-banco-horas.dados-cliente-formulario .dados-cliente-acoes .btn-voltar-filtro {
    min-width: 145px !important;
    background: #1f4e79 !important;
    color: #ffffff !important;
    box-shadow: 0 0 12px rgba(0, 195, 255, .35) !important;
}

body form.form-filtros-banco-horas.dados-cliente-formulario .dados-cliente-acoes .btn-voltar-filtro:hover {
    background: #1565c0 !important;
    color: #ffffff !important;
}

.mensagem-erro {
    margin: 14px 0;
    padding: 13px 15px;
    border-left: 5px solid #b42318;
    border-radius: 8px;
    background: #fdecec;
    color: #8a1c13;
    line-height: 1.5;
}

@media (max-width: 760px) {
    .dados-cliente-identificacao {
        grid-template-columns: 1fr;
    }

    body form.form-filtros-banco-horas.dados-cliente-formulario {
        grid-template-columns: 1fr !important;
    }

    body form.form-filtros-banco-horas.dados-cliente-formulario .dados-cliente-campo-largo,
    .dados-cliente-acoes {
        grid-column: auto;
    }
}

/* ========================================================================== 
   MDF V22 â€” reassinatura visÃ­vel e correÃ§Ã£o do tomador da prÃ³pria DPS
   ========================================================================== */
.nfse-bloqueio-reassinatura {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.nfse-pendencias-assinatura {
    margin: 14px 0;
    padding: 16px 18px;
    border: 1px solid #f2c4bf;
    border-radius: 10px;
    background: #fff7f6;
}

.nfse-pendencias-assinatura h4 {
    margin: 0 0 10px;
    color: #8a1c13;
}

.nfse-pendencias-assinatura ul {
    margin: 0;
    padding-left: 22px;
}

.nfse-pendencias-assinatura li {
    margin: 7px 0;
    color: #5f261f;
    line-height: 1.45;
}

.nfse-acoes-reassinatura-bloqueada {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 14px;
}

.nfse-acoes-reassinatura-bloqueada .btn-pesquisar[disabled] {
    cursor: not-allowed !important;
    opacity: .56 !important;
    filter: grayscale(.25);
    box-shadow: none !important;
}

.nfse-ajuda-admin {
    flex: 1 1 100%;
    color: #7a4b00;
    font-size: 14px;
}

@media (max-width: 760px) {
    .nfse-acoes-reassinatura-bloqueada > * {
        width: 100%;
        text-align: center;
    }
}

/* ========================================================================== 
   MDF V23 â€” correÃ§Ã£o da sÃ©rie e dos dados do serviÃ§o da DPS
   ========================================================================== */
.nfse-checkbox-linha {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    color: #334155;
    font-weight: 600;
    line-height: 1.45;
}

body form.form-filtros-banco-horas .nfse-checkbox-linha input[type="checkbox"] {
    flex: 0 0 auto;
    width: 18px !important;
    min-width: 18px !important;
    height: 18px;
    margin: 2px 0 0;
}

.nfse-acoes-tabela {
    min-width: 190px;
}

@media (max-width: 760px) {
    .nfse-checkbox-linha {
        align-items: flex-start;
    }
}

/* ========================================================================== 
   MDF V27 â€” produÃ§Ã£o/homologaÃ§Ã£o, retenÃ§Ã£o do ISSQN e configuraÃ§Ã£o legÃ­vel
   ========================================================================== */
.nfse-config-container {
    width: min(1180px, 100%);
}

.nfse-config-card {
    overflow: visible;
    border: 1px solid #cdd9e7;
    box-shadow: 0 12px 30px rgba(12, 42, 72, .10);
}

.nfse-config-cabecalho {
    align-items: flex-start;
    gap: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid #dbe4ee;
}

.nfse-config-sobretitulo {
    display: inline-block;
    margin-bottom: 7px;
    color: #087fb3;
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .14em;
}

.nfse-config-cabecalho h2,
.nfse-config-card h3 {
    color: #123d66;
}

.nfse-ambiente-badge,
.nfse-ambiente-mini {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-weight: 900;
    letter-spacing: .035em;
    white-space: nowrap;
}

.nfse-ambiente-badge {
    min-height: 40px;
    padding: 0 16px;
    border: 1px solid transparent;
    font-size: .78rem;
}

.nfse-ambiente-homologacao,
.nfse-ambiente-mini.homologacao {
    border-color: #6faed1;
    background: #e7f4fb;
    color: #145e84;
}

.nfse-ambiente-producao,
.nfse-ambiente-mini.producao {
    border-color: #dd7777;
    background: #fdeaea;
    color: #9d2020;
}

.nfse-config-form {
    display: grid;
    gap: 22px;
    width: 100%;
    margin-top: 22px;
}

.nfse-config-secao {
    min-width: 0;
    margin: 0;
    padding: 20px;
    border: 1px solid #cfdbe8;
    border-radius: 14px;
    background: #f9fbfd;
}

.nfse-config-secao legend {
    padding: 0 8px;
    color: #123d66;
    font-size: 1.02rem;
    font-weight: 900;
}

.nfse-config-secao-ambiente {
    border-color: #a9c6da;
    background: #f4fafe;
}

.nfse-config-ajuda {
    margin: 0 0 16px;
    color: #4b6278;
    font-size: .9rem;
    line-height: 1.55;
}

.nfse-config-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
}

.nfse-config-campo {
    display: flex !important;
    flex-direction: column;
    align-items: stretch !important;
    gap: 7px;
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    color: #1f3448 !important;
    font-weight: 700 !important;
}

.nfse-config-campo-largo {
    grid-column: 1 / -1;
}

.nfse-label-texto,
.nfse-formulario .nfse-label-texto {
    display: block;
    color: #163b5c;
    font-size: .88rem;
    font-weight: 900;
    line-height: 1.3;
}

.nfse-config-form input:not([type="radio"]):not([type="checkbox"]),
.nfse-config-form select,
.nfse-config-form textarea,
.nfse-formulario .nfse-label-texto + input,
.nfse-formulario .nfse-label-texto + select,
.nfse-formulario .nfse-label-texto + textarea {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 46px;
    padding: 11px 13px !important;
    border: 2px solid #aebfd0 !important;
    border-radius: 9px !important;
    background: #ffffff !important;
    color: #132c43 !important;
    font-size: .96rem !important;
    font-weight: 650 !important;
    box-shadow: inset 0 1px 2px rgba(15, 45, 75, .04) !important;
}

.nfse-config-form input:focus,
.nfse-config-form select:focus,
.nfse-config-form textarea:focus,
.nfse-formulario .nfse-label-texto + input:focus,
.nfse-formulario .nfse-label-texto + select:focus,
.nfse-formulario .nfse-label-texto + textarea:focus {
    outline: 3px solid rgba(0, 153, 214, .18) !important;
    border-color: #078fc2 !important;
}

.nfse-config-campo small,
.nfse-config-checkbox-card small,
.nfse-formulario label small,
.nfse-confirmacao-transmissao-producao small {
    display: block;
    color: #5d7184;
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.45;
}

.nfse-opcoes-ambiente,
.nfse-opcoes-retencao {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.nfse-opcao-ambiente,
.nfse-opcao-retencao {
    position: relative;
    display: flex !important;
    align-items: center !important;
    gap: 14px;
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    padding: 17px !important;
    border: 2px solid #c5d2df;
    border-radius: 13px;
    background: #ffffff;
    color: #263f56 !important;
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.nfse-opcao-ambiente:hover,
.nfse-opcao-retencao:hover {
    border-color: #62a8cc;
    box-shadow: 0 7px 18px rgba(21, 89, 126, .10);
    transform: translateY(-1px);
}

.nfse-opcao-ambiente.selecionada,
.nfse-opcao-retencao.selecionada {
    border-color: #078fc2;
    background: #eef9fe;
    box-shadow: 0 0 0 3px rgba(7, 143, 194, .12);
}

.nfse-opcao-ambiente.nfse-opcao-producao.selecionada,
.nfse-opcao-retencao.tomador.selecionada {
    border-color: #bd4242;
    background: #fff4f4;
    box-shadow: 0 0 0 3px rgba(189, 66, 66, .11);
}

.nfse-opcao-ambiente input[type="radio"],
.nfse-opcao-retencao input[type="radio"] {
    position: absolute;
    width: 1px !important;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.nfse-opcao-icone {
    display: inline-flex;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 11px;
    background: #1689b9;
    color: #ffffff;
    font-size: 1.02rem;
    font-weight: 900;
}

.nfse-opcao-producao .nfse-opcao-icone {
    background: #b93434;
}

.nfse-opcao-conteudo,
.nfse-opcao-retencao > span {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.nfse-opcao-conteudo strong,
.nfse-opcao-retencao strong {
    color: #123d66;
    font-size: .98rem;
    font-weight: 900;
}

.nfse-opcao-conteudo small,
.nfse-opcao-retencao small {
    color: #536b80;
    font-size: .82rem;
    line-height: 1.45;
}

.nfse-confirmacao-producao {
    margin-top: 16px;
    padding: 16px;
    border: 1px solid #e3a2a2;
    border-radius: 12px;
    background: #fff8f8;
}

.nfse-confirmacao-producao[hidden] {
    display: none !important;
}

.nfse-confirmacao-linha,
.nfse-confirmacao-transmissao-producao,
.nfse-config-checkbox-card {
    padding: 13px 15px;
    border: 1px solid #bdcbd8;
    border-radius: 10px;
    background: #ffffff;
}

.nfse-confirmacao-linha {
    margin-top: 12px;
}

.nfse-confirmacao-transmissao-producao {
    grid-column: 1 / -1;
    border-color: #db8d8d;
    background: #fff7f7;
}

.nfse-checkbox-linha > span {
    display: grid;
    gap: 3px;
    color: #243d53;
}

.nfse-config-acoes {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 13px;
    padding-top: 4px;
}

.nfse-config-acoes-esquerda {
    justify-content: flex-start;
}

.nfse-config-acoes .btn-pesquisar,
.nfse-config-acoes .btn-nfse,
.nfse-acoes-formulario .btn-pesquisar,
.nfse-acoes-topo .btn-nfse,
.nfse-acoes-reassinatura-bloqueada .btn-nfse,
.nfse-acoes-reassinatura-bloqueada .btn-pesquisar {
    min-height: 43px;
    padding: 10px 17px !important;
    border-radius: 8px !important;
    font-weight: 850 !important;
    text-decoration: none !important;
}

.nfse-btn-salvar-config,
.nfse-btn-transmitir {
    background: #087faf !important;
    color: #ffffff !important;
    box-shadow: 0 6px 14px rgba(8, 127, 175, .25) !important;
}

.nfse-btn-producao {
    background: #ad2929 !important;
    color: #ffffff !important;
    box-shadow: 0 6px 14px rgba(173, 41, 41, .25) !important;
}

.nfse-topo-status {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.nfse-ambiente-resumo,
.nfse-aviso-ambiente {
    border-radius: 12px;
}

.nfse-ambiente-resumo {
    display: grid;
    gap: 4px;
    min-width: 255px;
    padding: 14px 16px;
    border: 1px solid #a9c9dc;
    background: #eef8fd;
}

.nfse-ambiente-resumo-producao {
    border-color: #dc9292;
    background: #fff2f2;
}

.nfse-ambiente-resumo span,
.nfse-ambiente-resumo small {
    color: #50697d;
}

.nfse-ambiente-resumo strong {
    color: #123d66;
}

.nfse-aviso-ambiente {
    margin: 15px 0;
    padding: 13px 15px;
    border-left: 5px solid #2491bd;
    background: #edf8fd;
    color: #214f68;
}

.nfse-ambiente-mini {
    padding: 4px 9px;
    border: 1px solid transparent;
    font-size: .72rem;
}

.nfse-retencao-fieldset {
    grid-column: 1 / -1;
    min-width: 0;
    padding: 16px;
    border: 1px solid #cbd8e4;
    border-radius: 12px;
    background: #f8fbfd;
}

.nfse-retencao-fieldset legend {
    padding: 0 7px;
    color: #163b5c;
    font-weight: 900;
}

.nfse-calculo-retencao {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 14px;
    padding: 13px 15px;
    border: 1px solid #b9ccd9;
    border-radius: 9px;
    background: #ffffff;
}

.nfse-calculo-retencao span {
    color: #50677a;
    font-size: .83rem;
    font-weight: 750;
}

.nfse-calculo-retencao strong {
    color: #123d66;
    text-align: right;
}

.nfse-aviso-producao {
    margin: 18px 0;
    padding: 15px 17px;
    border: 1px solid #df8f8f;
    border-left: 5px solid #b42c2c;
    border-radius: 12px;
    background: #fff1f1;
    color: #792222;
    line-height: 1.5;
}

.nfse-endpoint-producao {
    border-color: #dfa0a0;
    background: #fff3f3;
}

.nfse-endpoint-producao span,
.nfse-endpoint-producao small,
.nfse-endpoint-producao strong {
    color: #792222;
}

@media (max-width: 820px) {
    .nfse-config-grid,
    .nfse-opcoes-ambiente,
    .nfse-opcoes-retencao {
        grid-template-columns: 1fr;
    }

    .nfse-config-campo-largo,
    .nfse-retencao-fieldset,
    .nfse-confirmacao-transmissao-producao {
        grid-column: auto;
    }

    .nfse-config-cabecalho,
    .nfse-topo-status,
    .nfse-calculo-retencao {
        flex-direction: column;
        align-items: stretch;
    }

    .nfse-ambiente-badge,
    .nfse-ambiente-resumo {
        width: 100%;
        min-width: 0;
    }

    .nfse-calculo-retencao strong {
        text-align: left;
    }

    .nfse-config-acoes > *,
    .nfse-acoes-formulario > *,
    .nfse-acoes-topo > * {
        width: 100%;
        text-align: center;
    }
}

/* =========================================================
   MDF NFS-e V28 â€” Eventos, cancelamento e IBS/CBS
   ========================================================= */
.btn-nfse-cancelar,
.nfse-acao-cancelar {
    border-color: #b83232 !important;
    background: #b83232 !important;
    color: #fff !important;
    font-weight: 900;
}

.btn-nfse-cancelar:hover,
.nfse-acao-cancelar:hover {
    border-color: #8f2323 !important;
    background: #8f2323 !important;
    color: #fff !important;
}

.nfse-fieldset-ibscbs {
    grid-column: 1 / -1;
    min-width: 0;
    margin-top: 12px;
    padding: 18px;
    border: 2px solid #b9d1e1;
    border-radius: 14px;
    background: #f5fbfe;
}

.nfse-fieldset-ibscbs legend {
    padding: 0 9px;
    color: #0c4f78;
    font-size: 1rem;
    font-weight: 900;
}

.nfse-fieldset-ibscbs .nfse-config-ajuda {
    margin: 0 0 15px;
    padding: 12px 14px;
    border-left: 4px solid #1f8fbd;
    border-radius: 8px;
    background: #e9f7fd;
    color: #214f68;
}

.nfse-card-eventos {
    border-top: 5px solid #1d6a91;
}

.nfse-form-consulta-evento {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto;
    align-items: end;
    gap: 14px;
    margin: 18px 0;
    padding: 16px;
    border: 1px solid #c9d7e2;
    border-radius: 12px;
    background: #f7fafc;
}

.nfse-form-consulta-evento label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.nfse-form-consulta-evento input {
    min-height: 44px;
    border: 1px solid #8fa9bd;
    border-radius: 8px;
    background: #fff;
    color: #102d45;
}

.nfse-form-consulta-evento small {
    color: #557084;
}

.nfse-tabela-eventos {
    margin-top: 15px;
}

.nfse-status-chip {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 4px 9px;
    border: 1px solid #b9cad7;
    border-radius: 999px;
    background: #eef4f8;
    color: #163f5e;
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .02em;
}

@media (max-width: 820px) {
    .nfse-form-consulta-evento {
        grid-template-columns: 1fr;
    }

    .nfse-form-consulta-evento button,
    .btn-nfse-cancelar,
    .nfse-acao-cancelar {
        width: 100%;
        text-align: center;
    }
}

.nfse-evento-arquivos {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.nfse-evento-arquivos a {
    display: inline-flex;
    padding: 5px 8px;
    border: 1px solid #9eb7c9;
    border-radius: 7px;
    background: #fff;
    color: #174d72;
    font-size: .74rem;
    font-weight: 850;
    text-decoration: none;
    white-space: nowrap;
}

/* ========================================================================== 
   MDF NFS-e V31 â€” substituiÃ§Ã£o com valor editÃ¡vel e layout de alto contraste
   ========================================================================== */

/* FormulÃ¡rios usados no cancelamento e na substituiÃ§Ã£o. A classe existia nos
   PHPs, mas ainda nÃ£o possuÃ­a uma regra visual centralizada. */
body .conteudo-central.nfse-conteudo .nfse-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
    margin: 0;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid > label {
    display: flex !important;
    flex-direction: column;
    align-items: stretch !important;
    gap: 8px;
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0;
    padding: 16px;
    border: 1px solid #c6d5e3;
    border-radius: 12px;
    background: #f7fafc;
    color: #17344d !important;
    box-sizing: border-box;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid > label.nfse-campo-largo,
body .conteudo-central.nfse-conteudo .nfse-form-grid > .nfse-campo-largo {
    grid-column: 1 / -1;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid .nfse-label-texto {
    display: block;
    margin: 0;
    color: #103e63 !important;
    font-size: .94rem;
    font-weight: 900;
    line-height: 1.35;
    text-shadow: none !important;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid input:not([type="checkbox"]):not([type="radio"]),
body .conteudo-central.nfse-conteudo .nfse-form-grid select,
body .conteudo-central.nfse-conteudo .nfse-form-grid textarea {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 48px;
    padding: 11px 13px !important;
    border: 2px solid #9fb4c8 !important;
    border-radius: 9px !important;
    background: #ffffff !important;
    color: #102c44 !important;
    font-family: inherit;
    font-size: .98rem !important;
    font-weight: 700 !important;
    line-height: 1.4;
    box-shadow: inset 0 1px 2px rgba(11, 48, 79, .05) !important;
    box-sizing: border-box;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid textarea {
    min-height: 130px;
    resize: vertical;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid input:focus,
body .conteudo-central.nfse-conteudo .nfse-form-grid select:focus,
body .conteudo-central.nfse-conteudo .nfse-form-grid textarea:focus {
    outline: 3px solid rgba(2, 132, 183, .18) !important;
    border-color: #087fae !important;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid small {
    display: block;
    margin: 0;
    color: #4b6479 !important;
    font-size: .82rem;
    font-weight: 650;
    line-height: 1.5;
    text-shadow: none !important;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid > label.nfse-checkbox-linha {
    flex-direction: row;
    align-items: flex-start !important;
    gap: 12px;
    border-color: #b7c9d8;
    background: #ffffff;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid > label.nfse-checkbox-linha input[type="checkbox"] {
    flex: 0 0 auto;
    width: 20px !important;
    min-width: 20px !important;
    height: 20px;
    margin: 2px 0 0;
    accent-color: #087fae;
}

body .conteudo-central.nfse-conteudo .nfse-form-grid > label.nfse-checkbox-linha strong,
body .conteudo-central.nfse-conteudo .nfse-form-grid > label.nfse-checkbox-linha span {
    color: #17344d !important;
}

.nfse-campo-destaque-valor {
    border: 2px solid #58a4ca !important;
    background: #eef8fd !important;
    box-shadow: 0 0 0 3px rgba(41, 139, 185, .08);
}

.nfse-campo-destaque-valor .nfse-label-texto::before {
    content: "VALOR CORRIGIDO â€¢ ";
    color: #a13b00;
    font-size: .74rem;
    letter-spacing: .06em;
}

body .nfse-form-grid .nfse-btn-confirmar-substituicao,
body .nfse-editar-dps-form .nfse-btn-salvar-dps {
    background: #087fae !important;
    border: 1px solid #087fae !important;
    color: #ffffff !important;
    box-shadow: 0 6px 15px rgba(8, 127, 174, .24) !important;
}

body .nfse-form-grid .nfse-btn-confirmar-substituicao:hover,
body .nfse-editar-dps-form .nfse-btn-salvar-dps:hover {
    background: #05658b !important;
    border-color: #05658b !important;
    color: #ffffff !important;
}

/* Lista principal de documentos: corrige o conflito do CSS geral de tabelas,
   que estava deixando cabeÃ§alhos claros e textos escuros sobre os botÃµes. */
.nfse-card-registros {
    overflow: hidden;
}

.nfse-card-registros > h3 {
    margin-bottom: 16px;
}

.nfse-area-tabela-registros {
    margin-bottom: 0;
    border: 1px solid #c8d5e2;
    border-radius: 12px;
    background: #ffffff;
}

body .conteudo-central.nfse-conteudo .nfse-registros-tabela {
    min-width: 1180px;
    border-collapse: separate;
    border-spacing: 0;
    background: #ffffff;
    font-size: 13px;
}

body .conteudo-central.nfse-conteudo .nfse-registros-tabela thead th,
body .conteudo-central.nfse-conteudo .nfse-registros-tabela thead th * {
    padding: 13px 10px;
    border-color: #315d82 !important;
    background: #174a73 !important;
    color: #ffffff !important;
    font-size: .76rem;
    font-weight: 900 !important;
    letter-spacing: .035em;
    text-align: left;
    text-shadow: none !important;
    opacity: 1 !important;
}

body .conteudo-central.nfse-conteudo .nfse-registros-tabela tbody td,
body .conteudo-central.nfse-conteudo .nfse-registros-tabela tbody td *:not(.btn-acao):not(.nfse-status-documento) {
    color: #172f45 !important;
    text-shadow: none !important;
}

body .conteudo-central.nfse-conteudo .nfse-registros-tabela tbody td {
    padding: 12px 10px;
    border-color: #d5dee7 !important;
    background: #ffffff !important;
    vertical-align: middle;
    white-space: normal;
    line-height: 1.4;
}

body .conteudo-central.nfse-conteudo .nfse-registros-tabela tbody tr:nth-child(even) td {
    background: #f4f7fa !important;
}

body .conteudo-central.nfse-conteudo .nfse-registros-tabela tbody tr:hover td {
    background: #eaf4fb !important;
}

body .conteudo-central.nfse-conteudo .nfse-registros-tabela td small {
    display: block;
    margin-top: 4px;
    color: #4c657a !important;
    font-size: .74rem;
    font-weight: 650;
}

.nfse-coluna-status {
    min-width: 145px;
    text-align: center !important;
}

.nfse-status-documento {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 5px 10px;
    border: 1px solid #9eb2c4;
    border-radius: 999px;
    background: #edf2f6;
    color: #29465f !important;
    font-size: .71rem;
    font-weight: 900;
    letter-spacing: .035em;
    text-transform: uppercase;
    white-space: nowrap;
}

.nfse-status-documento.autorizada {
    border-color: #73ac82;
    background: #e9f7ed;
    color: #176334 !important;
}

.nfse-status-documento.cancelada,
.nfse-status-documento.rejeitada {
    border-color: #d68484;
    background: #fdecec;
    color: #922626 !important;
}

.nfse-status-documento.analise {
    border-color: #d2a251;
    background: #fff7df;
    color: #7c5200 !important;
}

.nfse-status-documento.substituida,
.nfse-status-documento.assinada {
    border-color: #7d9fc8;
    background: #edf4fd;
    color: #234f82 !important;
}

body .conteudo-central.nfse-conteudo .nfse-acoes-tabela {
    display: grid;
    grid-template-columns: repeat(2, minmax(165px, 1fr));
    align-items: stretch;
    gap: 8px;
    min-width: 360px;
}

body .conteudo-central.nfse-conteudo .nfse-card .nfse-acoes-tabela a.btn-acao {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    margin: 0;
    padding: 8px 11px !important;
    border: 1px solid #1f5a88 !important;
    border-radius: 7px;
    background: #1f5a88 !important;
    color: #ffffff !important;
    font-size: .77rem;
    font-weight: 850 !important;
    line-height: 1.25;
    text-align: center;
    text-decoration: none !important;
    text-shadow: none !important;
    white-space: normal;
    box-shadow: 0 3px 7px rgba(16, 55, 88, .15);
}

body .conteudo-central.nfse-conteudo .nfse-card .nfse-acoes-tabela a.btn-acao:hover {
    transform: translateY(-1px);
    filter: brightness(.93);
    color: #ffffff !important;
}

body .conteudo-central.nfse-conteudo .nfse-card .nfse-acoes-tabela a.nfse-acao-principal {
    border-color: #075f8b !important;
    background: #087fae !important;
}

body .conteudo-central.nfse-conteudo .nfse-card .nfse-acoes-tabela a.nfse-acao-editar {
    border-color: #9a6200 !important;
    background: #a66b00 !important;
}

body .conteudo-central.nfse-conteudo .nfse-card .nfse-acoes-tabela a.nfse-acao-download {
    border-color: #216a4a !important;
    background: #287b57 !important;
}

body .conteudo-central.nfse-conteudo .nfse-card .nfse-acoes-tabela a.nfse-acao-danfse {
    border-color: #4057a1 !important;
    background: #4d65b3 !important;
}

body .conteudo-central.nfse-conteudo .nfse-card .nfse-acoes-tabela a.nfse-acao-substituir {
    border-color: #653e8e !important;
    background: #7449a0 !important;
}

body .conteudo-central.nfse-conteudo .nfse-card .nfse-acoes-tabela a.nfse-acao-cancelar {
    border-color: #9c2929 !important;
    background: #b33333 !important;
}

/* A pÃ¡gina de correÃ§Ã£o da DPS tambÃ©m recebe cartÃµes mais legÃ­veis. */
body .nfse-editar-dps-form > label:not(.nfse-campo-largo),
body .nfse-editar-dps-form > label.nfse-campo-largo {
    padding: 14px;
    border: 1px solid #c8d6e3;
    border-radius: 11px;
    background: #f8fbfd;
}

body .nfse-editar-dps-form > label .nfse-label-texto {
    margin-bottom: 7px;
}

@media (max-width: 820px) {
    body .conteudo-central.nfse-conteudo .nfse-form-grid {
        grid-template-columns: 1fr;
    }

    body .conteudo-central.nfse-conteudo .nfse-form-grid > label.nfse-campo-largo,
    body .conteudo-central.nfse-conteudo .nfse-form-grid > .nfse-campo-largo {
        grid-column: auto;
    }

    body .conteudo-central.nfse-conteudo .nfse-acoes-tabela {
        grid-template-columns: 1fr;
        min-width: 240px;
    }
}

/* ========================================================================== 
   MDF NFS-e V32 â€” cadastros em duas colunas e leitura reforÃ§ada
   ========================================================================== */

/*
 * O CSS geral do MDF trata form-filtros-banco-horas como uma linha flexÃ­vel.
 * Nos cadastros do mÃ³dulo NFS-e, isso limitava os rÃ³tulos a 190px e deixava
 * os campos estreitos. Esta regra especÃ­fica transforma os formulÃ¡rios do
 * mÃ³dulo em uma grade real de duas colunas no desktop.
 */
body .conteudo-central.nfse-conteudo form.nfse-formulario {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: start !important;
    justify-content: stretch !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > label {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 100%;
    margin: 0 !important;
    padding: 15px !important;
    border: 1px solid #c7d6e4 !important;
    border-radius: 12px !important;
    background: #f7fafc !important;
    color: #17344d !important;
    box-sizing: border-box !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > label.nfse-campo-largo,
body .conteudo-central.nfse-conteudo form.nfse-formulario > .nfse-campo-largo,
body .conteudo-central.nfse-conteudo form.nfse-formulario > fieldset {
    grid-column: 1 / -1 !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > label .nfse-label-texto,
body .conteudo-central.nfse-conteudo form.nfse-formulario > label:not(.nfse-checkbox-linha) {
    color: #123f63 !important;
    font-size: .93rem !important;
    font-weight: 850 !important;
    line-height: 1.35 !important;
    text-shadow: none !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > label input:not([type="checkbox"]):not([type="radio"]),
body .conteudo-central.nfse-conteudo form.nfse-formulario > label select,
body .conteudo-central.nfse-conteudo form.nfse-formulario > label textarea {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 11px 13px !important;
    border: 2px solid #9fb5c9 !important;
    border-radius: 9px !important;
    background: #ffffff !important;
    color: #102d45 !important;
    font-size: .97rem !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    box-sizing: border-box !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > label textarea {
    min-height: 125px !important;
    resize: vertical;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > label input:focus,
body .conteudo-central.nfse-conteudo form.nfse-formulario > label select:focus,
body .conteudo-central.nfse-conteudo form.nfse-formulario > label textarea:focus {
    outline: 3px solid rgba(8, 127, 174, .17) !important;
    border-color: #087fae !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > label small {
    margin: 0 !important;
    color: #4d667b !important;
    font-size: .8rem !important;
    font-weight: 620 !important;
    line-height: 1.5 !important;
    text-shadow: none !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > label.nfse-checkbox-linha,
body .conteudo-central.nfse-conteudo form.nfse-formulario > label .nfse-checkbox-linha {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 12px !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > label.nfse-checkbox-linha input[type="checkbox"],
body .conteudo-central.nfse-conteudo form.nfse-formulario > label .nfse-checkbox-linha input[type="checkbox"] {
    flex: 0 0 auto !important;
    width: 20px !important;
    min-width: 20px !important;
    height: 20px !important;
    margin: 2px 0 0 !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > .nfse-acoes-formulario {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
    min-height: 48px !important;
    margin-top: 2px !important;
}

body .conteudo-central.nfse-conteudo form.nfse-formulario > .nfse-acoes-formulario button,
body .conteudo-central.nfse-conteudo form.nfse-formulario > .nfse-acoes-formulario a {
    min-height: 44px !important;
    height: auto !important;
    padding: 10px 20px !important;
    color: #ffffff !important;
}

/* O formulÃ¡rio de substituiÃ§Ã£o tambÃ©m usa grade prÃ³pria. Valor e motivo ficam
   lado a lado; descriÃ§Ã£o e confirmaÃ§Ãµes continuam em largura total. */
body .conteudo-central.nfse-conteudo .nfse-form-substituicao > label:not(.nfse-campo-largo) {
    min-height: 100%;
}

body .conteudo-central.nfse-conteudo .nfse-editar-dps-form > label:nth-of-type(3) select {
    min-height: 52px !important;
}

/* A tabela de tomadores tem apenas trÃªs colunas e nÃ£o precisa da largura mÃ­nima
   usada pela lista principal de NFS-e. */
body .conteudo-central.nfse-conteudo .nfse-tabela-tomadores {
    min-width: 720px !important;
}

@media (max-width: 820px) {
    body .conteudo-central.nfse-conteudo form.nfse-formulario,
    body .conteudo-central.nfse-conteudo .nfse-form-grid {
        grid-template-columns: 1fr !important;
    }

    body .conteudo-central.nfse-conteudo form.nfse-formulario > label,
    body .conteudo-central.nfse-conteudo form.nfse-formulario > label.nfse-campo-largo,
    body .conteudo-central.nfse-conteudo form.nfse-formulario > .nfse-campo-largo,
    body .conteudo-central.nfse-conteudo .nfse-form-grid > label,
    body .conteudo-central.nfse-conteudo .nfse-form-grid > .nfse-campo-largo {
        grid-column: auto !important;
    }

    body .conteudo-central.nfse-conteudo form.nfse-formulario > .nfse-acoes-formulario {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    body .conteudo-central.nfse-conteudo form.nfse-formulario > .nfse-acoes-formulario button,
    body .conteudo-central.nfse-conteudo form.nfse-formulario > .nfse-acoes-formulario a {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* ========================================================================== 
   MDF NFS-e V34 â€” seleÃ§Ã£o multiprovedor e identificaÃ§Ã£o visual
   ========================================================================== */
body .conteudo-central.nfse-conteudo .nfse-opcoes-provedor {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    width: 100%;
    margin-top: 14px;
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 104px;
    padding: 16px;
    border: 2px solid #b7c9d9;
    border-radius: 14px;
    background: #f7fafc;
    color: #17344d;
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor:hover {
    border-color: #4382a8;
    box-shadow: 0 7px 18px rgba(25, 73, 104, .12);
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor.selecionada {
    border-color: #087fae;
    background: #eaf7fc;
    box-shadow: 0 0 0 3px rgba(8, 127, 174, .13);
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor.nfse-opcao-municipal.selecionada {
    border-color: #7650a4;
    background: #f3eef9;
    box-shadow: 0 0 0 3px rgba(118, 80, 164, .13);
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor .nfse-opcao-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #174e75;
    color: #fff;
    font-size: 1.15rem;
    font-weight: 900;
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor.nfse-opcao-municipal .nfse-opcao-icone {
    background: #68418e;
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor .nfse-opcao-conteudo {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor .nfse-opcao-conteudo strong {
    color: #153b58;
    font-size: 1rem;
    font-weight: 900;
}

body .conteudo-central.nfse-conteudo .nfse-opcao-provedor .nfse-opcao-conteudo small {
    color: #4c6578;
    font-size: .84rem;
    font-weight: 650;
    line-height: 1.45;
}

body .conteudo-central.nfse-conteudo .nfse-provedor-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 6px 11px;
    border-radius: 999px;
    background: #174e75;
    color: #fff;
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}

body .conteudo-central.nfse-conteudo .nfse-provedor-badge.municipal {
    background: #68418e;
}

body .conteudo-central.nfse-conteudo .nfse-badges-linha {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

body .conteudo-central.nfse-conteudo .nfse-aviso-municipal {
    margin-top: 15px;
    border-left: 5px solid #68418e;
    background: #f4eff9;
    color: #38244d;
}

body .conteudo-central.nfse-conteudo .bloco-provedor[hidden],
body .conteudo-central.nfse-conteudo #aviso-salvador[hidden] {
    display: none !important;
}

body .conteudo-central.nfse-conteudo .nfse-status-lote-recebido {
    background: #805b18 !important;
    color: #fff !important;
}

@media (max-width: 820px) {
    body .conteudo-central.nfse-conteudo .nfse-opcoes-provedor {
        grid-template-columns: 1fr;
    }

    body .conteudo-central.nfse-conteudo .nfse-badges-linha {
        justify-content: flex-start;
    }
}


/* ==========================================================
   COMPROVANTE ITAU PDF - INICIO
   RelatÃ³rio separado do retorno bancÃ¡rio do projeto Ã“tica.
========================================================== */

@page {
    size: letter portrait;
    margin: 8mm 8mm 7mm 8mm;
}

.itau-pdf-body {
    margin: 0;
    padding: 0;
    background: #fff;
    color: #222;
    font-family: Arial, Helvetica, sans-serif;
}

.itau-pdf-pagina {
    position: relative;
    height: 252mm;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #292929;
    page-break-inside: avoid;
}

.itau-pdf-quebra {
    page-break-after: always;
}

.itau-pdf-topo {
    position: relative;
    height: 24mm;
}

.itau-pdf-logo {
    position: absolute;
    left: 0;
    top: 0;
    width: 19mm;
    height: auto;
}

.itau-pdf-30h {
    position: absolute;
    left: 45mm;
    top: 0;
    width: 17mm;
    height: auto;
}

.itau-pdf-logo-texto {
    display: inline-block;
    padding: 5px;
    background: #000;
    color: #fff;
    border-radius: 5px;
    font-size: 20px;
    font-weight: bold;
}

.itau-pdf-30h-texto {
    position: absolute;
    left: 48mm;
    top: 0;
    font-size: 28px;
    line-height: 18px;
    font-weight: bold;
}

.itau-pdf-titulo {
    text-align: center;
    font-size: 15px;
    line-height: 18px;
    font-weight: bold;
    margin-top: -2mm;
    margin-bottom: 3mm;
}

.itau-pdf-linha {
    border-top: 2px solid #111;
    height: 0;
    margin: 1mm 0;
}

.itau-pdf-linha.fina {
    border-top-width: 1.4px;
}

.itau-pdf-identificacao {
    text-align: left;
    padding-left: 11mm;
    font-size: 11px;
}

.itau-pdf-secao {
    font-weight: bold;
    margin: 1.5mm 0 2mm 0;
}

.itau-pdf-centro {
    text-align: center;
    margin: 2mm 0;
}

.itau-pdf-destaque {
    letter-spacing: 1.3px;
}

.itau-pdf-duas-colunas {
    width: 100%;
    border-collapse: collapse;
    margin: 2mm 0;
}

.itau-pdf-duas-colunas td {
    width: 50%;
    border: none;
    text-align: center;
    padding: 0;
    font-size: 11px;
}

.itau-pdf-valor {
    text-align: center;
    margin: 2.5mm 0 1mm;
}

.itau-pdf-pagador {
    width: 44mm;
    text-align: center;
    line-height: 12px;
    margin: 1mm 0 0 3mm;
}

.itau-pdf-transferencia {
    padding: 1.5mm 0;
    font-size: 11px;
}

.itau-pdf-autenticacao {
    margin-top: 2mm;
    letter-spacing: .1px;
    font-size: 11px;
}

.itau-pdf-rodape {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    font-size: 7.2px;
    line-height: 8.5px;
}

.itau-pdf-numero-pagina {
    position: absolute;
    right: -4mm;
    bottom: -1mm;
    font-size: 6px;
}

/* ==========================================================
   COMPROVANTE ITAU PDF - FIM
========================================================== */

|--------------------------------------------------------------------------
| RelatÃ³rio de Retorno de Contratos por Comprador - Hiperideal
| Adicionar ao final de MDF/CSS/estilo.css
|--------------------------------------------------------------------------
*/
body .relatorio-retorno-contratos {
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;
}

body .relatorio-retorno-contratos > h2,
body .relatorio-retorno-contratos > h3 {
    text-align: center;
}

body .relatorio-retorno-contratos .form-filtros-retorno-contratos,
body .relatorio-retorno-contratos .form-filtros-relatorio {
    max-width: 1500px;
}

body .relatorio-retorno-contratos .grid-info {
    grid-template-columns: repeat(6, minmax(150px, 1fr));
    margin-top: 20px;
    margin-bottom: 25px;
}

body .relatorio-retorno-contratos .info-box {
    text-align: center;
}

body .relatorio-retorno-contratos .info-box span {
    display: block;
    margin-top: 6px;
    font-size: 20px;
    font-weight: 800;
}

body .relatorio-retorno-contratos .area-tabela-relatorio {
    width: 100%;
    overflow-x: auto;
}

body .relatorio-retorno-contratos .tabela-relatorio-larga {
    min-width: 1900px;
}


body .relatorio-retorno-contratos .grupo-detalhes-compradores {
    display: grid;
    gap: 15px;
    width: 100%;
}

body .relatorio-retorno-contratos .grupo-detalhes-compradores .detalhes-relatorio {
    margin-top: 0;
}

body .relatorio-retorno-contratos .grid-info-comprador {
    grid-template-columns: repeat(5, minmax(150px, 1fr));
    margin-top: 0;
}

body .relatorio-retorno-contratos .detalhes-relatorio {
    width: 100%;
    margin: 28px auto 0;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    background: #ffffff;
    overflow: hidden;
}

body .relatorio-retorno-contratos .detalhes-relatorio > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 16px 20px;
    cursor: pointer;
    background: #f3f4f6;
    color: #1f2937;
    font-weight: 700;
    list-style: none;
}

body .relatorio-retorno-contratos .detalhes-relatorio > summary::-webkit-details-marker {
    display: none;
}

body .relatorio-retorno-contratos .detalhes-relatorio > summary::before {
    content: '+';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border-radius: 50%;
    background: #1f4e79;
    color: #ffffff;
    font-size: 18px;
    line-height: 1;
}

body .relatorio-retorno-contratos .detalhes-relatorio[open] > summary::before {
    content: 'âˆ’';
}

body .relatorio-retorno-contratos .detalhes-relatorio > summary span {
    flex: 1;
}

body .relatorio-retorno-contratos .detalhes-relatorio > summary strong {
    white-space: nowrap;
}

body .relatorio-retorno-contratos .conteudo-detalhes-relatorio {
    padding: 15px;
}

body .relatorio-retorno-contratos .texto-direita {
    text-align: right;
}

body .relatorio-retorno-contratos .texto-centro {
    text-align: center;
}

@media (max-width: 1300px) {
    body .relatorio-retorno-contratos .grid-info-comprador {
        grid-template-columns: repeat(3, minmax(150px, 1fr));
    }

    body .relatorio-retorno-contratos .grid-info {
        grid-template-columns: repeat(3, minmax(150px, 1fr));
    }
}

@media (max-width: 720px) {
    body .relatorio-retorno-contratos .grid-info-comprador {
        grid-template-columns: 1fr;
    }

    body .relatorio-retorno-contratos .grid-info {
        grid-template-columns: 1fr;
    }

    body .relatorio-retorno-contratos .detalhes-relatorio > summary {
        align-items: flex-start;
        flex-wrap: wrap;
    }
}
/* MDF_SPED_DIRBI_CSS_INICIO
   MÃ³dulo SPED ContribuiÃ§Ãµes / DIRBI â€” Hiperideal
   Todo o layout do mÃ³dulo permanece exclusivamente neste CSS central.
   NÃ£o utilizar <style> ou atributo style nos arquivos PHP do mÃ³dulo.
========================================================== */

body.dirbi-body {
    color: #111827;
}

body.dirbi-body .sped-pagina,
body.dirbi-body .pag,
body.dirbi-body .sped-rel,
body.dirbi-body .dirbi-pagina {
    width: min(96%, 1600px);
    margin: 24px auto;
    padding: 0;
    box-sizing: border-box;
}

body.dirbi-body .sped-card,
body.dirbi-body .card,
body.dirbi-body .box,
body.dirbi-body .dirbi-card,
body.dirbi-body .indic {
    width: 100%;
    box-sizing: border-box;
    background: #ffffff !important;
    color: #111827 !important;
    opacity: 1 !important;
    filter: none !important;
    border: 1px solid #dbe3ec;
    border-radius: 14px;
    padding: 20px;
    margin: 0 0 18px;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .14);
}

body.dirbi-body .box {
    width: min(96%, 1050px);
    margin: 28px auto;
}

body.dirbi-body .sped-card *,
body.dirbi-body .card *,
body.dirbi-body .box *,
body.dirbi-body .dirbi-card *,
body.dirbi-body .indic * {
    opacity: 1;
}

body.dirbi-body .sped-card h1,
body.dirbi-body .sped-card h2,
body.dirbi-body .sped-card h3,
body.dirbi-body .card h1,
body.dirbi-body .card h2,
body.dirbi-body .card h3,
body.dirbi-body .box h1,
body.dirbi-body .box h2,
body.dirbi-body .box h3,
body.dirbi-body .dirbi-card h1,
body.dirbi-body .dirbi-card h2,
body.dirbi-body .dirbi-card h3,
body.dirbi-body .sped-rel > h1,
body.dirbi-body .sped-rel > h2,
body.dirbi-body .sped-rel > h3 {
    color: #123f63 !important;
    opacity: 1 !important;
    text-shadow: none !important;
    filter: none !important;
    line-height: 1.25;
}

body.dirbi-body .sped-card h2,
body.dirbi-body .card h2,
body.dirbi-body .box h2,
body.dirbi-body .dirbi-card h2 {
    margin: 0 0 14px;
    font-size: 30px !important;
}

body.dirbi-body .sped-card h3,
body.dirbi-body .card h3,
body.dirbi-body .box h3,
body.dirbi-body .dirbi-card h3 {
    margin: 0 0 14px;
    font-size: 23px !important;
}

body.dirbi-body .sped-card p,
body.dirbi-body .card p,
body.dirbi-body .box p,
body.dirbi-body .dirbi-card p,
body.dirbi-body .sped-card span,
body.dirbi-body .card span,
body.dirbi-body .box span,
body.dirbi-body .dirbi-card span,
body.dirbi-body .sped-card strong,
body.dirbi-body .card strong,
body.dirbi-body .box strong,
body.dirbi-body .dirbi-card strong,
body.dirbi-body .sped-card label,
body.dirbi-body .card label,
body.dirbi-body .box label,
body.dirbi-body .dirbi-card label {
    opacity: 1 !important;
    text-shadow: none !important;
}

body.dirbi-body .sped-card p,
body.dirbi-body .card p,
body.dirbi-body .box p,
body.dirbi-body .dirbi-card p {
    color: #374151 !important;
    line-height: 1.55;
}

body.dirbi-body .sped-alerta,
body.dirbi-body .alert,
body.dirbi-body .dirbi-msg {
    display: block;
    padding: 14px 16px;
    margin: 0 0 16px;
    border: 1px solid #93c5fd;
    border-radius: 10px;
    background: #eef6ff !important;
    color: #1e3a5f !important;
    opacity: 1 !important;
    line-height: 1.55;
    text-shadow: none !important;
}

body.dirbi-body .alert.erro,
body.dirbi-body .dirbi-msg.erro,
body.dirbi-body .msg.err {
    border-color: #fca5a5;
    background: #fef2f2 !important;
    color: #991b1b !important;
}

body.dirbi-body .alert.ok,
body.dirbi-body .msg:not(.err) {
    border-color: #86efac;
    background: #ecfdf5 !important;
    color: #166534 !important;
}

body.dirbi-body code:not(.log code) {
    display: inline-block;
    max-width: 100%;
    padding: 3px 7px;
    border-radius: 5px;
    background: #e5e7eb !important;
    color: #1f2937 !important;
    opacity: 1 !important;
    overflow-wrap: anywhere;
}

body.dirbi-body pre {
    display: block;
    overflow: auto;
    padding: 14px;
    border-radius: 9px;
    background: #111827 !important;
    color: #e5e7eb !important;
    white-space: pre-wrap;
}

body.dirbi-body .sped-acoes,
body.dirbi-body .acoes,
body.dirbi-body .dirbi-acoes,
body.dirbi-body .paginacao {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
}

body.dirbi-body .sped-btn,
body.dirbi-body .btn,
body.dirbi-body .dirbi-btn,
body.dirbi-body a.sped-btn,
body.dirbi-body a.btn,
body.dirbi-body a.dirbi-btn,
body.dirbi-body button.sped-btn,
body.dirbi-body button.btn,
body.dirbi-body button.dirbi-btn {
    min-height: 40px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 9px 16px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: #1f4e79 !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.2;
    text-decoration: none !important;
    text-shadow: none !important;
    opacity: 1 !important;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0, 195, 255, .28) !important;
}

body.dirbi-body .sped-btn:hover,
body.dirbi-body .btn:hover,
body.dirbi-body .dirbi-btn:hover {
    background: #1565c0 !important;
    color: #ffffff !important;
    transform: translateY(-2px);
}

body.dirbi-body .sped-btn.sec,
body.dirbi-body .btn.sec,
body.dirbi-body .dirbi-btn.sec {
    background: #4b5563 !important;
}

body.dirbi-body .sped-btn.ok,
body.dirbi-body .btn.ok {
    background: #15803d !important;
}

body.dirbi-body .sped-btn.aviso,
body.dirbi-body .btn.aviso {
    background: #b45309 !important;
}

body.dirbi-body .sped-tabela-wrap,
body.dirbi-body .wrap,
body.dirbi-body .tabela-responsiva {
    width: 100%;
    overflow: auto;
    border-radius: 10px;
}

body.dirbi-body .sped-tabela,
body.dirbi-body .tab,
body.dirbi-body .dirbi-tabela {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    background: #ffffff !important;
    color: #111827 !important;
    font-size: 13px;
    opacity: 1 !important;
}

body.dirbi-body .sped-tabela thead th,
body.dirbi-body .tab thead th,
body.dirbi-body .dirbi-tabela thead th,
body.dirbi-body .sped-tabela th,
body.dirbi-body .tab th,
body.dirbi-body .dirbi-tabela th {
    padding: 10px 9px;
    border: 1px solid #cbd5e1;
    background: linear-gradient(135deg, #123f63, #1f6da5) !important;
    color: #ffffff !important;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
    text-shadow: none !important;
    opacity: 1 !important;
    white-space: nowrap;
}

body.dirbi-body .sped-tabela td,
body.dirbi-body .tab td,
body.dirbi-body .dirbi-tabela td {
    padding: 9px;
    border: 1px solid #d1d5db;
    background: #ffffff !important;
    color: #111827 !important;
    text-shadow: none !important;
    opacity: 1 !important;
    vertical-align: middle;
}

body.dirbi-body .sped-tabela tbody tr:nth-child(even) td,
body.dirbi-body .tab tbody tr:nth-child(even) td,
body.dirbi-body .dirbi-tabela tbody tr:nth-child(even) td {
    background: #f3f6fb !important;
}

body.dirbi-body .sped-tabela tbody tr:hover td,
body.dirbi-body .tab tbody tr:hover td,
body.dirbi-body .dirbi-tabela tbody tr:hover td {
    background: #e8f2ff !important;
    color: #000000 !important;
}

body.dirbi-body .num {
    text-align: right !important;
    white-space: nowrap;
}

body.dirbi-body .centro {
    text-align: center !important;
}

body.dirbi-body .status {
    font-weight: 800;
}
body.dirbi-body .status-IMPORTADO,
body.dirbi-body .status-SINCRONIZADO,
body.dirbi-body .dirbi-ok,
body.dirbi-body .ok {
    color: #166534 !important;
}
body.dirbi-body .status-ERRO,
body.dirbi-body .dirbi-erro,
body.dirbi-body .erro {
    color: #991b1b !important;
}
body.dirbi-body .status-PROCESSANDO {
    color: #92400e !important;
}

body.dirbi-body form.form-filtros-banco-horas,
body.dirbi-body form.form-filtros,
body.dirbi-body form.form-filtros-relatorio {
    width: 100% !important;
    max-width: 1500px !important;
    margin: 0 auto !important;
    background: #ffffff !important;
    color: #111827 !important;
    opacity: 1 !important;
}

body.dirbi-body form.form-filtros-banco-horas .campo,
body.dirbi-body form.form-filtros .campo,
body.dirbi-body form.form-filtros-relatorio .campo,
body.dirbi-body .campo {
    min-width: 155px !important;
    max-width: 230px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    color: #111827 !important;
}

body.dirbi-body .campo.largo {
    min-width: 320px !important;
    max-width: 500px !important;
}

body.dirbi-body form label,
body.dirbi-body .campo label {
    color: #111827 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    opacity: 1 !important;
}

body.dirbi-body form input,
body.dirbi-body form select,
body.dirbi-body form textarea {
    min-height: 38px;
    margin: 0 !important;
    padding: 8px 10px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: #111827 !important;
    font-size: 14px !important;
    opacity: 1 !important;
}

body.dirbi-body .cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
    margin: 0 0 18px;
}

body.dirbi-body .indic {
    margin: 0;
    padding: 17px;
}

body.dirbi-body .indic span {
    display: block;
    color: #4b5563 !important;
    font-size: 13px;
    font-weight: 700;
}

body.dirbi-body .indic strong {
    display: block;
    margin-top: 7px;
    color: #123f63 !important;
    font-size: 24px;
}

body.dirbi-body details.nat,
body.dirbi-body details.detalhes-dirbi,
body.dirbi-body .card > details {
    width: 100%;
    margin: 0 0 12px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #ffffff;
    overflow: hidden;
}

body.dirbi-body details.nat > summary,
body.dirbi-body details.detalhes-dirbi > summary,
body.dirbi-body .card > details > summary {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) repeat(4, minmax(110px, auto));
    gap: 12px;
    align-items: center;
    padding: 14px 16px;
    background: #eaf2fb !important;
    color: #123f63 !important;
    font-weight: 800;
    cursor: pointer;
    list-style: none;
    opacity: 1 !important;
    text-shadow: none !important;
}

body.dirbi-body details > summary::-webkit-details-marker {
    display: none;
}

body.dirbi-body details > summary::before {
    content: '+';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin-right: 8px;
    border-radius: 50%;
    background: #1f4e79;
    color: #ffffff;
    font-size: 18px;
    line-height: 1;
}

body.dirbi-body details[open] > summary::before {
    content: 'âˆ’';
}

body.dirbi-body .nat-corpo,
body.dirbi-body details > .wrap,
body.dirbi-body details > .detalhe-conteudo {
    padding: 14px;
    background: #ffffff;
    color: #111827;
}

body.dirbi-body .badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}
body.dirbi-body .badge.S { background: #dcfce7; color: #166534 !important; }
body.dirbi-body .badge.N { background: #fee2e2; color: #991b1b !important; }
body.dirbi-body .badge.A { background: #fef3c7; color: #92400e !important; }

body.dirbi-body .log {
    display: block;
    width: 100%;
    max-height: 650px;
    overflow: auto;
    box-sizing: border-box;
    padding: 15px;
    border-radius: 9px;
    background: #111827 !important;
    color: #d1fae5 !important;
    font-family: Consolas, "Courier New", monospace;
    font-size: 13px;
    line-height: 1.55;
    white-space: pre-wrap;
    opacity: 1 !important;
}

body.dirbi-body .dirbi-card form {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

@media (max-width: 900px) {
    body.dirbi-body .sped-pagina,
    body.dirbi-body .pag,
    body.dirbi-body .sped-rel,
    body.dirbi-body .dirbi-pagina {
        width: calc(100% - 24px);
        margin: 12px auto;
    }

    body.dirbi-body details.nat > summary,
    body.dirbi-body details.detalhes-dirbi > summary,
    body.dirbi-body .card > details > summary {
        grid-template-columns: 1fr;
    }

    body.dirbi-body .hide-mob {
        display: none;
    }

    body.dirbi-body .campo,
    body.dirbi-body .campo.largo {
        width: 100% !important;
        min-width: 100% !important;
        max-width: none !important;
    }
}


/* MDF SPED DIRBI V1.2.1 - atualizaÃ§Ã£o da tabela e reclassificaÃ§Ã£o local */
body.dirbi-body input[type="file"] {
    width: 100% !important;
    min-height: 42px !important;
    padding: 7px 10px !important;
    color: #111827 !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
}

body.dirbi-body .mensagem.sucesso,
body.dirbi-body .mensagem.erro {
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 18px;
    padding: 14px 18px;
    border-radius: 12px;
    font-weight: 700;
    opacity: 1 !important;
}

body.dirbi-body .mensagem.sucesso {
    color: #166534 !important;
    background: #dcfce7 !important;
    border: 1px solid #86efac;
}

body.dirbi-body .mensagem.erro {
    color: #991b1b !important;
    background: #fee2e2 !important;
    border: 1px solid #fca5a5;
}

body.dirbi-body .sped-acoes .sped-btn,
body.dirbi-body .acoes .btn {
    margin: 3px;
}

body.dirbi-body .sped-tabela td .sped-btn {
    display: inline-flex;
    margin: 3px;
}


/* ========================================================================== 
   MDF SPED DIRBI V1.2.2 â€” visualizaÃ§Ã£o amigÃ¡vel das regras por natureza
   Este bloco pertence exclusivamente ao CSS central MDF/CSS/estilo.css.
   NÃ£o manter regras visuais em parametrizar_sped_dirbi.php.
   ========================================================================== */

body.dirbi-body .dirbi-regras-card {
    overflow: hidden;
}

body.dirbi-body .dirbi-regras-cabecalho {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

body.dirbi-body .dirbi-regras-cabecalho h3 {
    margin-bottom: 5px !important;
}

body.dirbi-body .dirbi-regras-cabecalho p {
    margin: 0 !important;
}

body.dirbi-body .dirbi-resumo-regras {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 12px;
    margin: 0 0 20px;
}

body.dirbi-body .dirbi-resumo-card {
    min-height: 88px;
    padding: 14px 16px;
    border: 1px solid #cbd5e1;
    border-left: 5px solid #1f5f8f;
    border-radius: 10px;
    background: #f8fbff;
    color: #111827;
    box-shadow: 0 2px 7px rgba(15, 23, 42, .08);
}

body.dirbi-body .dirbi-resumo-card span {
    display: block;
    color: #4b5563 !important;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .025em;
    text-transform: uppercase;
}

body.dirbi-body .dirbi-resumo-card strong {
    display: block;
    margin-top: 5px;
    color: #123f63 !important;
    font-size: 26px;
    line-height: 1;
}

body.dirbi-body .dirbi-lista-naturezas {
    display: grid;
    gap: 12px;
    width: 100%;
}

body.dirbi-body details.dirbi-natureza-item {
    width: 100%;
    margin: 0;
    border: 1px solid #c7d5e2;
    border-radius: 12px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 2px 7px rgba(15, 23, 42, .07);
}

body.dirbi-body details.dirbi-natureza-item > summary {
    display: grid !important;
    grid-template-columns: 30px 130px minmax(260px, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 72px;
    padding: 13px 16px;
    list-style: none;
    cursor: pointer;
    background: #edf5fc !important;
    color: #123f63 !important;
    text-shadow: none !important;
}

body.dirbi-body details.dirbi-natureza-item > summary::-webkit-details-marker {
    display: none;
}

body.dirbi-body details.dirbi-natureza-item > summary::before {
    content: '+' !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    margin: 0 !important;
    border-radius: 50%;
    background: #1f5f8f;
    color: #ffffff;
    font-size: 19px;
    font-weight: 900;
    line-height: 1;
}

body.dirbi-body details.dirbi-natureza-item[open] > summary::before {
    content: 'âˆ’' !important;
}

body.dirbi-body details.dirbi-natureza-item[open] > summary {
    border-bottom: 1px solid #c7d5e2;
    background: #e4f0fb !important;
}

body.dirbi-body .dirbi-natureza-codigo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 5px 11px;
    border-radius: 999px;
    background: #123f63;
    color: #ffffff !important;
    font-size: 13px;
    font-weight: 900;
    text-align: center;
    white-space: nowrap;
}

body.dirbi-body .dirbi-natureza-descricao {
    min-width: 0;
    color: #173b58 !important;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

body.dirbi-body .dirbi-natureza-metricas {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 7px;
}

body.dirbi-body .dirbi-natureza-metricas > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 4px 9px;
    border: 1px solid #aebfd0;
    border-radius: 999px;
    background: #ffffff;
    color: #26465f !important;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

body.dirbi-body .dirbi-natureza-metricas > span.dirbi-metrica-revisao {
    border-color: #f1c66a;
    background: #fff7db;
    color: #7c4a03 !important;
}

body.dirbi-body .dirbi-natureza-conteudo {
    padding: 15px;
    background: #ffffff;
}

body.dirbi-body .dirbi-tabela-wrapper {
    width: 100%;
    max-height: 62vh;
    overflow: auto;
    border: 1px solid #d3dde7;
    border-radius: 9px;
    background: #ffffff;
}

body.dirbi-body table.dirbi-regras-tabela {
    width: 100% !important;
    min-width: 1360px;
    margin: 0;
    border-collapse: collapse;
    table-layout: fixed;
    background: #ffffff;
    color: #111827;
    font-size: 12px;
}

body.dirbi-body table.dirbi-regras-tabela thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    padding: 10px 8px !important;
    border: 1px solid #b8c8d6 !important;
    background: linear-gradient(135deg, #123f63, #1f6da5) !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1.2;
    text-align: center !important;
    text-transform: uppercase;
    white-space: normal !important;
    text-shadow: none !important;
}

body.dirbi-body table.dirbi-regras-tabela tbody td {
    padding: 9px 8px !important;
    border: 1px solid #d3dde7 !important;
    background: #ffffff !important;
    color: #111827 !important;
    line-height: 1.35;
    text-align: left;
    vertical-align: middle;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
    text-shadow: none !important;
}

body.dirbi-body table.dirbi-regras-tabela tbody tr:nth-child(even) td {
    background: #f5f8fc !important;
}

body.dirbi-body table.dirbi-regras-tabela tbody tr:hover td {
    background: #eaf4ff !important;
}

body.dirbi-body table.dirbi-regras-tabela th:nth-child(1),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(1) {
    width: 100px;
}

body.dirbi-body table.dirbi-regras-tabela th:nth-child(2),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(2) {
    width: 165px;
}

body.dirbi-body table.dirbi-regras-tabela th:nth-child(3),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(3) {
    width: 145px;
}

body.dirbi-body table.dirbi-regras-tabela th:nth-child(4),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(4) {
    width: 135px;
}

body.dirbi-body table.dirbi-regras-tabela th:nth-child(5),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(5),
body.dirbi-body table.dirbi-regras-tabela th:nth-child(6),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(6),
body.dirbi-body table.dirbi-regras-tabela th:nth-child(8),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(8) {
    width: 95px;
}

body.dirbi-body table.dirbi-regras-tabela th:nth-child(7),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(7) {
    width: 120px;
}

body.dirbi-body table.dirbi-regras-tabela th:nth-child(9),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(9) {
    width: 215px;
}

body.dirbi-body table.dirbi-regras-tabela th:nth-child(10),
body.dirbi-body table.dirbi-regras-tabela td:nth-child(10) {
    width: 90px;
}

body.dirbi-body .dirbi-col-tipo,
body.dirbi-body .dirbi-col-origem,
body.dirbi-body .dirbi-col-centro,
body.dirbi-body .dirbi-col-acao {
    text-align: center !important;
}

body.dirbi-body .dirbi-col-regra code {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto;
    padding: 4px 7px;
    color: #153d5d !important;
    background: #e8f1f8 !important;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
    white-space: normal;
    overflow-wrap: anywhere;
}

body.dirbi-body .dirbi-col-vigencia {
    text-align: center !important;
}

body.dirbi-body .dirbi-col-vigencia span,
body.dirbi-body .dirbi-col-vigencia small {
    display: block;
    color: #374151 !important;
    font-weight: 700;
}

body.dirbi-body .dirbi-col-vigencia small {
    margin-top: 3px;
    color: #6b7280 !important;
    font-size: 11px;
}

body.dirbi-body .dirbi-badge-dirbi,
body.dirbi-body .dirbi-badge-revisao,
body.dirbi-body .dirbi-badge-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 64px;
    min-height: 27px;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

body.dirbi-body .dirbi-badge-dirbi.dirbi-badge-s,
body.dirbi-body .dirbi-badge-status.ativo,
body.dirbi-body .dirbi-badge-revisao.nao {
    border: 1px solid #86efac;
    background: #dcfce7;
    color: #166534 !important;
}

body.dirbi-body .dirbi-badge-dirbi.dirbi-badge-n,
body.dirbi-body .dirbi-badge-status.inativo {
    border: 1px solid #fca5a5;
    background: #fee2e2;
    color: #991b1b !important;
}

body.dirbi-body .dirbi-badge-dirbi.dirbi-badge-a,
body.dirbi-body .dirbi-badge-revisao.sim {
    border: 1px solid #f4cf76;
    background: #fef3c7;
    color: #854d0e !important;
}

body.dirbi-body details.dirbi-regra-info {
    width: 100%;
    margin: 0;
    border: 0;
    background: transparent;
    overflow: visible;
}

body.dirbi-body details.dirbi-regra-info > summary {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 29px;
    padding: 4px 9px;
    border: 1px solid #aebfd0;
    border-radius: 7px;
    background: #ffffff !important;
    color: #174d72 !important;
    font-size: 11px;
    font-weight: 800;
    list-style: none;
    cursor: pointer;
    white-space: nowrap;
}

body.dirbi-body details.dirbi-regra-info > summary::before {
    content: none !important;
    display: none !important;
}

body.dirbi-body details.dirbi-regra-info > summary::-webkit-details-marker {
    display: none;
}

body.dirbi-body details.dirbi-regra-info[open] > summary {
    margin-bottom: 7px;
    background: #eaf4ff !important;
}

body.dirbi-body details.dirbi-regra-info > div {
    padding: 8px 9px;
    border: 1px solid #d3dde7;
    border-radius: 7px;
    background: #f8fafc;
}

body.dirbi-body details.dirbi-regra-info p {
    margin: 0 0 7px !important;
    color: #374151 !important;
    font-size: 11px;
    line-height: 1.4;
}

body.dirbi-body details.dirbi-regra-info p:last-child {
    margin-bottom: 0 !important;
}

body.dirbi-body .dirbi-sem-informacao {
    display: block;
    color: #9ca3af !important;
    text-align: center;
}

body.dirbi-body .dirbi-btn-editar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 31px;
    padding: 5px 11px;
    border-radius: 7px;
    background: #1f5f8f;
    color: #ffffff !important;
    font-size: 11px;
    font-weight: 900;
    text-decoration: none !important;
    box-shadow: 0 2px 6px rgba(31, 95, 143, .22);
}

body.dirbi-body .dirbi-btn-editar:hover {
    background: #1570ad;
    transform: translateY(-1px);
}

body.dirbi-body .dirbi-opcoes-checkbox {
    justify-content: center;
    gap: 10px !important;
}

body.dirbi-body .dirbi-opcoes-checkbox label {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 7px !important;
    min-width: 0 !important;
    max-width: none !important;
}

body.dirbi-body .dirbi-opcoes-checkbox input[type="checkbox"] {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
}

@media (max-width: 1100px) {
    body.dirbi-body .dirbi-resumo-regras {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
    }

    body.dirbi-body details.dirbi-natureza-item > summary {
        grid-template-columns: 30px 125px minmax(220px, 1fr);
    }

    body.dirbi-body .dirbi-natureza-metricas {
        grid-column: 2 / -1;
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    body.dirbi-body .dirbi-resumo-regras {
        grid-template-columns: 1fr;
    }

    body.dirbi-body details.dirbi-natureza-item > summary {
        grid-template-columns: 30px minmax(0, 1fr);
        gap: 9px;
        padding: 12px;
    }

    body.dirbi-body .dirbi-natureza-codigo,
    body.dirbi-body .dirbi-natureza-descricao,
    body.dirbi-body .dirbi-natureza-metricas {
        grid-column: 2;
    }

    body.dirbi-body .dirbi-natureza-metricas {
        justify-content: flex-start;
    }

    body.dirbi-body .dirbi-natureza-conteudo {
        padding: 9px;
    }
}

/* MDF_SPED_DIRBI_CSS_FIM */

/* MDF_INDICE_FALTAS_INICIO */
.indice-faltas {
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;
    padding: 24px 18px 42px;
}

.indice-faltas .cabecalho-relatorio {
    text-align: center;
    margin-bottom: 18px;
}

.indice-faltas .cabecalho-relatorio h1 {
    margin: 0 0 6px;
    color: #1f2937;
}

.indice-faltas .cabecalho-relatorio p {
    margin: 0;
    color: #4b5563;
}

.indice-faltas .aviso-homologacao,
.indice-faltas .alerta-erro,
.indice-faltas .sem-dados,
.indice-faltas .aviso-informativo {
    max-width: 1320px;
    margin: 0 auto 18px;
    padding: 14px 18px;
    border-radius: 10px;
    text-align: center;
}

.indice-faltas .aviso-homologacao {
    background: #fff7ed;
    border: 1px solid #fdba74;
    color: #9a3412;
}

.indice-faltas .aviso-informativo {
    background: #eff6ff;
    border: 1px solid #93c5fd;
    color: #1e3a8a;
}

.indice-faltas .alerta-erro {
    background: #fee2e2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.indice-faltas .sem-dados {
    background: #f9fafb;
    border: 1px dashed #9ca3af;
    color: #4b5563;
}

.indice-faltas .area-filtros-relatorio {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
}

.indice-faltas .form-filtros-relatorio {
    max-width: 1320px !important;
}

.indice-faltas .acoes-exportacao {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 auto 20px;
}

.indice-faltas .grid-indicadores {
    display: grid;
    grid-template-columns: repeat(6, minmax(150px, 1fr));
    gap: 12px;
    margin-bottom: 24px;
}

.indice-faltas .card-indice {
    background: rgba(255, 255, 255, .98);
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px 12px;
    text-align: center;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .08);
}

.indice-faltas .card-indice span {
    display: block;
    margin-bottom: 7px;
    color: #4b5563;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.indice-faltas .card-indice strong {
    color: #111827;
    font-size: 21px;
}

.indice-faltas .card-indice.destaque strong {
    color: #b91c1c;
}

.indice-faltas .grade-dashboard {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.indice-faltas .secao-relatorio {
    margin-bottom: 24px;
    background: rgba(255, 255, 255, .98);
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .08);
}

.indice-faltas .titulo-secao {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    background: #f3f4f6;
    border-bottom: 1px solid #d1d5db;
}

.indice-faltas .titulo-secao h2,
.indice-faltas .titulo-secao h3 {
    margin: 0;
    color: #1f2937;
}

.indice-faltas .titulo-secao span {
    color: #4b5563;
    font-size: 13px;
}

.indice-faltas .area-tabela {
    width: 100%;
    overflow-x: auto;
}

.indice-faltas table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.indice-faltas th,
.indice-faltas td {
    padding: 9px 10px;
    border-bottom: 1px solid #e5e7eb;
    white-space: nowrap;
}

.indice-faltas th {
    background: #1f4e79;
    color: #fff;
    text-align: left;
}

.indice-faltas tbody tr:nth-child(even) {
    background: #f9fafb;
}

.indice-faltas tbody tr:hover {
    background: #eef6ff;
}

.indice-faltas .texto-centro {
    text-align: center;
}

.indice-faltas .texto-direita {
    text-align: right;
}

.indice-faltas .indice-alto {
    color: #b91c1c;
    font-weight: 800;
}

.indice-faltas .top-200 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    padding: 3px 7px;
    border-radius: 999px;
    background: #fef3c7;
    color: #92400e;
    font-size: 11px;
    font-weight: 800;
}

.indice-faltas .ranking {
    padding: 14px 18px 18px;
}

.indice-faltas .linha-ranking {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) 3fr 70px;
    align-items: center;
    gap: 10px;
    margin-bottom: 9px;
}

.indice-faltas .nome-ranking {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #374151;
    font-size: 12px;
    font-weight: 700;
}

.indice-faltas .barra-ranking {
    height: 18px;
    border-radius: 999px;
    overflow: hidden;
    background: #e5e7eb;
}

.indice-faltas .barra-ranking span {
    display: block;
    height: 100%;
    min-width: 2px;
    background: #1f4e79;
}

.indice-faltas .valor-ranking {
    text-align: right;
    color: #111827;
    font-size: 12px;
    font-weight: 800;
}

.indice-faltas details.grupo-detalhe {
    margin: 12px;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

.indice-faltas details.grupo-detalhe > summary {
    padding: 12px 15px;
    cursor: pointer;
    background: #f9fafb;
    color: #1f2937;
    font-weight: 800;
}

.indice-faltas .paginacao-relatorio {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
}

.indice-faltas .paginacao-relatorio div {
    display: flex;
    align-items: center;
    gap: 9px;
}

.indice-faltas .area-voltar-relatorio {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

@media (max-width: 1250px) {
    .indice-faltas .grid-indicadores {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 900px) {
    .indice-faltas .grade-dashboard {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .indice-faltas {
        padding-left: 8px;
        padding-right: 8px;
    }

    .indice-faltas .grid-indicadores {
        grid-template-columns: 1fr;
    }

    .indice-faltas .linha-ranking {
        grid-template-columns: 1fr 2fr 58px;
    }

    .indice-faltas .paginacao-relatorio {
        flex-direction: column;
    }
}

.indice-faltas .campo-compradores {
    min-width: 310px;
    grid-column: span 2;
}

.indice-faltas .rotulo-campo {
    display: block;
    margin-bottom: 6px;
    color: #1f2937;
    font-size: 13px;
    font-weight: 800;
}

.indice-faltas .seletor-compradores {
    border: 1px solid #cbd5e1;
    border-radius: 9px;
    overflow: hidden;
    background: #fff;
}

.indice-faltas .opcao-comprador {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    color: #1f2937;
    cursor: pointer;
}

.indice-faltas .opcao-comprador:hover {
    background: #eff6ff;
}

.indice-faltas .form-filtros-relatorio
.seletor-compradores input[type="checkbox"] {
    appearance: auto !important;
    flex: 0 0 14px !important;
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    max-width: 14px !important;
    max-height: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 3px !important;
    box-shadow: none !important;
}

.indice-faltas .opcao-todos {
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
}

.indice-faltas .lista-compradores {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: 190px;
    overflow-y: auto;
    padding: 5px;
}

.indice-faltas .sem-compradores {
    grid-column: 1 / -1;
    padding: 10px;
    color: #64748b;
    text-align: center;
}

.indice-faltas .legenda-matriz {
    margin: 0;
    padding: 10px 18px;
    border-bottom: 1px solid #e5e7eb;
    color: #475569;
    font-size: 12px;
}

.indice-faltas .area-matriz-indice {
    max-height: 680px;
    overflow: auto;
}

.indice-faltas .tabela-matriz-indice {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.indice-faltas .tabela-matriz-indice th,
.indice-faltas .tabela-matriz-indice td {
    min-width: 92px;
    padding: 7px 8px;
    border-right: 1px solid #dbe3ec;
    border-bottom: 1px solid #dbe3ec;
    text-align: center;
}

.indice-faltas .tabela-matriz-indice thead th {
    position: sticky;
    top: 0;
    z-index: 4;
    background: #1f4e79;
}

.indice-faltas .tabela-matriz-indice .coluna-fixa-codigo {
    position: sticky;
    left: 0;
    z-index: 3;
    min-width: 68px;
    width: 68px;
    background: #fff;
}

.indice-faltas .tabela-matriz-indice th.coluna-fixa-codigo {
    z-index: 6;
    background: #1f4e79;
}

.indice-faltas .tabela-matriz-indice .coluna-fixa-comprador {
    position: sticky;
    left: 68px;
    z-index: 3;
    min-width: 190px;
    max-width: 240px;
    background: #fff;
    text-align: left;
}

.indice-faltas .tabela-matriz-indice th.coluna-fixa-comprador {
    z-index: 6;
    background: #1f4e79;
}

.indice-faltas .tabela-matriz-indice tbody tr:nth-child(even)
.coluna-fixa-codigo,
.indice-faltas .tabela-matriz-indice tbody tr:nth-child(even)
.coluna-fixa-comprador {
    background: #f9fafb;
}

.indice-faltas .tabela-matriz-indice .cabecalho-loja small {
    display: block;
    max-width: 105px;
    margin-top: 2px;
    overflow: hidden;
    color: #dbeafe;
    font-size: 9px;
    font-weight: 500;
    text-overflow: ellipsis;
}

.indice-faltas .tabela-matriz-indice td strong {
    display: block;
    font-size: 13px;
}

.indice-faltas .tabela-matriz-indice td small {
    display: block;
    margin-top: 2px;
    color: #475569;
    font-size: 9px;
    font-weight: 600;
}

.indice-faltas .tabela-matriz-indice td.indice-alto {
    background: #fee2e2;
    color: #991b1b;
}

.indice-faltas .tabela-matriz-indice td.indice-medio {
    background: #fef3c7;
    color: #92400e;
    font-weight: 800;
}

.indice-faltas .tabela-matriz-indice td.indice-baixo {
    background: #dcfce7;
    color: #166534;
    font-weight: 800;
}

.indice-faltas .tabela-matriz-indice td.sem-dado-matriz {
    background: #f8fafc;
    color: #94a3b8;
}

.indice-faltas .tabela-matriz-indice .linha-geral-matriz td {
    font-weight: 800;
    border-bottom: 2px solid #64748b;
}

.indice-faltas .tabela-matriz-indice .linha-geral-matriz
.coluna-fixa-comprador,
.indice-faltas .tabela-matriz-indice .linha-geral-matriz
.coluna-fixa-codigo {
    background: #e2e8f0;
}

.indice-faltas .tabela-matriz-indice .celula-geral {
    border-left: 2px solid #64748b;
}

.indice-faltas .tabela-matriz-indice .cabecalho-geral {
    border-left: 2px solid #cbd5e1;
}

.indice-faltas .sem-indice {
    color: #94a3b8;
}

@media (max-width: 900px) {
    .indice-faltas .campo-compradores {
        grid-column: 1 / -1;
    }

    .indice-faltas .lista-compradores {
        grid-template-columns: 1fr;
    }
}


.indice-faltas .acoes-filtro {
    grid-column: 1 / -1;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.indice-faltas .btn-atualizar-consinco {
    min-height: 46px;
    padding: 10px 22px;
    border: 0;
    border-radius: 10px;
    background: #b45309;
    color: #fff;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .15);
}

.indice-faltas .btn-atualizar-consinco:hover {
    background: #92400e;
}

.indice-faltas .opcao-comprador span,
.indice-faltas .opcao-comprador strong {
    line-height: 1.25;
}


.indice-faltas .acoes-cabecalho-indice {
    display: flex;
    justify-content: center;
    margin-top: 12px;
}

.indice-faltas .aviso-gestores-pendentes {
    padding: 12px 18px;
    border-bottom: 1px solid #fde68a;
    background: #fffbeb;
    color: #92400e;
    text-align: center;
}

.indice-faltas .aviso-gestores-pendentes a {
    color: #1d4ed8;
    font-weight: 800;
}

.indice-faltas .tabela-resumo-gestores {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
    background: #fff;
}

.indice-faltas .tabela-resumo-gestores th,
.indice-faltas .tabela-resumo-gestores td {
    padding: 10px 12px;
    border: 1px solid #d8dee8;
    color: #1f2937;
}

.indice-faltas .tabela-resumo-gestores thead th {
    background: #1f4e79;
    color: #fff;
    font-weight: 800;
    text-align: left;
    white-space: nowrap;
}

.indice-faltas .tabela-resumo-gestores .texto-numero {
    text-align: right;
    white-space: nowrap;
}

.indice-faltas .tabela-resumo-gestores .coluna-codigo-gestor {
    width: 90px;
    text-align: center;
    white-space: nowrap;
}

.indice-faltas .tabela-resumo-gestores .linha-total-gestores td {
    background: #0f3557;
    color: #fff;
    font-weight: 900;
}

.indice-faltas .tabela-resumo-gestores .linha-gestor-matriz td {
    border-top: 2px solid #64748b;
    background: #dbeafe;
    color: #1e3a8a;
    font-weight: 900;
}

.indice-faltas .tabela-resumo-gestores .linha-comprador-gestor:nth-child(even) td {
    background: #f8fafc;
}

.indice-faltas .tabela-resumo-gestores .recuo-comprador-gestor {
    display: inline-block;
    padding-left: 22px;
}

.indice-faltas .tabela-resumo-gestores td.indice-alto {
    background: #fee2e2;
    color: #991b1b;
}

.indice-faltas .tabela-resumo-gestores td.indice-medio {
    background: #fef3c7;
    color: #92400e;
}

.indice-faltas .tabela-resumo-gestores td.indice-baixo {
    background: #dcfce7;
    color: #166534;
}

.cadastro-gestores-indice {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 24px 18px 42px;
}

.cadastro-gestores-indice .cabecalho-relatorio {
    margin-bottom: 20px;
    text-align: center;
}

.cadastro-gestores-indice .cabecalho-relatorio h1 {
    margin: 0 0 6px;
    color: #1f2937;
}

.cadastro-gestores-indice .cabecalho-relatorio p {
    margin: 0;
    color: #4b5563;
}

.cadastro-gestores-indice .alerta-erro,
.cadastro-gestores-indice .aviso-informativo,
.cadastro-gestores-indice .sem-dados {
    margin: 0 auto 18px;
    padding: 14px 18px;
    border-radius: 10px;
    text-align: center;
}

.cadastro-gestores-indice .alerta-erro {
    border: 1px solid #fecaca;
    background: #fee2e2;
    color: #991b1b;
}

.cadastro-gestores-indice .aviso-informativo {
    border: 1px solid #86efac;
    background: #f0fdf4;
    color: #166534;
}

.cadastro-gestores-indice .sem-dados {
    border: 1px dashed #9ca3af;
    background: #f9fafb;
    color: #4b5563;
}

.cadastro-gestores-indice .secao-cadastro-gestor {
    margin-bottom: 22px;
    overflow: hidden;
    border: 1px solid #d1d5db;
    border-radius: 14px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 4px 14px rgba(0, 0, 0, .08);
}

.cadastro-gestores-indice .titulo-secao-cadastro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    border-bottom: 1px solid #d1d5db;
    background: #f3f4f6;
}

.cadastro-gestores-indice .titulo-secao-cadastro h2 {
    margin: 0;
    color: #1f2937;
}

.cadastro-gestores-indice .titulo-secao-cadastro span {
    color: #4b5563;
    font-size: 13px;
}

.cadastro-gestores-indice .form-cadastro-gestor {
    padding: 18px;
}

.cadastro-gestores-indice .campo-nome-gestor {
    display: block;
    max-width: 520px;
    margin: 0 auto 18px;
    color: #1f2937;
    font-weight: 800;
}

.cadastro-gestores-indice .campo-nome-gestor input {
    width: 100%;
    margin-top: 6px;
}

.cadastro-gestores-indice .campo-lista-compradores-gestor {
    margin-bottom: 18px;
}

.cadastro-gestores-indice .rotulo-campo {
    display: block;
    margin-bottom: 8px;
    color: #1f2937;
    font-weight: 800;
}

.cadastro-gestores-indice .lista-compradores-gestor {
    display: grid;
    grid-template-columns: 1fr;
    max-height: 460px;
    overflow-y: auto;
    gap: 6px;
    padding: 10px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #fff;
}

.cadastro-gestores-indice .opcao-comprador-gestor {
    display: grid;
    grid-template-columns: 18px 86px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 48px;
    padding: 8px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #1f2937;
    cursor: pointer;
}

.cadastro-gestores-indice .opcao-comprador-gestor:hover {
    background: #eff6ff;
}

.cadastro-gestores-indice
.opcao-comprador-gestor input[type="checkbox"] {
    appearance: auto !important;
    flex: 0 0 14px !important;
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    max-width: 14px !important;
    max-height: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
}

.pagina-cadastro-gestores .conteudo-central {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

.cadastro-gestores-indice .form-cadastro-gestor {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
}

.cadastro-gestores-indice .campo-lista-compradores-gestor {
    width: 100%;
    max-width: 980px;
    margin-right: auto;
    margin-left: auto;
}

.cadastro-gestores-indice .ferramentas-compradores-gestor {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) auto;
    align-items: end;
    gap: 12px;
    margin-bottom: 10px;
}

.cadastro-gestores-indice .campo-busca-comprador-gestor {
    display: block;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
}

.cadastro-gestores-indice .campo-busca-comprador-gestor span {
    display: block;
    margin-bottom: 5px;
}

.cadastro-gestores-indice .campo-busca-comprador-gestor input {
    width: 100%;
    min-height: 42px;
}

.cadastro-gestores-indice .acoes-selecao-compradores-gestor {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.cadastro-gestores-indice .contador-compradores-gestor {
    min-width: 175px;
    color: #475569;
    font-size: 12px;
    font-weight: 800;
    text-align: right;
}

.cadastro-gestores-indice .opcao-comprador-gestor[hidden] {
    display: none !important;
}

.cadastro-gestores-indice .codigo-comprador-gestor {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    line-height: 1.1;
}

.cadastro-gestores-indice .codigo-comprador-gestor small {
    color: #64748b;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.cadastro-gestores-indice .codigo-comprador-gestor strong {
    color: #1f4e79;
    font-size: 14px;
}

.cadastro-gestores-indice .nome-comprador-gestor {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #111827;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
    white-space: normal;
}

.cadastro-gestores-indice .acoes-cadastro-gestor,
.cadastro-gestores-indice .acoes-grupo-gestor {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.cadastro-gestores-indice .grupo-gestor-cadastrado {
    margin: 12px;
    overflow: hidden;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    background: #fff;
}

.cadastro-gestores-indice .grupo-gestor-cadastrado > summary {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 16px;
    background: #e0ecf8;
    color: #1f3b57;
    font-weight: 800;
    cursor: pointer;
}

.cadastro-gestores-indice .acoes-grupo-gestor {
    justify-content: flex-end;
    padding: 10px 14px;
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
}

.cadastro-gestores-indice .area-tabela {
    width: 100%;
    overflow-x: auto;
}

.cadastro-gestores-indice table {
    width: 100%;
    border-collapse: collapse;
}

.cadastro-gestores-indice th,
.cadastro-gestores-indice td {
    padding: 9px 10px;
    border-bottom: 1px solid #e5e7eb;
    white-space: nowrap;
}

.cadastro-gestores-indice th {
    background: #1f4e79;
    color: #fff;
    text-align: left;
}

.cadastro-gestores-indice .texto-centro {
    text-align: center;
}

.cadastro-gestores-indice .btn-excluir-gestor,
.cadastro-gestores-indice .btn-remover-comprador {
    padding: 7px 11px;
    border: 0;
    border-radius: 7px;
    background: #b91c1c;
    color: #fff;
    font-weight: 800;
    cursor: pointer;
}

.cadastro-gestores-indice .btn-excluir-gestor:hover,
.cadastro-gestores-indice .btn-remover-comprador:hover {
    background: #991b1b;
}

.cadastro-gestores-indice .area-voltar-relatorio {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

@media (max-width: 900px) {
    .cadastro-gestores-indice .ferramentas-compradores-gestor {
        grid-template-columns: 1fr;
    }

    .cadastro-gestores-indice .acoes-selecao-compradores-gestor {
        justify-content: flex-start;
    }

    .cadastro-gestores-indice .contador-compradores-gestor {
        width: 100%;
        text-align: left;
    }
}

@media (max-width: 650px) {
    .cadastro-gestores-indice {
        padding-left: 8px;
        padding-right: 8px;
    }

    .cadastro-gestores-indice .opcao-comprador-gestor {
        grid-template-columns: 18px 62px minmax(0, 1fr);
        gap: 8px;
        padding: 8px;
    }

    .cadastro-gestores-indice .nome-comprador-gestor {
        font-size: 13px;
    }
}

/* MDF_INDICE_FALTAS_FIM */
/* MDF_INDICE_FALTAS_GESTORES_CONTRASTE_V1_0_6_INICIO */
.indice-faltas .tabela-resumo-gestores thead th {
    background: #e6f0fa !important;
    color: #17324d !important;
    border-color: #9fb6ce !important;
}

.indice-faltas .tabela-resumo-gestores tbody .linha-total-gestores > td {
    background: #d9e9f7 !important;
    color: #102a43 !important;
    border-color: #9fb6ce !important;
}

.indice-faltas .tabela-resumo-gestores tbody .linha-gestor-matriz > td {
    background: #eef6ff !important;
    color: #174a78 !important;
    border-top-color: #9fb6ce !important;
}

.indice-faltas .tabela-resumo-gestores tbody .linha-total-gestores > td *,
.indice-faltas .tabela-resumo-gestores tbody .linha-gestor-matriz > td * {
    color: inherit !important;
}

.indice-faltas .tabela-resumo-gestores tbody tr > td.indice-alto {
    background: #fee2e2 !important;
    color: #991b1b !important;
}

.indice-faltas .tabela-resumo-gestores tbody tr > td.indice-medio {
    background: #fef3c7 !important;
    color: #92400e !important;
}

.indice-faltas .tabela-resumo-gestores tbody tr > td.indice-baixo {
    background: #dcfce7 !important;
    color: #166534 !important;
}
/* MDF_INDICE_FALTAS_GESTORES_CONTRASTE_V1_0_6_FIM */

/* MDF_INDICE_FALTAS_CD_CSS_INICIO */
.indice-faltas-cd .form-filtros-cd {
    max-width: 760px !important;
    margin: 0 auto 20px;
}

.indice-faltas-cd .campo-check-cd {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 8px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 9px;
    background: #fff;
    color: #1f2937 !important;
    font-weight: 700;
}

.indice-faltas-cd .campo-check-cd input[type="checkbox"] {
    appearance: auto !important;
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    margin: 0 !important;
}

.indice-faltas-cd .grid-indicadores-cd {
    grid-template-columns: repeat(4, minmax(170px, 1fr));
}

.indice-faltas-cd .cabecalho-secao-cd {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 18px;
    border-bottom: 1px solid #e5e7eb;
    background: #fff;
}

.indice-faltas-cd .cabecalho-secao-cd h2 {
    margin: 0 0 5px;
    color: #1f2937 !important;
}

.indice-faltas-cd .cabecalho-secao-cd p {
    margin: 0;
    color: #64748b !important;
    font-size: 13px;
}

.indice-faltas-cd .secao-top10-cd,
.indice-faltas-cd .secao-estoque-cd {
    margin-bottom: 24px;
    background: #fff;
}

.indice-faltas-cd .paginacao-relatorio,
.indice-faltas-cd .paginacao-relatorio span,
.indice-faltas-cd .paginacao-relatorio div {
    color: #334155 !important;
}

.indice-faltas-cd .area-tabela-cd {
    max-height: 690px;
    overflow: auto;
}

.indice-faltas-cd .tabela-estoque-cd thead th,
.indice-faltas-cd .tabela-top10-cd thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: #1f4e78 !important;
    color: #fff !important;
    opacity: 1 !important;
    border-color: #dbeafe !important;
    text-shadow: none !important;
}

.indice-faltas-cd .tabela-estoque-cd tbody td,
.indice-faltas-cd .tabela-top10-cd tbody td {
    color: #1f2937 !important;
    background: #fff;
}

.indice-faltas-cd .tabela-estoque-cd tbody tr:nth-child(even) td,
.indice-faltas-cd .tabela-top10-cd tbody tr:nth-child(even) td {
    background: #f8fafc;
}

.indice-faltas-cd .tabela-estoque-cd td:nth-child(2),
.indice-faltas-cd .tabela-top10-cd td:nth-child(3) {
    min-width: 300px;
    text-align: left;
}

.indice-faltas-cd .tabela-estoque-cd td:nth-child(5),
.indice-faltas-cd .tabela-top10-cd td:nth-child(5) {
    min-width: 170px;
}

.indice-faltas-cd .btn-paginacao {
    color: #0f4c81 !important;
    font-weight: 700;
}

.alerta-top10-cd {
    text-align: left;
    line-height: 1.5;
}

@media (max-width: 900px) {
    .indice-faltas-cd .grid-indicadores-cd {
        grid-template-columns: repeat(2, 1fr);
    }

    .indice-faltas-cd .cabecalho-secao-cd {
        flex-direction: column;
    }
}

@media (max-width: 620px) {
    .indice-faltas-cd .grid-indicadores-cd {
        grid-template-columns: 1fr;
    }
}
/* MDF_INDICE_FALTAS_CD_CSS_FIM */

/* MDF_FLUXO_CAIXA_INICIO */

.fluxo-caixa-mdf .container-relatorio {
    width: min(98%, 1800px);
    max-width: 1800px;
}

.fluxo-caixa-mdf .cabecalho-relatorio {
    text-align: center;
    margin-bottom: 20px;
}

.fluxo-caixa-mdf .cabecalho-relatorio h1 {
    margin-bottom: 8px;
}

.fluxo-caixa-mdf .cabecalho-relatorio p {
    margin: 5px auto;
    max-width: 1100px;
}

.fluxo-caixa-mdf .grid-indicadores-fluxo {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px;
    margin: 20px 0;
}

.fluxo-caixa-mdf .grid-indicadores-fluxo .card-indice {
    min-height: 110px;
}

.fluxo-caixa-mdf .grid-indicadores-fluxo .entrada-fluxo {
    border-left-color: #16a34a;
}

.fluxo-caixa-mdf .grid-indicadores-fluxo .saida-fluxo {
    border-left-color: #dc2626;
}

.fluxo-caixa-mdf .grid-indicadores-fluxo .validacao-fluxo {
    border-left-color: #7c3aed;
}

.fluxo-caixa-mdf .acoes-fluxo-caixa {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 18px 0;
}

.fluxo-caixa-mdf .alerta-fluxo-classificacao {
    margin: 16px 0;
    padding: 14px 16px;
    border: 1px solid #f59e0b;
    border-left-width: 6px;
    border-radius: 8px;
    background: #fffbeb;
    color: #78350f;
}

.fluxo-caixa-mdf .secao-card {
    margin-top: 22px;
}

.fluxo-caixa-mdf .area-tabela-fluxo-larga,
.fluxo-caixa-mdf .area-tabela-fluxo-detalhe {
    overflow-x: auto;
}

.fluxo-caixa-mdf .tabela-fluxo-composicao {
    min-width: 620px;
}

.fluxo-caixa-mdf .area-tabela-fluxo-detalhe .tabela-relatorio-larga {
    min-width: 1650px;
}

.fluxo-caixa-mdf .linha-nao-classificada td {
    background: #fff7ed;
    color: #9a3412;
    font-weight: 600;
}

.fluxo-caixa-mdf .fluxo-resumo-diario .tabela-relatorio {
    min-width: 980px;
}

.fluxo-caixa-mdf .paginacao-relatorio {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 14px 0;
}

.fluxo-caixa-mdf .paginacao-relatorio > div {
    display: flex;
    align-items: center;
    gap: 10px;
}

@media (max-width: 900px) {
    .fluxo-caixa-mdf .form-filtros-banco-horas {
        grid-template-columns: 1fr;
    }

    .fluxo-caixa-mdf .acoes-fluxo-caixa .btn-relatorio {
        width: 100%;
        text-align: center;
    }
}

/* MDF_FLUXO_CAIXA_FIM */

/*
===============================================================================
MDF RELATÓRIOS — FLUXO DE CAIXA — CLASSIFICAÇÃO V0.1.2
Adicionar uma única vez ao final de CSS/estilo.css.
===============================================================================
*/

.cadastro-fluxo-classificacao .cabecalho-secao-com-acoes {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.cadastro-fluxo-classificacao .cabecalho-secao-com-acoes h2,
.cadastro-fluxo-classificacao .cabecalho-secao-com-acoes p {
    margin-top: 0;
}

.cadastro-fluxo-classificacao .form-cadastro-fluxo,
.cadastro-fluxo-classificacao .form-filtros-classificacao {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    align-items: end;
}

.cadastro-fluxo-classificacao .form-cadastro-fluxo .campo-largo {
    grid-column: 1 / -1;
}

.cadastro-fluxo-classificacao .acoes-classificacao {
    white-space: nowrap;
}

.cadastro-fluxo-classificacao .acoes-classificacao form {
    display: inline-block;
    margin: 0 0 0 .35rem;
}

.cadastro-fluxo-classificacao .acoes-classificacao button {
    cursor: pointer;
}

.cadastro-fluxo-classificacao .linha-inativa {
    opacity: .62;
}

.cadastro-fluxo-classificacao .area-tabela-classificacao {
    margin-top: 1rem;
}

@media (max-width: 760px) {
    .cadastro-fluxo-classificacao .form-cadastro-fluxo,
    .cadastro-fluxo-classificacao .form-filtros-classificacao {
        grid-template-columns: 1fr;
    }
}

/*
===============================================================================
MDF RELATÓRIOS — FLUXO DE CAIXA — CLASSIFICAÇÃO V0.1.2
===============================================================================
*/

/*
===============================================================================
MDF RELATÓRIOS — FLUXO DE CAIXA — PAINEL DE INDICADORES V0.1.3
Adicionar uma única vez ao final de CSS/estilo.css.
Este bloco sobrescreve somente o painel superior do Fluxo de Caixa.
===============================================================================
*/

.fluxo-caixa-mdf .painel-resumo-financeiro {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin: 22px 0 26px;
    padding: 0;
    background: transparent;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .card-fluxo {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 0;
    min-height: 142px;
    padding: 18px 20px 16px;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, .28);
    border-left: 5px solid #64748b;
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(15, 44, 76, .96), rgba(8, 31, 57, .98));
    box-shadow: 0 8px 22px rgba(2, 18, 38, .18);
    color: #f8fafc;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .card-fluxo::after {
    content: '';
    position: absolute;
    right: -28px;
    bottom: -42px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .035);
    pointer-events: none;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .cabecalho-card-fluxo {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .icone-card-fluxo {
    display: inline-flex;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 10px;
    background: rgba(255, 255, 255, .09);
    color: #e2e8f0;
    font-size: .70rem;
    font-weight: 800;
    letter-spacing: .03em;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .rotulo-card-fluxo {
    min-width: 0;
    color: #dbeafe;
    font-size: .83rem;
    font-weight: 700;
    letter-spacing: .045em;
    line-height: 1.25;
    text-transform: uppercase;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .valor-card-fluxo {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    margin: 14px 0 7px;
    color: #ffffff;
    font-size: clamp(1.28rem, 1.7vw, 1.75rem);
    font-weight: 800;
    letter-spacing: -.025em;
    line-height: 1.12;
    overflow-wrap: anywhere;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .card-fluxo small {
    position: relative;
    z-index: 1;
    display: block;
    color: #aebfd2;
    font-size: .78rem;
    line-height: 1.35;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .saldo-inicial-fluxo {
    border-left-color: #60a5fa;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .entrada-fluxo {
    border-left-color: #22c55e;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .saida-fluxo {
    border-left-color: #f97316;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .fluxo-liquido-card {
    border-left-color: #38bdf8;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .saldo-final-fluxo {
    border-left-color: #a78bfa;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .validacao-fluxo {
    border-left-color: #14b8a6;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .resultado-negativo {
    background: linear-gradient(145deg, rgba(62, 30, 45, .98), rgba(43, 20, 33, .98));
    border-left-color: #ef4444;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .resultado-positivo {
    border-left-color: #22c55e;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .fechamento-ok {
    background: linear-gradient(145deg, rgba(12, 67, 72, .96), rgba(8, 48, 54, .98));
    border-left-color: #2dd4bf;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .fechamento-divergente {
    background: linear-gradient(145deg, rgba(78, 43, 24, .98), rgba(56, 28, 16, .98));
    border-left-color: #f59e0b;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .valor-positivo {
    color: #bbf7d0;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .valor-saida {
    color: #fed7aa;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .valor-negativo {
    color: #fecaca;
}

.fluxo-caixa-mdf .painel-resumo-financeiro .valor-validado {
    color: #99f6e4;
}

@media (max-width: 1180px) {
    .fluxo-caixa-mdf .painel-resumo-financeiro {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .fluxo-caixa-mdf .painel-resumo-financeiro {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .fluxo-caixa-mdf .painel-resumo-financeiro .card-fluxo {
        min-height: 126px;
        padding: 16px 17px 14px;
    }

    .fluxo-caixa-mdf .painel-resumo-financeiro .valor-card-fluxo {
        font-size: 1.36rem;
    }
}
===============================================================================
MDF RELATÓRIOS — FLUXO DE CAIXA — PAINEL DE INDICADORES V0.1.3
Este bloco sobrescreve somente o painel superior do Fluxo de Caixa.
===============================================================================
*/

/*
===============================================================================
MDF RELATÓRIOS — FLUXO DE CAIXA — LAYOUT DA VALIDAÇÃO V0.1.6
Adicionar uma única vez ao final de CSS/estilo.css.
Ajuste visual da seção “Validação das classificações”.
===============================================================================
*/

/* Seção */
.fluxo-caixa-mdf .secao-validacao-classificacao {
    padding: 22px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

/* Cabeçalho em bloco para evitar o espaço vazio à esquerda */
.fluxo-caixa-mdf .cabecalho-validacao-classificacao {
    display: block !important;
    margin-bottom: 14px;
}

.fluxo-caixa-mdf .cabecalho-validacao-classificacao > div {
    max-width: 100%;
}

.fluxo-caixa-mdf .cabecalho-validacao-classificacao h2 {
    margin: 0 0 8px;
    font-size: 2rem !important;
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #0f172a !important;
    text-shadow: none !important;
}

.fluxo-caixa-mdf .cabecalho-validacao-classificacao p {
    margin: 0;
    max-width: 920px;
    color: #475569;
    line-height: 1.55;
    font-size: 1rem;
}

/* Barra de filtro logo abaixo do texto */
.fluxo-caixa-mdf .form-filtro-validacao-classificacao {
    display: flex !important;
    align-items: end;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
    margin-top: 18px;
    padding: 14px 16px;
    border: 1px solid rgba(37, 99, 235, 0.14);
    border-radius: 14px;
    background: #f8fafc;
}

.fluxo-caixa-mdf .form-filtro-validacao-classificacao label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 340px;
    margin: 0;
    color: #0f172a;
    font-size: 0.95rem;
    font-weight: 700;
}

/* Remove o texto auxiliar extra para deixar o bloco mais limpo */
.fluxo-caixa-mdf .form-filtro-validacao-classificacao label::after {
    display: none !important;
    content: none !important;
}

.fluxo-caixa-mdf .form-filtro-validacao-classificacao select {
    width: 100%;
    min-width: 0;
    height: 46px;
    padding: 0 14px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    background: #ffffff;
    color: #0f172a;
    font-size: 0.98rem;
    box-shadow: none;
}

.fluxo-caixa-mdf .form-filtro-validacao-classificacao .btn-pesquisar {
    height: 46px;
    padding: 0 18px;
    border-radius: 12px;
    white-space: nowrap;
    font-weight: 700;
    box-shadow: none;
}

/* Resumo em cards simples e alinhados */
.fluxo-caixa-mdf .resumo-validacao-classificacao {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 12px;
    margin: 0 0 18px;
}

.fluxo-caixa-mdf .indicador-classificacao {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    background: #f8fafc;
    color: #334155;
    font-size: 0.92rem;
    line-height: 1.25;
}

.fluxo-caixa-mdf .indicador-classificacao strong {
    font-size: 1.15rem;
    font-weight: 800;
}

.fluxo-caixa-mdf .indicador-pendente {
    color: #92400e;
    background: #fff7ed;
    border-color: rgba(249, 115, 22, 0.25);
}

.fluxo-caixa-mdf .indicador-classificado {
    color: #166534;
    background: #f0fdf4;
    border-color: rgba(34, 197, 94, 0.25);
}

.fluxo-caixa-mdf .indicador-tecnico {
    color: #1d4ed8;
    background: #eff6ff;
    border-color: rgba(59, 130, 246, 0.25);
}

.fluxo-caixa-mdf .alerta-classificacao-concluida {
    margin: 0 0 18px;
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid rgba(34, 197, 94, 0.25);
    background: #f0fdf4;
    color: #166534;
    font-weight: 700;
}

@media (max-width: 980px) {
    .fluxo-caixa-mdf .resumo-validacao-classificacao {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 700px) {
    .fluxo-caixa-mdf .secao-validacao-classificacao {
        padding: 16px;
    }

    .fluxo-caixa-mdf .cabecalho-validacao-classificacao h2 {
        font-size: 1.7rem !important;
    }

    .fluxo-caixa-mdf .form-filtro-validacao-classificacao {
        flex-direction: column;
        align-items: stretch;
    }

    .fluxo-caixa-mdf .form-filtro-validacao-classificacao label {
        min-width: 0;
        width: 100%;
    }

    .fluxo-caixa-mdf .form-filtro-validacao-classificacao .btn-pesquisar {
        width: 100%;
    }

    .fluxo-caixa-mdf .resumo-validacao-classificacao {
        grid-template-columns: 1fr;
    }
}
/*
===============================================================================
MDF RELATÓRIOS — FLUXO DE CAIXA — FILTRO DA CLASSIFICAÇÃO V0.1.4
===============================================================================
*/
/*
===============================================================================
MDF RELATÓRIOS — FLUXO DE CAIXA — CONTAS HOMOLOGADAS V0.2.0
Adicionar uma única vez ao final de CSS/estilo.css.
Não altera o relatório geral de fluxo de caixa.
===============================================================================
*/

.fluxo-caixa-mdf .filtro-contas-homologadas {
    min-width: 310px;
    flex: 1 1 380px;
}

.fluxo-caixa-mdf .filtro-contas-homologadas select[multiple] {
    width: 100%;
    min-height: 150px;
    padding: 8px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #fff;
    line-height: 1.45;
}

.fluxo-caixa-mdf .filtro-contas-homologadas option {
    padding: 5px 7px;
    border-radius: 5px;
}

.fluxo-caixa-mdf .filtro-contas-homologadas small {
    display: block;
    margin-top: 5px;
    color: #64748b;
    font-size: .78rem;
    font-weight: 500;
}

@media (max-width: 760px) {
    .fluxo-caixa-mdf .filtro-contas-homologadas {
        min-width: 0;
        width: 100%;
    }
}

/*
===============================================================================
MDF RELATÓRIOS — FLUXO DE CAIXA — CONTAS HOMOLOGADAS V0.2.0
===============================================================================
*/

/* MDF_OTICA_COMISSAO_GERENTE_LAYOUT_INICIO
   Relatório de Comissão de Gerente — Projeto Ótica.
   Este bloco atua somente nesta tela e não altera as demais tabelas do MDF.
*/

/* Amplia a área útil do relatório sem interferir no container global. */
.container.container-comissao-gerente {
    width: calc(100% - 24px) !important;
    max-width: none !important;
    margin: 24px auto 36px !important;
    padding: 20px 12px 28px !important;
    align-items: stretch !important;
    overflow: visible !important;
}

/* Mantém o título centralizado e separado das ações. */
.container-comissao-gerente > h1 {
    margin: 18px 0 24px !important;
    text-align: center;
}

/* Área dos botões de retorno da tela. */
.area-voltar-comissao {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 18px 0 8px;
}

/* Botão Voltar sem usar botão dentro de link. */
.btn-voltar-comissao {
    min-width: 130px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 26px;
    border: 0;
    border-radius: 9px;
    background: #1f4e79;
    color: #ffffff !important;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none !important;
    box-shadow: 0 0 12px rgba(0, 195, 255, .35);
    transition: transform .2s ease, background-color .2s ease;
}

.btn-voltar-comissao:hover {
    background: #1565c0;
    color: #ffffff !important;
    transform: translateY(-2px);
}

/* Card branco que organiza cada grade do relatório. */
.bloco-tabela-comissao {
    width: 100%;
    margin: 22px 0 8px;
    padding: 14px;
    overflow: hidden;
    border: 1px solid rgba(203, 213, 225, .95);
    border-radius: 15px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .16);
}

/* Título e orientação exibidos acima da barra de rolagem. */
.cabecalho-tabela-comissao {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin: 0 2px 12px;
}

.cabecalho-tabela-comissao h2 {
    margin: 0 !important;
    color: #111827 !important;
    font-size: 21px !important;
    line-height: 1.25;
    text-shadow: none !important;
}

.cabecalho-tabela-comissao span {
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    text-align: right;
}

/*
 * Área rolável da grade:
 * - rolagem horizontal para todas as colunas;
 * - rolagem vertical limitada à altura da tela;
 * - o cabeçalho permanece visível durante a navegação.
 */
.scroll-tabela-comissao {
    width: 100%;
    max-width: 100%;
    max-height: 72vh;
    margin: 0;
    overflow-x: auto !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable both-edges;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #ffffff;
}

.scroll-tabela-comissao:focus {
    outline: 3px solid rgba(37, 99, 235, .30);
    outline-offset: 2px;
}

/* Torna as barras de rolagem mais fáceis de localizar. */
.scroll-tabela-comissao::-webkit-scrollbar {
    width: 14px;
    height: 14px;
}

.scroll-tabela-comissao::-webkit-scrollbar-track {
    background: #e2e8f0;
    border-radius: 10px;
}

.scroll-tabela-comissao::-webkit-scrollbar-thumb {
    background: #64748b;
    border: 3px solid #e2e8f0;
    border-radius: 10px;
}

.scroll-tabela-comissao::-webkit-scrollbar-thumb:hover {
    background: #334155;
}

/*
 * Remove o table-layout fixed herdado do CSS geral.
 * A tabela passa a respeitar a largura real de cada coluna e gera scroll.
 */
.container-comissao-gerente .tabela-comissao-gerente {
    width: max-content !important;
    min-width: 100% !important;
    margin: 0 !important;
    table-layout: auto !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: #ffffff !important;
    color: #111827 !important;
    font-size: 12.5px !important;
}

/* Cabeçalho fixo, legível e sem separação de palavras no meio. */
.container-comissao-gerente .tabela-comissao-gerente thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 4 !important;
    min-width: 96px;
    height: 70px;
    padding: 10px 9px !important;
    vertical-align: middle !important;
    border-right: 1px solid #cbd5e1 !important;
    border-bottom: 1px solid #94a3b8 !important;
    background: #e5e7eb !important;
    color: #111827 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.28 !important;
    text-align: center !important;
    text-transform: none !important;
    text-shadow: none !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

/* Dados permanecem em uma linha, evitando colunas altas e visual poluído. */
.container-comissao-gerente .tabela-comissao-gerente tbody td {
    min-height: 39px;
    padding: 9px 10px !important;
    border-right: 1px solid #e2e8f0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #ffffff;
    color: #111827 !important;
    font-size: 12.5px !important;
    line-height: 1.25;
    text-align: center !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

.container-comissao-gerente .tabela-comissao-gerente tbody tr:nth-child(even) td {
    background: #f8fafc;
}

.container-comissao-gerente .tabela-comissao-gerente tbody tr:hover td {
    background: #e8f2ff !important;
}

/* Larguras por tipo de conteúdo. A quebra ocorre somente entre palavras. */
.container-comissao-gerente .tabela-comissao-gerente th.col-curta {
    width: 96px;
    min-width: 96px;
}

.container-comissao-gerente .tabela-comissao-gerente th.col-media {
    width: 122px;
    min-width: 122px;
}

.container-comissao-gerente .tabela-comissao-gerente th.col-longa {
    width: 154px;
    min-width: 154px;
}

.container-comissao-gerente .tabela-comissao-gerente th.col-nome {
    width: 220px;
    min-width: 220px;
}

.container-comissao-gerente .tabela-comissao-gerente th.col-periodo {
    width: 260px;
    min-width: 260px;
}

/* A tabela detalhada é menor, mas mantém a mesma navegação. */
.container-comissao-gerente .tabela-detalhe-percentual {
    min-width: 920px !important;
}

/* Formulário do botão Salvar Comissão, isolado das regras gerais de filtros. */
.form-salvar-comissao {
    width: 100% !important;
    max-width: none !important;
    display: flex !important;
    justify-content: center !important;
    margin: 22px 0 6px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.form-salvar-comissao button {
    min-width: 190px;
    height: 42px;
    padding: 0 24px;
    border-radius: 9px;
    background: #166534 !important;
    color: #ffffff !important;
    cursor: pointer;
}

.form-salvar-comissao button:hover {
    background: #15803d !important;
}

/* Em telas menores, título e orientação ficam um abaixo do outro. */
@media (max-width: 800px) {
    .container.container-comissao-gerente {
        width: calc(100% - 12px) !important;
        padding-right: 6px !important;
        padding-left: 6px !important;
    }

    .cabecalho-tabela-comissao {
        display: block;
    }

    .cabecalho-tabela-comissao span {
        display: block;
        margin-top: 6px;
        text-align: left;
    }

    .scroll-tabela-comissao {
        max-height: 68vh;
    }
}
/* MDF_OTICA_COMISSAO_GERENTE_LAYOUT_FIM */

/* MDF_OTICA_RELATORIOS_LAYOUT_PADRAO_INICIO
   Padrão visual homologado para os relatórios atuais do Projeto Ótica.
   O bloco é isolado pelas classes "container-relatorio-otica" e
   "tabela-relatorio-otica", sem alterar consultas, cálculos ou outras telas.
*/

.container.container-relatorio-otica {
    width: calc(100% - 20px) !important;
    max-width: none !important;
    margin: 24px auto 36px !important;
    padding: 18px 10px 28px !important;
    align-items: stretch !important;
    overflow: visible !important;
}

.container-relatorio-otica > h1 {
    margin: 18px 0 24px !important;
    text-align: center;
}

.area-voltar-relatorio-otica {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 18px 0 8px;
}

.btn-voltar-relatorio-otica {
    min-width: 130px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 26px;
    border: 0;
    border-radius: 9px;
    background: #1f4e79;
    color: #ffffff !important;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none !important;
    box-shadow: 0 0 12px rgba(0, 195, 255, .35);
    transition: transform .2s ease, background-color .2s ease;
}

.btn-voltar-relatorio-otica:hover {
    background: #1565c0;
    color: #ffffff !important;
    transform: translateY(-2px);
}

.bloco-tabela-relatorio-otica {
    width: 100%;
    margin: 22px 0 8px;
    padding: 14px;
    overflow: hidden;
    border: 1px solid rgba(203, 213, 225, .95);
    border-radius: 15px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .16);
}

.cabecalho-tabela-relatorio-otica {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin: 0 2px 12px;
}

.cabecalho-tabela-relatorio-otica h2 {
    margin: 0 !important;
    color: #111827 !important;
    font-size: 21px !important;
    line-height: 1.25;
    text-shadow: none !important;
}

.cabecalho-tabela-relatorio-otica span {
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    text-align: right;
}

.scroll-relatorio-otica {
    width: 100%;
    max-width: 100%;
    max-height: 72vh;
    margin: 0;
    overflow-x: auto !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable both-edges;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #ffffff;
}

.scroll-relatorio-otica:focus {
    outline: 3px solid rgba(37, 99, 235, .30);
    outline-offset: 2px;
}

.scroll-relatorio-otica::-webkit-scrollbar {
    width: 14px;
    height: 14px;
}

.scroll-relatorio-otica::-webkit-scrollbar-track {
    background: #e2e8f0;
    border-radius: 10px;
}

.scroll-relatorio-otica::-webkit-scrollbar-thumb {
    background: #64748b;
    border: 3px solid #e2e8f0;
    border-radius: 10px;
}

.scroll-relatorio-otica::-webkit-scrollbar-thumb:hover {
    background: #334155;
}

.container-relatorio-otica .tabela-relatorio-otica {
    width: max-content !important;
    min-width: var(--largura-tabela, 1600px) !important;
    margin: 0 !important;
    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: #ffffff !important;
    color: #111827 !important;
    font-size: 12.5px !important;
}

.container-relatorio-otica .tabela-relatorio-otica thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 4 !important;
    height: auto !important;
    min-height: 52px;
    padding: 12px 10px !important;
    vertical-align: middle !important;
    border-right: 1px solid rgba(255, 255, 255, .14) !important;
    border-bottom: 1px solid #16395a !important;
    background: #1f4e79 !important;
    color: #ffffff !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

.container-relatorio-otica .tabela-relatorio-otica thead th,
.container-relatorio-otica .tabela-relatorio-otica thead th *,
.container-relatorio-otica .tabela-relatorio-otica thead th span,
.container-relatorio-otica .tabela-relatorio-otica thead th strong {
    color: #ffffff !important;
    text-shadow: none !important;
}

.container-relatorio-otica .tabela-relatorio-otica thead th .titulo-coluna {
    display: inline-block;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

.container-relatorio-otica .tabela-relatorio-otica tbody td {
    min-height: 39px;
    padding: 9px 10px !important;
    border-right: 1px solid #e2e8f0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #ffffff;
    color: #111827 !important;
    font-size: 12.5px !important;
    line-height: 1.25;
    text-align: center !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

.container-relatorio-otica .tabela-relatorio-otica tbody tr:nth-child(even) td {
    background: #f8fafc;
}

.container-relatorio-otica .tabela-relatorio-otica tbody tr:hover td {
    background: #e8f2ff !important;
}

.container-relatorio-otica .tabela-relatorio-otica .coluna-fixa-1 {
    position: sticky !important;
    left: 0 !important;
}

.container-relatorio-otica .tabela-relatorio-otica thead .coluna-fixa-1 {
    z-index: 7 !important;
    background: #173f66 !important;
    box-shadow: 1px 0 0 rgba(255,255,255,.18);
}

.container-relatorio-otica .tabela-relatorio-otica tbody .coluna-fixa-1 {
    z-index: 2 !important;
    background: #ffffff !important;
    box-shadow: 1px 0 0 #e2e8f0;
}

.container-relatorio-otica .tabela-relatorio-otica tbody tr:nth-child(even) .coluna-fixa-1 {
    background: #f8fafc !important;
}

.container-relatorio-otica .tabela-relatorio-otica .coluna-fixa-2 {
    position: sticky !important;
    left: var(--posicao-coluna-fixa-2, 110px) !important;
}

.container-relatorio-otica .tabela-relatorio-otica thead .coluna-fixa-2 {
    z-index: 7 !important;
    background: #173f66 !important;
    box-shadow: 1px 0 0 rgba(255,255,255,.18);
}

.container-relatorio-otica .tabela-relatorio-otica tbody .coluna-fixa-2 {
    z-index: 2 !important;
    background: #ffffff !important;
    box-shadow: 1px 0 0 #e2e8f0;
}

.container-relatorio-otica .tabela-relatorio-otica tbody tr:nth-child(even) .coluna-fixa-2 {
    background: #f8fafc !important;
}

.form-acao-relatorio-otica {
    width: 100% !important;
    max-width: none !important;
    display: flex !important;
    justify-content: center !important;
    margin: 22px 0 6px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.form-acao-relatorio-otica button {
    min-width: 190px;
    height: 42px;
    padding: 0 24px;
    border-radius: 9px;
    background: #166534 !important;
    color: #ffffff !important;
    cursor: pointer;
}

.form-acao-relatorio-otica button:hover {
    background: #15803d !important;
}

@media (max-width: 800px) {
    .container.container-relatorio-otica {
        width: calc(100% - 8px) !important;
        padding-right: 4px !important;
        padding-left: 4px !important;
    }

    .cabecalho-tabela-relatorio-otica {
        display: block;
    }

    .cabecalho-tabela-relatorio-otica span {
        display: block;
        margin-top: 6px;
        text-align: left;
    }

    .scroll-relatorio-otica {
        max-height: 68vh;
    }
}
/* MDF_OTICA_RELATORIOS_LAYOUT_PADRAO_FIM */
