/* =====================================================
   IDENTIDADE VISUAL - Verifica Diário
   Carregado por último em todas as telas.
   Altere as variáveis abaixo para ajustar o visual inteiro.
===================================================== */

:root {
    --cor-fundo: #F4F7FB;
    --cor-superficie: #FFFFFF;
    --cor-suave: #e3eaf3;
    --cor-suave-2: #eef2f7;
    --cor-borda: #dde3ec;
    --cor-primaria: #174EA6;
    --cor-primaria-rgb: 23, 78, 166;
    --cor-destaque: #0E9F8C;
    --cor-primaria-escura: #172B4D;
    --cor-texto: #172B4D;
    --cor-texto-suave: #66738a;
    --cor-sucesso: #3f7d5c;
    --cor-sucesso-fundo: #e5f1ea;
    --cor-alerta: #8a6a2b;
    --cor-alerta-fundo: #f6efdf;
    --cor-erro: #a94848;
    --cor-erro-fundo: #f6e6e6;

    --raio-sm: 8px;
    --raio: 12px;
    --raio-lg: 16px;

    --sombra: 0 1px 2px rgba(46, 58, 77, 0.04), 0 4px 16px rgba(46, 58, 77, 0.05);
    --sombra-foco: 0 0 0 3px rgba(var(--cor-primaria-rgb), 0.18);

    --fonte: "IBM Plex Sans", "Segoe UI", Arial, sans-serif;
}

/* ---------- Base ---------- */

html, body {
    font-family: var(--fonte) !important;
    color: var(--cor-texto);
    -webkit-font-smoothing: antialiased;
}

body {
    background: var(--cor-fundo) !important;
}

button, input, select, textarea {
    font-family: inherit;
}

h1, h2, h3, h4 {
    color: var(--cor-texto);
    letter-spacing: -0.01em;
}

a { color: var(--cor-primaria); }

::selection { background: var(--cor-suave); }

/* ---------- Login e cadastro ---------- */

.login-page {
    background: var(--cor-fundo) !important;
}

.login-card {
    border: 1px solid var(--cor-borda) !important;
    border-radius: var(--raio-lg) !important;
    box-shadow: var(--sombra) !important;
}

.logo-icon,
.logo-circle {
    background: var(--cor-primaria) !important;
    color: var(--cor-superficie) !important;
    box-shadow: none !important;
    border-radius: var(--raio) !important;
}

.auth-link { color: var(--cor-primaria) !important; }

/* Marca: mesmas áreas do layout, com proporção original dos SVGs. */
.logo-icon.brand-icon {
    background: transparent !important;
}

.brand-icon img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.sidebar .brand-area {
    min-width: 0;
    gap: 0;
}

.brand-mark {
    display: flex;
    align-items: center;
    min-height: 42px;
    width: 100%;
    max-width: 100%;
}

.brand-logo {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

@media (max-width: 700px) {
    .sidebar .brand-area { padding-inline: 0; }
    .sidebar .brand-mark { justify-content: center; }
    .sidebar .brand-logo { width: 42px; height: 42px; }
}

/* ---------- Campos ---------- */

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
select,
textarea {
    border: 1px solid var(--cor-borda) !important;
    border-radius: var(--raio-sm) !important;
    background-color: var(--cor-superficie);
    color: var(--cor-texto);
    transition: border-color .15s ease, box-shadow .15s ease;
}

input:focus,
select:focus,
textarea:focus {
    outline: none !important;
    border-color: var(--cor-primaria) !important;
    box-shadow: var(--sombra-foco) !important;
}

label { color: var(--cor-texto); }

/* ---------- Botões: padrão único ---------- */

/* Primário */
.btn-login,
.primary-button,
.quick-search-button,
.btn-adicionar,
.btn-salvar-servidor,
.btn-pesquisar-hoje {
    background: var(--cor-primaria) !important;
    color: var(--cor-superficie) !important;
    border: 1px solid var(--cor-primaria) !important;
    border-radius: var(--raio-sm) !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    transition: background .15s ease, border-color .15s ease;
}

.btn-login:hover,
.primary-button:hover,
.quick-search-button:hover,
.btn-adicionar:hover,
.btn-salvar-servidor:hover {
    background: var(--cor-primaria-escura) !important;
    border-color: var(--cor-primaria-escura) !important;
}

/* Secundário */
.btn-google,
.secondary-button,
.btn-importar,
.btn-pesquisar,
.btn-cancelar,
.school-cancel-button,
.btn-editar {
    background: var(--cor-superficie) !important;
    color: var(--cor-texto) !important;
    border: 1px solid var(--cor-borda) !important;
    border-radius: var(--raio-sm) !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    transition: background .15s ease, border-color .15s ease;
}

.btn-google:hover,
.secondary-button:hover,
.btn-importar:hover,
.btn-pesquisar:hover,
.btn-cancelar:hover,
.school-cancel-button:hover,
.btn-editar:hover {
    background: var(--cor-suave-2) !important;
    border-color: #c9d3e1 !important;
}

/* Perigo */
.btn-excluir {
    background: var(--cor-superficie) !important;
    color: var(--cor-erro) !important;
    border: 1px solid #e6c9c9 !important;
    border-radius: var(--raio-sm) !important;
}

.btn-excluir:hover { background: var(--cor-erro-fundo) !important; }

button:focus-visible,
a:focus-visible {
    outline: none;
    box-shadow: var(--sombra-foco) !important;
}

button:disabled { opacity: .55; cursor: not-allowed; }

/* ---------- Menu lateral ---------- */

.sidebar {
    background: var(--cor-superficie) !important;
    border-right: 1px solid var(--cor-borda) !important;
}

.sidebar .logo-area h2 { color: var(--cor-texto) !important; }
.sidebar .logo-area span { color: var(--cor-texto-suave) !important; }

.menu-item {
    border-radius: var(--raio-sm) !important;
    color: var(--cor-texto-suave) !important;
    font-weight: 500 !important;
    transition: background .15s ease, color .15s ease;
}

.menu-item:hover {
    background: var(--cor-suave-2) !important;
    color: var(--cor-texto) !important;
}

.menu-item.active {
    background: var(--cor-suave) !important;
    color: var(--cor-primaria) !important;
    font-weight: 600 !important;
}

.menu-icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    font-size: 0 !important;
}

.menu-icon svg,
.icone svg {
    width: 18px;
    height: 18px;
}

.logout-button:hover {
    background: var(--cor-erro-fundo) !important;
    color: var(--cor-erro) !important;
}

/* ---------- Área principal ---------- */

.main-content { background: var(--cor-fundo) !important; }

.topbar h1 { color: var(--cor-texto) !important; font-weight: 600 !important; }
.topbar p { color: var(--cor-texto-suave) !important; }

.avatar,
.user-avatar {
    background: var(--cor-suave) !important;
    color: var(--cor-primaria-escura) !important;
}

/* Destaque do painel: suave em vez de azul forte */
.welcome-card {
    background: var(--cor-superficie) !important;
    color: var(--cor-texto) !important;
    border: 1px solid var(--cor-borda) !important;
    border-left: 4px solid var(--cor-destaque) !important;
    border-radius: var(--raio) !important;
    box-shadow: var(--sombra) !important;
}

.welcome-card * { color: var(--cor-texto) !important; }
.welcome-card p { color: var(--cor-texto-suave) !important; }
.welcome-card::before,
.welcome-card::after { display: none !important; }

/* Cartões: todos com o mesmo canto, borda e sombra */
.dashboard-card,
.quick-access-card,
.settings-card,
.school-summary-card,
.school-modal-card,
.verification-card,
.edicoes-card,
.quick-search,
.modal-content {
    background: var(--cor-superficie) !important;
    border: 1px solid var(--cor-borda) !important;
    border-radius: var(--raio) !important;
    box-shadow: var(--sombra) !important;
}

/* Ícones em caixinha dos cartões */
[class*="-icon"]:not(.menu-icon):not(.logo-icon) {
    background-color: var(--cor-suave) !important;
    color: var(--cor-primaria) !important;
    border-radius: var(--raio-sm) !important;
}

/* Etiquetas de status */
[class*="badge"],
[class*="status-pill"] {
    border-radius: 999px !important;
}

/* Tabelas */
table { border-collapse: separate; border-spacing: 0; }
th {
    background: var(--cor-suave-2) !important;
    color: var(--cor-texto-suave) !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}
td { border-color: var(--cor-borda) !important; }
tbody tr:hover td { background: #f9fafc; }

/* Janelas (modais) */
.modal-overlay,
.modal-backdrop {
    background: rgba(46, 58, 77, 0.35) !important;
    backdrop-filter: blur(2px);
}

.btn-fechar-modal {
    border-radius: var(--raio-sm) !important;
    color: var(--cor-texto-suave) !important;
}

.btn-fechar-modal:hover { background: var(--cor-suave-2) !important; }

/* Área de envio de PDF */
[class*="upload"],
[class*="dropzone"] {
    border-radius: var(--raio) !important;
    border-color: #c9d3e1 !important;
}

/* Rodapé */
.footer, footer { color: var(--cor-texto-suave) !important; }

/* ---------- Ajustes finos ---------- */

/* Ícones SVG dentro de caixinhas: tamanho padrão */
[class*="-icon"] > svg,
[class*="icon"] > svg {
    width: 22px !important;
    height: 22px !important;
}

.logo-circle > svg,
.logo-icon > svg {
    width: 60% !important;
    height: 60% !important;
}

.menu-icon > svg {
    width: 18px !important;
    height: 18px !important;
}