/* --- Bouton déclencheur --- */

/* Bouton déclencheur : identité visuelle strictement identique au
   bouton "Réserver" du shortcode [stella_reservation] (voir
   .stella-resa-bouton-ouvrir dans stella-reservation-form.css) — même
   marque, même geste, sur les deux points d'entrée du site. */
.stella-choix-bouton-declencheur {
	display: block;
	width: fit-content;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 10px 20px;
	border: 2px solid #FF4300; /* Spritz */
	border-radius: 3px;
	cursor: pointer;
	font-family: 'Obviously-extended', sans-serif;
	font-weight: 700;
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	text-align: left;
	color: #FFF3DE; /* Crème */
	background: #FF4300; /* Spritz */
	transition: background 0.15s ease, opacity 0.15s ease;
}

.stella-choix-bouton-declencheur:hover {
	background: #002A20; /* Basilic Foncé */
}

/* --- Modale (même langage visuel que la modale de réservation, voir
   stella-reservation-form.css) --- */

.stella-choix-modale {
	position: fixed;
	inset: 0;
	z-index: 2147483647;
	display: flex;
	align-items: center;
	justify-content: center;
}

.stella-choix-modale-fond {
	position: absolute;
	inset: 0;
	background: rgba( 0, 0, 0, 0.5 );
}

.stella-choix-modale-boite {
	position: relative;
	background: #fff3de;
	border-radius: 8px;
	padding: 40px 32px 32px;
	max-width: 480px;
	width: 90%;
	text-align: center;
}

.stella-choix-modale-boite h2 {
	margin: 0 0 28px;
	font-size: 22px;
	color: #003f2d;
}

.stella-choix-modale-fermer {
	position: absolute;
	top: 14px;
	right: 18px;
	background: none;
	border: none;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	color: #666;
}

/* --- Les deux boutons de choix --- */

.stella-choix-boutons {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.stella-choix-bouton {
	display: block;
	padding: 18px 20px;
	border-radius: 8px;
	font-size: 17px;
	font-weight: 700;
	text-decoration: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.stella-choix-bouton:hover {
	transform: translateY( -2px );
	box-shadow: 0 6px 14px rgba( 0, 0, 0, 0.15 );
}

.stella-choix-bouton--cc {
	background: #a63e26;
	color: #fff3de;
}

.stella-choix-bouton--resa {
	background: #ff4300;
	color: #fff3de;
}

.stella-choix-bouton--resa:hover {
	background: #003f2d !important;
	color: #fff3de !important;
}

.stella-choix-bouton--inactif {
	background: #e0e0e0 !important;
	color: #888 !important;
	cursor: not-allowed;
	pointer-events: none;
}

.stella-choix-bouton--inactif:hover {
	transform: none;
	box-shadow: none;
}

@media ( max-width: 480px ) {
	/* Même ajustement tactile que .stella-resa-bouton-ouvrir en mobile
	   (voir stella-reservation-form.css). */
	.stella-choix-bouton-declencheur {
		padding: 13px 20px;
		width: 100%;
		max-width: 320px;
	}

	.stella-choix-modale-boite {
		padding: 32px 20px 24px;
	}

	.stella-choix-bouton {
		padding: 16px;
		font-size: 16px;
	}
}