/* ================================================== 
   TEMA INSTITUCIONAL PREMIUM (IDURB)
   Conceito: "Autoridade Moderna" - Ar, Espaço e Confiança
================================================== */ 

/* 🎨 PALETA DE AUTORIDADE */ 
:root  { 
  /* Cores Institucionais - VIVAS E MODERNAS */
  --verde-idurb: #0B5D44;
  --verde-claro: #D1FAE5;
  --laranja-idurb: #F59E0B;
  --laranja-suave: #FFFBEB;
  --dourado: #D4AF37;
  --dourado-2: #B88A2B;
  --primary: var(--verde-idurb);
  --accent: var(--dourado);
  --warning: var(--laranja-idurb);
  --danger: #DC2626;
  --blue: #3B82F6;
  --brown: #A16207;
  --text: var(--texto-corpo);
  --text-strong: var(--texto-titulo);
  --muted: rgba(15, 23, 42, 0.06);
  
  /* Gradiente de Fundo (Mais Luminoso) */
  --bg-gradient-start: #F6F5F0;
  --bg-gradient-end: #EEF2F7;
  
  /* Cores de Interface */
  --branco: #FFFFFF;
  --vidro-branco: rgba(255, 255, 255, 0.72);
  --vidro-borda: rgba(255, 255, 255, 0.62);
  --superficie: rgba(255, 255, 255, 0.78);
  --superficie-2: rgba(255, 255, 255, 0.62);
  --borda: rgba(15, 23, 42, 0.10);
  --borda-forte: rgba(15, 23, 42, 0.14);
  
  /* Texto */
  --texto-titulo: #111827; /* Preto quase puro */
  --texto-corpo: #374151;
  --texto-leve: #6B7280;
  --texto-menu: #F9FAFB;
  --texto-menu-suave: rgba(249, 250, 251, 0.78);
  
  /* Sombras Premium (Macia e Difusa) */
  --sombra-card: 0 16px 34px -26px rgba(2, 6, 23, 0.45), 0 2px 10px -6px rgba(2, 6, 23, 0.18);
  --sombra-flutuante: 0 30px 70px -52px rgba(2, 6, 23, 0.70), 0 6px 22px -18px rgba(2, 6, 23, 0.25);
  --brilho-superficie: radial-gradient(900px 260px at 15% 0%, rgba(255,255,255,0.55), transparent 60%);
  
  /* Geometria */
  --radius-card: 18px;
  --radius-btn: 10px;
  --transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1);

  --sidebar-bg: linear-gradient(180deg, #0B5D44 0%, #06392A 55%, #041F18 100%);
  --sidebar-glow: radial-gradient(520px 260px at 30% 0%, rgba(212, 175, 55, 0.22), transparent 55%);
  --header-bg: rgba(255, 255, 255, 0.72);
  --page-bg:
    radial-gradient(900px 520px at 15% 10%, rgba(212, 175, 55, 0.10), transparent 60%),
    radial-gradient(900px 520px at 95% 0%, rgba(11, 93, 68, 0.12), transparent 58%),
    linear-gradient(110deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
  --foco: rgba(11, 93, 68, 0.20);
  --link: #0B5D44;
} 

html[data-theme="dark"] {
  --bg-gradient-start: #060A12;
  --bg-gradient-end: #0B1220;
  --vidro-branco: rgba(9, 13, 22, 0.72);
  --vidro-borda: rgba(148, 163, 184, 0.16);
  --superficie: rgba(12, 17, 29, 0.74);
  --superficie-2: rgba(12, 17, 29, 0.60);
  --borda: rgba(148, 163, 184, 0.14);
  --borda-forte: rgba(148, 163, 184, 0.18);
  --texto-titulo: rgba(248, 250, 252, 0.96);
  --texto-corpo: rgba(226, 232, 240, 0.88);
  --texto-leve: rgba(226, 232, 240, 0.62);
  --texto-menu: rgba(248, 250, 252, 0.96);
  --texto-menu-suave: rgba(226, 232, 240, 0.68);
  --sombra-card: 0 18px 44px -34px rgba(0, 0, 0, 0.75), 0 2px 10px -8px rgba(0, 0, 0, 0.45);
  --sombra-flutuante: 0 40px 100px -80px rgba(0, 0, 0, 0.85), 0 10px 30px -22px rgba(0, 0, 0, 0.55);
  --sidebar-bg: linear-gradient(180deg, #050B14 0%, #081022 55%, #04070D 100%);
  --sidebar-glow: radial-gradient(520px 260px at 30% 0%, rgba(212, 175, 55, 0.18), transparent 55%);
  --header-bg: rgba(9, 13, 22, 0.72);
  --page-bg:
    radial-gradient(900px 520px at 15% 10%, rgba(212, 175, 55, 0.14), transparent 60%),
    radial-gradient(900px 520px at 95% 0%, rgba(11, 93, 68, 0.14), transparent 58%),
    linear-gradient(110deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
  --foco: rgba(212, 175, 55, 0.25);
  --link: #D4AF37;
  --primary: var(--verde-idurb);
  --accent: var(--dourado);
  --warning: var(--laranja-idurb);
  --danger: #EF4444;
  --blue: #60A5FA;
  --brown: #F59E0B;
  --text: var(--texto-corpo);
  --text-strong: var(--texto-titulo);
  --muted: rgba(226, 232, 240, 0.08);
}

html[data-theme="sapphire"] {
  --verde-idurb: #1E3A8A;
  --verde-claro: rgba(30, 58, 138, 0.14);
  --laranja-idurb: #0284C7;
  --laranja-suave: rgba(2, 132, 199, 0.12);
  --dourado: #38BDF8;
  --dourado-2: #0EA5E9;
  --primary: var(--verde-idurb);
  --accent: var(--dourado);
  --warning: var(--laranja-idurb);
  --bg-gradient-start: #F6F8FF;
  --bg-gradient-end: #EEF4FF;
  --sidebar-bg: linear-gradient(180deg, #0B1F4A 0%, #0A1936 55%, #070F22 100%);
  --sidebar-glow: radial-gradient(520px 260px at 30% 0%, rgba(56, 189, 248, 0.26), transparent 55%);
  --page-bg:
    radial-gradient(900px 520px at 15% 10%, rgba(56, 189, 248, 0.12), transparent 60%),
    radial-gradient(900px 520px at 95% 0%, rgba(30, 58, 138, 0.14), transparent 58%),
    linear-gradient(110deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
  --foco: rgba(14, 165, 233, 0.22);
  --link: #1E40AF;
}

html[data-theme="graphite"] {
  --verde-idurb: #111827;
  --verde-claro: rgba(17, 24, 39, 0.08);
  --laranja-idurb: #334155;
  --laranja-suave: rgba(51, 65, 85, 0.10);
  --dourado: #64748B;
  --dourado-2: #475569;
  --primary: var(--verde-idurb);
  --accent: var(--dourado);
  --warning: #0EA5E9;
  --bg-gradient-start: #F5F6F8;
  --bg-gradient-end: #ECEFF3;
  --sidebar-bg: linear-gradient(180deg, #0F172A 0%, #0B1220 55%, #070B12 100%);
  --sidebar-glow: radial-gradient(520px 260px at 30% 0%, rgba(100, 116, 139, 0.24), transparent 55%);
  --page-bg:
    radial-gradient(900px 520px at 15% 10%, rgba(100, 116, 139, 0.11), transparent 60%),
    radial-gradient(900px 520px at 95% 0%, rgba(15, 23, 42, 0.10), transparent 58%),
    linear-gradient(110deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
  --foco: rgba(100, 116, 139, 0.18);
  --link: #0F172A;
}

html[data-theme="amethyst"] {
  --verde-idurb: #6D28D9;
  --verde-claro: rgba(109, 40, 217, 0.14);
  --laranja-idurb: #A855F7;
  --laranja-suave: rgba(168, 85, 247, 0.12);
  --dourado: #C4B5FD;
  --dourado-2: #A78BFA;
  --primary: var(--verde-idurb);
  --accent: var(--dourado);
  --warning: #F59E0B;
  --bg-gradient-start: #FBFAFF;
  --bg-gradient-end: #F3F0FF;
  --sidebar-bg: linear-gradient(180deg, #3B0764 0%, #2E1065 55%, #1E0B4B 100%);
  --sidebar-glow: radial-gradient(520px 260px at 30% 0%, rgba(196, 181, 253, 0.26), transparent 55%);
  --page-bg:
    radial-gradient(900px 520px at 15% 10%, rgba(196, 181, 253, 0.14), transparent 60%),
    radial-gradient(900px 520px at 95% 0%, rgba(109, 40, 217, 0.14), transparent 58%),
    linear-gradient(110deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
  --foco: rgba(168, 85, 247, 0.18);
  --link: #6D28D9;
}

html[data-theme="sunset"] {
  --verde-idurb: #B45309;
  --verde-claro: rgba(180, 83, 9, 0.12);
  --laranja-idurb: #F97316;
  --laranja-suave: rgba(249, 115, 22, 0.12);
  --dourado: #FDBA74;
  --dourado-2: #FB923C;
  --primary: var(--verde-idurb);
  --accent: var(--dourado);
  --warning: var(--laranja-idurb);
  --bg-gradient-start: #FFF9F3;
  --bg-gradient-end: #FFF1E6;
  --sidebar-bg: linear-gradient(180deg, #7C2D12 0%, #6B210F 55%, #431407 100%);
  --sidebar-glow: radial-gradient(520px 260px at 30% 0%, rgba(253, 186, 116, 0.26), transparent 55%);
  --page-bg:
    radial-gradient(900px 520px at 15% 10%, rgba(253, 186, 116, 0.14), transparent 60%),
    radial-gradient(900px 520px at 95% 0%, rgba(249, 115, 22, 0.14), transparent 58%),
    linear-gradient(110deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
  --foco: rgba(249, 115, 22, 0.18);
  --link: #9A3412;
}

/* 🌐 RESET & BASE */ 
* { margin: 0; padding: 0; box-sizing: border-box; } 

body { 
  font-family: 'Inter', 'Segoe UI', 'Roboto', 'Helvetica Neue', sans-serif;
  background: var(--page-bg);
  color: var(--texto-corpo); 
  min-height: 100vh; 
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
} 

a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }

.glass {
  background: var(--superficie);
  border: 1px solid var(--borda);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* ================================================== 
   LAYOUT GERAL
================================================== */ 
.app-layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    grid-template-rows: auto 1fr auto;
    min-height: 100vh;
    grid-template-areas:
        "sidebar header"
        "sidebar content"
        "sidebar footer";
}

/* ================================================== 
   MENU LATERAL (SIDEBAR) - AUTORIDADE
================================================== */ 
.app-sidebar { 
  grid-area: sidebar;
  background: var(--sidebar-bg);
  color: var(--texto-menu);
  display: flex;
  flex-direction: column;
  position: relative;
  padding: 24px 16px;
  box-shadow: 6px 0 30px rgba(2, 6, 23, 0.22);
  z-index: 20;
} 

.app-sidebar::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: var(--sidebar-glow);
  opacity: 1;
}

.app-sidebar > * {
  position: relative;
  z-index: 1;
}

.brand {
    padding: 10px 12px 40px 12px;
    display: flex;
    align-items: center;
    gap: 12px;
}
.brand img { 
    height: 56px; 
    width: auto;
    max-width: 100%;
    filter: drop-shadow(0 14px 24px rgba(0,0,0,0.22));
}

.brand-text { display: flex; flex-direction: column; }
.brand-title { 
    font-weight: 700; 
    font-size: 16px; 
    color: white;
    letter-spacing: 0.5px;
}
.brand-sub { 
    font-size: 10px; 
    text-transform: uppercase; 
    letter-spacing: 1px; 
    color: rgba(255,255,255,0.6); 
}

.nav-link { 
  display: flex;
  align-items: center;
  padding: 12px 16px; 
  margin-bottom: 4px;
  color: var(--texto-menu-suave); 
  text-decoration: none; 
  border-radius: var(--radius-btn);
  transition: var(--transition);
  font-weight: 500;
  border-left: 4px solid transparent;
} 

.nav-link .icon { margin-right: 12px; width: 20px; opacity: 0.8; }

.nav-link:hover { 
  background: rgba(255, 255, 255, 0.07);
  color: var(--texto-menu);
} 

/* Item Ativo: Selecionado com Autoridade */
.nav-link.active {
    background: rgba(255, 255, 255, 0.12);
    color: var(--texto-menu);
    font-weight: 600;
    border-left-color: var(--dourado);
}
.nav-link.active .icon { opacity: 1; }

/* ================================================== 
   TOPO / HEADER - VIDRO FLUTUANTE
================================================== */ 
.app-header { 
  grid-area: header;
  background: var(--header-bg);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  padding: 16px 40px; 
  display: flex;
  justify-content: flex-end;
  align-items: center;
  box-shadow: 0 16px 30px -26px rgba(2, 6, 23, 0.28);
  border-bottom: 1px solid var(--borda);
  position: sticky;
  top: 0;
  z-index: 10;
} 

.header-actions { 
    display: flex; 
    align-items: center; 
    gap: 16px; 
}

.user-name { 
    font-weight: 600; 
    color: var(--texto-titulo);
    margin-right: 8px;
    font-size: 14px;
}

.theme-picker {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.theme-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 220px;
  padding: 10px;
  border-radius: 16px;
  background: var(--superficie);
  border: 1px solid var(--borda);
  box-shadow: var(--sombra-card);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  z-index: 20;
}

.theme-item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: transparent;
  border: 1px solid transparent;
  color: var(--texto-titulo);
  font-weight: 800;
  cursor: pointer;
  transition: var(--transition);
}

.theme-item:hover {
  background: var(--superficie-2);
  border-color: var(--borda);
}

.theme-item.is-active {
  background: var(--foco);
  border-color: var(--dourado);
}

.theme-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.theme-choice.is-active {
  border-color: var(--dourado);
  box-shadow: 0 18px 44px -34px rgba(2, 6, 23, 0.75), 0 0 0 6px var(--foco);
}

/* ================================================== 
   CONTEÚDO
================================================== */ 
.app-content {
    grid-area: content;
    padding: 32px 40px 60px 40px;
}

/* Títulos */
h1 { 
    font-size: 28px; 
    font-weight: 700; 
    color: var(--texto-titulo);
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 12px;
}
/* Ícone de casinha verde (se houver no HTML, ou simulado via CSS se necessário) */
h1 .icon {
    color: var(--verde-idurb);
    background: var(--verde-claro);
    padding: 8px;
    border-radius: 12px;
    width: 36px;
    height: 36px;
}

h2 {
  font-size: 18px;
  font-weight: 700;
  color: var(--texto-titulo);
  margin: 32px 0 16px 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

h2 .icon {
  width: 28px;
  height: 28px;
  padding: 6px;
  border-radius: 12px;
  background: var(--superficie-2);
  color: var(--verde-idurb);
  border: 1px solid var(--borda);
}

/* ================================================== 
   CARDS PREMIUM (Cartão Físico)
================================================== */ 
.card { 
  background: var(--superficie);
  border-radius: var(--radius-card); 
  box-shadow: var(--sombra-card);
  padding: 24px;
  margin-bottom: 24px;
  border: 1px solid var(--borda);
  transition: var(--transition);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  position: relative;
  overflow: hidden;
} 

.card::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: var(--brilho-superficie);
  opacity: 0.55;
}

.card > * { position: relative; z-index: 1; }

.card:hover {
    box-shadow: var(--sombra-flutuante);
    transform: translateY(-2px);
}

/* Card Vencido (Vermelho Elegante) */
.card-danger {
    border-left: 4px solid #DC2626;
}
.card-danger h3, .card-danger .title { color: #991B1B; }

/* Card A Vencer (Laranja Alerta) */
.card-warning {
    border-left: 4px solid var(--laranja-idurb);
}

/* ================================================== 
   DASHBOARD WIDGETS (KPIs)
================================================== */ 
.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 24px;
    margin-bottom: 40px;
}

.stat {
    background: var(--superficie);
    padding: 24px;
    border-radius: var(--radius-card);
    box-shadow: var(--sombra-card);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--borda);
    transition: var(--transition);
}

.stat:hover {
    transform: translateY(-4px);
    box-shadow: var(--sombra-flutuante);
}

/* Faixa lateral colorida */
.stat::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
}
.kpi-green::before { background-color: var(--verde-idurb); }
.kpi-orange::before { background-color: var(--laranja-idurb); }
.kpi-blue::before { background-color: #3B82F6; }
.kpi-red::before { background-color: #EF4444; }

.stat .label { 
    font-size: 12px; 
    font-weight: 600; 
    text-transform: uppercase; 
    color: var(--texto-leve); 
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    display: flex; align-items: center; gap: 8px;
}
.stat .label .icon { 
    width: 18px; 
    height: 18px; 
    color: var(--texto-leve);
}

.stat .value { 
    font-size: 28px; 
    font-weight: 700; 
    color: var(--texto-titulo);
}
.stat .sub { font-size: 13px; color: var(--verde-idurb); font-weight: 600; margin-top: 4px; }

/* ================================================== 
   CARDS DE AÇÃO (Grandes e Vivos)
================================================== */ 
.quick-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 24px;
}

.quick-actions .btn {
    flex-direction: column;
    padding: 32px 24px;
    background: var(--superficie);
    color: var(--texto-titulo);
    border: 1px solid var(--borda);
    box-shadow: var(--sombra-card);
    border-radius: var(--radius-card);
    height: 100%;
    justify-content: center;
    text-align: center;
    gap: 16px;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.quick-actions .btn .icon {
    width: 40px; 
    height: 40px; 
    margin-right: 0;
    color: var(--verde-idurb);
    transition: var(--transition);
}

/* Hover Vivo */
.quick-actions .btn:hover {
    transform: translateY(-6px);
    box-shadow: var(--sombra-flutuante);
    background: var(--superficie);
    border-color: var(--borda-forte);
}

.quick-actions .btn:hover .icon {
    transform: scale(1.1);
}

/* Cores específicas para ícones se necessário */
.quick-actions .btn-blue .icon { color: #3B82F6; }
.quick-actions .btn-primary .icon { color: var(--verde-idurb); }
.quick-actions .btn-accent .icon { color: var(--laranja-idurb); }

/* ================================================== 
   ELEMENTOS DE UI
================================================== */ 

/* Botões Gerais - DESTACADOS */
.btn { 
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px; /* Mais corpo */
  border-radius: var(--radius-btn); 
  font-weight: 600; /* Texto mais forte */
  font-size: 14px;
  cursor: pointer;
  border: 1px solid var(--borda);
  transition: var(--transition);
  text-decoration: none;
  gap: 8px;
  letter-spacing: 0.3px;
  box-shadow: 0 10px 18px -16px rgba(2, 6, 23, 0.55);
  background: var(--superficie);
  color: var(--texto-titulo);
}

.btn .icon {
  width: 18px;
  height: 18px;
}

.btn:hover {
  transform: translateY(-2px); /* Efeito de levitação */
  border-color: var(--borda-forte);
}

.btn:active {
  transform: translateY(0);
}

.btn-primary { 
  background: linear-gradient(135deg, #0B5D44 0%, #064E3B 100%);
  color: white; 
  box-shadow: 0 18px 34px -28px rgba(11, 93, 68, 0.78);
  border: none;
} 
.btn-primary:hover { 
    background: linear-gradient(135deg, #0E7A57 0%, #0B5D44 100%);
    box-shadow: 0 24px 50px -40px rgba(11, 93, 68, 0.95), 0 0 0 6px rgba(212, 175, 55, 0.10);
}

.btn-danger {
  background: linear-gradient(135deg, #DC2626 0%, #991B1B 100%);
  color: white;
  box-shadow: 0 4px 6px -1px rgba(220, 38, 38, 0.3), 0 2px 4px -1px rgba(220, 38, 38, 0.2);
  border: none;
}
.btn-danger:hover {
  background: linear-gradient(135deg, #EF4444 0%, #B91C1C 100%);
  box-shadow: 0 10px 15px -3px rgba(220, 38, 38, 0.4), 0 4px 6px -2px rgba(220, 38, 38, 0.2);
}

.btn-blue {
  background: linear-gradient(135deg, #3B82F6 0%, #1D4ED8 100%);
  color: white;
  box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.3), 0 2px 4px -1px rgba(59, 130, 246, 0.2);
  border: none;
}
.btn-blue:hover {
  background: linear-gradient(135deg, #60A5FA 0%, #2563EB 100%);
  box-shadow: 0 10px 15px -3px rgba(59, 130, 246, 0.4), 0 4px 6px -2px rgba(59, 130, 246, 0.2);
}

.btn-accent {
  background: linear-gradient(135deg, var(--dourado) 0%, var(--dourado-2) 100%);
  color: white;
  box-shadow: 0 22px 44px -36px rgba(212, 175, 55, 0.85);
  border: none;
}
.btn-accent:hover {
  background: linear-gradient(135deg, #E6C45D 0%, var(--dourado) 100%);
  box-shadow: 0 34px 70px -58px rgba(212, 175, 55, 0.92), 0 0 0 6px rgba(212, 175, 55, 0.12);
}

.btn-gray {
  background-color: #6B7280;
  color: white;
}
.btn-gray:hover {
  background-color: #4B5563;
  box-shadow: 0 4px 12px rgba(107, 114, 128, 0.2);
}

.btn-outline { 
  background: var(--superficie-2); 
  border: 1px solid var(--borda); 
  color: var(--texto-titulo); 
  box-shadow: 0 10px 18px -16px rgba(2, 6, 23, 0.45);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
} 
.btn-outline:hover { 
  background: var(--superficie); 
  border-color: var(--dourado);
  color: var(--texto-titulo);
  transform: translateY(-2px);
}

.btn-light {
  background: rgba(15, 23, 42, 0.06);
  border: 1px solid var(--borda);
  color: var(--texto-titulo);
  box-shadow: none;
}

html[data-theme="dark"] .btn-light {
  background: rgba(226, 232, 240, 0.08);
  border: 1px solid var(--borda);
  color: var(--texto-titulo);
}

/* Inputs */
input, select, textarea { 
  width: 100%; 
  padding: 12px 16px; 
  border: 1px solid var(--borda);
  background: var(--superficie-2);
  border-radius: var(--radius-btn); 
  font-size: 14px;
  color: var(--texto-corpo);
  transition: var(--transition);
} 
input:focus, select:focus, textarea:focus { 
  outline: none; 
  border-color: var(--dourado); 
  box-shadow: 0 0 0 6px var(--foco); 
}

label {
  display: block;
  margin: 14px 0 8px 0;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: var(--texto-leve);
}

label .icon {
  width: 16px;
  height: 16px;
  margin-right: 6px;
}

input[type="file"] {
  padding: 10px 12px;
}

.alert {
  border-radius: 14px;
  padding: 12px 14px;
  border: 1px solid var(--borda);
  background: var(--superficie-2);
  color: var(--texto-corpo);
  font-weight: 600;
}

.alert-danger {
  background: rgba(239, 68, 68, 0.10);
  border-color: rgba(239, 68, 68, 0.22);
  color: #991B1B;
}

html[data-theme="dark"] .alert-danger {
  color: rgba(254, 226, 226, 0.92);
}

.alert-success {
  background: rgba(16, 185, 129, 0.12);
  border-color: rgba(16, 185, 129, 0.22);
  color: #065F46;
}

html[data-theme="dark"] .alert-success {
  color: rgba(209, 250, 229, 0.92);
}

/* Tabelas Institucionais */
table { 
    width: 100%; 
    border-collapse: collapse; 
    margin-top: 12px; 
}
th { 
    text-align: left; 
    padding: 12px 16px; 
    color: var(--texto-leve); 
    font-weight: 600; 
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--borda-forte);
    background: rgba(15, 23, 42, 0.03);
}
td { 
    padding: 16px; 
    border-bottom: 1px solid var(--borda);
    color: var(--texto-corpo);
}
tr:hover td { 
    background: rgba(212, 175, 55, 0.06); 
}

html[data-theme="dark"] th {
  background: rgba(226, 232, 240, 0.06);
}

html[data-theme="dark"] tr:hover td {
  background: rgba(212, 175, 55, 0.08);
}

.card ul {
  list-style: none;
  padding-left: 0;
  margin-top: 12px;
  display: grid;
  gap: 10px;
}

.card ul li {
  background: var(--superficie-2);
  border: 1px solid var(--borda);
  border-radius: 14px;
  padding: 12px 14px;
  transition: var(--transition);
}

.card ul li:hover {
  border-color: var(--borda-forte);
  box-shadow: 0 20px 40px -34px rgba(2, 6, 23, 0.65);
}

.card ul li a {
  color: var(--texto-titulo);
  font-weight: 700;
  text-decoration: none;
}

.card ul li a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Badge */
.badge { display: inline-block; padding: 4px 10px; border-radius: 20px; font-size: 11px; font-weight: 600; }
.badge-danger { background: rgba(239, 68, 68, 0.12); color: #991B1B; border: 1px solid rgba(239, 68, 68, 0.20); }
.badge-success { background: rgba(16, 185, 129, 0.14); color: #065F46; border: 1px solid rgba(16, 185, 129, 0.22); }
.badge-muted { background: rgba(15, 23, 42, 0.06); color: rgba(15, 23, 42, 0.60); border: 1px solid var(--borda); }

/* ================================================== 
   LOGIN PAGE - VIVID & PREMIUM
================================================== */
.login-page {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-size: cover;
    background-position: center;
    z-index: 100;
}

/* Overlay com Desfoque e Tons Institucionais */
.login-page::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background:
      radial-gradient(900px 520px at 20% 0%, rgba(245, 158, 11, 0.22), transparent 60%),
      radial-gradient(900px 520px at 85% 10%, rgba(11, 93, 68, 0.26), transparent 62%),
      linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(2, 6, 23, 0.30));
    backdrop-filter: blur(14px);
    z-index: 1;
}

.login-brand {
    position: relative;
    z-index: 10;
    margin-bottom: 0;
}

.login-logo {
    max-height: 170px;
    width: min(360px, 86vw);
    height: auto;
    filter: drop-shadow(0 0 20px rgba(255,255,255,0.3));
}

.login-card .login-brand {
  display: flex;
  justify-content: center;
  margin-bottom: 18px;
}

.login-card .login-logo {
  max-height: 120px;
  width: auto;
  filter: drop-shadow(0 12px 22px rgba(2, 6, 23, 0.18));
}

.login-card {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(20px);
    padding: 48px;
    width: 100%;
    max-width: 420px;
    border-radius: 24px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    z-index: 10;
}

html[data-theme="dark"] .login-card {
    background: rgba(12, 17, 29, 0.82);
    border: 1px solid rgba(148, 163, 184, 0.18);
    box-shadow: 0 40px 90px -78px rgba(0, 0, 0, 0.85);
}

.login-form label {
  color: rgba(107, 114, 128, 0.92);
}

html[data-theme="dark"] .login-form label {
  color: rgba(226, 232, 240, 0.68);
}

.remember-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
}

.remember-row label {
  margin: 0;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  font-size: 13px;
  color: var(--texto-leve);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.remember-row input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--verde-idurb);
}

.login-card .remember-row input[type="checkbox"] {
  accent-color: var(--laranja-idurb);
}

.login-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 18px 0 8px 0;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: rgba(107, 114, 128, 0.92);
}

html[data-theme="dark"] .login-label {
  color: rgba(226, 232, 240, 0.68);
}

.login-label .icon {
  width: 18px;
  height: 18px;
}

.login-field {
  position: relative;
}

.login-field .icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  color: rgba(107, 114, 128, 0.85);
  pointer-events: none;
}

html[data-theme="dark"] .login-field .icon {
  color: rgba(226, 232, 240, 0.72);
}

.login-field input {
  padding-left: 46px;
  background: rgba(15, 23, 42, 0.04);
}

html[data-theme="dark"] .login-field input {
  background: rgba(226, 232, 240, 0.06);
}

.login-footer {
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px solid var(--borda);
  color: rgba(107, 114, 128, 0.82);
  font-weight: 700;
  font-size: 12px;
  text-align: center;
}

html[data-theme="dark"] .login-footer {
  color: rgba(226, 232, 240, 0.62);
}

.login-title {
  margin: 0 0 10px 0;
  text-align: center;
  font-size: 18px;
  font-weight: 800;
  color: var(--texto-titulo);
}

.login-help {
  margin-top: 10px;
  color: var(--texto-leve);
  font-weight: 600;
  font-size: 13px;
  text-align: center;
}

.login-avatar {
    width: 140px;
    height: 140px;
    position: relative;
    margin: 0 auto 18px auto;
    filter: drop-shadow(0 34px 60px rgba(0, 0, 0, 0.26));
    animation: login-avatar-float 5.6s ease-in-out infinite;
}

.login-avatar-ring {
    position: absolute;
    inset: -10px;
    border-radius: 999px;
    background:
        radial-gradient(circle at 30% 30%, rgba(255,255,255,0.70), transparent 55%),
        conic-gradient(from 45deg, rgba(212,175,55,0.0), rgba(212,175,55,0.55), rgba(11,93,68,0.38), rgba(212,175,55,0.0));
    mask: radial-gradient(circle, transparent 62px, #000 63px);
    opacity: 0.85;
    animation: login-avatar-ring 9s linear infinite;
}

.login-avatar-hair {
    position: absolute;
    inset: 6px 10px 30px 10px;
    border-radius: 999px 999px 44px 44px;
    background:
        radial-gradient(120px 80px at 55% 20%, rgba(255,255,255,0.12), transparent 60%),
        linear-gradient(135deg, rgba(29, 78, 56, 0.95) 0%, rgba(12, 55, 39, 0.95) 38%, rgba(2, 6, 23, 0.92) 100%);
    box-shadow: inset 0 -18px 30px rgba(0,0,0,0.18);
    overflow: hidden;
}

.login-avatar-hair::after {
    content: '';
    position: absolute;
    inset: -40px -60px;
    background: linear-gradient(120deg, transparent 30%, rgba(212,175,55,0.20) 48%, transparent 62%);
    transform: translateX(-40%);
    animation: login-avatar-shine 4.8s ease-in-out infinite;
}

.login-avatar-face {
    position: absolute;
    left: 28px;
    right: 28px;
    top: 30px;
    bottom: 54px;
    border-radius: 44px;
    background:
        radial-gradient(70px 46px at 60% 35%, rgba(255,255,255,0.30), transparent 60%),
        radial-gradient(90px 70px at 40% 70%, rgba(0,0,0,0.08), transparent 60%),
        linear-gradient(180deg, rgba(245, 215, 190, 1) 0%, rgba(234, 195, 168, 1) 100%);
    box-shadow: 0 18px 28px -26px rgba(2, 6, 23, 0.70);
}

.login-avatar-face::before,
.login-avatar-face::after {
    content: '';
    position: absolute;
    top: 52%;
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.68);
    box-shadow: 0 10px 0 rgba(15, 23, 42, 0.10);
    transform-origin: 50% 50%;
    animation: login-avatar-blink 5.2s infinite;
}

.login-avatar-face::before { left: 22px; }
.login-avatar-face::after { right: 22px; animation-delay: 0.08s; }

.login-avatar-shoulders {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 6px;
    height: 58px;
    border-radius: 999px;
    background:
        radial-gradient(120px 60px at 50% 10%, rgba(255,255,255,0.18), transparent 60%),
        linear-gradient(135deg, rgba(11, 93, 68, 0.95) 0%, rgba(4, 31, 24, 0.96) 100%);
    box-shadow: 0 26px 50px -42px rgba(2, 6, 23, 0.78);
}

html[data-theme="dark"] .login-avatar-face {
    background:
        radial-gradient(70px 46px at 60% 35%, rgba(255,255,255,0.16), transparent 60%),
        radial-gradient(90px 70px at 40% 70%, rgba(0,0,0,0.22), transparent 60%),
        linear-gradient(180deg, rgba(231, 198, 171, 1) 0%, rgba(213, 172, 145, 1) 100%);
}

@keyframes login-avatar-float {
    0%, 100% { transform: translateY(0) rotate(-0.3deg); }
    50% { transform: translateY(-8px) rotate(0.3deg); }
}

@keyframes login-avatar-ring {
    0% { transform: rotate(0deg); opacity: 0.78; }
    50% { opacity: 0.92; }
    100% { transform: rotate(360deg); opacity: 0.78; }
}

@keyframes login-avatar-shine {
    0%, 100% { transform: translateX(-42%) rotate(8deg); opacity: 0.35; }
    50% { transform: translateX(42%) rotate(8deg); opacity: 0.70; }
}

@keyframes login-avatar-blink {
    0%, 92%, 100% { transform: scaleY(1); }
    94% { transform: scaleY(0.12); }
    96% { transform: scaleY(1); }
}

.login-welcome {
    font-size: 28px;
    font-weight: 800;
    color: var(--texto-titulo);
    text-align: center;
    margin-bottom: 4px;
}

.login-subtitle {
    text-align: center;
    color: var(--texto-leve);
    margin-bottom: 32px;
    font-size: 14px;
    font-weight: 500;
}

.input-lg {
    padding: 14px 16px;
    font-size: 16px;
}

.login-field .input-lg {
    padding-left: 46px;
}

.btn-lg {
    padding: 14px 28px;
    font-size: 16px;
    width: 100%;
    margin-top: 16px;
    background: linear-gradient(135deg, var(--dourado) 0%, var(--dourado-2) 100%);
    color: white;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 30px 60px -50px rgba(212, 175, 55, 0.85);
}
.btn-lg:hover {
    background: linear-gradient(135deg, #E6C45D 0%, var(--dourado) 100%);
    box-shadow: 0 44px 90px -78px rgba(212, 175, 55, 0.92);
    transform: translateY(-3px);
}

.login-card .btn.btn-lg {
  background: linear-gradient(135deg, #F59E0B 0%, #D97706 100%);
  box-shadow: 0 18px 38px -22px rgba(245, 158, 11, 0.75);
  border: none;
}

.login-card .btn.btn-lg:hover {
  background: linear-gradient(135deg, #FDBA74 0%, #F59E0B 100%);
  box-shadow: 0 26px 60px -36px rgba(245, 158, 11, 0.85);
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 14px 0 18px 0;
  color: var(--texto-leve);
  font-weight: 600;
  font-size: 13px;
}

.breadcrumbs a {
  color: var(--texto-titulo);
  text-decoration: none;
  opacity: 0.86;
}

.breadcrumbs a:hover {
  opacity: 1;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.breadcrumbs .sep {
  opacity: 0.45;
}

.app-footer {
  grid-area: footer;
  padding: 16px 40px 26px 40px;
  color: var(--texto-leve);
  font-weight: 600;
  font-size: 12px;
}

/* Responsividade */
@media (max-width: 768px) {
    .app-layout {
        grid-template-columns: 1fr;
        grid-template-areas: "header" "content" "footer";
    }
    .app-sidebar { display: none; } /* Em mobile idealmente seria um menu hamburger */
    .app-content { padding: 20px; }
    .app-header { padding: 14px 16px; }
    .header-actions { gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
    table { display: block; overflow-x: auto; }
    .login-card { padding: 28px 22px; border-radius: 22px; }
}

.dash-future {
    --dash-glow-green: rgba(16, 185, 129, 0.35);
    --dash-glow-orange: rgba(249, 115, 22, 0.35);
    --dash-glow-blue: rgba(59, 130, 246, 0.35);
    position: relative;
}

.dash-future::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(700px 420px at 20% 10%, rgba(16, 185, 129, 0.14), transparent 60%),
        radial-gradient(680px 420px at 90% 0%, rgba(249, 115, 22, 0.12), transparent 55%),
        radial-gradient(900px 520px at 60% 100%, rgba(59, 130, 246, 0.10), transparent 60%);
    filter: saturate(120%);
    z-index: 0;
}

.dash-future > * {
    position: relative;
    z-index: 1;
}

.dash-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    border-radius: 22px;
    background: linear-gradient(135deg, var(--superficie), var(--superficie-2));
    border: 1px solid var(--borda);
    box-shadow: 0 30px 60px -35px rgba(2, 6, 23, 0.55);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    margin-bottom: 18px;
}

.dash-h1 {
    margin: 0;
    font-size: 30px;
    font-weight: 800;
    letter-spacing: -0.3px;
}

.dash-h1-icon .icon {
    color: #fff;
    background: radial-gradient(circle at 30% 30%, #34D399 0%, #059669 60%, #064E3B 100%);
    padding: 10px;
    border-radius: 14px;
    width: 40px;
    height: 40px;
    box-shadow: 0 12px 26px -14px rgba(2, 6, 23, 0.7), 0 0 0 6px rgba(16, 185, 129, 0.10);
}

.dash-hero-sub {
    margin-top: 6px;
    color: var(--texto-leve);
    font-weight: 600;
    font-size: 13px;
}

.dash-chip-btn {
    border-radius: 999px;
    padding: 10px 16px;
}

.dash-hero-right {
    display: flex;
    align-items: flex-end;
    gap: 12px;
}

.dash-hero-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.dash-summary {
    min-width: 320px;
    border-radius: 18px;
    padding: 12px 14px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.58));
    border: 1px solid var(--borda);
    box-shadow: 0 26px 60px -46px rgba(2, 6, 23, 0.72);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

html[data-theme="dark"] .dash-summary {
    background: linear-gradient(135deg, rgba(12, 17, 29, 0.74), rgba(12, 17, 29, 0.52));
}

.dash-summary-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.dash-summary-k {
    font-weight: 800;
    letter-spacing: 0.3px;
    color: var(--texto-titulo);
    font-size: 13px;
}

.dash-summary-v {
    font-weight: 900;
    color: var(--verde-idurb);
    font-size: 18px;
}

.dash-progress {
    height: 10px;
    margin-top: 10px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.06);
    overflow: hidden;
    border: 1px solid var(--borda);
}

html[data-theme="dark"] .dash-progress {
    background: rgba(226, 232, 240, 0.08);
}

.dash-progress-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(212, 175, 55, 0.95), rgba(11, 93, 68, 0.92));
    box-shadow: 0 14px 30px -18px rgba(212, 175, 55, 0.85);
    transition: width 0.6s ease;
}

.dash-summary-grid {
    margin-top: 12px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.dash-mini {
    border-radius: 14px;
    padding: 10px 10px;
    background: var(--superficie-2);
    border: 1px solid var(--borda);
}

.dash-mini .k {
    font-size: 11px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    font-weight: 800;
    color: var(--texto-leve);
}

.dash-mini .v {
    margin-top: 4px;
    font-weight: 900;
    color: var(--texto-titulo);
    font-size: 13px;
    line-height: 1.15;
}

.dash-actions-card {
    padding-top: 18px;
}

.dash-actions-head {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-weight: 800;
    color: var(--texto-titulo);
    margin-bottom: 14px;
}

.dash-actions-head .icon {
    width: 18px;
    height: 18px;
    color: var(--texto-titulo);
    background: rgba(15, 23, 42, 0.06);
    border-radius: 10px;
    padding: 8px;
}

html[data-theme="dark"] .dash-actions-head .icon {
    background: rgba(226, 232, 240, 0.08);
}

.dash-future .card {
    background: var(--superficie);
    border: 1px solid var(--borda);
    box-shadow: 0 24px 44px -34px rgba(2, 6, 23, 0.75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.dash-future .card:hover {
    box-shadow: 0 44px 80px -58px rgba(2, 6, 23, 0.9);
}

.dash-future .stat {
    background: linear-gradient(135deg, var(--superficie), var(--superficie-2));
    border: 1px solid var(--borda);
    box-shadow: 0 24px 48px -34px rgba(2, 6, 23, 0.75);
}

html[data-theme="dark"] .dash-future::before {
    background:
        radial-gradient(700px 420px at 20% 10%, rgba(212, 175, 55, 0.12), transparent 60%),
        radial-gradient(680px 420px at 90% 0%, rgba(11, 93, 68, 0.12), transparent 55%),
        radial-gradient(900px 520px at 60% 100%, rgba(59, 130, 246, 0.10), transparent 60%);
    filter: saturate(120%);
}

.dash-future .stat::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(600px 180px at 20% 0%, rgba(255,255,255,0.50), transparent 60%);
    opacity: 0.7;
}

.dash-future .stat:hover {
    box-shadow: 0 40px 80px -60px rgba(2, 6, 23, 0.9), 0 0 0 6px rgba(59, 130, 246, 0.06);
}

.dash-kpis .kpi-green:hover { box-shadow: 0 44px 90px -70px rgba(2, 6, 23, 0.9), 0 0 0 6px rgba(16, 185, 129, 0.10); }
.dash-kpis .kpi-orange:hover { box-shadow: 0 44px 90px -70px rgba(2, 6, 23, 0.9), 0 0 0 6px rgba(249, 115, 22, 0.10); }
.dash-kpis .kpi-blue:hover { box-shadow: 0 44px 90px -70px rgba(2, 6, 23, 0.9), 0 0 0 6px rgba(59, 130, 246, 0.10); }
.dash-kpis .kpi-red:hover { box-shadow: 0 44px 90px -70px rgba(2, 6, 23, 0.9), 0 0 0 6px rgba(239, 68, 68, 0.10); }

.kpi-brown::before { background-color: #A16207; }

.kpi-progress {
    margin-top: 12px;
    height: 8px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.06);
    overflow: hidden;
    border: 1px solid var(--borda);
}

html[data-theme="dark"] .kpi-progress {
    background: rgba(226, 232, 240, 0.08);
}

.kpi-progress-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(249, 115, 22, 0.92), rgba(212, 175, 55, 0.95));
    box-shadow: 0 14px 28px -22px rgba(249, 115, 22, 0.75);
}

.trend {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.2px;
}

.trend-up {
    color: #065F46;
    background: rgba(16, 185, 129, 0.16);
}

.trend-down {
    color: #7F1D1D;
    background: rgba(239, 68, 68, 0.14);
}

.trend-none {
    color: rgba(17, 24, 39, 0.55);
    background: rgba(15, 23, 42, 0.06);
}

.dash-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 14px;
}

.dash-h2 {
    margin-top: 0;
}

.dash-after-table {
    margin-top: 12px;
}

.bars {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.bar {
    height: 10px;
    background: rgba(15, 23, 42, 0.06);
    border-radius: 999px;
    overflow: hidden;
    margin-top: 8px;
}

.bar-fill {
    height: 100%;
    border-radius: 999px;
    box-shadow: 0 12px 26px -18px rgba(2, 6, 23, 0.55);
}

.spark {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    gap: 10px;
    align-items: end;
    height: 140px;
    padding: 10px;
    border-radius: 16px;
    background: rgba(15, 23, 42, 0.03);
}

.spark-group {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    align-items: end;
    height: 100%;
}

.spark-bar {
    border-radius: 10px;
    min-height: 8px;
    transition: transform 0.25s ease;
}

.spark-bar:hover {
    transform: translateY(-2px);
}

.spark-entries {
    background: linear-gradient(180deg, rgba(16, 185, 129, 0.65), rgba(5, 150, 105, 0.35));
    box-shadow: 0 12px 26px -18px rgba(16, 185, 129, 0.65);
}

.spark-exits {
    background: linear-gradient(180deg, rgba(249, 115, 22, 0.60), rgba(234, 88, 12, 0.30));
    box-shadow: 0 12px 26px -18px rgba(249, 115, 22, 0.65);
}

.spark-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 10px;
    color: rgba(17, 24, 39, 0.70);
    font-weight: 600;
    font-size: 13px;
}

.spark-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.spark-swatch {
    width: 12px;
    height: 12px;
    border-radius: 4px;
}

@media (max-width: 1000px) {
    .dash-two-col { grid-template-columns: 1fr; }
    .dash-hero { align-items: flex-start; flex-direction: column; }
    .dash-hero-right { width: 100%; justify-content: space-between; align-items: stretch; flex-wrap: wrap; }
    .dash-summary { min-width: 0; width: 100%; }
}

.print-report {
  max-width: 980px;
  margin: 0 auto;
}

.print-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 14px;
}

.print-brand {
  display: flex;
  align-items: center;
  gap: 12px;
}

.print-logo {
  height: 48px;
  width: auto;
  max-width: 240px;
  filter: drop-shadow(0 14px 26px rgba(0,0,0,0.14));
}

.print-title {
  font-size: 20px;
  font-weight: 900;
  color: var(--texto-titulo);
}

.print-sub {
  color: var(--texto-leve);
  font-weight: 700;
  font-size: 12px;
}

.print-meta {
  color: var(--texto-leve);
  font-weight: 700;
  font-size: 12px;
}

.print-summary {
  margin-bottom: 14px;
}

.print-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.print-k {
  color: var(--texto-leve);
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.9px;
}

.print-v {
  margin-top: 4px;
  font-weight: 900;
  color: var(--texto-titulo);
}

.print-contract {
  margin-bottom: 14px;
}

.print-contract-head {
  margin-bottom: 12px;
}

.print-contract-title {
  font-weight: 900;
  font-size: 16px;
  color: var(--texto-titulo);
}

.print-contract-sub {
  margin-top: 2px;
  color: var(--texto-leve);
  font-weight: 700;
  font-size: 12px;
}

.print-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}

.print-block-title {
  font-weight: 900;
  font-size: 13px;
  margin-bottom: 8px;
  color: var(--texto-titulo);
}

.print-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.print-table td,
.print-table th {
  padding: 10px 12px;
  border-bottom: 1px solid var(--borda);
  vertical-align: top;
}

.print-table thead th {
  text-align: left;
  font-size: 11px;
  color: var(--texto-leve);
  text-transform: uppercase;
  letter-spacing: 0.8px;
}

.print-table .k {
  width: 140px;
  color: var(--texto-leve);
  font-weight: 800;
}

.print-table .v {
  font-weight: 700;
  color: var(--texto-titulo);
}

.print-table.wide td,
.print-table.wide th {
  padding: 9px 10px;
}

.print-section {
  margin-top: 12px;
}

.print-section-title {
  font-weight: 900;
  font-size: 13px;
  color: var(--texto-titulo);
  margin-bottom: 8px;
}

.print-empty {
  color: var(--texto-leve);
  font-weight: 700;
  font-size: 13px;
  padding: 8px 0;
}

.print-files {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.print-file {
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--borda);
  background: rgba(15, 23, 42, 0.03);
  color: var(--texto-titulo);
  font-weight: 700;
  font-size: 12px;
}

@media (max-width: 900px) {
  .print-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .print-grid { grid-template-columns: 1fr; }
  .print-table .k { width: 120px; }
}

@media print {
  body { background: #fff !important; }
  .app-sidebar, .app-header, .app-footer, .breadcrumbs, .no-print { display: none !important; }
  .app-layout { display: block !important; }
  .app-content { padding: 0 !important; }
  .card { box-shadow: none !important; }
  .print-contract { break-inside: avoid; page-break-inside: avoid; }
}