/* Réservation de salles communales — styles front-end
   Toutes les couleurs et dimensions passent par des variables CSS,
   surchargées par le widget Elementor (ou par le thème). */

.rs-app {
	--rs-primary: #2c5f2d;
	--rs-primary-dark: #234b24;
	--rs-primary-soft: #eef4ee;
	--rs-max-width: 860px;
	--rs-cols-min: 260px;
	--rs-cols-gap: 20px;

	--rs-card-bg: #ffffff;
	--rs-card-border-color: #dddddd;
	--rs-card-border-width: 1px;
	--rs-card-radius: 8px;
	--rs-card-padding: 16px;
	--rs-card-shadow: none;
	--rs-img-height: 160px;
	--rs-img-fit: cover;
	--rs-img-position: center center;
	--rs-img-placeholder: #ececec;
	--rs-slider-arrow-bg: rgba(0, 0, 0, 0.45);
	--rs-slider-arrow-color: #ffffff;
	--rs-slider-dot: rgba(255, 255, 255, 0.6);
	--rs-slider-dot-active: #ffffff;

	--rs-title-color: #1a1a1a;
	--rs-title-size: 18px;
	--rs-meta-color: #666666;
	--rs-desc-color: #444444;
	--rs-desc-size: 14px;
	--rs-price-color: #1a1a1a;
	--rs-price-size: 14px;

	--rs-btn-bg: #2c5f2d;
	--rs-btn-color: #ffffff;
	--rs-btn-hover-bg: #234b24;
	--rs-btn-hover-color: #ffffff;
	--rs-btn-radius: 6px;
	--rs-btn-padding: 10px 18px;
	--rs-btn-size: 15px;

	--rs-step-bg: #e5e5e5;
	--rs-step-color: #666666;
	--rs-step-active-bg: #2c5f2d;
	--rs-step-active-color: #ffffff;
	--rs-step-done-bg: #97be8f;

	--rs-day-height: 44px;
	--rs-day-radius: 6px;
	--rs-free-bg: #e3f2e3;
	--rs-free-color: #1d4d1e;
	--rs-partial-bg: #fdf3e3;
	--rs-partial-color: #7a4a00;
	--rs-full-bg: #fbe5e5;
	--rs-full-color: #8a1f1f;
	--rs-closed-bg: #f2f2f2;
	--rs-closed-color: #bbbbbb;
	--rs-selected-outline: #2c5f2d;

	--rs-slot-bg: #ffffff;
	--rs-slot-color: #1d4d1e;
	--rs-slot-border: #2c5f2d;
	--rs-slot-hover-bg: #eef4ee;
	--rs-slot-radius: 8px;

	--rs-societe-bg: #eef4ee;
	--rs-societe-border: #2c5f2d;
	--rs-recap-bg: #f7f7f4;
	--rs-note-color: #666666;

	max-width: var(--rs-max-width);
	margin: 0 auto;
}
.rs-app * { box-sizing: border-box; }
.rs-loading { color: var(--rs-meta-color); }

.rs-progress { display: flex; gap: 8px; list-style: none; margin: 0 0 24px; padding: 0; flex-wrap: wrap; }
.rs-progress li { display: flex; align-items: center; gap: 6px; font-size: 14px; color: #888; }
.rs-progress li span { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--rs-step-bg); color: var(--rs-step-color); font-size: 13px; }
.rs-progress li.rs-current { color: var(--rs-title-color); font-weight: 600; }
.rs-progress li.rs-current span { background: var(--rs-step-active-bg); color: var(--rs-step-active-color); }
.rs-progress li.rs-done span { background: var(--rs-step-done-bg); color: var(--rs-step-active-color); }
.rs-progress li:not(:last-child)::after { content: "›"; margin-left: 8px; color: #bbb; }
.rs-app.rs-hide-steps .rs-progress { display: none; }
.rs-app.rs-hide-img .rs-room-media { display: none; }
.rs-app.rs-hide-meta .rs-room-meta { display: none; }
.rs-app.rs-hide-desc .rs-room-desc { display: none; }
.rs-app.rs-hide-prices .rs-room-prices { display: none; }

.rs-intro { margin-bottom: 20px; }
.rs-title { margin: 8px 0 12px; color: var(--rs-title-color); }
.rs-back { background: none; border: none; color: var(--rs-primary); cursor: pointer; padding: 0; font-size: 14px; text-decoration: underline; }

.rs-rooms { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--rs-cols-min), 1fr)); gap: var(--rs-cols-gap); }
.rs-room-card {
	border: var(--rs-card-border-width) solid var(--rs-card-border-color);
	border-radius: var(--rs-card-radius);
	overflow: hidden;
	background: var(--rs-card-bg);
	box-shadow: var(--rs-card-shadow);
	display: flex;
	flex-direction: column;
}
/* Conteneur à hauteur fixe : garantit des cartes alignées quelles que soient
   les dimensions des images. Les !important neutralisent les règles de thème
   et d'Elementor du type « .elementor img { height: auto } ». */
.rs-app .rs-room-media {
	width: 100%;
	height: var(--rs-img-height);
	flex: 0 0 auto;
	overflow: hidden;
	background-color: var(--rs-img-placeholder);
}
.rs-app .rs-room-media .rs-room-img {
	width: 100% !important;
	height: 100% !important;
	max-width: none;
	object-fit: var(--rs-img-fit) !important;
	object-position: var(--rs-img-position);
	display: block;
	margin: 0;
	border-radius: 0;
}
/* Diaporama de la galerie */
.rs-app .rs-room-media { position: relative; }
.rs-app .rs-room-media .rs-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .4s ease; }
.rs-app .rs-room-media .rs-slide.rs-slide-active { opacity: 1; position: relative; }
.rs-slider-arrow {
	position: absolute; top: 50%; transform: translateY(-50%);
	width: 30px; height: 30px; border: none; border-radius: 50%;
	background: var(--rs-slider-arrow-bg); color: var(--rs-slider-arrow-color);
	font-size: 16px; line-height: 1; cursor: pointer; z-index: 2; padding: 0;
	opacity: 0; transition: opacity .2s ease;
}
.rs-room-media:hover .rs-slider-arrow, .rs-slider-arrow:focus { opacity: 1; }
.rs-slider-prev { left: 8px; }
.rs-slider-next { right: 8px; }
.rs-slider-dots { position: absolute; left: 0; right: 0; bottom: 8px; display: flex; justify-content: center; gap: 6px; z-index: 2; }
.rs-slider-dot { width: 8px; height: 8px; padding: 0; border: none; border-radius: 50%; background: var(--rs-slider-dot); cursor: pointer; }
.rs-slider-dot.rs-active { background: var(--rs-slider-dot-active); transform: scale(1.25); }
.rs-app.rs-hide-arrows .rs-slider-arrow { display: none; }
.rs-app.rs-hide-dots .rs-slider-dots { display: none; }

.rs-room-body { padding: var(--rs-card-padding); display: flex; flex-direction: column; gap: 8px; flex: 1; }
.rs-room-body h3 { margin: 0; font-size: var(--rs-title-size); color: var(--rs-title-color); }
.rs-room-meta { margin: 0; font-size: 13px; color: var(--rs-meta-color); }
.rs-room-desc { font-size: var(--rs-desc-size); color: var(--rs-desc-color); }
.rs-room-prices { margin: 0; font-size: var(--rs-price-size); font-weight: 600; color: var(--rs-price-color); }
.rs-room-open { margin: 0; font-size: 13px; color: #a05a00; background: #fdf3e3; padding: 6px 8px; border-radius: 4px; }

.rs-btn {
	background: var(--rs-btn-bg);
	color: var(--rs-btn-color);
	border: none;
	border-radius: var(--rs-btn-radius);
	padding: var(--rs-btn-padding);
	font-size: var(--rs-btn-size);
	cursor: pointer;
	margin-top: auto;
}
.rs-btn:hover { background: var(--rs-btn-hover-bg); color: var(--rs-btn-hover-color); }
.rs-btn:disabled { background: #999; cursor: default; }

.rs-mode-switch { display: flex; gap: 20px; margin: 12px 0; flex-wrap: wrap; }
.rs-mode-switch label { display: flex; align-items: center; gap: 6px; cursor: pointer; }

.rs-cal-header { display: flex; align-items: center; justify-content: space-between; margin: 16px 0 8px; }
.rs-nav { background: #f0f0f0; border: 1px solid #ddd; border-radius: var(--rs-btn-radius); padding: 6px 14px; cursor: pointer; font-size: 15px; color: var(--rs-title-color); }
.rs-cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.rs-cal-dow { text-align: center; font-size: 12px; color: var(--rs-meta-color); padding: 4px 0; }
.rs-cal-empty { min-height: var(--rs-day-height); }
.rs-cal-day { min-height: var(--rs-day-height); display: flex; align-items: center; justify-content: center; border-radius: var(--rs-day-radius); font-size: 14px; }
.rs-free { background: var(--rs-free-bg); color: var(--rs-free-color); cursor: pointer; }
.rs-free:hover { outline: 2px solid var(--rs-selected-outline); }
.rs-partial { background: var(--rs-partial-bg); color: var(--rs-partial-color); cursor: pointer; }
.rs-partial:hover { outline: 2px solid var(--rs-partial-color); }
.rs-full { background: var(--rs-full-bg); color: var(--rs-full-color); }
.rs-closed { background: var(--rs-closed-bg); color: var(--rs-closed-color); }
.rs-selected { outline: 2px solid var(--rs-selected-outline); font-weight: 700; }

.rs-legend { display: flex; gap: 16px; flex-wrap: wrap; margin: 12px 0; font-size: 13px; color: #555; }
.rs-dot { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; }
.rs-dot-free { background: var(--rs-free-bg); border: 1px solid var(--rs-free-color); }
.rs-dot-partial { background: var(--rs-partial-bg); border: 1px solid var(--rs-partial-color); }
.rs-dot-full { background: var(--rs-full-bg); border: 1px solid var(--rs-full-color); }
.rs-dot-closed { background: var(--rs-closed-bg); border: 1px solid #ddd; }

.rs-note { font-size: 13px; color: var(--rs-note-color); margin: 8px 0; }
.rs-chosen { font-weight: 600; background: var(--rs-primary-soft); padding: 10px 12px; border-radius: var(--rs-card-radius); color: var(--rs-title-color); }

.rs-slots { display: flex; flex-direction: column; gap: 10px; margin: 12px 0 20px; }
.rs-slot-btn {
	text-align: left;
	background: var(--rs-slot-bg);
	border: 2px solid var(--rs-slot-border);
	color: var(--rs-slot-color);
	border-radius: var(--rs-slot-radius);
	padding: 12px 16px;
	font-size: 15px;
	cursor: pointer;
}
.rs-slot-btn small { display: block; color: var(--rs-meta-color); font-size: 12px; margin-top: 2px; }
.rs-slot-btn:hover { background: var(--rs-slot-hover-bg); }

.rs-societe { display: block; border: 2px solid var(--rs-societe-border); background: var(--rs-societe-bg); border-radius: var(--rs-card-radius); padding: 12px 16px; margin: 16px 0; cursor: pointer; }
.rs-societe small { display: block; color: var(--rs-note-color); font-size: 12px; margin: 4px 0 0 24px; }
.rs-options { border: 1px solid var(--rs-card-border-color); border-radius: var(--rs-card-radius); padding: 12px 16px; margin: 16px 0; }
.rs-option { display: block; margin: 8px 0; cursor: pointer; }
.rs-option small { display: block; color: var(--rs-meta-color); font-size: 12px; margin-left: 24px; }
.rs-option.rs-disabled { opacity: 0.5; }

.rs-recap { background: var(--rs-recap-bg); border-radius: var(--rs-card-radius); padding: 14px 16px; margin: 16px 0; }
.rs-recap h4 { margin: 0 0 8px; color: var(--rs-title-color); }
.rs-recap-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.rs-recap-table td { padding: 4px 0; border-bottom: 1px solid #e5e5e5; }
.rs-recap-table td:last-child { text-align: right; white-space: nowrap; }
.rs-recap-table .rs-total td { font-weight: 700; border-bottom: none; padding-top: 8px; }

.rs-field { margin: 10px 0; }
.rs-field label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 4px; color: var(--rs-title-color); }
.rs-field input, .rs-field select, .rs-field textarea { width: 100%; padding: 8px 10px; border: 1px solid #ccc; border-radius: var(--rs-btn-radius); font-size: 15px; }
.rs-field-row { display: flex; gap: 14px; }
.rs-field-row .rs-field { flex: 1; }
@media (max-width: 600px) { .rs-field-row { flex-direction: column; gap: 0; } }

.rs-hp { position: absolute; left: -9999px; }
.rs-consent { display: flex; gap: 8px; align-items: flex-start; margin: 14px 0; font-size: 14px; }
.rs-error { background: var(--rs-full-bg); color: var(--rs-full-color); border-radius: var(--rs-btn-radius); padding: 10px 12px; margin: 10px 0; }
.rs-success { background: var(--rs-free-bg); color: var(--rs-free-color); border-radius: var(--rs-card-radius); padding: 24px; text-align: center; }
.rs-success h3 { margin-top: 0; }
.rs-annee { max-width: 480px; }
