/* Data 4 Admin Panel - Custom Styles */

/* Persistir Alpine.js state */
[x-cloak] { display: none !important; }

/* Variables de esquemas de color */
:root,
[data-scheme="blue"] {
  /* Blue Scheme (Default) */
  --primary-50: 239 246 255;
  --primary-100: 219 234 254;
  --primary-200: 191 219 254;
  --primary-300: 147 197 253;
  --primary-400: 96 165 250;
  --primary-500: 59 130 246;
  --primary-600: 37 99 235;
  --primary-700: 29 78 216;
  --primary-800: 30 64 175;
  --primary-900: 30 58 138;
}

/* Purple Scheme */
[data-scheme="purple"] {
  --primary-50: 250 245 255;
  --primary-100: 243 232 255;
  --primary-200: 233 213 255;
  --primary-300: 216 180 254;
  --primary-400: 192 132 252;
  --primary-500: 168 85 247;
  --primary-600: 147 51 234;
  --primary-700: 126 34 206;
  --primary-800: 107 33 168;
  --primary-900: 88 28 135;
}

/* Green Scheme */
[data-scheme="green"] {
  --primary-50: 240 253 244;
  --primary-100: 220 252 231;
  --primary-200: 187 247 208;
  --primary-300: 134 239 172;
  --primary-400: 74 222 128;
  --primary-500: 34 197 94;
  --primary-600: 22 163 74;
  --primary-700: 21 128 61;
  --primary-800: 22 101 52;
  --primary-900: 20 83 45;
}

/* Red Scheme */
[data-scheme="red"] {
  --primary-50: 254 242 242;
  --primary-100: 254 226 226;
  --primary-200: 254 202 202;
  --primary-300: 252 165 165;
  --primary-400: 248 113 113;
  --primary-500: 239 68 68;
  --primary-600: 220 38 38;
  --primary-700: 185 28 28;
  --primary-800: 153 27 27;
  --primary-900: 127 29 29;
}

/* Orange Scheme */
[data-scheme="orange"] {
  --primary-50: 255 247 237;
  --primary-100: 255 237 213;
  --primary-200: 254 215 170;
  --primary-300: 253 186 116;
  --primary-400: 251 146 60;
  --primary-500: 249 115 22;
  --primary-600: 234 88 12;
  --primary-700: 194 65 12;
  --primary-800: 154 52 18;
  --primary-900: 124 45 18;
}

/* Teal Scheme */
[data-scheme="teal"] {
  --primary-50: 240 253 250;
  --primary-100: 204 251 241;
  --primary-200: 153 246 228;
  --primary-300: 94 234 212;
  --primary-400: 45 212 191;
  --primary-500: 20 184 166;
  --primary-600: 13 148 136;
  --primary-700: 15 118 110;
  --primary-800: 17 94 89;
  --primary-900: 19 78 74;
}

/* Pink Scheme */
[data-scheme="pink"] {
  --primary-50: 253 242 248;
  --primary-100: 252 231 243;
  --primary-200: 251 207 232;
  --primary-300: 249 168 212;
  --primary-400: 244 114 182;
  --primary-500: 236 72 153;
  --primary-600: 219 39 119;
  --primary-700: 190 24 93;
  --primary-800: 157 23 77;
  --primary-900: 131 24 67;
}

/* Default/Indigo Scheme */
[data-scheme="default"] {
  --primary-50: 238 242 255;
  --primary-100: 224 231 255;
  --primary-200: 199 210 254;
  --primary-300: 165 180 252;
  --primary-400: 129 140 248;
  --primary-500: 99 102 241;
  --primary-600: 79 70 229;
  --primary-700: 67 56 202;
  --primary-800: 55 48 163;
  --primary-900: 49 46 129;
}

/* Cyan Scheme */
[data-scheme="cyan"] {
  --primary-50: 236 254 255;
  --primary-100: 207 250 254;
  --primary-200: 165 243 252;
  --primary-300: 103 232 249;
  --primary-400: 34 211 238;
  --primary-500: 6 182 212;
  --primary-600: 8 145 178;
  --primary-700: 14 116 144;
  --primary-800: 21 94 117;
  --primary-900: 22 78 99;
}

/* Amber Scheme */
[data-scheme="amber"] {
  --primary-50: 255 251 235;
  --primary-100: 254 243 199;
  --primary-200: 253 230 138;
  --primary-300: 252 211 77;
  --primary-400: 251 191 36;
  --primary-500: 245 158 11;
  --primary-600: 217 119 6;
  --primary-700: 180 83 9;
  --primary-800: 146 64 14;
  --primary-900: 120 53 15;
}

/* Smooth transitions */
* {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: rgb(243 244 246);
}

.dark ::-webkit-scrollbar-track {
  background: rgb(31 41 55);
}

::-webkit-scrollbar-thumb {
  background: rgb(209 213 219);
  border-radius: 4px;
}

.dark ::-webkit-scrollbar-thumb {
  background: rgb(75 85 99);
}

::-webkit-scrollbar-thumb:hover {
  background: rgb(156 163 175);
}

.dark ::-webkit-scrollbar-thumb:hover {
  background: rgb(107 114 128);
}

/* Animaciones personalizadas */
@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-slideIn {
  animation: slideIn 0.3s ease-out;
}

.animate-fadeIn {
  animation: fadeIn 0.2s ease-out;
}

.animate-slideDown {
  animation: slideDown 0.3s ease-out;
}

/* Estilos para tablas responsivas */
@media (max-width: 768px) {
  .table-responsive {
    overflow-x: auto;
  }
}

/* Utility classes */
.glass-effect {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.dark .glass-effect {
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Print styles */
@media print {
  .no-print {
    display: none !important;
  }
}

/* Sidebar collapse enhancements */
aside {
  transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

aside nav a,
aside nav button {
  transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
}