/**
 * ============================================================
 * ESTILOS GLOBALES - FUNDACIÓN DESPERTAR HCE
 * v3.0 - Tema Azul Profesional / Dorado Premium
 * ============================================================
 */

:root {
  /* Paleta Principal Azul/Dorado */
  --azul-oscuro: #0B1C33;
  --azul-primario: #1A3A5C;
  --azul-medio: #2E5A8C;
  --azul-claro: #4A90D9;
  --azul-fondo: #EAF2FA;
  --azul-accent: #00C8FF;

  --dorado: #D4A017;
  --dorado-claro: #F0C75E;
  --dorado-oscuro: #B8860B;
  --dorado-fondo: #FDF8E8;

  --gris-fondo: #F4F6F8;
  --card-bg: #FFFFFF;
  --texto-primario: #1A202C;
  --texto-secundario: #4A5568;
  --texto-muted: #718096;
  --borde: #E2E8F0;
  --exito: #38A169;
  --peligro: #E53E3E;
  --advertencia: #D69E2E;
  --info: #3182CE;

  /* Sombras premium */
  --shadow-sm: 0 1px 3px rgba(11, 28, 51, 0.08);
  --shadow-md: 0 4px 12px rgba(11, 28, 51, 0.10);
  --shadow-lg: 0 10px 30px rgba(11, 28, 51, 0.14);
  --shadow-glow: 0 0 20px rgba(212, 160, 23, 0.25);
}

/* ===== UTILIDADES ===== */
.text-azul { color: var(--azul-primario) !important; }
.text-dorado { color: var(--dorado) !important; }
.text-azul-claro { color: var(--azul-claro) !important; }
.border-azul { border-color: var(--azul-primario) !important; }
.bg-azul { background-color: var(--azul-primario) !important; }
.bg-azul-oscuro { background-color: var(--azul-oscuro) !important; }
.bg-azul-claro { background-color: var(--azul-claro) !important; }
.bg-azul-fondo { background-color: var(--azul-fondo) !important; }
.bg-dorado { background-color: var(--dorado) !important; }
.bg-dorado-fondo { background-color: var(--dorado-fondo) !important; }

/* ===== GRADIENTES PREMIUM ===== */
.gradient-azul {
  background: linear-gradient(135deg, var(--azul-oscuro) 0%, var(--azul-primario) 50%, var(--azul-medio) 100%);
}
.gradient-azul-card {
  background: linear-gradient(145deg, #1A3A5C 0%, #2E5A8C 100%);
}
.gradient-dorado {
  background: linear-gradient(135deg, var(--dorado) 0%, var(--dorado-claro) 100%);
}
.gradient-hero {
  background: linear-gradient(135deg, var(--azul-oscuro) 0%, var(--azul-primario) 60%, var(--azul-medio) 100%);
}

/* ===== BOTONES ===== */
.btn-despertar {
  background: linear-gradient(135deg, var(--azul-primario), var(--azul-medio));
  color: #fff;
  border: none;
  padding: 0.55rem 1.35rem;
  border-radius: 0.6rem;
  font-weight: 600;
  font-size: 0.9rem;
  transition: all 0.25s ease;
  box-shadow: var(--shadow-sm);
}
.btn-despertar:hover, .btn-despertar:focus {
  background: linear-gradient(135deg, var(--azul-medio), var(--azul-primario));
  color: #fff;
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}

.btn-outline-despertar {
  background: transparent;
  color: var(--azul-primario);
  border: 1.5px solid var(--azul-primario);
  padding: 0.45rem 1.1rem;
  border-radius: 0.6rem;
  font-weight: 600;
  font-size: 0.9rem;
  transition: all 0.25s ease;
}
.btn-outline-despertar:hover, .btn-outline-despertar:focus {
  background: var(--azul-primario);
  color: #fff;
  box-shadow: var(--shadow-sm);
}

.btn-dorado {
  background: linear-gradient(135deg, var(--dorado), var(--dorado-claro));
  color: #fff;
  border: none;
  font-weight: 600;
}
.btn-dorado:hover { background: linear-gradient(135deg, var(--dorado-oscuro), var(--dorado)); color: #fff; }

.btn-ghost {
  background: transparent;
  color: var(--texto-secundario);
  border: 1px solid var(--borde);
  transition: all 0.2s;
}
.btn-ghost:hover { background: var(--azul-fondo); color: var(--azul-primario); border-color: var(--azul-claro); }

/* ===== CARDS ===== */
.card-despertar {
  background: var(--card-bg);
  border-radius: 1rem;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--borde);
  overflow: hidden;
  transition: all 0.3s ease;
}
.card-despertar:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.card-header-despertar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  background: linear-gradient(90deg, var(--azul-fondo), #fff);
  border-bottom: 1px solid var(--borde);
  font-weight: 700;
}
.card-header-despertar h5, .card-header-despertar h6 {
  margin: 0;
  font-weight: 700;
  color: var(--azul-primario);
}

.card-premium {
  background: var(--card-bg);
  border-radius: 1rem;
  box-shadow: var(--shadow-sm);
  border: 1px solid rgba(212, 160, 23, 0.15);
  overflow: hidden;
  transition: all 0.3s ease;
  position: relative;
}
.card-premium::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--dorado), var(--dorado-claro), var(--dorado));
  opacity: 0.6;
}
.card-premium:hover {
  box-shadow: var(--shadow-md), var(--shadow-glow);
  transform: translateY(-3px);
}

/* ===== STAT CARDS / KPI ===== */
.kpi-card {
  background: var(--card-bg);
  border-radius: 1rem;
  padding: 1.5rem;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--borde);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
.kpi-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
.kpi-card .kpi-icon-wrap {
  width: 56px;
  height: 56px;
  border-radius: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  flex-shrink: 0;
}
.kpi-card .kpi-number {
  font-size: 1.85rem;
  font-weight: 800;
  color: var(--azul-oscuro);
  line-height: 1.1;
  letter-spacing: -0.5px;
}
.kpi-card .kpi-label {
  font-size: 0.82rem;
  color: var(--texto-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.kpi-card .kpi-trend {
  font-size: 0.8rem;
  margin-top: 0.4rem;
  font-weight: 600;
}
.kpi-card .kpi-glow-bg {
  position: absolute;
  top: -20px; right: -20px;
  width: 100px; height: 100px;
  border-radius: 50%;
  opacity: 0.06;
  filter: blur(20px);
}

/* Colores KPI */
.kpi-azul .kpi-icon-wrap { background: linear-gradient(135deg, #E3F2FD, #BBDEFB); color: #1565C0; }
.kpi-azul .kpi-glow-bg { background: #1565C0; }
.kpi-dorado .kpi-icon-wrap { background: linear-gradient(135deg, var(--dorado-fondo), #FFF8E1); color: var(--dorado-oscuro); }
.kpi-dorado .kpi-glow-bg { background: var(--dorado); }
.kpi-verde .kpi-icon-wrap { background: linear-gradient(135deg, #E8F5E9, #C8E6C9); color: #2E7D32; }
.kpi-verde .kpi-glow-bg { background: #2E7D32; }
.kpi-naranja .kpi-icon-wrap { background: linear-gradient(135deg, #FFF3E0, #FFE0B2); color: #E65100; }
.kpi-naranja .kpi-glow-bg { background: #E65100; }
.kpi-morado .kpi-icon-wrap { background: linear-gradient(135deg, #F3E5F5, #E1BEE7); color: #6A1B9A; }
.kpi-morado .kpi-glow-bg { background: #6A1B9A; }
.kpi-rojo .kpi-icon-wrap { background: linear-gradient(135deg, #FFEBEE, #FFCDD2); color: #C62828; }
.kpi-rojo .kpi-glow-bg { background: #C62828; }

/* ===== TABLAS ===== */
.table-despertar {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
.table-despertar th {
  background: linear-gradient(180deg, #F8FAFC, #EDF2F7);
  color: var(--azul-primario);
  font-weight: 700;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  padding: 0.875rem 1rem;
  border-bottom: 2px solid var(--borde);
}
.table-despertar td {
  padding: 0.875rem 1rem;
  border-bottom: 1px solid #EDF2F7;
  vertical-align: middle;
  font-size: 0.9rem;
  color: var(--texto-secundario);
}
.table-despertar tbody tr:hover {
  background-color: #F8FAFC;
}

/* ===== BADGES ETAPA ===== */
.badge-etapa {
  display: inline-block;
  padding: 0.35em 0.85em;
  font-size: 0.75rem;
  font-weight: 700;
  border-radius: 999px;
  letter-spacing: 0.3px;
}
.badge-etapa-1 { background: #E8F5E9; color: #1B5E20; }
.badge-etapa-2 { background: #FFF8E1; color: #B8860B; }
.badge-etapa-3 { background: #FFEBEE; color: #C62828; }
.badge-etapa-4 { background: #E3F2FD; color: #0D47A1; }

/* ===== TABLA MOBILE CARDS ===== */
@media (max-width: 767.98px) {
  .table-mobile-cards thead { display: none; }
  .table-mobile-cards tr {
    display: block;
    margin-bottom: 1rem;
    background: var(--card-bg);
    border-radius: 1rem;
    box-shadow: var(--shadow-sm);
    padding: 0.75rem;
    border: 1px solid var(--borde);
  }
  .table-mobile-cards td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: none;
    padding: 0.5rem 0;
    border-bottom: 1px solid #EDF2F7;
  }
  .table-mobile-cards td:last-child { border-bottom: none; }
  .table-mobile-cards td::before {
    content: attr(data-label);
    font-weight: 700;
    color: var(--texto-muted);
    font-size: 0.78rem;
    text-transform: uppercase;
  }
}

/* ===== NOTIFICACIONES ===== */
#notifMenu .dropdown-item.unread {
  background-color: #E3F2FD;
  border-left: 3px solid var(--azul-claro);
}
.notif-dropdown-item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  cursor: pointer;
  border-bottom: 1px solid #EDF2F7;
}
.notif-dropdown-item:hover {
  background-color: #F8FAFC;
}
.notif-icon-sm {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.notif-text { font-size: 0.85rem; line-height: 1.4; }
.notif-time { font-size: 0.75rem; color: #A0AEC0; margin-top: 0.25rem; }

/* ===== EMPTY STATE ===== */
.empty-state {
  text-align: center;
  padding: 2.5rem 1rem;
  color: #A0AEC0;
}
.empty-state i {
  font-size: 2.5rem;
  margin-bottom: 0.75rem;
  display: block;
  opacity: 0.5;
}

/* ===== BOTONES ADICIONALES ===== */
.btn-verde {
  background-color: var(--exito);
  color: #fff;
  border: none;
}
.btn-verde:hover { background-color: #2F855A; color: #fff; }
.btn-outline-verde {
  background-color: transparent;
  color: var(--exito);
  border: 1px solid var(--exito);
}
.btn-outline-verde:hover { background-color: var(--exito); color: #fff; }
.btn-accion {
  padding: 0.25rem 0.5rem;
  font-size: 0.8rem;
  border-radius: 0.375rem;
}

/* ===== CARDS ADICIONALES ===== */
.card-custom {
  border: none;
  border-radius: 1rem;
  box-shadow: var(--shadow-sm);
  background: var(--card-bg);
  border: 1px solid var(--borde);
}
.card-header-custom {
  background: linear-gradient(90deg, var(--azul-fondo), #fff);
  border-bottom: 1px solid var(--borde);
  font-weight: 700;
  padding: 1rem 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--azul-primario);
}
.card-stats {
  text-align: center;
  padding: 1.25rem;
}

/* ===== MONITOREO ===== */
.monitoreo-card {
  padding: 1rem;
  border-radius: 1rem;
  background: var(--card-bg);
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--borde);
}
.monitoreo-status {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
  font-size: 0.9rem;
}
.monitoreoActivo { color: var(--exito); }

/* ===== SMART ADMIN WIDGETS ===== */
.sa-card {
  background: var(--card-bg);
  border-radius: 1rem;
  box-shadow: var(--shadow-sm);
  padding: 1.25rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  border: 1px solid var(--borde);
}
.sa-icon-wrap {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  flex-shrink: 0;
}
.sa-number {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--azul-oscuro);
  line-height: 1;
}
.sa-label {
  font-size: 0.8rem;
  color: var(--texto-muted);
  font-weight: 600;
}
.sa-sub {
  font-size: 0.75rem;
  color: #A0AEC0;
  margin-top: 0.25rem;
}
.sa-tool {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #F7FAFC;
  color: #718096;
  transition: all 0.2s;
}
.sa-tool:hover { background: #EDF2F7; color: #2D3748; }
.sa-alert-bar {
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.9rem;
}

/* ===== FORMULARIOS ===== */
.form-section-title {
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--azul-primario);
  margin-bottom: 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--azul-claro);
}

/* ===== BADGES ===== */
.badge-nivel {
  display: inline-block;
  padding: 0.35em 0.85em;
  font-size: 0.75rem;
  font-weight: 700;
  border-radius: 999px;
}
.fulltext-badge {
  font-size: 0.7rem;
  padding: 0.2em 0.5em;
  border-radius: 0.25rem;
  font-weight: 700;
}

/* ===== TIMELINE ===== */
.timeline {
  position: relative;
  padding-left: 1.5rem;
}
.timeline::before {
  content: '';
  position: absolute;
  left: 6px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--borde);
}
.timeline-item {
  position: relative;
  padding-bottom: 1.25rem;
}
.timeline-item::before {
  content: '';
  position: absolute;
  left: -1.25rem;
  top: 4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--azul-claro);
  border: 2px solid #fff;
  box-shadow: 0 0 0 2px var(--azul-fondo);
}
.status-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

/* ===== PERMISOS / LOGS / STOCK ===== */
.perm-check {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.25rem 0.75rem;
  border-radius: 0.375rem;
  background: #F7FAFC;
  font-size: 0.85rem;
}
.log-row {
  padding: 0.75rem;
  border-radius: 0.5rem;
  background: var(--card-bg);
  margin-bottom: 0.5rem;
  border: 1px solid var(--borde);
}
.med-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 0;
  border-bottom: 1px solid #EDF2F7;
}
.stockBajo { color: var(--peligro); font-weight: 700; }
.stockTotal { color: var(--texto-muted); }

/* ===== TRAZA BOX ===== */
.traza-box {
  background: #F7FAFC;
  border-radius: 0.5rem;
  padding: 1rem;
  border-left: 4px solid var(--azul-claro);
}

/* ===== LOGIN ===== */
.login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--azul-oscuro) 0%, var(--azul-primario) 100%);
}
.login-box {
  background: var(--card-bg);
  border-radius: 1rem;
  box-shadow: var(--shadow-lg);
  padding: 2rem;
  width: 100%;
  max-width: 420px;
}
.login-logo {
  text-align: center;
  margin-bottom: 1.5rem;
}

/* ===== TOGGLE SWITCH ===== */
.toggle-switch {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
}
.toggle-slider {
  position: absolute;
  cursor: pointer;
  top: 0; left: 0; right: 0; bottom: 0;
  background-color: #CBD5E0;
  border-radius: 24px;
  transition: 0.3s;
}
.toggle-slider::before {
  position: absolute;
  content: '';
  height: 18px;
  width: 18px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: 0.3s;
}
.toggle-switch input:checked + .toggle-slider { background-color: var(--azul-claro); }
.toggle-switch input:checked + .toggle-slider::before { transform: translateX(20px); }

/* ===== ACCORDION PERSONALIZADO ===== */
.accordion-button:not(.collapsed) {
  background-color: var(--azul-fondo);
  color: var(--azul-primario);
  font-weight: 700;
}
.accordion-button:focus { box-shadow: 0 0 0 0.2rem rgba(26, 58, 92, 0.15); }

/* ===== NAV TABS ===== */
.nav-tabs .nav-link.active {
  color: var(--azul-primario);
  font-weight: 700;
  border-bottom-color: var(--azul-primario);
}
.nav-tabs .nav-link { color: var(--texto-muted); }
.nav-tabs .nav-link:hover { color: var(--azul-primario); }

/* ===== PAGINACIÓN ===== */
.pagination .page-item.active .page-link {
  background-color: var(--azul-primario);
  border-color: var(--azul-primario);
}
.pagination .page-link { color: var(--azul-primario); }
.pagination .page-link:hover { color: var(--azul-medio); }

/* ===== SIDEBAR PREMIUM ===== */
.sidebar-header {
  padding: 1.25rem;
  border-bottom: 1px solid var(--borde);
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: linear-gradient(90deg, var(--card-bg), var(--azul-fondo));
}
.sidebar-menu { padding: 0.75rem 0; }
.sidebar-nav { list-style: none; padding: 0; margin: 0; }
.sidebar-nav li { position: relative; }
.sidebar-nav a {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 1.25rem;
  color: var(--texto-secundario);
  font-size: 0.9rem;
  font-weight: 600;
  transition: all 0.2s;
  border-left: 3px solid transparent;
  text-decoration: none;
}
.sidebar-nav a:hover,
.sidebar-nav a.active {
  color: var(--azul-primario);
  background: var(--azul-fondo);
  border-left-color: var(--dorado);
}
.sidebar-nav a i { width: 20px; text-align: center; }

/* Submenu */
.has-submenu .submenu {
  list-style: none;
  padding: 0;
  margin: 0;
  background: #F8FAFC;
  display: none;
}
.has-submenu.open .submenu { display: block; }
.submenu a {
  padding-left: 2.5rem;
  font-size: 0.85rem;
  font-weight: 500;
}
.submenu-arrow {
  margin-left: auto;
  transition: transform 0.2s;
  font-size: 0.75rem;
}
.has-submenu.open .submenu-arrow { transform: rotate(90deg); }

/* Menú categoría en sidebar */
.sidebar-nav .menu-categoria > a {
  font-weight: 700;
  color: var(--azul-oscuro);
  background: linear-gradient(90deg, #F8FAFC, #EDF2F7);
  border-left: 4px solid var(--dorado);
}
.sidebar-nav .menu-categoria > a:hover {
  background: linear-gradient(90deg, #EDF2F7, #E2E8F0);
}
.sidebar-nav .submenu {
  padding-left: 0.5rem;
}

/* ===== LAYOUT ===== */
body {
  background-color: var(--gris-fondo);
  color: var(--texto-primario);
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
}
.dashboard-body {
  display: flex;
  min-height: 100vh;
}
.sidebar {
  width: 270px;
  background: var(--card-bg);
  border-right: 1px solid var(--borde);
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0; left: 0; bottom: 0;
  z-index: 1040;
  transition: transform 0.3s ease;
}
.main-content {
  flex: 1;
  margin-left: 270px;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.top-header {
  background: linear-gradient(90deg, var(--card-bg), var(--azul-fondo));
  border-bottom: 1px solid var(--borde);
  padding: 0.75rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 1030;
}
.main-content-area {
  flex: 1;
  padding: 1.5rem;
}
.footer-app {
  background: linear-gradient(90deg, var(--azul-oscuro), var(--azul-primario));
  border-top: none;
  padding: 1rem 1.5rem;
  text-align: center;
  font-size: 0.82rem;
  color: rgba(255,255,255,0.7);
}
.footer-app strong { color: var(--dorado-claro); }

/* ===== QUICK ACCESS CARDS ===== */
.quick-access-card {
  background: var(--card-bg);
  border-radius: 1rem;
  padding: 1.25rem;
  border: 1px solid var(--borde);
  transition: all 0.3s ease;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.quick-access-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
  border-color: rgba(212, 160, 23, 0.3);
  color: inherit;
}
.quick-access-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  flex-shrink: 0;
}
.quick-access-title {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--azul-oscuro);
}
.quick-access-desc {
  font-size: 0.78rem;
  color: var(--texto-muted);
}

/* ===== SUPERADMIN BADGE ===== */
.superadmin-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--dorado), var(--dorado-claro));
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* ===== DASHBOARD HERO ===== */
.dashboard-hero {
  background: linear-gradient(135deg, var(--azul-oscuro) 0%, var(--azul-primario) 60%, var(--azul-medio) 100%);
  border-radius: 1rem;
  padding: 1.75rem 2rem;
  color: #fff;
  margin-bottom: 1.5rem;
  position: relative;
  overflow: hidden;
}
.dashboard-hero::after {
  content: '';
  position: absolute;
  top: -50%; right: -10%;
  width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(212,160,23,0.15) 0%, transparent 70%);
  border-radius: 50%;
}
.dashboard-hero h2 {
  font-weight: 800;
  font-size: 1.6rem;
  margin-bottom: 0.25rem;
}
.dashboard-hero .hero-date {
  opacity: 0.85;
  font-size: 0.9rem;
}

/* ===== ANIMACIONES ===== */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(15px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in {
  animation: fadeInUp 0.5s ease forwards;
}

/* Sidebar toggle en móvil */
@media (max-width: 991.98px) {
  .sidebar { transform: translateX(-100%); }
  .sidebar.show { transform: translateX(0); }
  .main-content { margin-left: 0; }
  .dashboard-hero { padding: 1.25rem 1.5rem; }
  .dashboard-hero h2 { font-size: 1.3rem; }
  .kpi-card { padding: 1rem; }
  .kpi-card .kpi-number { font-size: 1.5rem; }
}

/* Scrollbar premium */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #F7FAFC; }
::-webkit-scrollbar-thumb { background: #CBD5E0; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #A0AEC0; }

/* ===== ICONOS SIDEBAR Y SUBMENÚ ===== */
.submenu a {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 1.25rem 0.55rem 3rem;
    font-size: 0.88rem;
    transition: all 0.2s ease;
}
.submenu a i {
    font-size: 0.78rem;
    width: 1.1rem;
    text-align: center;
    opacity: 0.8;
    transition: all 0.2s ease;
}
.submenu a:hover i,
.submenu a.active i {
    opacity: 1;
    transform: scale(1.15);
}
.sidebar-nav a {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.sidebar-nav a i {
    transition: transform 0.2s ease, color 0.2s ease;
}
.sidebar-nav a:hover > i,
.sidebar-nav a.active > i {
    transform: scale(1.1);
}
.sidebar-nav .chevron {
    margin-left: auto;
    transition: transform 0.3s ease;
    font-size: 0.75rem;
    opacity: 0.7;
}

/* ===== ICONOS EN TABLAS ===== */
.table-card thead th i {
    margin-right: 0.4rem;
    opacity: 0.85;
}
.table-card tbody td i {
    margin-right: 0.35rem;
    opacity: 0.75;
}

/* ===== ICONOS EN BOTONES ===== */
.btn-despertar i,
.btn-outline-despertar i,
.btn i {
    margin-right: 0.4rem;
    font-size: 0.92em;
}
.btn-sm i {
    margin-right: 0.25rem;
    font-size: 0.85em;
}

/* ===== ACCESOS RÁPIDOS ===== */
.quick-access-card i {
    transition: transform 0.25s ease, color 0.25s ease;
}
.quick-access-card:hover i {
    transform: scale(1.15);
}
.quick-access-card .text-muted.small i {
    margin-right: 0.3rem;
    font-size: 0.75rem;
}

/* ===== KPIX CARDS ICONOS ===== */
.kpi-card i {
    transition: transform 0.3s ease;
}
.kpi-card:hover i {
    transform: scale(1.12) rotate(-5deg);
}

/* ===== HEADERS CON ICONOS ===== */
.section-title i,
.card-hce .card-title i {
    margin-right: 0.5rem;
    opacity: 0.9;
}

/* ===== NOTIFICACIONES ICONO ===== */
.notification-bell i {
    transition: transform 0.2s ease;
}
.notification-bell:hover i {
    transform: rotate(15deg) scale(1.1);
}

/* ===== ANIMACIONES DE ENTRADA PARA ICONOS ===== */
@keyframes iconPop {
    0% { transform: scale(0.5); opacity: 0; }
    70% { transform: scale(1.15); opacity: 1; }
    100% { transform: scale(1); opacity: 1; }
}
.icon-pop {
    animation: iconPop 0.4s ease forwards;
}