/* Estilos globales de FulbitoApp — solo lo que Tailwind no cubre */

:root {
  --brand-green: #16a34a;
  --brand-dark: #14532d;
}

/* Fuentes base */
body {
  font-family: 'Inter', sans-serif;
}

h1, h2, h3 {
  font-family: 'Montserrat', sans-serif;
}

/* Scrollbar personalizada */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 999px; }

/* Animación de fade-in para secciones */
.fade-in {
  animation: fadeIn 0.4s ease-out both;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Skeleton loader */
.skeleton {
  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);
  background-size: 200% 100%;
  animation: skeleton-shimmer 1.4s infinite;
  border-radius: 6px;
}

@keyframes skeleton-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Tarjeta de cancha con hover */
.court-card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.court-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.1);
}

/* Grid de horarios */
.slot-available {
  cursor: pointer;
  transition: background-color 0.15s;
}
.slot-available:hover {
  background-color: #dcfce7;
  border-color: #16a34a;
}
.slot-selected {
  background-color: #16a34a;
  color: white;
  border-color: #15803d;
}
.slot-taken {
  background-color: #f1f5f9;
  color: #94a3b8;
  cursor: not-allowed;
  text-decoration: line-through;
}