/**
 * AACS Admin - Correções CSS Críticas
 * Garante que cores Tailwind e estilos funcionem corretamente
 */

/* ===========================================
   TAILWIND COLOR UTILITIES - CORES FALTANTES
   =========================================== */

/* Yellow - Amarelo */
.bg-yellow-50 { background-color: #fefce8 !important; }
.bg-yellow-100 { background-color: #fef3c7 !important; }
.bg-yellow-200 { background-color: #fde68a !important; }
.bg-yellow-300 { background-color: #fcd34d !important; }
.bg-yellow-400 { background-color: #fbbf24 !important; }
.bg-yellow-500 { background-color: #f59e0b !important; }
.bg-yellow-600 { background-color: #d97706 !important; }
.bg-yellow-700 { background-color: #b45309 !important; }
.bg-yellow-800 { background-color: #92400e !important; }
.bg-yellow-900 { background-color: #78350f !important; }

.text-yellow-50 { color: #fefce8 !important; }
.text-yellow-100 { color: #fef3c7 !important; }
.text-yellow-200 { color: #fde68a !important; }
.text-yellow-300 { color: #fcd34d !important; }
.text-yellow-400 { color: #fbbf24 !important; }
.text-yellow-500 { color: #f59e0b !important; }
.text-yellow-600 { color: #d97706 !important; }
.text-yellow-700 { color: #b45309 !important; }
.text-yellow-800 { color: #92400e !important; }
.text-yellow-900 { color: #78350f !important; }

.border-yellow-500 { border-color: #f59e0b !important; }
.border-yellow-600 { border-color: #d97706 !important; }

/* Red - Vermelho */
.bg-red-50 { background-color: #fef2f2 !important; }
.bg-red-100 { background-color: #fee2e2 !important; }
.bg-red-200 { background-color: #fecaca !important; }
.bg-red-300 { background-color: #fca5a5 !important; }
.bg-red-400 { background-color: #f87171 !important; }
.bg-red-500 { background-color: #ef4444 !important; }
.bg-red-600 { background-color: #dc2626 !important; }
.bg-red-700 { background-color: #b91c1c !important; }
.bg-red-800 { background-color: #991b1b !important; }
.bg-red-900 { background-color: #7f1d1d !important; }

.text-red-50 { color: #fef2f2 !important; }
.text-red-100 { color: #fee2e2 !important; }
.text-red-200 { color: #fecaca !important; }
.text-red-300 { color: #fca5a5 !important; }
.text-red-400 { color: #f87171 !important; }
.text-red-500 { color: #ef4444 !important; }
.text-red-600 { color: #dc2626 !important; }
.text-red-700 { color: #b91c1c !important; }
.text-red-800 { color: #991b1b !important; }
.text-red-900 { color: #7f1d1d !important; }

.border-red-500 { border-color: #ef4444 !important; }
.border-red-600 { border-color: #dc2626 !important; }

/* Blue - Azul */
.bg-blue-50 { background-color: #eff6ff !important; }
.bg-blue-100 { background-color: #dbeafe !important; }
.bg-blue-200 { background-color: #bfdbfe !important; }
.bg-blue-300 { background-color: #93c5fd !important; }
.bg-blue-400 { background-color: #60a5fa !important; }
.bg-blue-500 { background-color: #3b82f6 !important; }
.bg-blue-600 { background-color: #2563eb !important; }
.bg-blue-700 { background-color: #1d4ed8 !important; }
.bg-blue-800 { background-color: #1e40af !important; }
.bg-blue-900 { background-color: #1e3a8a !important; }

.text-blue-50 { color: #eff6ff !important; }
.text-blue-100 { color: #dbeafe !important; }
.text-blue-200 { color: #bfdbfe !important; }
.text-blue-300 { color: #93c5fd !important; }
.text-blue-400 { color: #60a5fa !important; }
.text-blue-500 { color: #3b82f6 !important; }
.text-blue-600 { color: #2563eb !important; }
.text-blue-700 { color: #1d4ed8 !important; }
.text-blue-800 { color: #1e40af !important; }
.text-blue-900 { color: #1e3a8a !important; }

/* Green - Verde */
.bg-green-50 { background-color: #f0fdf4 !important; }
.bg-green-100 { background-color: #dcfce7 !important; }
.bg-green-200 { background-color: #bbf7d0 !important; }
.bg-green-300 { background-color: #86efac !important; }
.bg-green-400 { background-color: #4ade80 !important; }
.bg-green-500 { background-color: #22c55e !important; }
.bg-green-600 { background-color: #16a34a !important; }
.bg-green-700 { background-color: #15803d !important; }
.bg-green-800 { background-color: #166534 !important; }
.bg-green-900 { background-color: #14532d !important; }

.text-green-50 { color: #f0fdf4 !important; }
.text-green-100 { color: #dcfce7 !important; }
.text-green-200 { color: #bbf7d0 !important; }
.text-green-300 { color: #86efac !important; }
.text-green-400 { color: #4ade80 !important; }
.text-green-500 { color: #22c55e !important; }
.text-green-600 { color: #16a34a !important; }
.text-green-700 { color: #15803d !important; }
.text-green-800 { color: #166534 !important; }
.text-green-900 { color: #14532d !important; }

/* ===========================================
   SVG/ICON SIZE FIXES - CORRIGIR ÍCONES GIGANTES
   =========================================== */

/* Tamanhos corretos de ícones */
svg, .svg-icon {
    display: inline-block;
    vertical-align: middle;
}

/* Width utilities */
.w-3 { width: 0.75rem !important; }
.w-4 { width: 1rem !important; }
.w-5 { width: 1.25rem !important; }
.w-6 { width: 1.5rem !important; }
.w-8 { width: 2rem !important; }
.w-10 { width: 2.5rem !important; }
.w-12 { width: 3rem !important; }

/* Height utilities */
.h-3 { height: 0.75rem !important; }
.h-4 { height: 1rem !important; }
.h-5 { height: 1.25rem !important; }
.h-6 { height: 1.5rem !important; }
.h-8 { height: 2rem !important; }
.h-10 { height: 2.5rem !important; }
.h-12 { height: 3rem !important; }

/* Corrigir ícones no header especificamente */
nav svg,
header svg {
    flex-shrink: 0;
}

nav .w-4,
header .w-4 {
    width: 1rem !important;
    height: 1rem !important;
}

nav .w-5,
header .w-5 {
    width: 1.25rem !important;
    height: 1.25rem !important;
}

nav .w-6,
header .w-6 {
    width: 1.5rem !important;
    height: 1.5rem !important;
}

/* ===========================================
   HOVER STATES - GARANTIR HOVER FUNCIONE
   =========================================== */

/* Header link hover */
nav a:hover,
header a:hover {
    transition: all 0.2s ease-in-out;
}

nav a.hover\:bg-gray-100:hover,
header a.hover\:bg-gray-100:hover,
nav button.hover\:bg-gray-100:hover,
header button.hover\:bg-gray-100:hover {
    background-color: #f3f4f6 !important;
}

nav a.hover\:text-blue-600:hover,
header a.hover\:text-blue-600:hover {
    color: #2563eb !important;
}

/* Button hover states */
.hover\:bg-gray-50:hover {
    background-color: #f9fafb !important;
}

.hover\:bg-gray-100:hover {
    background-color: #f3f4f6 !important;
}

.hover\:bg-gray-200:hover {
    background-color: #e5e7eb !important;
}

.hover\:bg-blue-600:hover {
    background-color: #2563eb !important;
}

.hover\:bg-blue-700:hover {
    background-color: #1d4ed8 !important;
}

/* Text hover */
.hover\:text-gray-900:hover {
    color: #111827 !important;
}

.hover\:text-blue-600:hover {
    color: #2563eb !important;
}

/* ===========================================
   USER INFO DISPLAY - GARANTIR VISIBILIDADE
   =========================================== */

/* User info container */
.user-info-container {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    padding: 0.5rem 0.75rem !important;
}

/* User text */
.user-info-container .text-sm {
    font-size: 0.875rem !important;
    line-height: 1.25rem !important;
}

.user-info-container .text-xs {
    font-size: 0.75rem !important;
    line-height: 1rem !important;
}

/* ===========================================
   UTILITY CLASSES ESSENCIAIS
   =========================================== */

/* Padding */
.p-2 { padding: 0.5rem !important; }
.p-3 { padding: 0.75rem !important; }
.p-4 { padding: 1rem !important; }
.p-5 { padding: 1.25rem !important; }

.px-2 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
.px-3 { padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
.px-4 { padding-left: 1rem !important; padding-right: 1rem !important; }

.py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
.py-3 { padding-top: 0.75rem !important; padding-bottom: 0.75rem !important; }
.py-4 { padding-top: 1rem !important; padding-bottom: 1rem !important; }

/* Margin */
.m-0 { margin: 0 !important; }
.m-2 { margin: 0.5rem !important; }
.m-4 { margin: 1rem !important; }

.mt-1 { margin-top: 0.25rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mt-4 { margin-top: 1rem !important; }

.ml-2 { margin-left: 0.5rem !important; }
.ml-3 { margin-left: 0.75rem !important; }
.ml-5 { margin-left: 1.25rem !important; }

/* Border Radius */
.rounded { border-radius: 0.25rem !important; }
.rounded-md { border-radius: 0.375rem !important; }
.rounded-lg { border-radius: 0.5rem !important; }
.rounded-xl { border-radius: 0.75rem !important; }

/* Shadow */
.shadow { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important; }
.shadow-md { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important; }
.shadow-lg { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important; }

/* Text size */
.text-xs { font-size: 0.75rem !important; line-height: 1rem !important; }
.text-sm { font-size: 0.875rem !important; line-height: 1.25rem !important; }
.text-base { font-size: 1rem !important; line-height: 1.5rem !important; }
.text-lg { font-size: 1.125rem !important; line-height: 1.75rem !important; }
.text-xl { font-size: 1.25rem !important; line-height: 1.75rem !important; }
.text-2xl { font-size: 1.5rem !important; line-height: 2rem !important; }

/* Font weight */
.font-medium { font-weight: 500 !important; }
.font-semibold { font-weight: 600 !important; }
.font-bold { font-weight: 700 !important; }

/* Text color - Gray */
.text-gray-400 { color: #9ca3af !important; }
.text-gray-500 { color: #6b7280 !important; }
.text-gray-600 { color: #4b5563 !important; }
.text-gray-700 { color: #374151 !important; }
.text-gray-900 { color: #111827 !important; }

/* Text color - White */
.text-white { color: #ffffff !important; }

/* Background - White/Gray */
.bg-white { background-color: #ffffff !important; }
.bg-gray-50 { background-color: #f9fafb !important; }
.bg-gray-100 { background-color: #f3f4f6 !important; }
.bg-gray-200 { background-color: #e5e7eb !important; }
.bg-gray-900 { background-color: #111827 !important; }

/* Border */
.border { border-width: 1px !important; }
.border-t { border-top-width: 1px !important; }
.border-b { border-bottom-width: 1px !important; }
.border-gray-200 { border-color: #e5e7eb !important; }

/* Transitions */
.transition-colors { transition-property: color, background-color, border-color !important; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; transition-duration: 150ms !important; }
.transition-transform { transition-property: transform !important; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; transition-duration: 150ms !important; }

/* Transform */
.rotate-180 { transform: rotate(180deg) !important; }

/* Display */
.hidden { display: none !important; }
.block { display: block !important; }
.inline-block { display: inline-block !important; }

/* Flex */
.flex { display: flex !important; }
.items-center { align-items: center !important; }
.justify-between { justify-content: space-between !important; }
.gap-1 { gap: 0.25rem !important; }
.gap-2 { gap: 0.5rem !important; }
.gap-3 { gap: 0.75rem !important; }

/* ===========================================
   RESPONSIVE UTILITIES
   =========================================== */

@media (min-width: 1024px) {
    .lg\:flex { display: flex !important; }
    .lg\:hidden { display: none !important; }
    .lg\:px-6 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
    .lg\:h-10 { height: 2.5rem !important; }
}

@media (max-width: 1023px) {
    nav svg.w-5,
    header svg.w-5 {
        width: 1.25rem !important;
        height: 1.25rem !important;
    }
    
    nav svg.w-6,
    header svg.w-6 {
        width: 1.5rem !important;
        height: 1.5rem !important;
    }
}


@keyframes fadeInOut {
    0% { opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { opacity: 0; }
}
