/* Custom styles beyond Tailwind */

/* Smooth scrolling */
html {
	scroll-behavior: smooth;
}

/* Custom scrollbar */
::-webkit-scrollbar {
	width: 10px;
}

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

::-webkit-scrollbar-thumb {
	background: #eab308;
	border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
	background: #ca8a04;
}

/* Navbar scroll effect */
nav.scrolled {
	background: rgba(255, 255, 255, 0.98);
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

/* Animation classes */
.fade-in {
	animation: fadeIn 0.5s ease-in;
}

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

/* Custom focus styles */
input:focus, textarea:focus {
	box-shadow: 0 0 0 3px rgba(234, 179, 8, 0.2);
}

/* Radio button custom styling */
input[type="radio"]:checked + div {
	border-color: #eab308;
	background-color: #fef9c3;
}

input[type="radio"]:checked + div i {
	color: #ca8a04;
}

/* Hover lift effect */
.hover-lift {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
	transform: translateY(-5px);
	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Modal animation */
.modal-enter {
	opacity: 1;
}

.modal-enter #modal-content {
	transform: scale(1);
	opacity: 1;
}

/* Image hover zoom */
.img-zoom {
	overflow: hidden;
}

.img-zoom img {
	transition: transform 0.5s ease;
}

.img-zoom:hover img {
	transform: scale(1.05);
}

/* Gradient text */
.gradient-text {
	background: linear-gradient(135deg, #eab308 0%, #ca8a04 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

/* Loading spinner */
.spinner {
	border: 3px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	border-top: 3px solid #ffffff;
	width: 24px;
	height: 24px;
	animation: spin 1s linear infinite;
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/* Mobile menu animation */
#mobile-menu {
	transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out;
	max-height: 0;
	opacity: 0;
	overflow: hidden;
}

#mobile-menu.active {
	max-height: 300px;
	opacity: 1;
}

/* Card shine effect */
.shine {
	position: relative;
	overflow: hidden;
}

.shine::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
	transition: left 0.5s;
}

.shine:hover::before {
	left: 100%;
}

/* Button pulse animation */
.pulse-yellow {
	box-shadow: 0 0 0 0 rgba(234, 179, 8, 0.7);
	animation: pulse-yellow 2s infinite;
}

@keyframes pulse-yellow {
	0% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba(234, 179, 8, 0.7);
	}
	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(234, 179, 8, 0);
	}
	100% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba(234, 179, 8, 0);
	}
}
.price-display {
  font-size: 1.5rem;           /* texte plus grand */
  font-weight: bold;           /* gras */
  color: #ff4d4f;              /* rouge vif, visible */
  background-color: #fff0f0;   /* léger fond rose pâle */
  padding: 10px 20px;          /* espace autour */
  border-radius: 8px;          /* coins arrondis */
  text-align: center;          /* centré */
  box-shadow: 0 4px 6px rgba(0,0,0,0.1); /* petite ombre */
  transition: transform 0.2s ease, background-color 0.2s ease;
}

/* Animation quand le prix change */
.price-display.update {
  transform: scale(1.1);
  background-color: #ffecec;
}
/* Section divider */
.section-divider {
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(234, 179, 8, 0.3), transparent);
	margin: 4rem 0;
}