/*
 * Tema Isótopo — paleta "Céu e manteiga" (pastel), modo claro e escuro.
 * Todas as telas devem usar estas variáveis em vez de cores fixas.
 * O modo é definido em <html data-theme="light|dark"> (ver includes/header.php).
 */
:root,
html[data-theme="light"] {
    --t-bg: #F4F7FC;          /* fundo da página */
    --t-card: #FFFFFF;        /* cartões */
    --t-card-2: #F8FAFE;      /* cartão secundário / hover */
    --t-borda: #DFE7F5;
    --t-borda-forte: #C9D6EC;
    --t-tx: #1F2A3D;          /* texto principal */
    --t-tx-2: #4A5872;        /* texto de apoio */
    --t-mu: #6E7B93;          /* legendas */

    --t-acc: #5F8FE0;         /* destaque (azul céu) */
    --t-acc-bg: #D8E6FB;
    --t-acc-tx: #244F8C;
    --t-acc-forte: #4A79CC;   /* botão principal ao passar o mouse */
    --t-acc-on: #FFFFFF;      /* texto sobre o destaque */
    --t-lil-bg: #EDE3FB;     /* lilás: Prova Paulista */
    --t-lil-tx: #5B3E96;
    --t-lil: #A68BE0;

    --t-ok-bg: #D9F2E3;       /* situação: bom */
    --t-ok-tx: #1F6B43;
    --t-at-bg: #FFF2C2;       /* situação: atenção */
    --t-at-tx: #7A5A0E;
    --t-ri-bg: #FCDDE0;       /* situação: em risco */
    --t-ri-tx: #9A2D3B;
    --t-vazio: #EEF2F8;       /* sem nota */

    --t-sidebar: #FFFFFF;
    --t-sidebar-hover: #EEF3FC;
    --t-sombra: 0 1px 2px rgba(31, 42, 61, .04), 0 4px 16px rgba(31, 42, 61, .05);
    color-scheme: light;
}

html[data-theme="dark"] {
    --t-bg: #161C27;
    --t-card: #1F2736;
    --t-card-2: #252F42;
    --t-borda: #2E3A50;
    --t-borda-forte: #3D4B66;
    --t-tx: #EAF0FA;
    --t-tx-2: #BFCADF;
    --t-mu: #97A5BF;

    --t-acc: #8FB3F0;
    --t-acc-bg: #233B61;
    --t-acc-tx: #C3D8FA;
    --t-acc-forte: #A9C6F5;
    --t-acc-on: #13233F;
    --t-lil-bg: #382D52;
    --t-lil-tx: #DCCBFA;
    --t-lil: #B49BEA;

    --t-ok-bg: #1E4533;
    --t-ok-tx: #B7EBCF;
    --t-at-bg: #4A3F17;
    --t-at-tx: #FFE9A3;
    --t-ri-bg: #4C2229;
    --t-ri-tx: #F7C0C8;
    --t-vazio: #263044;

    --t-sidebar: #1B2230;
    --t-sidebar-hover: #263044;
    --t-sombra: 0 1px 2px rgba(0, 0, 0, .25), 0 4px 16px rgba(0, 0, 0, .25);
    color-scheme: dark;

    /* Variáveis próprias da tela de notas acompanham o tema */
    --bg-main: var(--t-bg);
    --surface: var(--t-card);
    --text-primary: var(--t-tx);
    --text-secondary: var(--t-tx-2);
    --text-muted: var(--t-mu);
    --border-color: var(--t-borda);
    --primary-light: var(--t-acc-bg);
}

/* ===== Base das telas internas ===== */
/* Fonte única do sistema (Inter) e números de largura fixa: notas e médias ficam alinhadas nas colunas */
:root { --bs-body-font-family: 'Inter', system-ui, sans-serif; --bs-font-sans-serif: 'Inter', system-ui, sans-serif; }
body { font-family: 'Inter', system-ui, sans-serif; font-variant-numeric: tabular-nums; }
body { background: var(--t-bg) !important; color: var(--t-tx); transition: background .2s, color .2s; }
.content { color: var(--t-tx); }
.content h1, .content h2, .content h3, .content h4, .content h5 { color: var(--t-tx); }
.content .card { background: var(--t-card); border-color: var(--t-borda); color: var(--t-tx); }
.content .text-muted { color: var(--t-mu) !important; }
html[data-theme="dark"] .content .table { --bs-table-bg: transparent; --bs-table-color: var(--t-tx); border-color: var(--t-borda); }
html[data-theme="dark"] .content .table-light { --bs-table-bg: var(--t-card-2); --bs-table-color: var(--t-tx); }
html[data-theme="dark"] .content [style*="background: #ffffff"],
html[data-theme="dark"] .content [style*="background:#fff"],
html[data-theme="dark"] .content [style*="background: white"] { background: var(--t-card) !important; color: var(--t-tx) !important; border-color: var(--t-borda) !important; }
.slide, .slideFull { background: var(--t-card); color: var(--t-tx); }

/* ===== Componentes do tema ===== */
.t-card { background: var(--t-card); border: 1px solid var(--t-borda); border-radius: 16px; box-shadow: var(--t-sombra); }
.t-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.t-ok { background: var(--t-ok-bg); color: var(--t-ok-tx); }
.t-at { background: var(--t-at-bg); color: var(--t-at-tx); }
.t-ri { background: var(--t-ri-bg); color: var(--t-ri-tx); }
.t-vz { background: var(--t-vazio); color: var(--t-mu); }
/* Cores clássicas das notas (vermelho, amarelo/laranja e verde): gráficos nos dois temas e chips no modo escuro */
:root { --t-nota-ok: #9FDDB4; --t-nota-at: #F7D58C; --t-nota-ri: #F2A5AD; --t-nota-ri-forte: #E07F8A; }
html[data-theme="dark"] .t-ok { background: var(--t-nota-ok); color: #12381F; }
html[data-theme="dark"] .t-at { background: var(--t-nota-at); color: #3D2A00; }
html[data-theme="dark"] .t-ri { background: var(--t-nota-ri); color: #4A1219; }
.t-acc { background: var(--t-acc-bg); color: var(--t-acc-tx); }
.t-lil { background: var(--t-lil-bg); color: var(--t-lil-tx); }

/* Botão de tema */
.btn-tema { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 9px; border-radius: 12px;
    border: 1px solid var(--t-borda); background: var(--t-card-2); color: var(--t-tx-2); font-size: 13px; font-weight: 600; cursor: pointer; }
.btn-tema:hover { border-color: var(--t-acc); color: var(--t-acc-tx); }

/* ===== Cabeçalho de página e blocos ===== */
.t-head { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; flex-wrap: wrap; }
.t-head-ic { width: 46px; height: 46px; border-radius: 14px; display: flex; align-items: center; justify-content: center;
    font-size: 21px; background: var(--t-acc-bg); color: var(--t-acc-tx); flex-shrink: 0; }
.t-head-ic.lil { background: var(--t-lil-bg); color: var(--t-lil-tx); }
.t-head-ic.ok { background: var(--t-ok-bg); color: var(--t-ok-tx); }
.t-head-ic.at { background: var(--t-at-bg); color: var(--t-at-tx); }
.t-head-tx { flex: 1; min-width: 200px; }
.t-head h1 { font-size: 24px; font-weight: 800; letter-spacing: -.5px; margin: 0; color: var(--t-tx); line-height: 1.2; }
.t-head p { margin: 3px 0 0; color: var(--t-mu); font-size: 13.5px; }
.t-head-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.t-bloco { background: var(--t-card); border: 1px solid var(--t-borda); border-radius: 16px; box-shadow: var(--t-sombra); padding: 20px; }
.t-bloco + .t-bloco { margin-top: 16px; }
.t-bloco-tit { font-size: 15px; font-weight: 700; margin: 0 0 14px; color: var(--t-tx); display: flex; align-items: center; gap: 8px; }
.t-bloco-tit i { color: var(--t-acc); }
.t-bloco-tit .t-cont { margin-left: auto; font-size: 12px; font-weight: 600; color: var(--t-mu); }
.t-label { font-size: 12.5px; font-weight: 600; color: var(--t-tx-2); margin-bottom: 5px; display: block; }
.t-ajuda { font-size: 12.5px; color: var(--t-mu); }
.t-vazio-msg { text-align: center; padding: 34px 12px; color: var(--t-mu); font-size: 14px; }
.t-vazio-msg i { display: block; font-size: 34px; color: var(--t-acc); margin-bottom: 6px; }
.t-aviso { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; font-size: 13.5px; line-height: 1.5; }
.t-aviso > i { font-size: 18px; line-height: 1.2; }
.t-lista { list-style: none; margin: 0; padding: 0; }
.t-lista li { display: flex; align-items: center; gap: 10px; padding: 11px 4px; border-bottom: 1px solid var(--t-borda); }
.t-lista li:last-child { border-bottom: 0; }
.t-lista .t-lista-tx { flex: 1; min-width: 0; }
.t-btn-ic { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px;
    border: 1px solid var(--t-borda); background: var(--t-card-2); color: var(--t-tx-2); cursor: pointer; flex-shrink: 0; }
.t-btn-ic:hover { border-color: var(--t-acc); color: var(--t-acc-tx); }
.t-btn-ic.perigo:hover { border-color: var(--t-ri-tx); color: var(--t-ri-tx); background: var(--t-ri-bg); }

/* ===== Bootstrap acompanhando o tema nas telas internas ===== */
.content .form-control, .content .form-select { border-radius: 10px; border-color: var(--t-borda-forte); background-color: var(--t-card); color: var(--t-tx); min-height: 42px; }
.content .form-control-sm { min-height: 34px; }
.content .form-control::placeholder { color: var(--t-mu); }
.content .form-control:focus, .content .form-select:focus { border-color: var(--t-acc); box-shadow: 0 0 0 3px var(--t-acc-bg); }
.content .form-control:disabled, .content .form-control[readonly] { background-color: var(--t-card-2); color: var(--t-tx-2); }
.content select.form-control { appearance: auto; }
.content .input-group-text { background: var(--t-card-2); border-color: var(--t-borda-forte); color: var(--t-tx-2); }
.content .btn { border-radius: 10px; font-weight: 600; }
.content .btn-primary { --bs-btn-bg: var(--t-acc); --bs-btn-border-color: var(--t-acc); --bs-btn-color: var(--t-acc-on);
    --bs-btn-hover-bg: var(--t-acc-forte); --bs-btn-hover-border-color: var(--t-acc-forte); --bs-btn-hover-color: var(--t-acc-on);
    --bs-btn-active-bg: var(--t-acc-forte); --bs-btn-active-border-color: var(--t-acc-forte); --bs-btn-active-color: var(--t-acc-on); }
.content .btn-outline-primary { --bs-btn-color: var(--t-acc-tx); --bs-btn-border-color: var(--t-acc); --bs-btn-hover-bg: var(--t-acc-bg);
    --bs-btn-hover-color: var(--t-acc-tx); --bs-btn-hover-border-color: var(--t-acc); --bs-btn-active-bg: var(--t-acc-bg); --bs-btn-active-color: var(--t-acc-tx); }
.content .btn-suave { background: var(--t-card-2); border: 1px solid var(--t-borda); color: var(--t-tx-2); }
.content .btn-suave:hover { border-color: var(--t-acc); color: var(--t-acc-tx); }
.content .card { border-radius: 16px; box-shadow: var(--t-sombra) !important; }
.content .table { --bs-table-bg: transparent; --bs-table-color: var(--t-tx); --bs-table-border-color: var(--t-borda);
    --bs-table-hover-bg: var(--t-card-2); --bs-table-hover-color: var(--t-tx); --bs-table-striped-bg: var(--t-card-2); --bs-table-striped-color: var(--t-tx); }
.content .table > thead th { font-size: 11.5px; text-transform: uppercase; letter-spacing: .5px; color: var(--t-mu); font-weight: 700; white-space: nowrap; }
.content .table-light { --bs-table-bg: var(--t-card-2); --bs-table-color: var(--t-mu); }
.content .bg-light { background-color: var(--t-card-2) !important; }
.content .bg-white { background-color: var(--t-card) !important; }
.content .text-dark { color: var(--t-tx) !important; }
.t-tabela-rolagem { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.slider-lateral, .slide { background: var(--t-card) !important; color: var(--t-tx); }
.btn-fechar-slider { background: var(--t-card-2) !important; color: var(--t-tx-2) !important; }

.t-toast { position: fixed; right: 20px; bottom: calc(20px + var(--t-nav-h, 0px) + env(safe-area-inset-bottom)); z-index: 10000; max-width: calc(100vw - 40px);
    background: #1F6B43; color: #fff; padding: 12px 18px; border-radius: 12px; font-size: 14px; font-weight: 600;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .18); opacity: 0; transform: translateY(8px); transition: .25s; }
.t-toast.visivel { opacity: 1; transform: none; }
.t-toast.erro { background: #9A2D3B; }

/* ===== Estrutura no celular e tablet ===== */
.t-topbar, .t-bottomnav, .t-menu-fundo { display: none; }
@media (max-width: 991.98px) {
    :root { --t-top-h: 58px; }
    .t-shell { display: block !important; }
    .t-topbar { display: flex; align-items: center; gap: 10px; position: sticky; top: 0; z-index: 1030;
        height: calc(var(--t-top-h) + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 12px 0;
        background: var(--t-sidebar); border-bottom: 1px solid var(--t-borda); }
    .t-topbar-marca { font-weight: 800; font-size: 18px; letter-spacing: -.5px; color: var(--t-tx); text-decoration: none; }
    .t-topbar-ctx { flex: 1; min-width: 0; text-align: right; font-size: 11.5px; color: var(--t-mu); line-height: 1.25; }
    .t-topbar-ctx b { display: block; color: var(--t-tx-2); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .t-topbar .t-btn-ic { width: 40px; height: 40px; font-size: 20px; }
    .sidebar-tema { position: fixed !important; top: 0; left: 0; bottom: 0; height: 100dvh; min-height: 0 !important;
        width: min(300px, 86vw) !important; overflow-y: auto; z-index: 1050 !important; transform: translateX(-102%);
        transition: transform .25s ease; padding-top: calc(1.5rem + env(safe-area-inset-top)) !important; }
    body.menu-aberto .sidebar-tema { transform: none; box-shadow: 0 0 40px rgba(0, 0, 0, .25); }
    .t-menu-fundo { position: fixed; inset: 0; background: rgba(15, 23, 42, .4); z-index: 1040; }
    body.menu-aberto .t-menu-fundo { display: block; }
    body.menu-aberto { overflow: hidden; }
    /* Submenus abertos dentro da gaveta (sem depender de passar o mouse) */
    .sidebar-tema .sidebar-dropdown-floating > button { display: none; }
    .sidebar-tema .dropdown-floating-container { display: block !important; position: static; padding: 0; min-width: 0; }
    .sidebar-tema .dropdown-floating-content { background: transparent; box-shadow: none; border: 0; padding: 0; }
    .sidebar-tema .dropdown-floating-title { border: 0; margin: 8px 0 2px; padding: 4px 14px; }
    .sidebar-tema .dropdown-floating-content a { font-size: 14px; padding: 10px 14px; }
    .sidebar-tema .dropdown-divider-custom { display: none; }
    .content { padding: 18px 16px 28px !important; overflow-x: clip; }
    .t-head h1 { font-size: 21px; }
    .t-head-ic { width: 40px; height: 40px; font-size: 18px; }
    .slider-lateral, .slide { width: 100% !important; max-width: 100% !important; padding: 22px 18px calc(22px + env(safe-area-inset-bottom)) !important; z-index: 1060 !important; }
    .slider-lateral:not(.active), .slide:not(.active) { right: -110% !important; }
    .slider-backdrop, .overlay { z-index: 1055 !important; }
}
@media (max-width: 767.98px) {
    :root { --t-nav-h: 64px; }
    .t-bottomnav { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1035;
        height: calc(var(--t-nav-h) + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom);
        background: var(--t-sidebar); border-top: 1px solid var(--t-borda); box-shadow: 0 -4px 16px rgba(31, 42, 61, .06); }
    .t-bottomnav a, .t-bottomnav button { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
        background: none; border: 0; color: var(--t-mu); font-size: 10.5px; font-weight: 600; text-decoration: none; }
    .t-bottomnav i { font-size: 20px; line-height: 1; padding: 3px 14px; border-radius: 999px; }
    .t-bottomnav .ativo { color: var(--t-acc-tx); }
    .t-bottomnav .ativo i { background: var(--t-acc-bg); }
    .content { padding-bottom: calc(var(--t-nav-h) + 28px + env(safe-area-inset-bottom)) !important; }
    /* Evita o zoom automático do iPhone ao tocar em campos */
    .content input.form-control, .content select, .content textarea, .slider-lateral input, .slider-lateral select { font-size: 16px !important; }
    .t-bloco { padding: 16px; border-radius: 14px; }
    .t-esconde-cel { display: none !important; }
}

/* Impressão: sempre clara */
@media print {
    html, html[data-theme="dark"] {
        --t-bg: #FFFFFF; --t-card: #FFFFFF; --t-borda: #CBD5E1; --t-tx: #0F172A; --t-tx-2: #334155; --t-mu: #64748B;
        --t-ok-bg: #D9F2E3; --t-ok-tx: #1F6B43; --t-at-bg: #FFF2C2; --t-at-tx: #7A5A0E; --t-ri-bg: #FCDDE0; --t-ri-tx: #9A2D3B;
        color-scheme: light;
    }
}