/*
This file contains CSS custom properties for primary colors
to ensure Tailwind CSS can properly generate color utilities
*/

:root {
  --color-primary-50: 244 246 251;
  --color-primary-100: 232 236 247;
  --color-primary-200: 213 221 238;
  --color-primary-300: 185 198 224;
  --color-primary-400: 151 169 207;
  --color-primary-500: 123 140 192;
  --color-primary-600: 103 114 177;
  --color-primary-700: 92 99 162;
  --color-primary-800: 77 82 133;
  --color-primary-900: 66 71 107;
  --color-primary-950: 8 21 52;
  --color-primary: 8 21 52;
}

/* Force inclusion of primary color classes */
.text-primary-600 { color: rgb(103 114 177); }
.text-primary-500 { color: rgb(123 140 192); }
.text-primary { color: rgb(8 21 52); }
.bg-primary-600 { background-color: rgb(103 114 177); }
.bg-primary-700 { background-color: rgb(92 99 162); }
.bg-primary-800 { background-color: rgb(77 82 133); }
.hover\:bg-primary-700:hover { background-color: rgb(92 99 162); }
.hover\:bg-primary-600\/90:hover { background-color: rgb(103 114 177 / 0.9); }
.hover\:text-primary-500:hover { color: rgb(123 140 192); }
.focus\:ring-primary-500:focus { --tw-ring-color: rgb(123 140 192); }
.focus\:border-primary-500:focus { border-color: rgb(123 140 192); }
.border-primary-500 { border-color: rgb(123 140 192); }
.ring-primary-500 { --tw-ring-color: rgb(123 140 192); }

/* Gradient classes for dashboard */
.bg-gradient-to-r { 
  background-image: linear-gradient(to right, var(--tw-gradient-stops)) !important; 
}
.from-primary-800 { 
  --tw-gradient-from: #4d5285 !important; 
  --tw-gradient-to: rgba(77, 82, 133, 0) !important; 
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; 
}
.via-primary-700 { 
  --tw-gradient-to: rgba(92, 99, 162, 0) !important; 
  --tw-gradient-stops: var(--tw-gradient-from), #5c63a2, var(--tw-gradient-to) !important; 
}
/* Navbar overflow scroll styling - HIDDEN SCROLLBAR */
.lg\:scrollbar-none {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* Internet Explorer 10+ */
}

.lg\:scrollbar-none::-webkit-scrollbar {
  display: none; /* WebKit browsers */
}

/* Remove any visible scrollbar from navbar */
.lg\:overflow-x-auto {
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.lg\:overflow-x-auto::-webkit-scrollbar {
  display: none;
}

/* Ensure dropdowns appear above all other content with higher z-index */
.dropdown-menu {
  z-index: 9999 !important;
  position: absolute;
}

/* Enhanced z-index for navbar dropdowns */
nav .relative > div[x-show] {
  z-index: 9999 !important;
  position: absolute !important;
}

/* Fix for Alpine.js initialization issues */
[x-cloak] { 
  display: none !important; 
}

/* Ensure navbar dropdowns work properly */
.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

/* Additional z-index fix for navbar dropdowns */
nav .relative > div[x-show] {
  z-index: 9999;
}

.to-primary-600 { 
  --tw-gradient-to: #6772b1 !important; 
}

/* Direct gradient fallbacks for all dashboard sections */
.bg-gradient-to-r.from-primary-800.via-primary-700.to-primary-600 {
  background: linear-gradient(to right, #4d5285, #5c63a2, #6772b1) !important;
}

.bg-gradient-to-r.from-blue-500.to-blue-600 {
  background: linear-gradient(to right, #3b82f6, #2563eb) !important;
}

.bg-gradient-to-r.from-orange-500.to-orange-600 {
  background: linear-gradient(to right, #f97316, #ea580c) !important;
}

.bg-gradient-to-r.from-green-500.to-green-600 {
  background: linear-gradient(to right, #10b981, #059669) !important;
}

.bg-gradient-to-r.from-green-500.to-emerald-600 {
  background: linear-gradient(to right, #10b981, #059669) !important;
}

.bg-gradient-to-r.from-red-500.to-rose-600 {
  background: linear-gradient(to right, #ef4444, #dc2626) !important;
}

.bg-gradient-to-r.from-yellow-500.to-orange-600 {
  background: linear-gradient(to right, #eab308, #ea580c) !important;
}

.bg-gradient-to-r.from-purple-500.to-purple-600 {
  background: linear-gradient(to right, #8b5cf6, #7c3aed) !important;
}

/* Z-index fix for dropdown menu */
.dropdown-menu {
    z-index: 999 !important;
}
