/**
 * L'Aire Bête — Caisse + panier + réservation (Phase 5.1 v0.8.0)
 *
 * Squelette fonctionnel UNIQUEMENT — charte sauge/terracotta sobre.
 * Tout sera refait en Three.js/WebGL au pass final mi-juin 2026.
 *
 * Variables charte :
 *   --lb-sauge       : #9CAF88   (boutons Réserver — animal)
 *   --lb-sauge-fonce : #6F8463
 *   --lb-terracotta  : #C95F30   (boutons Acheter — produit)
 *   --lb-terracotta-fonce : #8E3F1A
 */

:root {
	--lb-sauge:           #9CAF88;
	--lb-sauge-fonce:     #6F8463;
	--lb-terracotta:      #C95F30;
	--lb-terracotta-fonce:#8E3F1A;
}

/* === Boutons charte =================================================== */

.lb-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px 18px;
	border: 2px solid currentColor;
	border-radius: 4px;
	background: #FAF7F2;
	color: var(--lb-bois-fonce, #5C3D1E);
	font-family: var(--lb-font-corps, 'Open Sans', sans-serif);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background 150ms ease, transform 150ms ease, opacity 150ms ease;
}
.lb-btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}
.lb-btn:not(:disabled):hover {
	transform: translateY(-1px);
}

.lb-btn-reserver {
	background: var(--lb-sauge);
	border-color: var(--lb-sauge-fonce);
	color: #2A3320;
}
.lb-btn-reserver:not(:disabled):hover {
	background: var(--lb-sauge-fonce);
	color: #FAF7F2;
}

.lb-btn-acheter {
	background: var(--lb-terracotta);
	border-color: var(--lb-terracotta-fonce);
	color: #FAF7F2;
}
.lb-btn-acheter:not(:disabled):hover {
	background: var(--lb-terracotta-fonce);
}

.lb-btn-secondary {
	background: transparent;
	border-color: var(--lb-bois-fonce, #5C3D1E);
	color: var(--lb-bois-fonce, #5C3D1E);
}
.lb-btn-secondary:hover {
	background: rgba(139, 111, 71, 0.10);
}

/* === Présentoir produits dans la scène (Phase 5.1.2 v1.2.2) =========
 *
 * Les fiches produits sont DANS la scène intérieure de la boutique,
 * posées sur un présentoir mural devant le mur du fond. Cela remplace
 * la grille plate hors-scène : on garde l'ambiance immersive (comptoir,
 * caisse, avatar, étagères perspective, lianes, plantes) tout en ayant
 * des fiches cliquables avec photo + titre + prix + bouton.
 *
 * Le présentoir occupe la zone centrale supérieure de la scène, devant
 * le mur du fond (top:18%, hauteur 12%) mais au-dessus, pour se poser
 * sur le sol entre l'îlot central et les murs latéraux. Position et
 * dimensions ajustées pour ne pas masquer la caisse, l'avatar ni l'écran.
 *
 * Squelette CSS uniquement — pass Three.js fera le rendu photoréaliste.
 */

.lb-shop-display-shelves {
	position: absolute;
	/* Posé contre le mur du fond, dans la zone supérieure du sol —
	   ne masque ni la caisse (right:11%, top:58%), ni l'avatar
	   (right:6%, bottom:28%), ni le comptoir (right:0, top:60%),
	   ni l'écran sur pied (left:6%, bottom:43%). */
	top: 30%;
	left: 50%;
	transform: translateX(-50%);
	width: 56%;                       /* évite les murs latéraux */
	max-height: 24%;                  /* s'arrête bien avant le comptoir */
	z-index: 6;                       /* entre îlot (6) et lanternes (7) */
	padding: 8px 10px 10px;
	background:
		linear-gradient(180deg, rgba(184, 147, 112, 0.92) 0%, rgba(139, 111, 71, 0.95) 100%);
	border: 2px solid #5C3D1E;
	border-top-width: 6px;            /* tasseau supérieur de l'étagère */
	border-bottom-width: 6px;         /* tasseau inférieur (planche) */
	border-radius: 4px;
	box-shadow:
		0 6px 14px rgba(0, 0, 0, 0.55),
		inset 0 1px 1px rgba(255, 220, 180, 0.25),
		inset 0 -2px 4px rgba(0, 0, 0, 0.30);
	overflow-y: auto;
}

/* Stries bois sur l'arrière du présentoir (cohérence avec le mur fond) */
.lb-shop-display-shelves::before {
	content: '';
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient(90deg,
		transparent 0px,
		transparent 18px,
		rgba(92, 61, 30, 0.20) 18px,
		rgba(92, 61, 30, 0.20) 20px);
	pointer-events: none;
	z-index: 0;
}

.lb-shop-shelf-grid {
	position: relative;
	z-index: 1;
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	/* v1.2.4 — 2 colonnes max sur le présentoir pour que les cards
	   tiennent proprement dans la hauteur disponible (max-height: 24%
	   de la scène). Au-delà de 2-3 fiches, scroll vertical interne. */
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 6px;
}

.lb-shop-catalog-empty {
	font-style: italic;
	color: #FAF7F2;
	text-align: center;
	margin: 24px auto 0;
	max-width: 480px;
	padding: 10px 16px;
	background: rgba(26, 18, 8, 0.75);
	border-radius: 4px;
}

/* === Fiche produit — version compacte « sur étagère » ================
 *
 * v1.2.4 — Phase 5.1.4 : layout HORIZONTAL (photo carrée à gauche,
 * info + bouton à droite). Gagne ~50% de hauteur par rapport à la
 * version v1.2.2 (vertical), donc les fiches tiennent dans la
 * hauteur du présentoir (max-height 24% de la scène).
 */

.lb-product-card {
	position: relative;
	display: grid;
	grid-template-columns: 44px 1fr;  /* photo carrée 44px + reste */
	grid-template-rows: auto auto;
	column-gap: 5px;
	row-gap: 2px;
	padding: 4px;
	background: #FAF7F2;
	border: 1.5px solid #5C3D1E;
	border-radius: 3px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.35);
	transition: transform 150ms ease, box-shadow 150ms ease;
}
.lb-product-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 8px rgba(212, 160, 23, 0.40);
}

.lb-product-photo {
	position: relative;
	grid-column: 1;
	grid-row: 1 / span 2;             /* photo couvre les 2 lignes à gauche */
	width: 44px;
	height: 44px;
	background: #EFDFC0;
	border-radius: 2px;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}
.lb-product-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.lb-product-photo-placeholder {
	font-size: 22px;
	opacity: 0.6;
}

.lb-product-badge {
	position: absolute;
	top: 1px;
	right: 1px;
	padding: 1px 3px;
	background: rgba(0, 0, 0, 0.75);
	color: #fff;
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	border-radius: 2px;
}
.lb-product-badge--reserve { background: #B8860B; }
.lb-product-badge--vendu   { background: #5C3D1E; }
.lb-product-badge--indisponible { background: #888; }

.lb-product-card--reserve .lb-product-photo,
.lb-product-card--vendu .lb-product-photo,
.lb-product-card--indisponible .lb-product-photo {
	opacity: 0.55;
}

.lb-product-info {
	grid-column: 2;
	grid-row: 1;
	min-width: 0;                     /* permet ellipsis sur le titre */
	display: flex;
	flex-direction: column;
	gap: 1px;
	overflow: hidden;
}
.lb-product-title {
	margin: 0;
	font-family: var(--lb-font-titre, 'Fredoka One', cursive);
	font-size: 10px;
	line-height: 1.1;
	color: #5C3D1E;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.lb-product-meta {
	margin: 0;
	display: flex;
	justify-content: flex-start;
}
.lb-product-price {
	font-family: var(--lb-font-titre, 'Fredoka One', cursive);
	font-size: 11px;
	color: var(--lb-terracotta-fonce);
	line-height: 1;
}

/* Bouton micro placé sur la 2e ligne, colonne 2 (à droite de la photo). */
.lb-product-card .lb-btn {
	grid-column: 2;
	grid-row: 2;
	padding: 2px 4px;
	font-size: 9px;
	line-height: 1.2;
	border-width: 1px;
	gap: 2px;
	border-radius: 2px;
	width: 100%;
	justify-self: stretch;
}

/* === Caisse cliquable dans la scène (rectangle dans le coin droit) ==== */

.lb-caisse-trigger {
	cursor: pointer;
	border: 2px solid #1A0F06 !important;
	transition: transform 200ms ease, box-shadow 200ms ease;
}
.lb-caisse-trigger:hover {
	/* v1.49.4 — Pattern unifié : luminosité dorée seule */
	filter: drop-shadow(0 8px 24px rgba(255, 215, 100, 0.65));
}
.lb-caisse-trigger.is-bumped {
	animation: lb-caisse-bump 400ms ease-out;
}
@keyframes lb-caisse-bump {
	0%, 100% { transform: scale(1) skewY(-5deg); }
	50%      { transform: scale(1.18) skewY(-5deg); }
}

/* Compteur sur la caisse — petit badge or */
.lb-shop-cash-counter {
	position: absolute;
	top: -8px;
	right: -6px;
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	background: #C95F30;
	color: #fff;
	border: 2px solid #FAF7F2;
	border-radius: 999px;
	font-family: 'Open Sans', sans-serif;
	font-size: 11px;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
	pointer-events: none;
	z-index: 10;
}
.lb-caisse-trigger[data-empty="true"] .lb-shop-cash-counter {
	display: none;
}

/* === Modales (caisse / checkout / réservation) ======================= */

.lb-caisse-modal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: none;
}
.lb-caisse-modal.is-open {
	display: block;
}

.lb-caisse-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(10, 6, 2, 0.65);
	cursor: pointer;
}

.lb-caisse-modal-panel {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: clamp(320px, 90vw, 540px);
	max-height: 85vh;
	display: flex;
	flex-direction: column;
	background: #FAF7F2;
	border: 3px solid #5C3D1E;
	border-radius: 8px;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5);
	font-family: 'Open Sans', sans-serif;
}

.lb-caisse-modal-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 18px;
	border-bottom: 2px solid #5C3D1E;
	background: rgba(156, 175, 136, 0.15);
}
.lb-caisse-modal-title {
	margin: 0;
	font-family: 'Fredoka One', cursive;
	font-size: 18px;
	color: #5C3D1E;
}
.lb-caisse-modal-close {
	width: 32px;
	height: 32px;
	padding: 0;
	background: transparent;
	border: 1.5px solid #5C3D1E;
	border-radius: 50%;
	color: #5C3D1E;
	font-size: 20px;
	line-height: 26px;
	cursor: pointer;
}
.lb-caisse-modal-close:hover {
	background: rgba(139, 111, 71, 0.15);
}

.lb-caisse-modal-body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 14px 18px;
}

.lb-caisse-modal-footer {
	flex: 0 0 auto;
	padding: 12px 18px;
	border-top: 2px solid #5C3D1E;
	background: rgba(156, 175, 136, 0.08);
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* === Items du panier dans la caisse ================================== */

.lb-caisse-items {
	list-style: none;
	margin: 0;
	padding: 0;
}

.lb-caisse-item {
	display: grid;
	grid-template-columns: 50px 1fr auto;
	gap: 10px;
	align-items: center;
	padding: 10px 0;
	border-bottom: 1px solid rgba(139, 111, 71, 0.30);
}
.lb-caisse-item:last-child {
	border-bottom: none;
}

.lb-caisse-item-photo {
	width: 50px;
	height: 50px;
	background: #EFDFC0;
	border-radius: 4px;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}
.lb-caisse-item-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.lb-caisse-item-photo-fallback {
	font-size: 24px;
	opacity: 0.6;
}

.lb-caisse-item-info {
	min-width: 0;
}
.lb-caisse-item-title {
	margin: 0 0 2px;
	font-size: 13px;
	font-weight: 600;
	color: #5C3D1E;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.lb-caisse-item-meta {
	margin: 0;
	font-size: 11px;
	color: #5C3D1E;
}
.lb-caisse-item-meta strong {
	color: var(--lb-terracotta-fonce);
}

.lb-caisse-item-controls {
	display: flex;
	align-items: center;
	gap: 4px;
}
.lb-caisse-item-controls button {
	width: 24px;
	height: 24px;
	padding: 0;
	background: #FAF7F2;
	border: 1.5px solid #5C3D1E;
	border-radius: 50%;
	color: #5C3D1E;
	font-size: 14px;
	line-height: 20px;
	cursor: pointer;
}
.lb-caisse-item-controls button:hover {
	background: #E8DFD0;
}
.lb-caisse-item-qty {
	min-width: 20px;
	text-align: center;
	font-weight: 700;
	font-size: 13px;
}
.lb-caisse-item-remove {
	color: var(--lb-terracotta) !important;
	border-color: var(--lb-terracotta) !important;
}

.lb-caisse-empty {
	margin: 24px 0;
	font-style: italic;
	color: #5C3D1E;
	text-align: center;
}

.lb-caisse-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-size: 14px;
	color: #5C3D1E;
	margin-bottom: 4px;
}
.lb-caisse-total strong {
	font-family: 'Fredoka One', cursive;
	font-size: 20px;
	color: var(--lb-terracotta-fonce);
}

/* === Pancarte cliquable — bouton bio (Phase 5.1.7 v1.2.7) ============
 *
 * La pancarte 4 planches `.lb-shop-sign` devient `<button>` qui ouvre
 * la modale bio du commerçant. On RESET les styles natifs button pour
 * conserver l'apparence visuelle existante (gradient + planches +
 * rotations), tout en ajoutant un signal de cliquabilité subtil.
 * Style final reproduit en Three.js mi-juin (référence Canva ALIS /
 * Johanne Bérard, voir THREEJS_TODO Section 6).
 */

.lb-shop-sign--button {
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
	font: inherit;
	color: inherit;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: transform 200ms ease, filter 200ms ease;
	/* CRITIQUE : .lb-shop-sign hérite de `pointer-events: none` (shop.css
	   ligne 106 — relique de l'époque où la pancarte était décorative).
	   On restaure les events sur le bouton ET ses planches enfants pour
	   que le clic atteigne le delegate. Découvert lors du fix v1.2.8. */
	pointer-events: auto;
}
.lb-shop-sign--button .lb-shop-sign-plank {
	pointer-events: auto;
}
.lb-shop-sign--button:hover {
	transform: translateY(-2px);
	filter: brightness(1.04) drop-shadow(0 4px 8px rgba(212, 160, 23, 0.30));
}
.lb-shop-sign--button:focus-visible {
	outline: 3px solid var(--lb-or, #D4A017);
	outline-offset: 4px;
	border-radius: 4px;
}

/* === Modale bio commerçant (Phase 5.1.7 v1.2.7) ======================
 *
 * Squelette charte sauge/terracotta. Le pass Three.js (mi-juin 2026)
 * remplacera la modale rectangulaire par un concept matière naturelle
 * (parchemin, livret commerçant — voir THREEJS_TODO Section 7).
 */

.lb-bio-modal-panel {
	width: clamp(320px, 92vw, 620px);
	max-height: 90vh;
}

.lb-bio-modal-body {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding: 20px;
	text-align: center;
}

.lb-bio-modal-portrait {
	position: relative;
	width: clamp(120px, 30vw, 180px);
	height: clamp(120px, 30vw, 180px);
	border-radius: 50%;
	overflow: hidden;
	background: #EFDFC0;
	border: 3px solid var(--lb-sauge-fonce);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}
.lb-bio-modal-portrait img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.lb-bio-modal-photo-fallback {
	font-size: clamp(48px, 12vw, 80px);
	opacity: 0.55;
}

.lb-bio-modal-name {
	margin: 0;
	font-family: 'Fredoka One', cursive;
	font-size: clamp(20px, 3vw, 26px);
	color: #5C3D1E;
	line-height: 1.1;
}

.lb-bio-modal-role {
	margin: 0;
	font-size: clamp(13px, 1.5vw, 15px);
	font-style: italic;
	color: var(--lb-sauge-fonce);
}

.lb-bio-modal-text {
	margin: 6px 0 0;
	padding: 12px 14px;
	background: rgba(156, 175, 136, 0.08);
	border-left: 3px solid var(--lb-sauge);
	border-radius: 0 3px 3px 0;
	font-size: 14px;
	line-height: 1.6;
	color: #2A3320;
	white-space: pre-wrap;
	word-break: break-word;
	overflow-y: auto;
	max-height: 240px;
	text-align: left;
	width: 100%;
	box-sizing: border-box;
}

/* État vide — boutique sans bio remplie */
.lb-bio-modal-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	padding: 8px 0;
}
.lb-bio-modal-empty-msg {
	margin: 0;
	font-size: 15px;
	color: #5C3D1E;
	font-style: italic;
}

.lb-bio-modal-footer {
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}
.lb-bio-modal-footer .lb-btn {
	flex: 1 1 auto;
	min-width: 140px;
	padding: 10px 18px;
	font-size: 14px;
	width: auto;
	border-radius: 4px;
	border-width: 2px;
	gap: 6px;
}

/* === Modale détail produit (Phase 5.1.5 v1.2.5) =====================
 *
 * Squelette charte sauge/terracotta. Le pass Three.js (mi-juin 2026)
 * remplacera la modale rectangulaire par un concept matière naturelle
 * (parchemin, livre de commerce — voir THREEJS_TODO.md Section 7).
 *
 * Layout 2 colonnes desktop (galerie | infos), 1 colonne mobile.
 */

.lb-product-modal-panel {
	width: clamp(320px, 92vw, 880px);
	max-height: 90vh;
}

.lb-product-modal-body {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 18px;
	padding: 18px;
}

@media (max-width: 720px) {
	.lb-product-modal-body {
		grid-template-columns: 1fr;
		gap: 14px;
		padding: 14px;
	}
}

/* --- Galerie -------------------------------------------------------- */

.lb-product-modal-gallery {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.lb-product-modal-stage {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	background: #EFDFC0;
	border: 2px solid #5C3D1E;
	border-radius: 4px;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}
.lb-product-modal-stage img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.lb-product-modal-fallback {
	font-size: clamp(48px, 10vw, 96px);
	opacity: 0.55;
}

.lb-product-modal-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 36px;
	height: 36px;
	padding: 0;
	background: rgba(250, 247, 242, 0.92);
	border: 1.5px solid #5C3D1E;
	border-radius: 50%;
	color: #5C3D1E;
	font-size: 22px;
	line-height: 1;
	font-weight: 700;
	cursor: pointer;
	z-index: 2;
	transition: background 150ms ease;
}
.lb-product-modal-nav:hover {
	background: #FAF7F2;
}
.lb-product-modal-nav--prev { left: 8px; }
.lb-product-modal-nav--next { right: 8px; }

#lb-product-modal-badge {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 3;
}

.lb-product-modal-thumbs {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.lb-product-modal-thumb {
	width: 56px;
	height: 56px;
	padding: 0;
	background: #EFDFC0;
	border: 2px solid transparent;
	border-radius: 3px;
	overflow: hidden;
	cursor: pointer;
	display: block;
	transition: border-color 150ms ease, transform 150ms ease;
}
.lb-product-modal-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.lb-product-modal-thumb:hover {
	border-color: #C9B484;
	transform: translateY(-1px);
}
.lb-product-modal-thumb.is-active {
	border-color: var(--lb-terracotta);
}

/* --- Panneau infos -------------------------------------------------- */

.lb-product-modal-info {
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-width: 0;
}

.lb-product-modal-price {
	margin: 0;
	font-family: 'Fredoka One', cursive;
	font-size: clamp(28px, 4vw, 38px);
	color: var(--lb-terracotta-fonce);
	line-height: 1;
}

.lb-product-modal-type {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	color: var(--lb-sauge-fonce);
}
.lb-product-modal-type--produit {
	color: var(--lb-terracotta-fonce);
}

.lb-product-modal-status {
	margin: 0;
	display: inline-block;
	align-self: flex-start;
	padding: 4px 10px;
	background: #B8860B;
	color: #fff;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.lb-product-modal-status--vendu        { background: #5C3D1E; }
.lb-product-modal-status--indisponible { background: #888; }

.lb-product-modal-description {
	margin: 0;
	padding: 10px 12px;
	background: rgba(156, 175, 136, 0.08);
	border-left: 3px solid var(--lb-sauge);
	border-radius: 0 3px 3px 0;
	font-size: 14px;
	line-height: 1.55;
	color: #2A3320;
	white-space: pre-wrap;
	word-break: break-word;
	overflow-y: auto;
	max-height: 200px;
}

.lb-product-modal-footer {
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}
.lb-product-modal-footer .lb-btn {
	flex: 1 1 auto;
	min-width: 140px;
	padding: 10px 18px;
	font-size: 14px;
	width: auto;
	border-radius: 4px;
	border-width: 2px;
	gap: 6px;
}

/* Indique visuellement que la photo / titre / prix de la card sont
   cliquables (ouvrent la modale détail). Le bouton lui-même garde son
   curseur natif. */
.lb-product-card .lb-product-photo,
.lb-product-card .lb-product-title,
.lb-product-card .lb-product-price {
	cursor: pointer;
}

/* === Modale checkout (instructions paiement) ========================= */

.lb-checkout-amount {
	margin: 0 0 12px;
	font-size: 14px;
	color: #5C3D1E;
}
.lb-checkout-amount strong {
	font-family: 'Fredoka One', cursive;
	font-size: 22px;
	color: var(--lb-terracotta-fonce);
}

.lb-checkout-instructions {
	background: #FFFBF0;
	border: 1.5px solid #C9B484;
	border-radius: 4px;
	padding: 12px;
}
.lb-checkout-pre {
	margin: 0;
	font-family: 'Open Sans', monospace;
	font-size: 13px;
	white-space: pre-wrap;
	word-break: break-word;
	color: #5C3D1E;
}

/* === Modale réservation (formulaire animal) ========================== */

.lb-form-row {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-bottom: 12px;
}
.lb-form-row span {
	font-size: 13px;
	font-weight: 600;
	color: #5C3D1E;
}
.lb-form-row em {
	color: var(--lb-terracotta);
	font-style: normal;
}
.lb-form-row input,
.lb-form-row textarea {
	padding: 8px 10px;
	background: #fff;
	border: 1.5px solid #C9B484;
	border-radius: 4px;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	color: #5C3D1E;
}
.lb-form-row input:focus,
.lb-form-row textarea:focus {
	outline: 2px solid var(--lb-sauge);
	outline-offset: 1px;
	border-color: var(--lb-sauge-fonce);
}

.lb-form-error {
	color: var(--lb-terracotta);
	font-size: 13px;
	margin: 8px 0;
	min-height: 1em;
}

/* === Toast confirmation ============================================== */

.lb-toast {
	position: fixed;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%) translateY(20px);
	z-index: 99999;
	padding: 12px 20px;
	background: #2A3320;
	color: #FAF7F2;
	border-radius: 4px;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	font-weight: 600;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
	opacity: 0;
	pointer-events: none;
	transition: opacity 200ms ease, transform 200ms ease;
}
.lb-toast.is-visible {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
}

/* === Reduced motion ================================================== */

@media (prefers-reduced-motion: reduce) {
	.lb-caisse-trigger.is-bumped { animation: none; }
	.lb-toast,
	.lb-btn { transition: none; }
}

/* v1.49.68 — Mode "Ventes fermées" (body.lb-sales-closed) :
   - Cache caisse-trigger (icône flottante)
   - Remplace boutons d'achat par libellé "Ouverture bientôt"
   - Bloque pointer-events sur les actions panier */
body.lb-sales-closed .lb-caisse-trigger {
	display: none !important;
}
body.lb-sales-closed .lb-btn-acheter,
body.lb-sales-closed .lb-btn-reserver,
body.lb-sales-closed [data-lb-coin-add],
body.lb-sales-closed .lb-action-add-cart,
body.lb-sales-closed .lb-action-reserver {
	pointer-events: none !important;
	opacity: 0.55;
	cursor: not-allowed !important;
	background: rgba(139, 94, 60, 0.55) !important;
	color: #f4dcae !important;
}
body.lb-sales-closed .lb-btn-acheter::before,
body.lb-sales-closed .lb-btn-reserver::before,
body.lb-sales-closed [data-lb-coin-add]::before {
	content: "⏳ Ouverture des ventes bientôt";
	display: block;
}
body.lb-sales-closed .lb-btn-acheter > *,
body.lb-sales-closed .lb-btn-reserver > *,
body.lb-sales-closed [data-lb-coin-add] > * {
	display: none;
}
body.lb-sales-closed .lb-btn-coming-soon {
	background: rgba(139, 94, 60, 0.85);
	color: #f4dcae;
	cursor: not-allowed;
	pointer-events: none;
	opacity: 0.95;
}