@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --color-medical-500: #0ea5e9;
  --color-medical-600: #0284c7;
  --color-critical-500: #ef4444;
  --color-critical-900: #7f1d1d;
}

body {
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior-y: none; /* Prevents pull-to-refresh on mobile */
}

/* Custom Scrollbars */
.custom-scrollbar::-webkit-scrollbar {
  width: 5px;
}
.custom-scrollbar::-webkit-scrollbar-track {
  background: transparent; 
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background: #334155; 
  border-radius: 10px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: #475569; 
}

/* Mask fade for logs */
.mask-fade-bottom {
  mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
}

/* Number Input Cleanup */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
input[type=number] {
  -moz-appearance: textfield;
}

/* Transitions */
.list-enter-active,
.list-leave-active {
  transition: all 0.3s ease;
}
.list-enter-from,
.list-leave-to {
  opacity: 0;
  transform: translateX(-20px);
}

.fade-enter-active, .fade-leave-active {
  transition: opacity 0.2s ease;
}
.fade-enter-from, .fade-leave-to {
  opacity: 0;
}

/* Animations */
.critical-flash {
  animation: flash-red 2s infinite;
}
@keyframes flash-red {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); border-color: rgba(239, 68, 68, 0.5); }
  50% { box-shadow: 0 0 0 10px rgba(239, 68, 68, 0.15); border-color: rgba(239, 68, 68, 1); }
}

.animate-pulse-slow {
  animation: pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.border-glow-critical {
  box-shadow: 0 0 15px rgba(239, 68, 68, 0.3);
  border-color: rgba(239, 68, 68, 0.8);
}

/* iPhone X+ Safe Areas */
.safe-area-bottom {
  padding-bottom: env(safe-area-inset-bottom, 20px);
}