/* ========================================================================= */
/* ========================== CONFIGURAÇÕES GERAIS ========================= */
/* ========================================================================= */
body {
    margin: 0; 
    padding: 0;
    font-family: 'gotham', 'Segoe UI', sans-serif;
    background-color: #F3F4F6;
    line-height: 1.4;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; 
}



:root {

/* ========================================================================= */
    /* CORE - CORES BASE SELAA (NÃO USAR DIRETO) */
/* ========================================================================= */

    --navy-dark: #0D1B2A;     /* navy marca → sidebar / header / textos fortes */
    --navy-medium: #1a2f45;   /* navy médio → botões primários */
    --gold-accent: #D4AF37;   /* gold marca → destaque / foco / CTAs */

    --gray-bg: #F3F4F6;       /* fundo geral da aplicação (doc identidade) */
    --gray-soft: #eef1f4;     /* fundo leve (hover, tabela, inputs ativos) */
    --gray-border: #d6dee6;   /* bordas padrão */

    --white: #ffffff;         /* branco puro */
    --red-danger: #C62828;    /* vermelho → ações destrutivas */

    /* aliases legados (telas FG) */
    --blue-dark: var(--navy-dark);
    --blue-medium: var(--navy-medium);
    --blue-accent: var(--gold-accent);

    /* SEMÂNTICO - USAR NO SISTEMA */

    --color-primary: var(--navy-medium);         /* ação principal (Salvar, Filtrar, Incluir) */
    --color-primary-dark: var(--navy-dark);      /* hover/ativo do primary */

    --color-accent: var(--gold-accent);          /* destaque (focus, links, elementos ativos) */

    --color-background: var(--gray-bg);          /* fundo geral da página */
    --color-surface: var(--white);               /* fundo de cards, containers */

    --color-border: var(--gray-border);          /* bordas padrão */

    --color-text: var(--navy-dark);              /* texto principal */
    --color-text-muted: #333333;                 /* texto secundário (doc identidade) */

    --color-hover: var(--gray-soft);             /* hover neutro (tabela, botões leves) */

    --color-danger: var(--red-danger);           /* excluir / erro */


    --shadow-container: 0 4px 12px rgba(0,0,0,.12);

}



/* ========================== CONTAINERES ========================== */

.Cl_ConfigContainer{
  margin: 10px auto;
  padding: 20px;

  width: calc(100% - 20px);

  background: #ffffff;
  border-radius: 12px;

  box-shadow: 0 4px 12px rgba(0,0,0,0.08),
              0 1px 3px rgba(0,0,0,0.06);

  border: 1px solid #e5e7eb;
}

@media (max-width: 900px){
  .Cl_ConfigContainer{
    width: calc(100% - 24px); /* 12px de cada lado */
  }
}

.Cl_ConfigContainer h2 {
    margin: 0;
    font-size: 28px;
    color: var(--color-text);
}

.Cl_ContainerApoio{
    margin: 10px auto;     /* centraliza */
    padding: 20px;
    width: calc(100% - 80px); /* mantém a “folga” de 70px em cada lado */
    max-width: 1200px;
    background-color: var(--color-surface);
    border-radius: 8px;
    box-shadow: var(--shadow-container);
}

/* ========================================================================= */
/* ========================== FILTROS PADRÃO =============================== */
/* ========================================================================= */
.Cl_FilterPanel{
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:14px;

  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;

  margin: 14px 0 12px 0;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
}

.Cl_FilterPanelFields{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:flex-end;
  flex: 1 1 auto;
}

.Cl_FilterGroup{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width: 220px;
}

.Cl_FilterGroup label{
  font-size:13px;
  font-weight:700;
  color:#1c2e3c;
}

/* INPUTS */
.Cl_FilterGroup input,
.Cl_FilterGroup select{
  height:36px;
  border-radius:10px;
  border:1px solid #d6dee6;
  padding: 0 10px;
  font-size:14px;
  outline:none;

  background:#ffffff;
  color:#1c2e3c;
}

/* FOCO */
.Cl_FilterGroup input:focus,
.Cl_FilterGroup select:focus{
  border-color:#1c2e3c;
  box-shadow: 0 0 0 3px rgba(200,162,94,.22);
}

/* BOTÕES */
.Cl_FilterPanelActions{
  display:flex;
  gap:10px;
  flex: 0 0 auto;
}

/* Aliases legados (FleetGuard / financeiro) → mesmo visual do padrão global */
.filter-panel {
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:14px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin: 14px 0 12px 0;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
}
.filter-panel-fields {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:flex-end;
  flex: 1 1 auto;
}
.filter-group {
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width: 180px;
}
.filter-group label {
  font-size:13px;
  font-weight:700;
  color:#1c2e3c;
}
.filter-group input,
.filter-group select,
.filter-group .input-text,
.filter-group .input-select {
  height:36px;
  border-radius:10px;
  border:1px solid #d6dee6;
  padding: 0 10px;
  font-size:14px;
  outline:none;
  background:#ffffff;
  color:#1c2e3c;
}
.filter-panel-actions {
  display:flex;
  gap:10px;
  flex: 0 0 auto;
  align-items:flex-end;
}
.Cl_botaoFiltro,
.Cl_BtnIncluir {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  font-size: 15px;
  border-radius: 8px;
  cursor: pointer;
  border: 1px solid transparent;
  background-color: #3a4f61;
  color: #fff;
}
.Cl_botaoFiltro:hover,
.Cl_BtnIncluir:hover {
  background-color: #1c2e3c;
}
.Cl_BtnCancelar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  font-size: 15px;
  border-radius: 8px;
  cursor: pointer;
  background: #fff;
  color: #1c2e3c;
  border: 1px solid #d6dee6;
}
.Cl_ConfigPage {
  margin: 10px auto;
  padding: 20px;
  width: calc(100% - 20px);
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08), 0 1px 3px rgba(0,0,0,0.06);
  border: 1px solid #e5e7eb;
}
.Cl_ConfigPageHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.Cl_ConfigPageHeader h2 { margin: 0; color: var(--color-text); }
.Cl_ConfigSub {
  margin: 6px 0 0;
  color: #64748b;
  font-size: 0.92rem;
}
.Cl_ConfigActions {
  margin: 10px 0;
}

/* Faixa de ações abaixo dos filtros (Importar, Novo, etc.) */
.Cl_BotoesApoio {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  margin: 10px 40px 14px auto;
}

/* ========================================================================= */
/* ======================= HEADER PADRÃO (APOIO) ============================ */
/* ========================================================================= */

.Cl_ApoioHeader {
    height: 50px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    background: #1f3442;
    color: #eef3f6;

    padding: 0 20px;

    border-bottom: 1px solid #1c2e3c;
}

/* logo */
.Cl_ApoioHeaderLogo img {
    height: 40px;
}

/* título */
.Cl_ApoioHeaderTitulo {
    flex: 1;
    text-align: center;
    font-weight: 600;
    font-size: 16px;
}

/* ID / campo lateral */
.Cl_ApoioHeaderInfo input {
    background: #ffffff;
    color: #1f3442;

    border: none;
    border-radius: 6px;

    padding: 6px 10px;

    min-width: 80px;
    text-align: center;

    font-weight: 600;
}

/* ========================================================================= */
/* ========================== CAMPOS FORMULÁRIO ============================ */
/* ========================================================================= */

.Cl_FormCampo {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.Cl_FormCampo label {
    font-weight: 700;
    margin-bottom: 6px;
    color: #1c2e3c;
    font-size: 13px;
}

.Cl_FormCampo input,
.Cl_FormCampo select,
.Cl_FormCampo textarea {
    height: 36px;

    border-radius: 10px;
    border: 1px solid #d6dee6;

    padding: 0 10px;
    font-size: 14px;

    background: #ffffff;
    color: #1c2e3c;

    outline: none;
    box-sizing: border-box;

    transition: border-color .2s, box-shadow .2s;
}

/* foco padrão FleedGuard */
.Cl_FormCampo input:focus,
.Cl_FormCampo select:focus,
.Cl_FormCampo textarea:focus {
    border-color: #1c2e3c;
    box-shadow: 0 0 0 3px rgb(28, 46, 60,.38);
}

/* Combobox e selects: texto não pode cobrir a seta */
.Cl_FormCampo .Cl_SelectLike .Cl_SelectDisplay {
    padding-right: 36px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.Cl_FormCampo select {
    padding-right: 36px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.Cl_FormCampo .Cl_SelectLike .Cl_Caret {
    z-index: 1;
}

.Cl_FormCampo textarea {
    height: auto;
    min-height: 80px;
    padding: 10px;
    resize: vertical;
}


/* ========================================================================= */
/* =========================== TABELA PADRÃO =============================== */
/* ========================================================================= */
/* Padrão visual: cabeçalho cinza-azulado, bordas horizontais, zebra leve,
   ações por ícone, paginação à direita (Primeiro/Anterior/…/Último).
   Wrappers: .Cl_Table | .Cl_TabelaPrincipal
   Alias direto: table.Cl_Tabela | table.Cl_Table
*/

.Cl_Table,
.Cl_TabelaPrincipal {
    margin: 10px 0;
    padding: 0;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: none;
}

.Cl_Table table,
.Cl_TabelaPrincipal table,
table.Cl_Tabela,
table.Cl_Table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 14px;
    background: #ffffff;
}

table.Cl_Tabela,
table.Cl_Table {
    margin: 10px 0;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    overflow: hidden;
}

.Cl_Table th,
.Cl_Table td,
.Cl_TabelaPrincipal th,
.Cl_TabelaPrincipal td,
table.Cl_Tabela th,
table.Cl_Tabela td,
table.Cl_Table th,
table.Cl_Table td {
    padding: 11px 14px;
    border: none;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    vertical-align: middle;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.Cl_Table th,
.Cl_TabelaPrincipal th,
table.Cl_Tabela th,
table.Cl_Table th {
    background: #f1f4f8;
    color: var(--navy-dark, #0D1B2A);
    font-weight: 700;
    font-size: 13px;
}

.Cl_Table thead th,
.Cl_TabelaPrincipal thead th,
table.Cl_Tabela thead th,
table.Cl_Table thead th {
    box-shadow: none;
    z-index: 2;
}

.Cl_Table td,
.Cl_TabelaPrincipal td,
table.Cl_Tabela td,
table.Cl_Table td {
    font-size: 13px;
    color: #334155;
    background: #ffffff;
}

.Cl_Table tbody tr:nth-child(even) td,
.Cl_TabelaPrincipal tbody tr:nth-child(even) td,
table.Cl_Tabela tbody tr:nth-child(even) td,
table.Cl_Table tbody tr:nth-child(even) td {
    background: #f8fafc;
}

.Cl_Table tbody tr:hover td,
.Cl_TabelaPrincipal tbody tr:hover td,
table.Cl_Tabela tbody tr:hover td,
table.Cl_Table tbody tr:hover td {
    background: #eef3f6;
}

.Cl_Table tbody tr:last-child td,
.Cl_TabelaPrincipal tbody tr:last-child td,
table.Cl_Tabela tbody tr:last-child td,
table.Cl_Table tbody tr:last-child td {
    border-bottom: none;
}

.Cl_Table td.no-ellipsis,
.Cl_TabelaPrincipal td.no-ellipsis,
table.Cl_Tabela td.no-ellipsis {
    white-space: normal;
    text-overflow: clip;
}

.Cl_TableCell {
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.Cl_TableActions,
.Cl_Table th.Cl_TableActions,
.Cl_Table td.Cl_TableActions,
.Cl_TabelaPrincipal th.Cl_TableActions,
.Cl_TabelaPrincipal td.Cl_TableActions,
table.Cl_Tabela th.Cl_TableActions,
table.Cl_Tabela td.Cl_TableActions {
    width: 152px;
    min-width: 152px;
    max-width: 152px;
    text-align: center;
    white-space: nowrap;
    overflow: visible !important;
    text-overflow: clip;
}

.Cl_Table td.Cl_TableActions,
.Cl_TabelaPrincipal td.Cl_TableActions,
table.Cl_Tabela td.Cl_TableActions {
    padding: 6px 12px;
    vertical-align: middle;
}

.Cl_TableActionsInner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: max-content;
    max-width: none;
}

.Cl_TableActionsInner .Cl_BtnIcon,
.Cl_TableActionsInner .Cl_BtnAcao,
.Cl_TableActions .Cl_BtnIcon,
.Cl_TableActions .Cl_BtnAcao {
    flex: 0 0 auto;
    display: inline-flex;
}

/* badge compacto dentro da tabela (status, convite, etc.) */
.Cl_Badge {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    vertical-align: middle;
}

.Cl_Badge--pendente { background: #fef3c7; color: #92400e; }
.Cl_Badge--aceito { background: #dcfce7; color: #166534; }
.Cl_Badge--expirado { background: #fee2e2; color: #991b1b; }
.Cl_Badge--sem { background: #e5e7eb; color: #374151; }
.Cl_Badge--ativo { background: #dcfce7; color: #166534; }
.Cl_Badge--inativo { background: #fee2e2; color: #991b1b; }

/* ========================================================================= */
/* ============================== TOOLTIP ================================= */
/* ========================================================================= */

.Cl_TableCell[title] {
    position: relative;
}

/* tooltip */
.Cl_TableCell[title]:hover::after {
    content: attr(title);
    position: absolute;
    left: 0;
    top: calc(100% + 6px);

    background: #1c2e3c;
    color: #ffffff;

    padding: 6px 8px;
    border-radius: 6px;

    box-shadow: 0 4px 18px rgba(0,0,0,.2);

    white-space: normal;
    max-width: 480px;

    z-index: 2000;
    pointer-events: none;

    font-size: 12px;
    border: 1px solid rgba(212,164,74,.45);
}

/* seta */
.Cl_TableCell[title]:hover::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 100%;

    border: 6px solid transparent;
    border-top-color: #1c2e3c;

    z-index: 2001;
}


/* ========================================================================= */
/* ========================== ÍCONES (PADRÃO) ============================== */
/* ========================================================================= */

.Cl_Icon {
    background: transparent !important;
    color: #1c2e3c; /* dourado padrão */

    width: 20px;
    height: 20px;

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

    cursor: pointer;

    transition: color .2s ease, transform .15s ease;
    vertical-align: middle;
}

.Cl_Icon:hover {
    color: #ffffff;
    transform: translateY(-1px);
}

/* ========================================================================= */
/* ===================== BOTÃO DE AÇÃO (TABELA) ============================ */
/* ========================================================================= */

.Cl_BtnAcao {
    background: transparent !important;
    border: none !important;

    padding: 6px;
    margin: 0 2px;

    cursor: pointer;

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

    border-radius: 8px;
    vertical-align: middle;

    width: 36px;
    height: 36px;
    color: #334155;
    font-size: 18px;
    line-height: 1;

    transition: background .15s ease, color .15s ease, transform .12s ease;
}

.Cl_BtnAcao:hover {
    background: rgba(13, 27, 42, 0.08) !important;
    color: #0D1B2A;
    transform: translateY(-1px);
}

.Cl_BtnAcao svg,
.Cl_BtnAcao i,
.Cl_BtnAcao .lucide,
.Cl_BtnAcao .icon-tech {
    width: 20px;
    height: 20px;
    stroke-width: 2;
    pointer-events: none;
}

.Cl_BtnAcao.btnExcluir:hover,
.Cl_BtnAcao.fin_btnExcluir:hover,
.Cl_BtnAcao.fin_btnEstornarBaixa:hover {
    background: rgba(198, 40, 40, 0.12) !important;
    color: #C62828;
}

/* ========================================================================= */
/* ========================== BOTÃO DE ÍCONE =============================== */
/* ========================================================================= */

.Cl_BtnIcon {
    background: transparent !important;
    border: none !important;

    padding: 6px;
    margin: 0 2px;

    cursor: pointer;

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

    border-radius: 8px;

    transition: background .15s ease, color .15s ease, transform .12s ease;

    width: 36px;
    height: 36px;
    color: #334155;
    font-size: 18px;
    line-height: 1;
}

.Cl_BtnIcon svg,
.Cl_BtnIcon i,
.Cl_BtnIcon .lucide {
    width: 20px;
    height: 20px;
    stroke-width: 2;
    pointer-events: none;
}

.Cl_BtnIcon:hover {
    background: rgba(13, 27, 42, 0.08) !important;
    color: #0D1B2A;
    transform: translateY(-1px);
}

.Cl_BtnIcon--danger:hover,
.Cl_BtnIcon.btnExcluir:hover {
    background: rgba(198, 40, 40, 0.12) !important;
    color: #C62828;
}

/* ícone dentro do botão */
.Cl_BtnIcon .Cl_Icon {
    pointer-events: none;
}



/* ========================================================================= */
/* ========================== PAGINAÇÃO PADRÃO ============================= */
/* ========================================================================= */
/* .Cl_Pagination | .Cl_Paginacao
   Botões: .Cl_PaginationBtn | .Cl_direcao
   Texto:  .Cl_PaginationInfo  (ou span direto dentro do wrapper)
*/

.Cl_Pagination,
.Cl_Paginacao {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
    margin-right: 0;
}

.Cl_PaginationBtn,
.Cl_Paginacao .Cl_direcao,
.Cl_Pagination .Cl_direcao {
    background: #ffffff;
    color: #334155;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    padding: 7px 14px;
    font-size: 13px;
    font-family: inherit;
    line-height: 1.2;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.Cl_PaginationBtn:hover:not(:disabled),
.Cl_Paginacao .Cl_direcao:hover:not(:disabled),
.Cl_Pagination .Cl_direcao:hover:not(:disabled) {
    background: #f8fafc;
    border-color: #94a3b8;
    color: var(--navy-dark, #0D1B2A);
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06);
}

.Cl_PaginationBtn:disabled,
.Cl_Paginacao .Cl_direcao:disabled,
.Cl_Pagination .Cl_direcao:disabled {
    color: #94a3b8;
    border-color: #e5e7eb;
    background: #ffffff;
    cursor: not-allowed;
    opacity: 1;
    box-shadow: none;
}

.Cl_PaginationInfo,
.Cl_Paginacao > span,
.Cl_Pagination > span:not(.Cl_PaginationBtn) {
    font-weight: 400;
    color: #475569;
    font-size: 13px;
    padding: 0 4px;
    white-space: nowrap;
}

.Cl_PaginationInfo span,
.Cl_PaginationInfo strong,
.Cl_Paginacao > span span,
.Cl_Pagination > span span {
    font-weight: 700;
    color: var(--navy-dark, #0D1B2A);
}


/* ========================================================================= */
/* BOTÕES (padrão global)                                                    */
/* ========================================================================= */
/* BASE */
.Cl_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 10px 20px;
    font-size: 15px;
    border-radius: 8px;
    cursor: pointer;

    border: 1px solid transparent;

    transition: background-color .2s, transform .15s, box-shadow .2s, border-color .2s;
}

/* PRINCIPAL */
.Cl_btn_primary {
    background-color: #3a4f61;
    color: #fff;
    border-color: rgba(28,46,60,.15);
}

.Cl_btn_primary:hover {
    background-color: #1c2e3c;
    border-color: rgba(200,162,94,.55);
    box-shadow: 0 10px 22px rgba(28,46,60,.14);
    transform: translateY(-1px);
}

/* NEUTRO */
.Cl_btn_neutral {
    background-color: #ffffff;
    color: #1c2e3c;
    border-color: #d6dee6;
}

.Cl_btn_neutral:hover {
    background-color: #eef3f6;
    border-color: #c8a25e;
    box-shadow: 0 10px 22px rgba(28,46,60,.10);
    transform: translateY(-1px);
}

/* EXCLUIR */
.Cl_btn_danger {
    background-color: #C62828;
    color: #fff;
}

.Cl_btn_danger:hover {
    background-color: #8e0000;
    transform: scale(1.02);
}

/* LINK */
.Cl_btn_link {
    background: none;
    border: none;
    padding: 0;

    color: #1c2e3c;
    font-size: 13px;
    font-weight: 500;
    text-decoration: underline;
}

.Cl_btn_link:hover {
    color: #1c2e3c;
}

/* ========================================================================= */
/* =============================== SWITCH ================================== */
/* ========================================================================= */

.Cl_Switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    user-select: none;
    cursor: pointer;
}

/* esconde checkbox */
.Cl_Switch input {
    display: none;
}

/* trilho */
.Cl_SwitchSlider {
    position: relative;

    width: 46px;
    height: 24px;

    border-radius: 999px;

    background: #3a4f5c;
    transition: .2s;

    box-shadow: inset 0 0 0 1px #2e4756;
}

/* bolinha */
.Cl_SwitchSlider::after {
    content: "";
    position: absolute;

    top: 3px;
    left: 3px;

    width: 18px;
    height: 18px;

    border-radius: 50%;
    background: #ffffff;

    transition: .2s;
    box-shadow: 0 1px 2px rgba(0,0,0,.25);
}

/* ativo */
.Cl_Switch input:checked + .Cl_SwitchSlider {
    background: #1c2e3c;
    box-shadow: inset 0 0 0 1px #1c2e3c;
}

/* bolinha move */
.Cl_Switch input:checked + .Cl_SwitchSlider::after {
    transform: translateX(22px);
}

/* label */
.Cl_SwitchLabel {
    font-size: 13px;
    color: #dce3e8;
    line-height: 1.2;
    white-space: nowrap;
}



/* ========================================================= */
/* ======================= MODAL PADRÃO ===================== */
/* ========================================================= */

.Cl_ModalOverlay {
    position: fixed;
    inset: 0;

    background: rgba(0,0,0,.4);

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

/* níveis (empilhamento) */
.Cl_ModalOverlay.level-1 { z-index: 10000; }
.Cl_ModalOverlay.level-2 { z-index: 10002; }
.Cl_ModalOverlay.level-3 { z-index: 10004; }

/* janela */
.Cl_ModalWindow {
    background: #ffffff;

    border-radius: 10px;
    box-shadow: 0 10px 40px rgba(0,0,0,.35);

    display: flex;
    flex-direction: column;

    overflow: hidden;

    max-width: 96vw;
    max-height: 92vh;

    width: var(--cl-modal-width, 1000px);
}

/* altura fixa */
.Cl_ModalWindow.height-fixed {
    height: var(--cl-modal-height, 600px);
}

/* altura automática */
.Cl_ModalWindow.height-auto {
    height: 92vh;
}

/* conteúdo (iframe) */
.Cl_ModalIframe {
    border: none;

    width: 100%;
    height: 100%;

    flex: 1;

    background: transparent;
}


/* ========================================================================= */
/* ============================ SCROLLBAR ================================== */
/* ========================================================================= */
/* Uso: classe Cl_Scroll em áreas com overflow. Variante clara: Cl_Scroll--light */

.Cl_Scroll,
.Cl_Scroll--dark {
    scrollbar-gutter: stable;
    scrollbar-width: auto;
    scrollbar-color: #5dade2 #1a2d3d;
}

.Cl_Scroll--light {
    scrollbar-gutter: stable;
    scrollbar-width: auto;
    scrollbar-color: #2980b9 #d5dde4;
}

.Cl_Scroll::-webkit-scrollbar,
.Cl_Scroll--dark::-webkit-scrollbar {
    width: 14px;
    height: 14px;
}

.Cl_Scroll::-webkit-scrollbar-track,
.Cl_Scroll--dark::-webkit-scrollbar-track {
    background: #1a2d3d;
    border-radius: 8px;
    border: 2px solid #142430;
}

.Cl_Scroll::-webkit-scrollbar-thumb,
.Cl_Scroll--dark::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #7ec8f5 0%, #3d93d6 55%, #2e7bbf 100%);
    border-radius: 8px;
    border: 2px solid #1a2d3d;
    min-height: 48px;
}

.Cl_Scroll::-webkit-scrollbar-thumb:hover,
.Cl_Scroll--dark::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #9ed8ff 0%, #56a8e8 100%);
}

.Cl_Scroll--light::-webkit-scrollbar {
    width: 14px;
    height: 14px;
}

.Cl_Scroll--light::-webkit-scrollbar-track {
    background: #e4eaef;
    border-radius: 8px;
    border: 2px solid #cfd8dc;
}

.Cl_Scroll--light::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #5dade2 0%, #2980b9 100%);
    border-radius: 8px;
    border: 2px solid #e4eaef;
    min-height: 48px;
}

.Cl_Scroll--light::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #7ec8f5 0%, #3498db 100%);
}



/* ========================================================================= */
/* ===================== COMBOBOX (Cl_SelectLike) ========================== */
/* ========================================================================= */
.Cl_SelectLike {
    position: relative;
    display: inline-block;
    width: 100%;
}

.Cl_SelectDisplay {
    width: 100%;
    padding: 8px 36px 8px 12px;
    border: 1px solid #d6dee6;
    border-radius: 6px;
    font-size: 14px;
    background-color: #ffffff;
    color: #1c2e3c;
    cursor: pointer;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.Cl_Caret {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #1c2e3c;
}

.Cl_ComboPanel {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 100%;
    max-height: 280px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #ffffff;
    border: 1px solid #d6dee6;
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(0,0,0,.15), 0 2px 8px rgba(0,0,0,.08);
    z-index: 2000;
    box-sizing: border-box;
}

.Cl_ComboPanel.is-floating {
    position: fixed;
    inset: auto;
    min-width: auto !important;
    width: auto;
    max-height: 280px;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 2147483000;
    box-sizing: border-box;
}

.Cl_ComboPanel[aria-hidden="true"]  { display: none; }
.Cl_ComboPanel[aria-hidden="false"] { display: block; }

.Cl_ComboSearch {
    padding: 8px;
    border-bottom: 1px solid #d6dee6;
    position: sticky;
    top: 0;
    background: #ffffff;
    z-index: 1;
}

.Cl_ComboSearchInput {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #d6dee6;
    border-radius: 8px;
    background: #ffffff;
    color: #1c2e3c;
}

.Cl_ComboStatus {
    padding: 6px 10px;
    font-size: 12px;
    color: #6b7a88;
}

.Cl_ComboLista {
    display: grid;
    gap: 4px;
    padding: 8px;
}

.Cl_Item,
.Cl_ComboItem {
    padding: 10px 12px;
    border-radius: 10px;
    cursor: pointer;
    display: grid;
    grid-auto-rows: min-content;
    gap: 2px;
    transition: background-color 0.15s, box-shadow 0.15s;
    line-height: 1.25;
    color: #1c2e3c;
}

.Cl_Item:hover,
.Cl_ComboItem:hover,
.Cl_Item.Cl_sel,
.Cl_ComboItem[aria-selected="true"] {
    background: #eef3f6;
    box-shadow: inset 0 0 0 1px #d6dee6;
}

.Cl_Item__linha,
.Cl_ComboItem__linha {
    font-size: 13px;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.Cl_Item__linha--1,
.Cl_ComboItem__linha--1 {
    font-weight: 700;
}

.Cl_Item__rotulo,
.Cl_ComboItem__rotulo {
    font-weight: 700;
    margin-right: 4px;
}

.Cl_Item mark,
.Cl_ComboItem mark,
.Cl_Match mark {
    background: rgba(74,108,240,.15);
    color: #1c2e3c;
    padding: 0 2px;
    border-radius: 3px;
}

.Cl_SelectDisplay:focus,
.Cl_Caret:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(28,46,60,.18);
    border-color: #1c2e3c;
}

#combo_conta {
    width: 420px;
}


/* ========================================================================= */
/* Garante: Confirmar à ESQUERDA, Cancelar à DIREITA                         */
/* ========================================================================= */

.swal2-actions {
  display: flex;
  justify-content: center;
}

.swal2-actions .swal2-confirm { order: 1 !important; }
.swal2-actions .swal2-cancel  { order: 2 !important; }

.swal2-actions .swal2-styled  {
  margin: 0 .25rem;
  border-radius: 8px;
  font-weight: 600;
  padding: 8px 16px;
}

/* ========================================================================= */
/* BOTÃO CONFIRMAR (PADRÃO FLEEDGUARD)                                      */
/* ========================================================================= */

.swal2-confirm {
  background: var(--blue-medium, #3a4f61) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.swal2-confirm:hover {
  background: var(--blue-dark, #1c2e3c) !important;
  color: #ffffff !important;
}

.swal2-confirm:focus-visible {
  outline: 2px solid var(--blue-accent, #4a6cf0);
  outline-offset: 2px;
}

/* ========================================================================= */
/* BOTÃO CANCELAR                                                            */
/* ========================================================================= */

.swal2-cancel {
  background: var(--red-danger, #c62828) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.swal2-cancel:hover {
  background: #b71c1c !important;
  color: #ffffff !important;
}

.swal2-cancel:focus-visible {
  outline: 2px solid #ef9a9a;
  outline-offset: 2px;
}

/* ========================================================================= */
/* MODAL (ALINHAMENTO COM TEMA)                                              */
/* ========================================================================= */

.swal2-popup {
  background: #1f3442 !important;
  color: #ffffff !important;
  border-radius: 12px !important;
}

/* título */
.swal2-title {
  color: #ffffff !important;
}

/* texto */
.swal2-html-container {
  color: #dce3e8 !important;
}

/* select/input: fundo claro + texto escuro (options nativas herdam color do popup) */
.swal2-popup .swal2-select,
.swal2-popup .swal2-input,
.swal2-popup .swal2-textarea {
  background: #ffffff !important;
  color: #17324a !important;
  border: 1px solid rgba(23, 50, 74, 0.25) !important;
}

.swal2-popup .swal2-select option {
  background: #ffffff !important;
  color: #17324a !important;
}

/* ========================================================================= */
/* Z-INDEX (CRÍTICO)                                                         */
/* ========================================================================= */

.swal2-container {
  z-index: 20000 !important;
}





/* ========================================================================= */
/* ======================== MOVIMENTO REDUZIDO ============================= */
/* ========================================================================= */
@media (prefers-reduced-motion: reduce) {
    * {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}


/* ========================================================================= */
/* ===================== MÊS/ANO PICKER (Cl_MesAno) ======================== */
/* ========================================================================= */
.Cl_MesAno {
  position: relative;
  display: block;
  width: 100%;
}

.Cl_MesAno__display {
  width: 100%;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 10px;
  border: 1px solid #d6dee6;
  border-radius: 10px;
  background: #ffffff;
  color: #1c2e3c;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
  user-select: none;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.Cl_MesAno__display:focus,
.Cl_MesAno__display:focus-visible {
  border-color: #1c2e3c;
  box-shadow: 0 0 0 3px rgba(200, 162, 94, 0.22);
}

.Cl_MesAno__text {
  font-weight: 600;
  letter-spacing: 0.01em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.Cl_MesAno__caret {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #6b7a88;
  flex-shrink: 0;
}

.Cl_MesAno__panel {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  width: 260px;
  background: #fff;
  color: #1c2e3c;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(28, 46, 60, 0.16);
  z-index: 1200;
  padding: 10px;
  box-sizing: border-box;
}

.Cl_MesAno__panel[aria-hidden="true"] {
  display: none !important;
}

.Cl_MesAno__panel[aria-hidden="false"] {
  display: block;
}

.Cl_MesAno__topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid #e5e7eb;
}

.Cl_MesAno__ano {
  font-weight: 700;
  font-size: 14px;
  color: #1c2e3c;
  min-width: 3.5rem;
  text-align: center;
}

.Cl_MesAno__anoBtn {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  border: 1px solid #d6dee6;
  background: #f6f9fb;
  color: #3a4f61;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  padding: 0;
}

.Cl_MesAno__anoBtn:hover {
  background: #eef3f6;
  border-color: #1c2e3c;
}

.Cl_MesAno__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  padding: 10px 0;
}

.Cl_MesAno__mes {
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  padding: 8px 4px;
  font: inherit;
  font-size: 12px;
  text-transform: lowercase;
  cursor: pointer;
  color: #3a4f61;
}

.Cl_MesAno__mes:hover {
  background: #eef3f6;
  border-color: #c8a25e;
}

.Cl_MesAno__mes.is-sel {
  background: #3a4f61;
  border-color: #3a4f61;
  color: #fff;
  font-weight: 700;
}

.Cl_MesAno__msg {
  min-height: 16px;
  font-size: 11px;
  color: #b42318;
  padding: 0 0 6px;
}

.Cl_MesAno__acoes {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  border-top: 1px solid #e5e7eb;
  padding-top: 8px;
}

.Cl_MesAno__btn {
  border: 1px solid #d6dee6;
  background: #ffffff;
  border-radius: 8px;
  padding: 6px 12px;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  color: #1c2e3c;
}

.Cl_MesAno__btn:hover {
  background: #eef3f6;
  border-color: #c8a25e;
}

.Cl_MesAno__btn--ok {
  border-color: #3a4f61;
  background: #3a4f61;
  color: #fff;
  font-weight: 700;
}

.Cl_MesAno__btn--ok:hover {
  background: #1c2e3c;
}

/* ========================================================================= */
/* ================================ PRINT ================================== */
/* ========================================================================= */
@media print {

    .Cl_BotoesApoio,
    .btn-icon,
    .Cl_Pagination,
    .Cl_Paginacao {
        display: none !important;
    }

    a::after {
        content: " (" attr(href) ")";
        font-size: 10px;
        color: #6b7280; /* 🔥 leve ajuste (cinza neutro impressão) */
    }

    body {
        background: #FFFFFF !important;
        color: #000000 !important; /* 🔥 garante legibilidade */
    }

    /* 🔥 melhora leitura geral */
    * {
        box-shadow: none !important;
        text-shadow: none !important;
    }
}

/* ========================================================================= */
/* Compat GoldVault financeiro (botões / filtros / página) — cores SELAA      */
/* ========================================================================= */
.filter-panel{
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:14px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin: 14px 0 12px 0;
}
.filter-panel-fields{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:flex-end;
  flex: 1 1 auto;
}
.filter-group{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width: 180px;
}
.filter-group label{
  font-size:13px;
  font-weight:700;
  color: var(--color-text, #0D1B2A);
}
.filter-group input,
.filter-group select{
  height:36px;
  border-radius:10px;
  border:1px solid var(--color-border, #d6dee6);
  padding: 0 10px;
  font-size:14px;
  outline:none;
  background:#ffffff;
  color: var(--color-text, #0D1B2A);
}
.filter-group input:focus,
.filter-group select:focus{
  border-color: var(--gold-accent, #D4AF37);
  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.22);
}
.filter-panel-actions{
  display:flex;
  gap:10px;
  flex: 0 0 auto;
}
.filter-panel-actions button{
  height:36px;
  border-radius:10px;
  padding:0 14px;
  font-weight:700;
  cursor:pointer;
}

.Cl_BtnIncluir, .Cl_BtnSalvar, .Cl_botaoprimario, .Cl_botaoFiltro{
    background-color: var(--gold-accent, #D4AF37);
    color: var(--navy-dark, #0D1B2A);
    border: 1px solid var(--color-primary-dark, #0D1B2A);
    border-radius: 8px;
    padding: 10px 20px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 0.2s, transform 0.15s, box-shadow 0.2s;
}
.Cl_BtnIncluir:hover, .Cl_BtnSalvar:hover, .Cl_botaoprimario:hover, .Cl_botaoFiltro:hover {
    background-color: #B8962E;
    box-shadow: 0 10px 22px rgba(212, 175, 55, 0.25);
    transform: translateY(-1px);
}
.Cl_BtnAuxiliar, .Cl_BtnCancelar {
    background-color: #ffffff;
    color: var(--color-text, #0D1B2A);
    border: 1px solid var(--color-border, #d6dee6);
    border-radius: 8px;
    padding: 10px 20px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}
.Cl_BtnAuxiliar:hover, .Cl_BtnCancelar:hover {
    background-color: var(--color-hover, #eef1f4);
    border-color: var(--gold-accent, #D4AF37);
}
.Cl_BtnExcluir {
    background-color: var(--color-danger, #C62828);
    color: #FFFFFF;
    border: none;
    border-radius: 8px;
    padding: 10px 20px;
    font-size: 15px;
    cursor: pointer;
}

#fg_content .cl-page-principal,
.cl-page-principal {
  margin: 0 0 1.25rem 0;
  padding: 20px 24px 24px;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(13, 27, 42, 0.08);
  border: 1px solid #e5e7eb;
}
.cl-page-title h2 {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--color-text, #0D1B2A);
}
.cl-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}