/* ==========================================================
   SGCS — identidade visual sobre o AdminLTE 3
   ========================================================== */

:root {
    /* Gradiente da marca (fundos: botões, menu ativo, faixas) */
    --scc-gradiente: linear-gradient(90deg, #03228f 0%, #0e73e4 100%);
    --scc-gradiente-hover: linear-gradient(90deg, #021b72 0%, #0b62c4 100%);
    /* Cor sólida equivalente (textos, bordas, ícones — onde gradiente não se aplica) */
    --scc-primaria: #0a4fc4;
    --scc-primaria-escura: #03228f;
    --scc-primaria-clara: #0e73e4;
    --scc-destaque: #ffb81c;
    --scc-fundo-claro: #f1f5fd;
}

body {
    font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}

a { color: var(--scc-primaria); }
a:hover { color: var(--scc-primaria-escura); }

/* ---------- Botão da marca ---------- */
.btn-scc {
    color: #fff;
    background: var(--scc-gradiente);
    border: 0;
    box-shadow: 0 2px 6px rgba(3, 34, 143, .18);
    transition: box-shadow .15s, transform .15s, filter .15s;
}
.btn-scc:hover,
.btn-scc:focus {
    color: #fff;
    background: var(--scc-gradiente-hover);
    box-shadow: 0 4px 12px rgba(3, 34, 143, .28);
}
.btn-scc:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(14, 115, 228, .35); }
.btn-scc:active { transform: translateY(1px); }
.btn-scc:disabled { filter: grayscale(.4); opacity: .7; }

.bg-scc { background: var(--scc-gradiente) !important; color: #fff !important; }

/* Card com faixa superior em gradiente */
.card-scc.card-outline {
    border-top: 0;
    position: relative;
}
.card-scc.card-outline::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: var(--scc-gradiente);
    border-radius: .25rem .25rem 0 0;
}

/* Menu lateral */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active:hover {
    background: var(--scc-gradiente);
    color: #fff;
    box-shadow: 0 2px 8px rgba(14, 115, 228, .35);
}
.main-sidebar .brand-link { border-bottom-color: rgba(255, 255, 255, .08); }
.brand-link .brand-image {
    float: none;
    max-height: 32px;
    margin-left: .6rem;
    margin-right: .4rem;
    margin-top: -3px;
    opacity: 1;
}
.brand-text { font-family: 'Poppins', 'Source Sans Pro', sans-serif; }
.brand-link .brand-text.small { font-size: .74rem; letter-spacing: .01em; }

/* Cabeçalho do usuário no menu de conta */
.user-header.bg-scc { color: #fff; }

/* Formulários: foco na cor da marca */
.form-control:focus,
.custom-select:focus {
    border-color: var(--scc-primaria-clara);
    box-shadow: 0 0 0 .2rem rgba(14, 115, 228, .15);
}
.custom-control-input:checked ~ .custom-control-label::before {
    border-color: var(--scc-primaria);
    background-color: var(--scc-primaria);
}
.page-item.active .page-link { background: var(--scc-primaria); border-color: var(--scc-primaria); }

.content-header h1 { font-size: 1.6rem; font-family: 'Poppins', 'Source Sans Pro', sans-serif; font-weight: 500; }

/* Selo de status */
.badge-status { font-size: .78rem; font-weight: 600; padding: .35em .6em; }
.badge-warning.badge-status { color: #5c4400; }

/* Amarelo do Bootstrap é claro demais para texto sobre fundo branco */
.text-warning { color: #b7791f !important; }

/* Tabelas */
.table td, .table th { vertical-align: middle; }
.js-linha-link { cursor: pointer; }
table.dataTable thead th { white-space: nowrap; }

/* Gráficos */
.chart-box { position: relative; height: 260px; }
.chart-box-sm { height: 230px; }

/* Descrição do contrato */
.descricao { white-space: normal; font-size: 1.02rem; }

/* Seletor de avatar */
.avatar-picker label { cursor: pointer; }
.avatar-picker img { border: 3px solid transparent; transition: border-color .15s, transform .15s; }
.avatar-picker input:checked + img { border-color: var(--scc-primaria); transform: scale(1.06); }
.avatar-picker input:focus-visible + img { outline: 2px dashed var(--scc-destaque); }

/* Campos desabilitados por "prazo indeterminado" */
.js-dep-indeterminado-grupo.desabilitado { opacity: .55; }

/* Página de erro */
.auth-page { background: linear-gradient(135deg, #eaf1fd 0%, #f7f9fc 60%); }
.error-page { margin-left: auto; margin-right: auto; }

/* ---------- 2FA (perfil) ---------- */
.twofa-selo {
    width: 56px; height: 56px; flex: 0 0 56px;
    border-radius: 14px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.6rem; color: #fff; margin-right: 1rem;
    background: var(--scc-gradiente);
}
.twofa-selo-ok { background: linear-gradient(90deg, #1e7e34, #28a745); }
.twofa-passos { padding-left: 1.2rem; }
.twofa-passos > li { margin-bottom: 1.2rem; }
.twofa-passos > li::marker { font-weight: 700; color: var(--scc-primaria); }
.twofa-qr {
    width: 196px; height: 196px;
    padding: 8px; background: #fff;
    border: 1px solid #dfe6f3; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
}
.twofa-qr svg { width: 100%; height: 100%; }
.twofa-chave {
    display: inline-block; font-size: 1.05rem; letter-spacing: .08em;
    padding: .35rem .6rem; background: var(--scc-fundo-claro); color: var(--scc-primaria-escura);
    border-radius: 6px; user-select: all;
}
.form-inline .campo-codigo-sm,
.campo-codigo-sm { width: 160px; max-width: 100%; font-size: 1.25rem; letter-spacing: .3em; text-align: center; font-weight: 600; }
.codigos-recuperacao {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem;
    max-width: 380px;
}
.codigos-recuperacao code {
    display: block; text-align: center; font-size: 1.1rem; padding: .45rem;
    background: var(--scc-fundo-claro); color: var(--scc-primaria-escura); border-radius: 6px; letter-spacing: .05em;
}

/* ==========================================================
   Tela de acesso (login, 2FA, recuperação de senha)
   ========================================================== */
body.acesso {
    position: relative; min-height: 100vh;
    font-family: 'Poppins', 'Source Sans Pro', sans-serif;
    color: #1d2433;
    background:
        radial-gradient(circle at 80% 15%, rgba(14, 115, 228, .16), transparent 42%),
        radial-gradient(circle at 10% 90%, rgba(3, 34, 143, .10), transparent 40%),
        linear-gradient(160deg, #f4f8ff 0%, #e6efff 100%);
    background-attachment: fixed;
}
.acesso-linhas {
    position: fixed; inset: 0; width: 100%; height: 100%;
    pointer-events: none; z-index: 0;
}
.acesso-grade {
    position: relative; z-index: 1;
    display: grid;
    grid-template-columns: 7fr minmax(420px, 5fr);
    min-height: 100vh;
}
.acesso-painel {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    min-width: 0;
    padding: 2rem clamp(1.25rem, 4vw, 4rem) 1.5rem;
}
.acesso-cartao {
    width: 100%; max-width: 440px;
    margin-bottom: 6vh; /* leve deslocamento para cima: fica mais equilibrado que o centro exato */
    background: #fff; border-radius: 18px;
    padding: 2.25rem 2.25rem 2rem;
    box-shadow: 0 24px 60px rgba(3, 34, 143, .12), 0 2px 6px rgba(3, 34, 143, .05);
}
.acesso-marca {
    display: inline-flex; align-items: center; gap: .6rem; margin-bottom: 1.75rem;
    color: var(--scc-primaria-escura); font-size: 1.05rem; text-decoration: none;
}
.acesso-marca:hover { color: var(--scc-primaria-escura); text-decoration: none; }
.acesso-marca strong { font-weight: 700; }
.acesso-marca-texto { display: flex; flex-direction: column; line-height: 1.15; }
.acesso-marca-texto strong { font-size: 1.2rem; letter-spacing: .02em; }
.acesso-marca-texto small { font-size: .8rem; color: #56617a; }
.acesso-conteudo { width: 100%; }

.acesso-titulo { font-size: 2.2rem; font-weight: 700; margin: 0 0 .4rem; letter-spacing: -.02em; }
.acesso-subtitulo { color: #6b7385; margin-bottom: 1.6rem; font-size: .95rem; line-height: 1.55; }
.acesso-icone {
    width: 52px; height: 52px; border-radius: 14px; margin-bottom: 1.2rem;
    display: flex; align-items: center; justify-content: center;
    background: var(--scc-gradiente); color: #fff; font-size: 1.35rem;
    box-shadow: 0 8px 20px rgba(3, 34, 143, .22);
}
.acesso-icone-erro { background: linear-gradient(90deg, #b21f2d, #dc3545); box-shadow: 0 8px 20px rgba(178, 31, 45, .2); }

.acesso .alert { font-family: 'Source Sans Pro', sans-serif; font-size: .92rem; }

.campo-acesso {
    position: relative; display: flex; align-items: center;
    background: #f1f3f7; border: 1px solid #e3e7ef; border-radius: 10px;
    margin-bottom: 1rem; transition: border-color .15s, box-shadow .15s, background .15s;
}
.campo-acesso:focus-within {
    background: #fff; border-color: var(--scc-primaria-clara);
    box-shadow: 0 0 0 4px rgba(14, 115, 228, .12);
}
.campo-acesso > i { width: 44px; text-align: center; color: #7b8499; font-size: .95rem; }
.campo-acesso:focus-within > i { color: var(--scc-primaria); }
.campo-acesso input {
    flex: 1; border: 0; background: transparent; outline: 0;
    height: 50px; padding: 0 .75rem 0 0; font-size: .95rem; color: #1d2433; min-width: 0;
}
.campo-acesso input::placeholder { color: #9aa2b3; }
.campo-olho {
    border: 0; background: transparent; color: #7b8499; width: 46px; height: 50px; cursor: pointer;
}
.campo-olho:hover, .campo-olho:focus { color: var(--scc-primaria); outline: 0; }

.campo-codigo {
    width: 100%; height: 64px; margin-bottom: 1rem;
    border: 1px solid #e3e7ef; border-radius: 12px; background: #f1f3f7; outline: 0;
    text-align: center; font-size: 2rem; font-weight: 600; letter-spacing: .45em; color: var(--scc-primaria-escura);
    transition: border-color .15s, box-shadow .15s, background .15s;
}
.campo-codigo:focus { background: #fff; border-color: var(--scc-primaria-clara); box-shadow: 0 0 0 4px rgba(14, 115, 228, .12); }
.campo-codigo::placeholder { color: #c9cfdb; }

.acesso-linha {
    display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .5rem;
    margin: -.25rem 0 1.4rem; font-size: .86rem;
}
.acesso-linha .custom-control-label { color: #545d70; padding-top: 1px; }
.acesso-linha a { font-weight: 500; }

.btn-acesso {
    display: block; width: 100%; height: 52px; border-radius: 10px;
    font-weight: 600; font-size: 1rem; letter-spacing: .01em;
}

.acesso-ajuda {
    margin-top: 1.4rem; font-size: .86rem; color: #545d70;
    background: var(--scc-fundo-claro); border-radius: 10px; padding: .8rem 1rem;
}
.acesso-ajuda summary { cursor: pointer; font-weight: 500; color: var(--scc-primaria); }
.acesso-ajuda p { margin: .6rem 0 0; }

/* Lado da ilustração */
.acesso-arte {
    display: flex; align-items: center; justify-content: center; min-width: 0;
}
.acesso-arte-conteudo { text-align: center; padding: 3rem; max-width: 720px; margin-bottom: 6vh; }
.acesso-ilustracao { width: min(100%, 560px); height: auto; margin-bottom: 1.5rem; }
.acesso-arte h2 { font-size: 1.6rem; font-weight: 600; color: var(--scc-primaria-escura); line-height: 1.35; margin-bottom: .5rem; }
.acesso-arte p { color: #56617a; margin: 0; }

@media (max-width: 991.98px) {
    .acesso-grade { grid-template-columns: minmax(0, 1fr); }
    .acesso-arte { display: none; }
    .acesso-cartao { margin-bottom: 4vh; }
}
@media (max-width: 575.98px) {
    .content-header h1 { font-size: 1.35rem; }
    .content-header .text-sm-right .btn,
    .content-header .text-sm-right form { margin-bottom: .35rem; }
    .acesso-titulo { font-size: 1.8rem; }
    .acesso-painel { padding: 1.25rem 1rem; }
    .acesso-cartao { padding: 1.75rem 1.4rem 1.5rem; border-radius: 14px; }
}
