/* Modal « Lire et accepter le règlement » — alignée au design Chalets Astra.
   Palette : nuit #231f36 / crème #efe7e1. Polices via les variables du thème
   (--font-urbanist / --font-league-spartan) avec fallback. */

body.chalets-rules-js-active .wpbs-form-field-checkbox.chalets-rules-checkbox > .wpbs-form-field-input {
	display: none;
}

body.chalets-rules-js-active .wpbs-form-field.chalets-rules-timestamp {
	display: none;
}

/* ── Bouton déclencheur (remplace la case à cocher) ──────────────────── */
.chalets-rules-trigger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 14px 18px;
	margin-top: 6px;
	background: #231f36;
	border: 1px solid #231f36;
	border-radius: 0;
	font-family: var(--font-league-spartan, "League Spartan", sans-serif);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: #efe7e1;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.chalets-rules-trigger:hover {
	background: #efe7e1;
	color: #231f36;
	border-color: #231f36;
}

/* État accepté — inversé, sobre, sans vert */
.chalets-rules-trigger.is-accepted {
	background: #efe7e1;
	border-color: #231f36;
	color: #231f36;
	cursor: default;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-size: 12px;
}

.chalets-rules-trigger.is-accepted:hover {
	background: #efe7e1;
	color: #231f36;
}

/* ── Modal ───────────────────────────────────────────────────────────── */
body.chalets-rules-modal-open {
	overflow: hidden;
}

.chalets-rules-overlay {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(35, 31, 54, 0.6);
}

.chalets-rules-overlay[hidden] {
	display: none;
}

.chalets-rules-modal {
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 720px;
	max-height: 85vh;
	background: #fafafa;
	border-radius: 0;
	box-shadow: 0 30px 80px rgba(35, 31, 54, 0.25);
	overflow: hidden;
}

.chalets-rules-modal-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 24px;
	border-bottom: 1px solid rgba(35, 31, 54, 0.1);
	flex-shrink: 0;
}

.chalets-rules-modal-header h2 {
	margin: 0;
	font-family: var(--font-urbanist, "Urbanist", sans-serif);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: #231f36;
}

.chalets-rules-modal-close {
	background: transparent;
	border: 0;
	font-size: 26px;
	line-height: 1;
	color: #231f36;
	cursor: pointer;
	padding: 0 4px;
	opacity: 0.8;
	transition: opacity 0.2s ease;
}

.chalets-rules-modal-close:hover {
	opacity: 1;
}

.chalets-rules-modal-body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 26px 32px;
	font-family: var(--font-league-spartan, "League Spartan", sans-serif);
	font-size: 15px;
	line-height: 1.65;
	color: #231f36;
	scrollbar-width: thin;
	scrollbar-color: rgba(35, 31, 54, 0.35) transparent;
}

.chalets-rules-modal-body::-webkit-scrollbar { width: 6px; }
.chalets-rules-modal-body::-webkit-scrollbar-thumb { background: rgba(35, 31, 54, 0.3); border-radius: 9999px; }

.chalets-rules-modal-body h1,
.chalets-rules-modal-body h2,
.chalets-rules-modal-body h3,
.chalets-rules-modal-body h4 {
	margin: 1.4em 0 0.6em;
	font-family: var(--font-urbanist, "Urbanist", sans-serif);
	font-weight: 500;
	letter-spacing: -0.02em;
	color: #231f36;
}

.chalets-rules-modal-body h2 { font-size: 19px; }

/* Titres de section : bien démarqués + petite ligne décorative du design */
.chalets-rules-modal-body h3 {
	margin: 2em 0 0.9em;
	font-size: 17px;
	font-weight: 600;
}

.chalets-rules-modal-body h3::after {
	content: "";
	display: block;
	width: 36px;
	height: 2px;
	margin-top: 8px;
	background: rgba(35, 31, 54, 0.3);
}

.chalets-rules-modal-body > :first-child { margin-top: 0; }

.chalets-rules-modal-body p { margin: 0 0 1em; }

/* Listes : le preflight Tailwind retire les puces (list-style: none) et les
   marges — on restyle des puces « • » et l'espacement entre items ici. */
.chalets-rules-modal-body ul,
.chalets-rules-modal-body ol {
	margin: 0 0 1.6em;
	padding-left: 0;
	list-style: none;
}

.chalets-rules-modal-body ol {
	list-style: decimal;
	padding-left: 1.5em;
}

.chalets-rules-modal-body li {
	margin: 0 0 0.55em;
	line-height: 1.6;
}

.chalets-rules-modal-body ul > li {
	position: relative;
	padding-left: 1.35em;
}

.chalets-rules-modal-body ul > li::before {
	content: "\2022"; /* • */
	position: absolute;
	left: 0.3em;
	top: 0;
	color: rgba(35, 31, 54, 0.55);
}

/* Listes imbriquées éventuelles */
.chalets-rules-modal-body li > ul,
.chalets-rules-modal-body li > ol {
	margin: 0.55em 0 0;
}

.chalets-rules-scroll-hint {
	flex-shrink: 0;
	padding: 10px 24px;
	background: #efe7e1;
	border-top: 1px solid rgba(35, 31, 54, 0.1);
	font-family: var(--font-league-spartan, "League Spartan", sans-serif);
	font-size: 12px;
	letter-spacing: 0.04em;
	text-align: center;
	color: #231f36;
}

.chalets-rules-scroll-hint[hidden] {
	display: none;
}

.chalets-rules-modal-footer {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 18px 24px;
	border-top: 1px solid rgba(35, 31, 54, 0.1);
	background: #fff;
	flex-shrink: 0;
}

.chalets-rules-accept-label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--font-league-spartan, "League Spartan", sans-serif);
	font-size: 14px;
	color: #231f36;
	cursor: pointer;
	user-select: none;
}

.chalets-rules-accept-label.is-disabled {
	color: rgba(35, 31, 54, 0.45);
	cursor: not-allowed;
}

.chalets-rules-accept-label input[type="checkbox"] {
	margin: 0;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	accent-color: #231f36;
	cursor: pointer;
}

.chalets-rules-accept-label.is-disabled input[type="checkbox"] {
	cursor: not-allowed;
}

/* Bouton « Valider » — réplique le bouton primaire du design.
   line-height et padding explicites pour tomber exactement sur la hauteur du
   bouton « Soumettre » du formulaire (49,6 px) : sans line-height il héritait
   du 1.6 de la page et mesurait 48,8 px, soit 1 px d'écart avec son jumeau. */
.chalets-rules-confirm {
	align-self: flex-end;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 16px 28px;
	background: #231f36;
	border: 1px solid #231f36;
	border-radius: 0;
	color: #efe7e1;
	font-family: var(--font-league-spartan, "League Spartan", sans-serif);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.22em;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.chalets-rules-confirm:hover:not(:disabled) {
	background: #efe7e1;
	color: #231f36;
}

.chalets-rules-confirm:disabled {
	background: rgba(35, 31, 54, 0.25);
	border-color: transparent;
	color: #fff;
	cursor: not-allowed;
}

@media (max-width: 600px) {
	.chalets-rules-overlay {
		padding: 0;
	}

	.chalets-rules-modal {
		max-width: 100%;
		max-height: 100vh;
		height: 100vh;
		border-radius: 0;
	}

	.chalets-rules-modal-header h2 { font-size: 19px; }
	.chalets-rules-modal-body { padding: 18px; font-size: 14px; }
	.chalets-rules-confirm { width: 100%; align-self: stretch; }
}