/* PADRÃO VISUAL DAS TELAS
   Mesma base do sistema principal (minhasCacambas: dist/css/pages/user/profile.css):
   variáveis de cor por skin e os cartões cfgCard. Cada tela inclui este arquivo
   e põe no seu próprio CSS só o que é dela. */

/* Variáveis no body: valem também para modais e alertify (criados direto no body) */
body{
    --cfg-primaria: #3c8dbc;
    --cfg-primaria-suave: rgba(60, 141, 188, 0.08);
    --cfg-sucesso: #00a65a;
    --cfg-alerta: #db8b0b;
    --cfg-perigo: #dd4b39;
    --cfg-borda: #e3e8ee;
    --cfg-fundo-suave: #f7f9fb;
    --cfg-texto: #333;
    --cfg-texto-suave: #6b7785;
    --cfg-sobre-primaria: #fff;
    --cfg-fundo-pagina: #ecf0f5;
    --cfg-fundo-cartao: #fff;
    --cfg-fundo-bloco: #fafbfc;
    --cfg-fundo-neutro: #eef1f4;
}
/* Cor principal por skin */
.skin-purple,
.skin-purple-light { --cfg-primaria: #605ca8; --cfg-primaria-suave: rgba(96, 92, 168, 0.08); }

.skin-green,
.skin-green-light  { --cfg-primaria: #00a65a; --cfg-primaria-suave: rgba(0, 166, 90, 0.08); }

.skin-red,
.skin-red-light    { --cfg-primaria: #dd4b39; --cfg-primaria-suave: rgba(221, 75, 57, 0.08); }

.skin-yellow,
.skin-yellow-light { --cfg-primaria: #db8b0b; --cfg-primaria-suave: rgba(219, 139, 11, 0.08); }

.skin-black,
.skin-black-light  { --cfg-primaria: #222d32; --cfg-primaria-suave: rgba(34, 45, 50, 0.06); }

/* MODO ESCURO (body.tema-escuro): só as cores neutras mudam, a cor do sistema continua */
body.tema-escuro{
    color-scheme: dark;
    --cfg-primaria-suave: rgba(60, 141, 188, 0.18);
    --cfg-borda: #343d46;
    --cfg-fundo-pagina: #14181c;
    --cfg-fundo-cartao: #1d2329;
    --cfg-fundo-bloco: #222930;
    --cfg-fundo-suave: #242b32;
    --cfg-fundo-neutro: #2d353d;
    --cfg-texto: #e4e8ec;
    --cfg-texto-suave: #9ba7b3;
}
body.tema-escuro.skin-purple,
body.tema-escuro.skin-purple-light { --cfg-primaria: #8481cc; --cfg-primaria-suave: rgba(132, 129, 204, 0.2); }

body.tema-escuro.skin-green,
body.tema-escuro.skin-green-light  { --cfg-primaria-suave: rgba(0, 166, 90, 0.18); }

body.tema-escuro.skin-red,
body.tema-escuro.skin-red-light    { --cfg-primaria-suave: rgba(221, 75, 57, 0.18); }

body.tema-escuro.skin-yellow,
body.tema-escuro.skin-yellow-light { --cfg-primaria-suave: rgba(219, 139, 11, 0.18); }

/* Preto vira branco no escuro, com texto escuro por cima */
body.tema-escuro.skin-black,
body.tema-escuro.skin-black-light  { --cfg-primaria: #e9edf1; --cfg-primaria-suave: rgba(233, 237, 241, 0.1); --cfg-sobre-primaria: #1a2226; }

/* O Bootstrap 3 esconde [hidden] sem !important: classes com display:flex
   (.cfgDica, .cfgSelo...) passariam por cima e o elemento continuaria aparecendo */
[hidden]{
    display: none !important;
}

.cfgPagina{
    padding: 5px 0 0;
}
.cfgPagina .btn{
    border-radius: 8px;
    padding: 8px 18px;
}
/* O _all-skins do AdminLTE força ".skin-* a.btn { color: #fff !important }":
   links com cara de botão claro ficariam com o texto invisível */
.cfgPagina a.btn.btn-default{
    color: var(--cfg-texto) !important;
}

/* CARTÕES DE SEÇÃO */
.cfgCard{
    background: var(--cfg-fundo-cartao);
    border: 1px solid var(--cfg-borda);
    border-radius: 10px;
    padding: 18px 20px 6px;
    margin-bottom: 20px;
}
.cfgCardHeader{
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--cfg-borda);
}
.cfgCardHeader h4{
    margin: 0 0 2px;
    font-size: 16px;
    font-weight: 600;
    color: var(--cfg-texto);
}
.cfgCardHeader p{
    margin: 0;
    color: var(--cfg-texto-suave);
    font-size: 13px;
}
.cfgCardIcone{
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 9px;
    background: var(--cfg-primaria);
    color: var(--cfg-sobre-primaria);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
}
/* Ação à direita no cabeçalho do cartão */
.cfgCardHeaderAcao > .btn,
.cfgCardHeaderAcao > .cfgContador{
    flex: 0 0 auto;
    margin-left: auto;
}
.cfgContador{
    align-self: center;
    padding: 3px 10px;
    border-radius: 12px;
    background: var(--cfg-fundo-neutro);
    color: var(--cfg-texto-suave);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

/* Cartões lado a lado com a mesma altura */
.cfgLinhaIgual{
    display: flex;
    flex-wrap: wrap;
}
.cfgLinhaIgual:before,
.cfgLinhaIgual:after{
    display: none;
}
.cfgLinhaIgual > [class*='col-']{
    float: none;
    flex: 0 0 100%;
    max-width: 100%;
    display: flex;
}
@media (min-width: 1200px){
    .cfgLinhaIgual > .col-lg-4{ flex-basis: 33.3333%; max-width: 33.3333%; }
    .cfgLinhaIgual > .col-lg-5{ flex-basis: 41.6667%; max-width: 41.6667%; }
    .cfgLinhaIgual > .col-lg-6{ flex-basis: 50%;      max-width: 50%; }
    .cfgLinhaIgual > .col-lg-7{ flex-basis: 58.3333%; max-width: 58.3333%; }
    .cfgLinhaIgual > .col-lg-8{ flex-basis: 66.6667%; max-width: 66.6667%; }
}
.cfgLinhaIgual .cfgCard{
    flex: 1 1 auto;
    width: 100%;
}

/* TABELA */
.cfgTabela{
    margin-bottom: 14px;
    border: 1px solid var(--cfg-borda);
    border-radius: 10px;
}
.cfgTabela .table{
    margin: 0;
}
.cfgTabela .table > thead > tr > th{
    padding: 10px 14px;
    background: var(--cfg-fundo-suave);
    border-bottom: 1px solid var(--cfg-borda);
    color: var(--cfg-primaria);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
}
.cfgTabela .table > tbody > tr > td{
    padding: 11px 14px;
    border-top: 1px solid var(--cfg-borda);
    vertical-align: middle;
    color: var(--cfg-texto);
}
.cfgTabela .table > tbody > tr:hover > td{
    background: var(--cfg-primaria-suave);
}
.cfgTabela .label{
    display: inline-block;
    padding: 3px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
}
/* Botão de ação redondo dentro da tabela (ex.: visualizar) */
.cfgBtnAcao{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid var(--cfg-borda);
    background: var(--cfg-fundo-cartao);
    color: var(--cfg-primaria);
    transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}
.cfgBtnAcao:hover,
.cfgBtnAcao:focus{
    background: var(--cfg-primaria);
    border-color: var(--cfg-primaria);
    color: var(--cfg-sobre-primaria);
}

/* TABELA COM DATATABLES: borda só na tabela, pesquisa e paginação soltas */
.cfgTabela.cfgTabelaDados{
    border: 0;
    border-radius: 0;
    overflow-x: auto;
}
.cfgTabelaDados .dataTables_wrapper > .row{
    margin: 0;
}
.cfgTabelaDados .dataTables_wrapper > .row > [class*='col-']{
    padding: 0;
}
/* Barras de cima (mostrar/pesquisar) e de baixo (info/paginação) no mesmo
   formato arredondado da tabela */
.cfgTabelaDados .dataTables_wrapper > .row:first-child,
.cfgTabelaDados .dataTables_wrapper > .row:last-child{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--cfg-borda);
    border-radius: 10px;
    background: var(--cfg-fundo-suave);
}
.cfgTabelaDados .dataTables_wrapper > .row:first-child:before,
.cfgTabelaDados .dataTables_wrapper > .row:first-child:after,
.cfgTabelaDados .dataTables_wrapper > .row:last-child:before,
.cfgTabelaDados .dataTables_wrapper > .row:last-child:after{
    display: none;
}
.cfgTabelaDados .dataTables_wrapper > .row:first-child > [class*='col-'],
.cfgTabelaDados .dataTables_wrapper > .row:last-child > [class*='col-']{
    float: none;
    width: auto;
    flex: 0 1 auto;
}
.cfgTabelaDados .dataTables_length,
.cfgTabelaDados .dataTables_filter{
    margin: 0;
}
/* Select e pesquisa com a mesma altura, borda e cantos */
.cfgTabelaDados .dataTables_length select.form-control,
.cfgTabelaDados .dataTables_filter input.form-control{
    height: 36px !important;
    border: 1px solid var(--cfg-borda) !important;
    border-radius: 8px !important;
    background-color: var(--cfg-fundo-cartao);
    box-shadow: none;
    font-size: 13px;
    color: var(--cfg-texto);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.cfgTabelaDados .dataTables_length select.form-control{
    padding: 4px 8px;
}
/* Coluna da pesquisa ocupa o espaço livre e o campo cresce para a esquerda */
.cfgTabelaDados .dataTables_wrapper > .row:first-child > [class*='col-']:last-child{
    flex: 1 1 auto;
}
.cfgTabelaDados div.dataTables_filter{
    text-align: right;
}
.cfgTabelaDados div.dataTables_filter label{
    display: block;
}
/* O CSS do DataTables força width:auto no campo de pesquisa */
.cfgTabelaDados div.dataTables_filter input.form-control{
    width: 420px !important;
    max-width: 100%;
}
.cfgTabelaDados .dataTables_length select.form-control:focus{
    border-color: var(--cfg-primaria) !important;
    box-shadow: 0 0 0 3px var(--cfg-primaria-suave);
    outline: none;
}
.cfgTabelaDados table.dataTable{
    margin: 12px 0 !important;
    border: 1px solid var(--cfg-borda);
    border-collapse: separate !important;
    border-spacing: 0;
    border-radius: 10px;
}
.cfgTabelaDados table.dataTable > thead > tr > th:first-child{ border-top-left-radius: 10px; }
.cfgTabelaDados table.dataTable > thead > tr > th:last-child{ border-top-right-radius: 10px; }
.cfgTabelaDados table.dataTable > thead > tr > th{
    border-bottom: 1px solid var(--cfg-borda);
}
.cfgTabelaDados table.dataTable > tbody > tr:first-child > td{
    border-top: 0;
}
.cfgTabelaDados .dataTables_length label,
.cfgTabelaDados .dataTables_filter label{
    font-weight: normal;
    color: var(--cfg-texto-suave);
}
.cfgTabelaDados .dataTables_length select{
    margin: 0 4px;
    border-radius: 8px;
}
.cfgTabelaDados .dataTables_filter input{
    height: 36px;
    margin: 0 !important;
    padding: 6px 12px 6px 34px;
    border: 1px solid var(--cfg-borda);
    border-radius: 8px;
    background: var(--cfg-fundo-cartao) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236b7785' stroke-width='2.5' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 12px center;
    box-shadow: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.cfgTabelaDados .dataTables_filter input:focus{
    border-color: var(--cfg-primaria) !important;
    box-shadow: 0 0 0 3px var(--cfg-primaria-suave);
    outline: none;
}
.cfgTabelaDados .dataTables_info{
    padding-top: 0 !important;
    color: var(--cfg-texto-suave);
    font-size: 13px;
}
.cfgTabelaDados .dataTables_paginate .pagination{
    margin: 0;
}
.cfgTabelaDados .pagination > li > a,
.cfgTabelaDados .pagination > li > span{
    margin-left: 4px;
    border: 1px solid var(--cfg-borda);
    border-radius: 8px !important;
    color: var(--cfg-texto);
}
.cfgTabelaDados .pagination > .active > a,
.cfgTabelaDados .pagination > .active > a:hover,
.cfgTabelaDados .pagination > .active > a:focus{
    background: var(--cfg-primaria);
    border-color: var(--cfg-primaria);
    color: var(--cfg-sobre-primaria);
}
.cfgTabelaDados .pagination > .disabled > a{
    color: #b8c0c8;
}
/* Setas de ordenação mais discretas */
.cfgTabelaDados table.dataTable thead .sorting:after,
.cfgTabelaDados table.dataTable thead .sorting_asc:after,
.cfgTabelaDados table.dataTable thead .sorting_desc:after{
    bottom: 10px;
    font-size: 11px;
}

/* CÉLULAS E SELOS */
.cfgAvatar{
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--cfg-primaria);
    color: var(--cfg-sobre-primaria);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.cfgUsuarioCel{
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 200px;
    color: var(--cfg-texto);
}
.cfgUsuarioCel:hover,
.cfgUsuarioCel:focus{
    color: var(--cfg-primaria);
}
.cfgUsuarioCelTexto{
    min-width: 0;
    line-height: 1.3;
}
.cfgUsuarioCelTexto strong{
    display: block;
    font-weight: 600;
}
.cfgUsuarioCelTexto small{
    display: block;
    color: var(--cfg-texto-suave);
}
.cfgContatoCel{
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 13px;
    line-height: 1.35;
}
.cfgContatoCel .fa{
    width: 14px;
    margin-right: 3px;
    text-align: center;
    color: var(--cfg-texto-suave);
}
.cfgTextoSuave{
    color: var(--cfg-texto-suave);
}
.cfgSelo{
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    border-radius: 12px;
    background: var(--cfg-fundo-neutro);
    color: var(--cfg-texto-suave);
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
}
.cfgSelo.sucesso{ background: rgba(0, 166, 90, 0.12);   color: #008d4c; }
.cfgSelo.alerta { background: rgba(219, 139, 11, 0.14); color: #b06f05; }
.cfgSelo.perigo { background: rgba(221, 75, 57, 0.12);  color: #b03a2e; }
.cfgSelo.primaria{ background: var(--cfg-primaria-suave); color: var(--cfg-primaria); }

/* Avatar quadrado (empresas) */
.cfgAvatarQuadrado{
    border-radius: 9px;
}
/* Data + selo empilhados (ex.: plano da empresa) */
.cfgPlanoCel{
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
}
.cfgPlanoCel strong{
    font-weight: 600;
    color: var(--cfg-texto);
}
.cfgAjuda{
    display: block;
    margin-top: 4px;
    color: var(--cfg-texto-suave);
    font-size: 12px;
    line-height: 1.4;
}

/* FILTROS EM PÍLULAS (ex.: Todos / Não verificados) */
.cfgFiltros{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-self: center;
    margin-left: auto;
}
.cfgFiltro{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid var(--cfg-borda);
    border-radius: 20px;
    background: var(--cfg-fundo-cartao);
    color: var(--cfg-texto-suave);
    font-size: 13px;
    font-weight: 600;
    transition: border-color 0.15s, color 0.15s, background-color 0.15s;
}
.cfgFiltro span{
    padding: 0 7px;
    border-radius: 10px;
    background: var(--cfg-fundo-neutro);
    font-size: 11.5px;
}
.cfgFiltro:hover,
.cfgFiltro:focus{
    border-color: var(--cfg-primaria);
    color: var(--cfg-primaria);
}
.cfgFiltro.ativo{
    border-color: var(--cfg-primaria);
    background: var(--cfg-primaria);
    color: var(--cfg-sobre-primaria);
}
.cfgFiltro.ativo span{
    background: rgba(255, 255, 255, 0.25);
}
/* Filtros numa linha própria, abaixo do cabeçalho do cartão */
.cfgFiltros.cfgFiltrosLinha{
    margin: 0 0 4px;
}

/* RESUMO NO TOPO (avatar/logo + nome + ações) */
.cfgResumo{
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 18px 20px;
    margin-bottom: 20px;
    border: 1px solid var(--cfg-borda);
    border-radius: 10px;
    background: linear-gradient(135deg, var(--cfg-primaria-suave), var(--cfg-fundo-cartao) 60%);
}
.cfgResumo > .cfgAvatar{
    flex-basis: 72px;
    width: 72px;
    height: 72px;
    font-size: 26px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}
.cfgResumoInfo{
    flex: 1 1 auto;
    min-width: 0;
}
.cfgResumoInfo h3{
    margin: 0 0 4px;
    font-size: 20px;
    font-weight: 600;
    color: var(--cfg-texto);
    word-break: break-word;
}
.cfgResumoInfo p{
    margin: 0 0 8px;
    color: var(--cfg-texto-suave);
    word-break: break-word;
}
.cfgResumoSelos{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cfgResumoAcoes{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex: 0 0 auto;
}

/* CAMPO COM EDIÇÃO INDIVIDUAL ("Alterar" libera o campo → Salvar com confirmação) */
.cfgCampos{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 4px 16px;
}
.cfgCampos.cfgCamposUmaColuna{
    grid-template-columns: 1fr;
}
.cfgCampo{
    margin-bottom: 14px;
}
.cfgCampoTopo{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 24px;
    margin-bottom: 5px;
}
.cfgCampoTopo > label{
    margin: 0;
    font-weight: 600;
    color: var(--cfg-texto);
}
/* "Alterar": checkbox em formato de pílula */
.cfgCampoTopo > .cfgLiberar{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 2px 10px 2px 6px;
    border: 1px solid var(--cfg-borda);
    border-radius: 12px;
    background: var(--cfg-fundo-cartao);
    color: var(--cfg-texto-suave);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    transition: border-color 0.15s, color 0.15s, background-color 0.15s;
}
.cfgCampoTopo > .cfgLiberar:hover{
    border-color: var(--cfg-primaria);
    color: var(--cfg-primaria);
}
.cfgCampoTopo > .cfgLiberar.ativo{
    border-color: var(--cfg-primaria);
    background: var(--cfg-primaria-suave);
    color: var(--cfg-primaria);
}
.cfgLiberar input[type="checkbox"]{
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    width: 15px;
    height: 15px;
    margin: 0;
    border: 1.5px solid #b8c0c8;
    border-radius: 4px;
    background: var(--cfg-fundo-cartao);
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s;
}
.cfgLiberar input[type="checkbox"]:checked{
    border-color: var(--cfg-primaria);
    background: var(--cfg-primaria);
}
.cfgLiberar input[type="checkbox"]:checked::after{
    content: '';
    position: absolute;
    left: 4px;
    top: 1px;
    width: 4px;
    height: 8px;
    border: solid var(--cfg-sobre-primaria);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.cfgLiberar input[type="checkbox"]:focus-visible{
    outline: 2px solid var(--cfg-primaria);
    outline-offset: 2px;
}
.cfgCampoLinha{
    display: flex;
    gap: 6px;
}
.cfgCampoLinha .form-control{
    flex: 1 1 auto;
    min-width: 0;
    height: 38px;
    border-radius: 8px;
    border-color: var(--cfg-borda);
    box-shadow: none;
    transition: border-color 0.15s, box-shadow 0.15s, background-color 0.15s;
}
.cfgCampoLinha .form-control[disabled]{
    background: var(--cfg-fundo-suave);
    color: var(--cfg-texto);
    cursor: default;
}
.cfgCampoLinha .form-control:focus{
    border-color: var(--cfg-primaria);
    box-shadow: 0 0 0 3px var(--cfg-primaria-suave);
}
.cfgCampo.editando .form-control{
    background: var(--cfg-fundo-cartao);
    border-color: var(--cfg-primaria);
}
.cfgCampoSalvar,
.cfgCampoSalvar:focus{
    flex: 0 0 auto;
    height: 38px;
    padding: 0 14px;
    border: 1px solid var(--cfg-sucesso);
    border-radius: 8px;
    background: var(--cfg-sucesso);
    color: #fff;
    font-weight: 600;
}
.cfgCampoSalvar:hover,
.cfgCampoSalvar:active{
    color: #fff;
    filter: brightness(0.92);
}
.cfgCampoSalvar[disabled],
.cfgCampoSalvar[disabled]:hover{
    border-color: var(--cfg-borda);
    background: var(--cfg-fundo-neutro);
    color: #9aa4ae;
    filter: none;
    opacity: 1;
}

/* Botão de mostrar/esconder senha ao lado do campo */
.cfgCampoOlho,
.cfgCampoOlho:focus{
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    padding: 0 !important;
    border: 1px solid var(--cfg-borda);
    border-radius: 8px;
    background: var(--cfg-fundo-cartao);
    color: var(--cfg-texto-suave);
}
.cfgCampoOlho:hover{
    border-color: var(--cfg-primaria);
    color: var(--cfg-primaria);
}

/* BARRA DE AÇÕES DO FORMULÁRIO (Voltar à esquerda, Salvar à direita) */
.cfgBarraAcoes{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px 16px;
    margin-bottom: 20px;
    border: 1px solid var(--cfg-borda);
    border-radius: 10px;
    background: var(--cfg-fundo-cartao);
}
.cfgBarraAcoes .cfgBtnSalvar{
    min-width: 200px;
    font-weight: 600;
}

/* BOTÃO VOLTAR: sempre na cor do skin selecionado, com texto branco */
.btn.cfgBtnVoltar,
.btn.cfgBtnVoltar:focus,
.btn.cfgBtnVoltar:visited{
    border: 1px solid var(--cfg-primaria) !important;
    background: var(--cfg-primaria) !important;
    color: var(--cfg-sobre-primaria) !important;
    font-weight: 600;
}
.btn.cfgBtnVoltar:hover,
.btn.cfgBtnVoltar:active{
    color: var(--cfg-sobre-primaria) !important;
    filter: brightness(0.88);
}

/* SWITCH LIGA/DESLIGA (button role="switch" aria-checked) */
.cfgSwitch{
    position: relative;
    flex: 0 0 44px;
    width: 44px;
    height: 24px;
    padding: 0;
    border: none;
    border-radius: 12px;
    background: #ccd1d6;
    cursor: pointer;
    transition: background-color 0.2s;
}
.cfgSwitch::after{
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    transition: left 0.2s;
}
.cfgSwitch[aria-checked="true"]{ background: var(--cfg-sucesso); }
.cfgSwitch[aria-checked="true"]::after{ left: 23px; }
.cfgSwitch:disabled{ opacity: 0.55; cursor: wait; }
.cfgSwitch:focus{ outline: none; }
.cfgSwitch:focus-visible{ outline: 2px solid var(--cfg-primaria); outline-offset: 2px; }

/* Bloco de opção com switch (borda à esquerda verde quando ligado) */
.cfgOpcao{
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid var(--cfg-borda);
    border-left: 4px solid #d2d6de;
    border-radius: 8px;
    background: var(--cfg-fundo-bloco);
    transition: border-color 0.15s, background-color 0.15s;
}
.cfgOpcao.ativo{
    border-color: rgba(0, 166, 90, 0.35);
    border-left-color: var(--cfg-sucesso);
    background: rgba(0, 166, 90, 0.04);
}
.cfgOpcaoTexto{
    flex: 1 1 auto;
    min-width: 0;
    line-height: 1.4;
}
.cfgOpcaoTexto strong{
    display: block;
    color: var(--cfg-texto);
}
.cfgOpcaoTexto small{
    display: block;
    margin-top: 2px;
    color: var(--cfg-texto-suave);
    font-size: 12.5px;
}

/* LISTA COM ÍCONES (explicações, passo a passo) */
.cfgLista{
    margin: 0 0 14px;
    padding: 0;
    list-style: none;
}
.cfgLista li{
    display: flex;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px dashed var(--cfg-borda);
    color: var(--cfg-texto);
    line-height: 1.45;
}
.cfgLista li:last-child{
    border-bottom: 0;
}
.cfgLista .fa{
    flex: 0 0 18px;
    margin-top: 3px;
    text-align: center;
    color: var(--cfg-primaria);
}

/* REENVIO DO E-MAIL DE VERIFICAÇÃO (tela do usuário, só para não verificados) */
.cfgReenvio{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin: -6px 0 14px;
    padding: 10px 12px;
    border: 1px dashed rgba(219, 139, 11, 0.5);
    border-radius: 8px;
    background: rgba(219, 139, 11, 0.06);
    font-size: 12.5px;
    color: #8a5a06;
}
.cfgReenvio .fa-info-circle{
    margin-right: 4px;
}
.cfgPagina .cfgReenvio .btn{
    padding: 6px 12px;
    border: 1px solid var(--cfg-alerta);
    background: var(--cfg-fundo-cartao);
    color: #b06f05;
    font-weight: 600;
}
.cfgPagina .cfgReenvio .btn:hover,
.cfgPagina .cfgReenvio .btn:focus{
    background: var(--cfg-alerta);
    color: #fff;
}

/* LISTA DE INFORMAÇÕES (rótulo à esquerda, valor à direita) */
.cfgInfos{
    margin: 0 0 14px;
    padding: 0;
    list-style: none;
}
.cfgInfos li{
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px dashed var(--cfg-borda);
}
.cfgInfos li:last-child{
    border-bottom: 0;
}
.cfgInfos li > span{
    flex: 0 0 auto;
    color: var(--cfg-texto-suave);
}
.cfgInfos li > span .fa{
    width: 16px;
    margin-right: 4px;
    text-align: center;
    color: var(--cfg-primaria);
}
.cfgInfos li > strong{
    min-width: 0;
    font-weight: 600;
    color: var(--cfg-texto);
    text-align: right;
    word-break: break-word;
}

/* BOTÃO PRINCIPAL NA COR DO SKIN */
.cfgBtnPrimario,
.cfgBtnPrimario:focus{
    background: var(--cfg-primaria);
    border-color: var(--cfg-primaria);
    color: var(--cfg-sobre-primaria);
}
.cfgBtnPrimario:hover,
.cfgBtnPrimario:active{
    background: var(--cfg-primaria);
    border-color: var(--cfg-primaria);
    color: var(--cfg-sobre-primaria);
    filter: brightness(0.9);
}

/* ESTADO VAZIO / NÃO ENCONTRADO */
.cfgVazio{
    padding: 40px 20px;
    text-align: center;
}
.cfgVazio .cfgCardIcone{
    width: 56px;
    height: 56px;
    margin: 0 auto 14px;
    border-radius: 14px;
    font-size: 24px;
    background: var(--cfg-primaria-suave);
    color: var(--cfg-primaria);
}
.cfgVazio h4{
    margin: 0 0 6px;
    font-size: 18px;
    font-weight: 600;
    color: var(--cfg-texto);
}
.cfgVazio p{
    margin: 0 0 18px;
    color: var(--cfg-texto-suave);
}

/* ELEMENTOS COMUNS */
.cfgAcoesCard{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px 0;
    margin-top: 6px;
    border-top: 1px solid var(--cfg-borda);
}
.cfgModalIntro{
    margin: 0 0 16px;
    padding: 10px 14px;
    border-radius: 8px;
    background: var(--cfg-primaria-suave);
    color: var(--cfg-texto);
    line-height: 1.5;
}
.cfgDica{
    display: flex;
    gap: 10px;
    margin-top: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #fcf8e3;
    color: #8a6d3b;
    font-size: 12.5px;
    line-height: 1.45;
}
.cfgDica .fa{
    margin-top: 2px;
    font-size: 16px;
}

/* MODAL BOOTSTRAP NO PADRÃO (.modal.cfgModal) */
.cfgModal .modal-content{
    border: none;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
}
.cfgModal .modal-header{
    padding: 16px 20px;
    border-bottom: 1px solid var(--cfg-borda);
}
.cfgModal .modal-header .cfgCardHeader{
    align-items: center;
    margin: 0;
    padding: 0;
    border: 0;
}
.cfgModal .modal-header .close{
    margin-top: 4px;
    font-size: 26px;
}
.cfgModal .modal-title{
    margin: 0;
    font-size: 17px;
    font-weight: 600;
}
.cfgModal .modal-body{
    padding: 20px;
    background: var(--cfg-fundo-cartao);
}
.cfgModal .modal-body label{
    font-weight: 600;
}
.cfgModal .modal-body .form-control{
    height: 38px;
    border-radius: 8px;
    border-color: var(--cfg-borda);
    box-shadow: none;
}
.cfgModal .modal-body .form-control:focus{
    border-color: var(--cfg-primaria);
    box-shadow: 0 0 0 3px var(--cfg-primaria-suave);
}
.cfgModal .modal-footer{
    padding: 14px 20px;
    background: var(--cfg-fundo-suave);
    border-top: 1px solid var(--cfg-borda);
}
.cfgModal .modal-footer .btn{
    border-radius: 8px;
    padding: 8px 18px;
    font-weight: 600;
}
.cfgIconePerigo{
    background: var(--cfg-perigo);
    color: #fff;
}
.cfgIconeAlerta{
    background: var(--cfg-alerta);
    color: #fff;
}

/* CONFIRMAÇÃO (alertify) — use confirmarCfg() do funcs.js */
.cfgDialog .ajs-dialog{
    max-width: 460px;
    padding: 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
}
.cfgDialog .ajs-header{
    margin: 0;
    padding: 16px 50px 16px 20px;
    border-bottom: 1px solid var(--cfg-borda);
    border-radius: 12px 12px 0 0;
    background: var(--cfg-fundo-cartao);
    font-size: 16px;
    font-weight: 600;
    color: var(--cfg-texto);
}
/* X de fechar: o alertify sobe o botão com margem negativa pensando no
   padding padrão do diálogo, que aqui foi zerado */
.cfgDialog .ajs-commands{
    top: 16px;
    right: 16px;
    margin: 0;
}
.cfgDialog .ajs-body{
    margin: 0;
    padding: 0;
}
.cfgDialog .ajs-body .ajs-content{
    padding: 20px;
}
.cfgDialogCorpo{
    display: flex;
    align-items: center;
    gap: 14px;
}
.cfgDialogCorpo p{
    margin: 0;
    color: var(--cfg-texto);
    line-height: 1.5;
}
.cfgDialog .ajs-footer{
    margin: 0;
    padding: 12px 20px;
    background: var(--cfg-fundo-suave);
    border-top: 1px solid var(--cfg-borda);
    border-radius: 0 0 12px 12px;
}
.cfgDialog .ajs-footer .ajs-buttons .ajs-button{
    min-width: 110px;
    margin: 0 0 0 8px;
    padding: 8px 18px;
    border-radius: 8px;
    font-weight: 600;
    text-transform: none;
}
.cfgDialog .ajs-dialog .ajs-footer .ajs-buttons .ajs-ok{
    background: var(--cfg-sucesso);
    border: 1px solid var(--cfg-sucesso);
    color: #fff;
}
.cfgDialog .ajs-dialog .ajs-footer .ajs-buttons .ajs-cancel{
    background: var(--cfg-fundo-cartao);
    border: 1px solid #d2d6de;
    color: var(--cfg-texto);
}
/* Variante para ações que apagam algo */
.cfgDialogPerigo .cfgCardIcone{
    background: var(--cfg-perigo);
    color: #fff;
}
.cfgDialogPerigo .ajs-dialog .ajs-footer .ajs-buttons .ajs-ok{
    background: var(--cfg-perigo);
    border-color: var(--cfg-perigo);
}

/* AVISO DE COOKIES (pages/index/usoCookie.php) */
.cfgCookie{
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 1030;
    width: 440px;
    max-width: calc(100% - 40px);
}
.cfgCookieCard{
    padding: 18px 20px 16px;
    background: var(--cfg-fundo-cartao);
    border: 1px solid var(--cfg-borda);
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
    animation: cfgCookieEntrada 0.35s ease-out;
}
@keyframes cfgCookieEntrada{
    from{ opacity: 0; transform: translateY(16px); }
    to  { opacity: 1; transform: translateY(0); }
}
.cfgCookieTopo{
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.cfgCookieTexto{
    flex: 1 1 auto;
    min-width: 0;
}
.cfgCookieTexto h4{
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 600;
    color: var(--cfg-texto);
}
.cfgCookieTexto p{
    margin: 0 0 6px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--cfg-texto-suave);
}
.cfgCookieTexto a{
    font-size: 12.5px;
    font-weight: 600;
    color: var(--cfg-primaria);
}
.cfgCookieTexto a .fa{
    margin-left: 2px;
    font-size: 11px;
}
.cfgCookieAcoes{
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--cfg-borda);
}
.cfgCookieAcoes .btn{
    border-radius: 8px;
    padding: 8px 18px;
    font-weight: 600;
}
/* Minimizado ("Agora não"): fica só o botão para reabrir */
.cfgCookieReabrir{
    display: none;
    margin-left: auto;
    padding: 8px 14px;
    border: 1px solid var(--cfg-borda);
    border-radius: 20px;
    background: var(--cfg-fundo-cartao);
    color: var(--cfg-primaria);
    font-weight: 600;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
    transition: box-shadow 0.15s, transform 0.15s;
}
.cfgCookieReabrir:hover,
.cfgCookieReabrir:focus{
    outline: none;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.16);
    transform: translateY(-2px);
}
.cfgCookie.minimizado{
    width: auto;
}
.cfgCookie.minimizado .cfgCookieCard{
    display: none;
}
.cfgCookie.minimizado .cfgCookieReabrir{
    display: block;
}

/* RESPONSIVO */
@media (max-width: 767px){
    .cfgCard{
        padding: 14px 12px 4px;
    }
    .cfgAcoesCard .btn{
        flex: 1 1 auto;
    }
    .cfgDialog .ajs-footer .ajs-buttons .ajs-button{
        min-width: 0;
    }
    .cfgCardHeaderAcao{
        flex-wrap: wrap;
    }
    .cfgCardHeaderAcao > .btn,
    .cfgFiltros{
        width: 100%;
        margin-left: 0;
    }
    .cfgFiltro{
        flex: 1 1 auto;
        justify-content: center;
    }
    .cfgTabelaDados .dataTables_length,
    .cfgTabelaDados .dataTables_filter,
    .cfgTabelaDados .dataTables_info,
    .cfgTabelaDados .dataTables_paginate{
        text-align: left !important;
    }
    .cfgTabelaDados .dataTables_wrapper > .row:first-child > [class*='col-'],
    .cfgTabelaDados .dataTables_wrapper > .row:last-child > [class*='col-']{
        flex: 1 1 100%;
    }
    .cfgTabelaDados .dataTables_filter label,
    .cfgTabelaDados div.dataTables_filter input.form-control{
        width: 100% !important;
    }
    .cfgResumo{
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        padding: 18px 14px;
    }
    .cfgResumoInfo{
        flex-basis: 100%;
    }
    .cfgResumoSelos,
    .cfgResumoAcoes{
        justify-content: center;
    }
    .cfgResumoAcoes{
        width: 100%;
    }
    .cfgResumoAcoes .btn,
    .cfgBarraAcoes .btn{
        flex: 1 1 auto;
    }
    .cfgBarraAcoes .cfgBtnSalvar{
        min-width: 0;
    }
    .cfgCookie{
        right: 12px;
        bottom: 12px;
        max-width: calc(100% - 24px);
    }
    .cfgCookieAcoes .btn{
        flex: 1 1 auto;
    }
}
