/*
 * Blanche Food Truck - Custom Styles
 * A warm, elegant design for a pastry shop food truck
 * Brand color: #5B4242
 */

/* Smooth transitions for all interactive elements */
a, button, .btn, input, select, textarea {
  transition: all 0.2s ease-in-out;
}

/* Card transitions */
.card {
  transition: box-shadow 0.2s ease-in-out, transform 0.2s ease-in-out;
}

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

::-webkit-scrollbar-track {
  background: #F5EDE6;
}

::-webkit-scrollbar-thumb {
  background: #8B7266;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #5B4242;
}

/* Focus styles for accessibility */
*:focus-visible {
  outline: 2px solid #5B4242;
  outline-offset: 2px;
}

/* Form input focus glow */
.input:focus, .select:focus, .textarea:focus {
  box-shadow: 0 0 0 3px rgba(239, 204, 213, 0.3);
}

/* Smooth page transitions with Turbo */
.turbo-progress-bar {
  background-color: #EFCCD5;
  height: 3px;
}

/* Alert animations */
.alert {
  animation: slideIn 0.3s ease-out;
}

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

/* Button press effect */
.btn:active {
  transform: scale(0.98);
}

/* Print styles */
@media print {
  header, footer, .btn, .card-actions {
    display: none !important;
  }
  
  body {
    background: white !important;
  }
  
  .card {
    box-shadow: none !important;
    border: 1px solid #ccc !important;
  }
}
