/* Menú lateral activo */

.dark a.active{
    background-color: rgba(27,51,91,.35) !important;
    color: #ffffff !important;
}

a.active{
    background-color: rgba(27,51,91,.15) !important;
}

/* Hover menú lateral */
.dark a.active,
.dark a.active * {
    color: #ffffff !important;
}

/* =========================
   TRANSICIÓN GLOBAL
========================= */
a {
    transition: all 0.2s ease;
}

/* =========================
   ACTIVE STATE
========================= */

/* Light mode */
a.active {
    background-color: rgba(59, 130, 246, 0.15) !important;
    color: #1d4ed8 !important;
}

/* Dark mode */
.dark a.active {
    background-color: rgba(59, 130, 246, 0.25) !important;
    color: #ffffff !important;
}

/* Mantener color en hijos */
a.active * {
    color: inherit !important;
}

/* =========================
   HOVER STATE
========================= */

/* Light mode hover */
a:hover {
    background-color: rgba(59, 130, 246, 0.10) !important;
    color: #1d4ed8 !important;
}

/* Dark mode hover */
.dark a:hover {
    background-color: rgba(59, 130, 246, 0.18) !important;
    color: #93c5fd !important;
}

/* =========================
   FIX UNFOLD / TAILWIND
========================= */

.hover\:text-primary-600:hover {
    color: #1d4ed8 !important;
}

.dark .hover\:text-primary-600:hover {
    color: #93c5fd !important;
}

.dark .text-link,
.dark .text-link * {
    color: #ffffff !important;
}