/* =====================================================================
   SOT Propriedade Intelectual — folha de estilo base

   Paleta: AZUL SÓLIDO + DOURADO.
   O azul é o mesmo do protótipo do dashboard (docs/prototipo-dashboard.html,
   --brand: #1A4F8C), para o sistema sair igual ao que o time já viu.
   ===================================================================== */

:root {
    --azul: #1A4F8C;
    --azul-claro: #2C6CB4;
    --azul-escuro: #123C6B;
    --dourado: #A6813F;
    --dourado-claro: #C99F55;
    --grafite: #33383D;
    --grafite-claro: #5A6169;

    --fundo: #EEF2F7;
    --superficie: #FFFFFF;
    --borda: #E2E9F1;
    --texto: #182533;
    --texto-suave: #63728A;

    --ok: #1F7A4D;
    --atencao: #B7791F;
    --perigo: #A32B2B;

    --raio: 8px;
    --sombra: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
}

* { box-sizing: border-box; }

html, body {
    margin: 0;
    font-family: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
    font-size: 15px;
    color: var(--texto);
    background: var(--fundo);
}

h1, h2, h3 { margin: 0 0 .5rem; font-weight: 600; letter-spacing: -.01em; }
a { color: var(--azul); }

/* ---------- estrutura ---------- */
.topo {
    display: flex; align-items: center; justify-content: space-between;
    gap: 1rem; padding: 0 1.5rem; height: 56px;
    background: var(--azul); color: #fff;
    border-bottom: 3px solid var(--dourado);
}
.topo .marca { display: flex; align-items: baseline; gap: .6rem; font-weight: 600; }
/* o dourado marca a identidade sobre o azul, sem competir com ele */
.topo .marca .sigla { font-size: 1.15rem; letter-spacing: .02em; color: var(--dourado-claro); }
.topo .marca .desc  { font-size: .78rem; opacity: .9; font-weight: 400; }
.topo .usuario { display: flex; align-items: center; gap: .9rem; font-size: .88rem; }

.conteudo { padding: 1.5rem; max-width: 1180px; margin: 0 auto; }

.cabecalho-pagina { margin-bottom: 1.25rem; }
.cabecalho-pagina p { margin: .15rem 0 0; color: var(--texto-suave); font-size: .9rem; }

/* ---------- cards de módulo ---------- */
.grade-cards {
    display: grid; gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(255px, 1fr));
}
.card-modulo {
    background: var(--superficie); border: 1px solid var(--borda);
    border-radius: var(--raio); box-shadow: var(--sombra);
    padding: 1.1rem 1.2rem; text-decoration: none; color: inherit;
    border-left: 4px solid var(--azul);
    transition: box-shadow .15s ease, transform .15s ease;
    display: block;
}
.card-modulo:hover {
    box-shadow: 0 4px 12px rgba(20, 40, 70, .14);
    border-left-color: var(--dourado);
    transform: translateY(-1px);
}
.card-modulo.bloqueado {
    opacity: .55; border-left-color: var(--borda); cursor: not-allowed;
}
.card-modulo h3 { font-size: .95rem; color: var(--grafite); margin-bottom: .6rem; }
.card-modulo .numero {
    font-size: 1.9rem; font-weight: 600; color: var(--azul); line-height: 1.1;
}
.card-modulo .rotulo { font-size: .8rem; color: var(--texto-suave); }
.card-modulo .secundario {
    margin-top: .65rem; padding-top: .55rem; border-top: 1px dashed var(--borda);
    font-size: .82rem; color: var(--texto-suave);
}
.card-modulo .secundario b { color: var(--dourado); font-weight: 600; }

/* ---------- faixa de prazos ---------- */
.faixa-prazos {
    display: flex; gap: 1.75rem; flex-wrap: wrap;
    background: var(--superficie); border: 1px solid var(--borda);
    border-radius: var(--raio); padding: .9rem 1.2rem; margin-bottom: 1.25rem;
    box-shadow: var(--sombra);
}
.faixa-prazos .item { display: flex; align-items: baseline; gap: .45rem; }
.faixa-prazos .valor { font-size: 1.3rem; font-weight: 600; }
.faixa-prazos .item.hoje .valor     { color: var(--atencao); }
.faixa-prazos .item.vencidos .valor { color: var(--perigo); }
.faixa-prazos .item.semana .valor   { color: var(--grafite); }
.faixa-prazos .rotulo { font-size: .85rem; color: var(--texto-suave); }

/* ---------- login ---------- */
.tela-login {
    min-height: 100vh; display: grid; place-items: center;
    background: linear-gradient(160deg, var(--azul-escuro), var(--azul) 55%, var(--grafite));
    padding: 1.5rem;
}
/* Agrupa logotipo + cartão para que os dois fiquem centrados juntos, e o
   logotipo apareça no topo do conjunto. */
.entrada { width: 100%; max-width: 380px; }

.logo-frg {
    display: block; width: 264px; max-width: 82%; height: auto;
    margin: 0 auto 1.75rem;
    /* Uma sombra tênue descola o metal do gradiente atrás: sem ela, as partes
       mais claras do "FRG" encostam no azul e o contorno some. */
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .45));
}

.caixa-login {
    width: 100%; max-width: 380px; background: var(--superficie);
    border-radius: 12px; padding: 2rem 1.75rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
}
.caixa-login .marca {
    text-align: center; margin-bottom: 1.5rem;
    padding-bottom: 1rem; border-bottom: 2px solid var(--dourado);
}
.caixa-login .marca .sigla {
    font-size: 1.5rem; font-weight: 700; color: var(--azul); letter-spacing: .02em;
}
.caixa-login .marca .desc { font-size: .8rem; color: var(--texto-suave); margin-top: .2rem; }

.campo { margin-bottom: 1rem; }
.campo label {
    display: block; font-size: .82rem; font-weight: 600;
    color: var(--grafite); margin-bottom: .35rem;
}
.campo input {
    width: 100%; padding: .6rem .7rem; font-size: .95rem;
    border: 1px solid var(--borda); border-radius: 6px; background: #fff;
}
.campo input:focus {
    outline: none; border-color: var(--azul);
    box-shadow: 0 0 0 3px rgba(26, 79, 140, .15);
}

.botao {
    display: inline-block; width: 100%; padding: .65rem 1rem;
    font-size: .95rem; font-weight: 600; color: #fff; cursor: pointer;
    background: var(--azul); border: none; border-radius: 6px;
}
.botao:hover { background: var(--azul-claro); }
.botao-link {
    background: none; border: 1px solid rgba(255, 255, 255, .4); color: #fff;
    padding: .3rem .7rem; font-size: .82rem; border-radius: 5px;
    cursor: pointer; width: auto;
}
.botao-link:hover { background: rgba(255, 255, 255, .12); }

/* ---------- avisos ---------- */
.aviso {
    padding: .7rem .85rem; border-radius: 6px; font-size: .87rem;
    margin-bottom: 1rem; border: 1px solid;
}
.aviso.erro   { background: #FDF2F2; border-color: #F1C6C6; color: var(--perigo); }
.aviso.info   { background: #F2F6FD; border-color: #C6D6F1; color: #1F4E8C; }
.aviso.neutro { background: #F7F8F9; border-color: var(--borda); color: var(--texto-suave); }

.rodape-nota {
    margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--borda);
    font-size: .8rem; color: var(--texto-suave);
}

/* erro do Blazor (mantido do template, repintado) */
#blazor-error-ui {
    background: #FDF2F2; color: var(--perigo); bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, .2); display: none;
    left: 0; padding: .6rem 1.25rem .7rem 1.25rem; position: fixed; width: 100%; z-index: 1000;
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: .75rem; top: .5rem; }

/* ---------- busca e tabelas (carteira) ---------- */
.barra-busca { display:flex; gap:.6rem; flex-wrap:wrap; margin-bottom:1rem; }
.campo-busca {
    flex:1; min-width:260px; padding:.55rem .75rem; font-size:.95rem;
    border:1px solid var(--borda); border-radius:6px; background:#fff;
}
.campo-busca:focus, .campo-select:focus {
    outline:none; border-color:var(--azul); box-shadow:0 0 0 3px rgba(26,79,140,.15);
}
.campo-select {
    padding:.55rem .6rem; font-size:.92rem; background:#fff;
    border:1px solid var(--borda); border-radius:6px;
}
.botao-secundario {
    padding:.5rem .9rem; font-size:.88rem; font-weight:600; cursor:pointer;
    background:#fff; color:var(--azul); border:1px solid var(--borda); border-radius:6px;
}
.botao-secundario:hover:not(:disabled) { border-color:var(--azul); background:#F5F8FC; }
.botao-secundario:disabled { opacity:.45; cursor:default; }

.tabela {
    width:100%; border-collapse:collapse; background:var(--superficie);
    border:1px solid var(--borda); border-radius:var(--raio); overflow:hidden;
    box-shadow:var(--sombra); font-size:.9rem;
}
.tabela th {
    text-align:left; padding:.6rem .8rem; background:#F7F9FC; font-size:.78rem;
    text-transform:uppercase; letter-spacing:.04em; color:var(--texto-suave);
    border-bottom:1px solid var(--borda); font-weight:600;
}
.tabela td { padding:.6rem .8rem; border-bottom:1px solid var(--borda); vertical-align:top; }
.tabela tbody tr:last-child td { border-bottom:none; }
.tabela.compacta td, .tabela.compacta th { padding:.4rem .6rem; font-size:.85rem; }
.linha-clicavel { cursor:pointer; }
.linha-clicavel:hover { background:#F5F8FC; }
.mono { font-family:Consolas,"Courier New",monospace; font-size:.86rem; }
.suave { color:var(--texto-suave); }
.menor { font-size:.83rem; }
.selo {
    display:inline-block; margin-left:.4rem; padding:.05rem .35rem; font-size:.68rem;
    color:var(--dourado); border:1px solid var(--dourado); border-radius:3px; vertical-align:middle;
}
.paginacao { display:flex; align-items:center; gap:1rem; margin-top:1rem; font-size:.88rem; color:var(--texto-suave); }

/* ---------- ficha ---------- */
.voltar { display:inline-block; font-size:.85rem; margin-bottom:.4rem; text-decoration:none; }
.voltar:hover { text-decoration:underline; }
.ficha { display:grid; grid-template-columns:1fr 340px; gap:1.25rem; align-items:start; }
@media (max-width:900px) { .ficha { grid-template-columns:1fr; } }
.ficha-principal { display:flex; flex-direction:column; gap:1.25rem; }
.ficha-lateral   { display:flex; flex-direction:column; gap:1.25rem; }
.painel {
    background:var(--superficie); border:1px solid var(--borda);
    border-radius:var(--raio); padding:1.1rem 1.2rem; box-shadow:var(--sombra);
}
.painel h2 { font-size:.9rem; color:var(--grafite); text-transform:uppercase;
             letter-spacing:.04em; margin-bottom:.8rem; }
.painel h3 { font-size:.85rem; color:var(--grafite); margin:1rem 0 .3rem; }
.campos { display:grid; grid-template-columns:auto 1fr; gap:.35rem 1rem; margin:0; font-size:.9rem; }
.campos dt { color:var(--texto-suave); }
.campos dd { margin:0; }
.texto-longo { font-size:.88rem; line-height:1.55; margin:.2rem 0 0; }
.lista-simples { margin:0; padding-left:0; list-style:none; font-size:.9rem; }
.lista-simples li { padding:.25rem 0; border-bottom:1px solid var(--borda); }
.lista-simples li:last-child { border-bottom:none; }
.etiqueta {
    display:inline-block; min-width:105px; font-size:.72rem; text-transform:uppercase;
    letter-spacing:.03em; color:var(--texto-suave);
}

/* ---------- colidência ---------- */
.resultado-colidencia { margin-top:.9rem; }
.lista-colidencia { list-style:none; margin:.5rem 0 0; padding:0; max-height:340px; overflow-y:auto; }
.lista-colidencia li { padding:.5rem 0; border-bottom:1px solid var(--borda); }
.lista-colidencia li:last-child { border-bottom:none; }
.topo-item { display:flex; justify-content:space-between; align-items:baseline; gap:.5rem; font-size:.9rem; }
.grau {
    font-size:.72rem; font-weight:700; padding:.1rem .4rem; border-radius:3px;
    text-transform:uppercase; letter-spacing:.03em;
}
.grau.alto  { background:#FBE9E9; color:var(--perigo); }
.grau.medio { background:#FBF1DC; color:var(--atencao); }
.grau.baixo { background:#EAF1EC; color:var(--ok); }
.separador { height:1px; background:var(--borda); margin:.9rem 0; }

.parecer { margin-top:1rem; border-top:2px solid var(--dourado); padding-top:.9rem; font-size:.88rem; }
.conclusao {
    display:inline-block; font-weight:700; font-size:.8rem; letter-spacing:.04em;
    padding:.25rem .6rem; border-radius:4px; margin-bottom:.6rem;
}
.conclusao.livre        { background:#EAF1EC; color:var(--ok); }
.conclusao.risco_baixo  { background:#EAF1EC; color:var(--ok); }
.conclusao.risco_medio  { background:#FBF1DC; color:var(--atencao); }
.conclusao.risco_alto   { background:#FBE9E9; color:var(--perigo); }
.risco { padding:.5rem 0; border-bottom:1px solid var(--borda); }
.rodape-parecer { margin-top:.8rem; font-style:italic; }

/* módulo cujo card ainda não tem tela: visível, mas não promete clique */
.card-modulo.em-breve { cursor: default; opacity: .82; }
.card-modulo.em-breve:hover { transform: none; border-left-color: var(--azul); box-shadow: var(--sombra); }

/* ---------- central de prazos ---------- */
.faixas { display:flex; gap:.6rem; flex-wrap:wrap; margin-bottom:1.1rem; }
.faixa {
    display:flex; flex-direction:column; align-items:flex-start; gap:.1rem;
    padding:.6rem .9rem; min-width:92px; cursor:pointer; text-align:left;
    background:var(--superficie); border:1px solid var(--borda);
    border-radius:var(--raio); box-shadow:var(--sombra);
    border-top:3px solid var(--borda);
}
.faixa:hover { border-color:var(--azul-claro); }
.faixa.ativa { border-color:var(--azul); box-shadow:0 0 0 2px rgba(26,79,140,.15); }
.faixa .numero { font-size:1.4rem; font-weight:600; line-height:1.1; }
.faixa .rotulo { font-size:.78rem; color:var(--texto-suave); text-transform:uppercase; letter-spacing:.03em; }
.faixa.perigo  { border-top-color:var(--perigo); }
.faixa.perigo  .numero { color:var(--perigo); }
.faixa.atencao { border-top-color:var(--atencao); }
.faixa.atencao .numero { color:var(--atencao); }
.faixa.ok      { border-top-color:var(--ok); }
.faixa.neutro  .numero { color:var(--grafite); }

.pilula {
    display:inline-block; padding:.1rem .45rem; border-radius:10px;
    font-size:.75rem; font-weight:600; white-space:nowrap;
}
.pilula.perigo  { background:#FBE9E9; color:var(--perigo); }
.pilula.atencao { background:#FBF1DC; color:var(--atencao); }
.pilula.ok      { background:#EAF1EC; color:var(--ok); }
.pilula.neutro  { background:#EEF2F7; color:var(--texto-suave); }

button.botao-secundario.menor { padding:.25rem .6rem; font-size:.8rem; }

/* ---------- caixa modal ---------- */
.cortina {
    position:fixed; inset:0; background:rgba(15,25,40,.45); z-index:900;
}
.caixa-modal {
    position:fixed; z-index:901; top:50%; left:50%; transform:translate(-50%,-50%);
    width:min(520px, calc(100vw - 2rem));
    background:var(--superficie); border-radius:12px; padding:1.5rem;
    box-shadow:0 16px 48px rgba(0,0,0,.3); border-top:4px solid var(--dourado);
}
.caixa-modal h2 { font-size:1.05rem; margin-bottom:.2rem; }
.acoes-modal { display:flex; gap:.6rem; justify-content:flex-end; margin-top:1.2rem; }
.acoes-modal .botao { width:auto; }

/* ---------- pop-up de alerta de prazo ---------- */
.cortina-alerta { position:fixed; inset:0; background:rgba(15,25,40,.55); z-index:1200; }
.alerta-prazo {
    position:fixed; z-index:1201; top:50%; left:50%; transform:translate(-50%,-50%);
    width:min(460px, calc(100vw - 2rem));
    background:var(--superficie); border-radius:12px; overflow:hidden;
    box-shadow:0 20px 56px rgba(0,0,0,.38);
}
.alerta-cabecalho {
    padding:.85rem 1.2rem; color:#fff; font-weight:700;
    display:flex; justify-content:space-between; align-items:center;
    font-size:.95rem; letter-spacing:.01em;
}
.alerta-cabecalho.critico { background:var(--perigo); }
.alerta-cabecalho.atencao { background:var(--atencao); }
.alerta-cabecalho.aviso   { background:var(--azul); }
.alerta-contador { font-size:.78rem; font-weight:500; opacity:.85; }

.alerta-corpo { padding:1.1rem 1.2rem; }
.alerta-descricao { margin:0 0 .8rem; font-size:1rem; font-weight:600; }
.alerta-corpo .campos { font-size:.88rem; }

.alerta-acoes {
    display:flex; gap:.5rem; flex-wrap:wrap; padding:0 1.2rem 1.2rem;
}
.alerta-acoes .botao { width:auto; flex:1; min-width:150px; }

/* o fixo ganha moldura vermelha: reforça que não é só mais um aviso */
.alerta-prazo.fixo { border:2px solid var(--perigo); }
