/* =====================================================================
   OKUTANGA — Folha de estilos do núcleo

   "Okutanga", em umbundu, significa contar e ler — os dois actos que
   fundam uma escola. Esta folha de estilos parte daí: a instituição
   feita sistema é, no fundo, um caderno pautado tornado digital —
   pautas, matrículas, boletins, tudo com o seu carimbo. A paleta vem
   da tinta e do selo, não de uma paleta de SaaS genérica; a tipografia
   junta um serifado com carácter a um grotesco discreto e denso o
   suficiente para tabelas cheias de números.
   ===================================================================== */

:root {
    /* Tinta — a cor de fundo da instituição, não um azul-marinho qualquer */
    --siga-ink-950: #131e17;
    --siga-ink-900: #1c2a20;
    --siga-ink-800: #24352a;
    --siga-ink-700: #2c4030;
    --siga-ink-100: #e8ece6;

    /* Selo e pauta — os dois acentos, tirados do carimbo e do dourado envelhecido */
    --siga-selo-600: #8f3226;
    --siga-selo-500: #a13a2e;
    --siga-pauta-600: #a3762f;
    --siga-pauta-500: #b9863a;
    --siga-pauta-400: #cc9c52;

    /* mantidos por compatibilidade com nomes antigos ainda referenciados nas views */
    --siga-navy-950: var(--siga-ink-950);
    --siga-navy-900: var(--siga-ink-900);
    --siga-navy-800: var(--siga-ink-700);
    --siga-navy-100: var(--siga-ink-100);
    --siga-gold-500: var(--siga-pauta-500);
    --siga-gold-400: var(--siga-pauta-400);

    --siga-bg: #eef0e9;
    --siga-surface: #fdfdfb;
    --siga-surface-sunken: #f4f5f0;
    --siga-text: #20241d;
    --siga-text-muted: #5c6357;
    --siga-border: #dde1d6;

    --siga-success: #3c6b46;
    --siga-danger: #a13a2e;
    --siga-warning: #96692a;
    --siga-info: #45607a;

    --siga-radius-sm: 6px;
    --siga-radius: 10px;
    --siga-radius-lg: 16px;
    --siga-shadow-sm: 0 1px 2px rgba(28, 42, 32, 0.06);
    --siga-shadow: 0 6px 20px rgba(28, 42, 32, 0.08);
    --siga-shadow-lg: 0 24px 60px rgba(19, 30, 23, 0.35);

    --siga-font-display: 'Fraunces', 'Georgia', serif;
    --siga-font-body: 'Work Sans', 'Segoe UI', sans-serif;
    --siga-font-mono: 'IBM Plex Mono', 'SFMono-Regular', monospace;

    /* Bootstrap 5 lê estas variáveis directamente — isto dá a toda a componente nativa
       (botões, alertas, badges text-bg-*, focus rings, links) a paleta da OKUTANGA sem
       precisar de tocar em nenhuma das centenas de vistas que já usam essas classes. */
    --bs-primary: var(--siga-ink-900);
    --bs-primary-rgb: 28, 42, 32;
    --bs-secondary: #746b5c;
    --bs-secondary-rgb: 116, 107, 92;
    --bs-success: var(--siga-success);
    --bs-success-rgb: 60, 107, 70;
    --bs-danger: var(--siga-danger);
    --bs-danger-rgb: 161, 58, 46;
    --bs-warning: var(--siga-warning);
    --bs-warning-rgb: 150, 105, 42;
    --bs-info: var(--siga-info);
    --bs-info-rgb: 69, 96, 122;
    --bs-body-color: var(--siga-text);
    --bs-body-bg: var(--siga-bg);
    --bs-border-color: var(--siga-border);
    --bs-border-radius: var(--siga-radius);
    --bs-border-radius-sm: var(--siga-radius-sm);
    --bs-border-radius-lg: var(--siga-radius-lg);
    --bs-link-color: var(--siga-ink-900);
    --bs-link-color-rgb: 28, 42, 32;
    --bs-link-hover-color: var(--siga-selo-500);
    --bs-link-hover-color-rgb: 161, 58, 46;
    --bs-focus-ring-color: rgba(185, 134, 58, 0.35);
    --bs-body-font-family: var(--siga-font-body);
}

[data-theme="dark"] {
    --siga-bg: #10160f;
    --siga-surface: #182019;
    --siga-surface-sunken: #131a12;
    --siga-text: #e7ece3;
    --siga-text-muted: #a1a99a;
    --siga-border: #2a352a;
    --siga-ink-100: #1e2a1f;
    --bs-body-color: var(--siga-text);
    --bs-body-bg: var(--siga-bg);
    --bs-border-color: var(--siga-border);
}

* { box-sizing: border-box; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

html { scroll-behavior: smooth; }

body {
    font-family: var(--siga-font-body);
    background-color: var(--siga-bg);
    color: var(--siga-text);
}

h1, h2, h3, .siga-brand {
    font-family: var(--siga-font-display);
    font-weight: 600;
    letter-spacing: -0.01em;
}
h4, h5, h6 { font-family: var(--siga-font-body); font-weight: 700; }

code, .siga-mono { font-family: var(--siga-font-mono); }

a { text-decoration-thickness: 1px; text-underline-offset: 2px; }

/* Foco de teclado sempre visível — nunca só a cor por trás de um botão a mudar */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible {
    outline: 2px solid var(--siga-pauta-500);
    outline-offset: 2px;
}

/* ---------- Layout: barra lateral + topo ---------- */

.siga-shell { display: flex; min-height: 100vh; }

.siga-sidebar {
    width: 268px;
    flex-shrink: 0;
    background:
        repeating-linear-gradient(180deg, rgba(255,255,255,0.028) 0, rgba(255,255,255,0.028) 1px, transparent 1px, transparent 34px),
        linear-gradient(175deg, var(--siga-ink-900), var(--siga-ink-950) 78%);
    color: #eef1ea;
    position: fixed;
    top: 0; bottom: 0; left: 0;
    overflow-y: auto;
    z-index: 1030;
    transition: transform 0.2s ease;
}

.siga-sidebar .siga-brand {
    display: flex; align-items: center; gap: 0.65rem;
    padding: 1.35rem 1.25rem 1.1rem;
    color: #fff;
    font-weight: 600;
    font-size: 1.2rem;
}
.siga-brand .badge-mark {
    background: var(--siga-pauta-500);
    color: var(--siga-ink-950);
    width: 36px; height: 36px;
    border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    font-family: var(--siga-font-display);
    font-weight: 700;
    box-shadow: inset 0 0 0 2px rgba(19, 30, 23, 0.25);
}

.siga-nav-section {
    padding: 1rem 1.25rem 0.4rem;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #8a9686;
    font-weight: 600;
}

.siga-nav a {
    display: flex; align-items: center; gap: 0.65rem;
    padding: 0.55rem 1.25rem;
    color: #cdd6c8;
    text-decoration: none;
    font-size: 0.92rem;
    border-left: 3px solid transparent;
    transition: background-color .12s ease, color .12s ease;
}
.siga-nav a:hover { background: rgba(255,255,255,0.06); color: #fff; }
.siga-nav a.active {
    background: rgba(185,134,58,0.14);
    color: #fff;
    border-left-color: var(--siga-pauta-500);
    font-weight: 600;
}
.siga-nav a:focus-visible { outline-offset: -2px; }

.siga-main { margin-left: 268px; flex: 1; min-width: 0; display: flex; flex-direction: column; }

.siga-topbar {
    background: var(--siga-surface);
    border-bottom: 1px solid var(--siga-border);
    padding: 0.75rem 1.5rem;
    display: flex; align-items: center; justify-content: space-between;
    position: sticky; top: 0; z-index: 1020;
}

.siga-content { padding: 1.5rem; flex: 1; }

.siga-sidebar-toggle { display: none; }

.siga-sidebar-close {
    display: none;
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.1);
    color: inherit;
    align-items: center;
    justify-content: center;
    z-index: 5;
}

.siga-sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(19, 30, 23, 0.5);
    z-index: 1035;
}

@media (max-width: 991.98px) {
    .siga-sidebar { transform: translateX(-100%); z-index: 1040; }
    .siga-sidebar.open { transform: translateX(0); }
    .siga-sidebar.open .siga-sidebar-close { display: flex; }
    .siga-sidebar.open ~ .siga-sidebar-backdrop,
    .siga-sidebar-backdrop.open { display: block; }
    .siga-main { margin-left: 0; }
    .siga-sidebar-toggle { display: inline-flex; }
}

/* ---------- Componentes ---------- */

.siga-card {
    background: var(--siga-surface);
    border: 1px solid var(--siga-border);
    border-radius: var(--siga-radius);
    box-shadow: var(--siga-shadow-sm);
}

.siga-kpi {
    background: var(--siga-surface);
    border: 1px solid var(--siga-border);
    border-radius: var(--siga-radius);
    padding: 1.15rem 1.3rem;
    box-shadow: var(--siga-shadow-sm);
}
.siga-kpi .siga-kpi-value { font-family: var(--siga-font-display); font-size: 1.75rem; font-weight: 600; }
.siga-kpi .siga-kpi-label { color: var(--siga-text-muted); font-size: 0.8rem; }

.table thead th {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--siga-text-muted);
    font-weight: 600;
    border-bottom-width: 1px;
    background: var(--siga-surface-sunken);
}
.table > :not(caption) > * > * { background-color: transparent; }

.btn { font-weight: 500; }
.btn-siga-primary {
    background-color: var(--siga-ink-900);
    border-color: var(--siga-ink-900);
    color: #fff;
}
.btn-siga-primary:hover, .btn-siga-primary:focus {
    background-color: var(--siga-ink-700);
    border-color: var(--siga-ink-700);
    color: #fff;
}

.btn-siga-gold {
    background-color: var(--siga-pauta-500);
    border-color: var(--siga-pauta-500);
    color: var(--siga-ink-950);
    font-weight: 600;
}
.btn-siga-gold:hover, .btn-siga-gold:focus {
    background-color: var(--siga-pauta-400);
    border-color: var(--siga-pauta-400);
    color: var(--siga-ink-950);
}

.siga-empty-state {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--siga-text-muted);
}

.siga-guest {
    min-height: 100vh;
    display: flex; align-items: center; justify-content: center;
    background:
        repeating-linear-gradient(180deg, rgba(255,255,255,0.03) 0, rgba(255,255,255,0.03) 1px, transparent 1px, transparent 36px),
        radial-gradient(circle at top left, var(--siga-ink-700), var(--siga-ink-950) 65%);
    padding: 1.5rem;
}
.siga-guest-card {
    background: var(--siga-surface);
    border-radius: var(--siga-radius-lg);
    padding: 2.25rem;
    width: 100%;
    max-width: 400px;
    box-shadow: var(--siga-shadow-lg);
}

/* Selo — o elemento de assinatura desta interface. Cada documento oficial que a OKUTANGA
   emite já leva um carimbo ("autenticado com o carimbo em uso nesta Instituição"); os
   estados aqui pegam nessa mesma ideia — um selo de aprovação, não uma pastilha qualquer. */
.siga-badge-status-active,
.siga-badge-status-trial,
.siga-badge-status-suspended,
.siga-badge-status-inactive {
    display: inline-flex;
    align-items: center;
    font-family: var(--siga-font-body);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.28em 0.75em;
    border-radius: 999px;
    transform: rotate(-1.5deg);
    box-shadow: inset 0 0 0 1px currentColor;
}
.siga-badge-status-active { background: rgba(60,107,70,0.1); color: var(--siga-success); }
.siga-badge-status-trial { background: rgba(150,105,42,0.1); color: var(--siga-warning); }
.siga-badge-status-suspended,
.siga-badge-status-inactive { background: rgba(161,58,46,0.1); color: var(--siga-danger); }

/* Mapa esquemático interactivo das províncias (Landing Page) */
.siga-province-tile {
    transition: transform .15s ease, filter .15s ease;
}
.siga-province-tile:hover {
    transform: scale(1.06);
    filter: brightness(1.1);
}