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

/* Scrollbar styling for dark mode */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #111827; }
::-webkit-scrollbar-thumb { background: #374151; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #4B5563; }

/* Smooth page transitions */
.page-fade { animation: fadeIn 0.2s ease-in; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }

/* Table row highlight animation */
.row-highlight { animation: highlight 2s ease-out; }
@keyframes highlight { 0% { background-color: rgba(59, 130, 246, 0.2); } 100% { background-color: transparent; } }

/* Pulsing green dot for active/present status */
.pulse-green {
  animation: pulse-green 2s infinite;
}
@keyframes pulse-green {
  0%, 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4); }
  50% { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
}

/* Bottom sheet mobile animation */
.bottom-sheet-enter { animation: slideUp 0.25s ease-out; }
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* Touch target minimum size */
@media (max-width: 768px) {
  button:not(.btn-small), a:not(.btn-small), input, select { min-height: 44px; }
  .btn-small { min-height: 32px !important; }
}

/* Print styles for Excel-related pages */
@media print {
  nav, .no-print { display: none !important; }
  body { background: white; color: black; }
}