/* Réservation des stages — styles
   Source : « :is(#content, body) .rs-app.rs-app » est remplacé par le sélecteur de portée à la génération de front.css
   (spécificité suffisante pour passer devant les styles globaux du thème). */

:is(#content, body) .rs-app.rs-app {
	--rs-accent: #a24dbb;
	--rs-accent-fort: #8a3aa3;
	--rs-accent-doux: #f4e6f8;
	--rs-rose: #d570eb;
	--rs-encre: #2b2631;
	--rs-gris: #6a6272;
	--rs-trait: #e3dce8;
	--rs-fond: #efe6f3;
	--rs-carte: #f7f1f9;
	--rs-jaune: #fff8df;
	--rs-jaune-trait: #f0e2b0;
	--rs-ok: #2f8a57;
	--rs-ok-doux: #e3f3ea;
	--rs-complet: #b9403f;
	--rs-complet-doux: #f8e4e3;
	color: var(--rs-encre);
	font-size: 15px;
	line-height: 1.5;
	text-align: left;
	container-type: inline-size;
	margin: 2rem 0;
}
:is(#content, body) .rs-app.rs-app *, :is(#content, body) .rs-app.rs-app *::before, :is(#content, body) .rs-app.rs-app *::after { box-sizing: border-box; }
:is(#content, body) .rs-app.rs-app p { margin: 0 0 .75em; }
:is(#content, body) .rs-app.rs-app ul { margin: 0; padding-left: 1.2em; }
:is(#content, body) .rs-app.rs-app li { list-style: disc; }
:is(#content, body) .rs-app.rs-app li::before { content: none !important; }
:is(#content, body) .rs-app.rs-app h2, :is(#content, body) .rs-app.rs-app h3 { text-transform: none; letter-spacing: normal; }
:is(#content, body) .rs-app.rs-app a { padding: 0 !important; display: inline !important; color: var(--rs-accent-fort); text-decoration: underline; }
:is(#content, body) .rs-app.rs-app .rs-chargement { color: var(--rs-gris); }

:is(#content, body) .rs-app.rs-app input, :is(#content, body) .rs-app.rs-app textarea, :is(#content, body) .rs-app.rs-app select {
	display: block; width: 100%; margin: 0; padding: 9px 10px;
	font: inherit; font-size: 15px; line-height: 1.3; color: var(--rs-encre);
	background: #fff; border: 1px solid var(--rs-trait); border-radius: 5px;
}
:is(#content, body) .rs-app.rs-app input:focus, :is(#content, body) .rs-app.rs-app textarea:focus, :is(#content, body) .rs-app.rs-app select:focus { outline: 2px solid var(--rs-accent); outline-offset: 0; border-color: var(--rs-accent); }
:is(#content, body) .rs-app.rs-app input[type="checkbox"], :is(#content, body) .rs-app.rs-app input[type="radio"] {
	display: inline-block; width: 16px; height: 16px; padding: 0; margin: 3px 0 0; flex: none; accent-color: var(--rs-accent);
}
:is(#content, body) .rs-app.rs-app button { font: inherit; color: inherit; }
:is(#content, body) .rs-app.rs-app button:focus-visible { outline: 2px solid var(--rs-accent); outline-offset: 2px; }

/* Mise en page : panier à droite quand il y a la place */
:is(#content, body) .rs-app.rs-app .rs-cadre { display: grid; grid-template-columns: 1fr; gap: 20px; align-items: start; }
@container (min-width: 880px) {
	:is(#content, body) .rs-app.rs-app .rs-cadre { grid-template-columns: minmax(0, 1fr) 280px; }
	:is(#content, body) .rs-app.rs-app .rs-panier { position: sticky; top: 110px; }
}

:is(#content, body) .rs-app.rs-app .rs-carte { background: var(--rs-carte); border: 1px solid #e2d5e9; box-shadow: 0 1px 2px rgba(60,30,70,.08), 0 6px 20px rgba(60,30,70,.12); border-radius: 4px; overflow: hidden; }
:is(#content, body) .rs-app.rs-app .rs-bandeau { background: var(--rs-accent); color: #fff; padding: 16px 22px; }
:is(#content, body) .rs-app.rs-app .rs-bandeau h2 { margin: 0; font-size: 19px; text-transform: uppercase; letter-spacing: .08em; color: #fff; font-weight: 500; }
:is(#content, body) .rs-app.rs-app .rs-bandeau p { margin: 2px 0 0; font-size: 14px; opacity: .92; }
:is(#content, body) .rs-app.rs-app .rs-corps { padding: 20px 22px; }

:is(#content, body) .rs-app.rs-app .rs-etapes { display: flex; background: var(--rs-fond); border-bottom: 1px solid var(--rs-trait); overflow-x: auto; }
:is(#content, body) .rs-app.rs-app .rs-etapes button { flex: 1; min-width: 110px; border: 0; background: none; padding: 13px 10px; display: flex; align-items: center; gap: 8px; cursor: pointer; color: var(--rs-gris); font-weight: 700; font-size: 14px; border-bottom: 3px solid transparent; text-align: left; }
:is(#content, body) .rs-app.rs-app .rs-etapes .rs-n { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; border: 1.5px solid currentColor; flex: none; }
:is(#content, body) .rs-app.rs-app .rs-etapes button[aria-current="step"] { color: var(--rs-accent-fort); border-bottom-color: var(--rs-accent); }
:is(#content, body) .rs-app.rs-app .rs-etapes button.rs-fait { color: var(--rs-ok); }
:is(#content, body) .rs-app.rs-app .rs-etapes button.rs-fait .rs-n { background: var(--rs-ok); border-color: var(--rs-ok); color: #fff; }

:is(#content, body) .rs-app.rs-app .rs-etape { padding: 22px; }
:is(#content, body) .rs-app.rs-app .rs-etape h3 { margin: 0 0 4px; font-size: 20px; color: var(--rs-encre); font-weight: 600; }
:is(#content, body) .rs-app.rs-app .rs-etape h3.rs-sous-titre { margin-top: 24px; margin-bottom: 8px; font-size: 17px; }
:is(#content, body) .rs-app.rs-app .rs-intro { color: var(--rs-gris); margin-bottom: 18px; }
:is(#content, body) .rs-app.rs-app .rs-discret { color: var(--rs-gris); font-size: 13px; font-weight: 400; }

:is(#content, body) .rs-app.rs-app .rs-enfants, :is(#content, body) .rs-app.rs-app .rs-plans { display: grid; gap: 14px; }
:is(#content, body) .rs-app.rs-app .rs-ajouter { margin: 20px 0 0; }
:is(#content, body) .rs-app.rs-app .rs-enfant { border: 1px solid var(--rs-trait); border-radius: 6px; padding: 14px 16px 16px; margin: 0; display: grid; gap: 14px; min-width: 0; }
:is(#content, body) .rs-app.rs-app .rs-enfant-titre { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; padding: 0; font-weight: 700; font-size: 17px; float: left; }
:is(#content, body) .rs-app.rs-app .rs-enfant-titre + * { clear: both; }
:is(#content, body) .rs-app.rs-app .rs-champs { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px 14px; }
:is(#content, body) .rs-app.rs-app .rs-champ { display: grid; gap: 4px; align-content: start; margin-top: 2px; }
:is(#content, body) .rs-app.rs-app .rs-champ label, :is(#content, body) .rs-app.rs-app .rs-label { font-size: 13px; font-weight: 700; }
:is(#content, body) .rs-app.rs-app .rs-aide { font-size: 12px; color: var(--rs-gris); }
:is(#content, body) .rs-app.rs-app .rs-niveaux { display: flex; flex-wrap: wrap; gap: 6px; }
:is(#content, body) .rs-app.rs-app .rs-niveaux label { border: 1px solid var(--rs-trait); border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 400; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
:is(#content, body) .rs-app.rs-app .rs-niveaux input { margin: 0; }
:is(#content, body) .rs-app.rs-app .rs-niveaux label.rs-on { border-color: var(--rs-accent); background: var(--rs-accent-doux); color: var(--rs-accent-fort); font-weight: 700; }
:is(#content, body) .rs-app.rs-app .rs-cases { display: grid; gap: 10px; margin-top: 16px; }
:is(#content, body) .rs-app.rs-app .rs-case { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; cursor: pointer; font-weight: 400; }

:is(#content, body) .rs-app.rs-app .rs-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid transparent; border-radius: 6px; padding: 11px 18px; font-weight: 700; cursor: pointer; font-size: 15px; line-height: 1.2; }
:is(#content, body) .rs-app.rs-app .rs-btn-plein { background: var(--rs-accent); color: #fff; }
:is(#content, body) .rs-app.rs-app .rs-btn-plein:hover { background: var(--rs-accent-fort); }
:is(#content, body) .rs-app.rs-app .rs-btn-ghost { background: #fff; border-color: var(--rs-trait); color: var(--rs-encre); }
:is(#content, body) .rs-app.rs-app .rs-btn-ghost:hover { border-color: var(--rs-accent); color: var(--rs-accent-fort); }
:is(#content, body) .rs-app.rs-app .rs-btn-petit { padding: 6px 12px; font-size: 13px; }
:is(#content, body) .rs-app.rs-app .rs-btn-large { padding: 14px 22px; font-size: 16px; width: 100%; max-width: 420px; }
:is(#content, body) .rs-app.rs-app .rs-btn[disabled] { opacity: .45; cursor: not-allowed; }
:is(#content, body) .rs-app.rs-app .rs-lien { background: none; border: 0; padding: 0; color: var(--rs-accent-fort); font-weight: 700; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; font-size: 14px; }

:is(#content, body) .rs-app.rs-app .rs-onglets { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
:is(#content, body) .rs-app.rs-app .rs-onglets button { border: 1px solid var(--rs-trait); background: #fff; border-radius: 6px; padding: 8px 14px; cursor: pointer; text-align: left; }
:is(#content, body) .rs-app.rs-app .rs-onglets button small { display: block; color: var(--rs-gris); font-size: 12px; }
:is(#content, body) .rs-app.rs-app .rs-onglets button[aria-selected="true"] { border-color: var(--rs-accent); background: var(--rs-accent-doux); }
:is(#content, body) .rs-app.rs-app .rs-onglets button[aria-selected="true"] strong { color: var(--rs-accent-fort); }

:is(#content, body) .rs-app.rs-app .rs-plan { border: 1px solid var(--rs-trait); border-radius: 6px; overflow: hidden; }
:is(#content, body) .rs-app.rs-app .rs-plan-tete { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 16px; padding: 10px 14px; background: var(--rs-fond); border-bottom: 1px solid var(--rs-trait); }
:is(#content, body) .rs-app.rs-app .rs-plan-tete strong { font-size: 16px; }
:is(#content, body) .rs-app.rs-app .rs-plan-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
:is(#content, body) .rs-app.rs-app .rs-grille-scroll { overflow-x: auto; }
:is(#content, body) .rs-app.rs-app .rs-grille { display: grid; grid-template-columns: 88px repeat(5, minmax(76px, 1fr)); min-width: 480px; }
:is(#content, body) .rs-app.rs-app .rs-grille > div { border-right: 1px solid var(--rs-trait); border-bottom: 1px solid var(--rs-trait); }
:is(#content, body) .rs-app.rs-app .rs-grille > div:nth-child(6n) { border-right: 0; }
:is(#content, body) .rs-app.rs-app .rs-jour { padding: 6px 4px; text-align: center; }
:is(#content, body) .rs-app.rs-app .rs-jour button { border: 0; background: none; cursor: pointer; display: grid; gap: 1px; width: 100%; padding: 3px; border-radius: 4px; line-height: 1.25; }
:is(#content, body) .rs-app.rs-app .rs-jour button:hover:not([disabled]) { background: var(--rs-accent-doux); }
:is(#content, body) .rs-app.rs-app .rs-jour button[disabled] { cursor: default; }
:is(#content, body) .rs-app.rs-app .rs-j-nom { font-weight: 900; font-size: 13px; }
:is(#content, body) .rs-app.rs-app .rs-j-date { font-size: 12px; color: var(--rs-gris); }
:is(#content, body) .rs-app.rs-app .rs-j-act { font-size: 11px; color: var(--rs-accent-fort); font-weight: 700; }
:is(#content, body) .rs-app.rs-app .rs-jour button[disabled] .rs-j-act { color: var(--rs-gris); }
:is(#content, body) .rs-app.rs-app .rs-ligne-titre { padding: 8px 10px; display: grid; align-content: center; font-size: 13px; font-weight: 700; }
:is(#content, body) .rs-app.rs-app .rs-ligne-titre span { font-weight: 400; color: var(--rs-gris); font-size: 12px; }
:is(#content, body) .rs-app.rs-app .rs-cellule { padding: 6px; }
:is(#content, body) .rs-app.rs-app .rs-creneau { width: 100%; min-height: 56px; border: 1.5px solid var(--rs-trait); border-radius: 5px; background: #fff; cursor: pointer; display: grid; place-items: center; padding: 4px; font-size: 12px; color: var(--rs-gris); line-height: 1.2; }
:is(#content, body) .rs-app.rs-app .rs-creneau b { font-size: 15px; color: var(--rs-ok); }
:is(#content, body) .rs-app.rs-app .rs-creneau:hover:not([disabled]) { border-color: var(--rs-accent); }
:is(#content, body) .rs-app.rs-app .rs-creneau.rs-choisi { background: var(--rs-accent); border-color: var(--rs-accent); color: #fff; }
:is(#content, body) .rs-app.rs-app .rs-creneau.rs-choisi b { color: #fff; }
:is(#content, body) .rs-app.rs-app .rs-creneau.rs-complet { background: var(--rs-complet-doux); border-color: transparent; color: var(--rs-complet); cursor: not-allowed; }
:is(#content, body) .rs-app.rs-app .rs-creneau.rs-complet b { color: var(--rs-complet); font-size: 13px; }
:is(#content, body) .rs-app.rs-app .rs-creneau.rs-ferme {
	background: repeating-linear-gradient(135deg, #e2dde6 0 6px, #eeeaf0 6px 12px);
	border-color: #d3ccd8; color: #7c7486; cursor: default;
	font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 700;
}
:is(#content, body) .rs-app.rs-app .rs-option { padding: 10px 14px; border-bottom: 1px solid var(--rs-trait); }
:is(#content, body) .rs-app.rs-app .rs-plan-pied { padding: 10px 14px; display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; align-items: center; font-size: 14px; margin: 0; }
:is(#content, body) .rs-app.rs-app .rs-montant { font-variant-numeric: tabular-nums; white-space: nowrap; }
:is(#content, body) .rs-app.rs-app .rs-legende { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; color: var(--rs-gris); margin-top: 8px; }
:is(#content, body) .rs-app.rs-app .rs-legende i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: -2px; margin-right: 4px; border: 1.5px solid var(--rs-trait); }
:is(#content, body) .rs-app.rs-app .rs-l-choisi { background: var(--rs-accent); border-color: var(--rs-accent) !important; }
:is(#content, body) .rs-app.rs-app .rs-l-complet { background: var(--rs-complet-doux); border-color: transparent !important; }
:is(#content, body) .rs-app.rs-app .rs-l-ferme { background: repeating-linear-gradient(135deg, #e2dde6 0 3px, #eeeaf0 3px 6px); border-color: #d3ccd8 !important; }

:is(#content, body) .rs-app.rs-app .rs-alerte { display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px; border-radius: 6px; font-size: 14px; margin: 0 0 14px; }
:is(#content, body) .rs-app.rs-app .rs-alerte ul { margin: 0; }
:is(#content, body) .rs-app.rs-app .rs-alerte-erreur, :is(#content, body) .rs-app.rs-app .rs-alerte-complet { background: var(--rs-complet-doux); color: var(--rs-complet); }
:is(#content, body) .rs-app.rs-app .rs-plan-pied .rs-alerte { margin: 0; flex: 1 1 100%; }
:is(#content, body) .rs-app.rs-app .rs-alerte-info { background: var(--rs-accent-doux); color: var(--rs-accent-fort); display: block; }
:is(#content, body) .rs-app.rs-app .rs-alerte-ok { background: var(--rs-ok-doux); color: var(--rs-ok); display: block; }
:is(#content, body) .rs-app.rs-app .rs-badge { display: inline-flex; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
:is(#content, body) .rs-app.rs-app .rs-badge-ok { background: var(--rs-ok-doux); color: var(--rs-ok); }
:is(#content, body) .rs-app.rs-app .rs-badge-complet { background: var(--rs-complet-doux); color: var(--rs-complet); }

:is(#content, body) .rs-app.rs-app .rs-recap-ligne { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 9px 0; border-bottom: 1px dashed var(--rs-trait); font-size: 14px; }
:is(#content, body) .rs-app.rs-app .rs-recap-ligne small { display: block; color: var(--rs-gris); font-size: 12px; }
:is(#content, body) .rs-app.rs-app .rs-recap-ligne .rs-montant { font-weight: 700; text-align: right; }
:is(#content, body) .rs-app.rs-app .rs-recap-ligne.rs-du { font-weight: 900; font-size: 16px; color: var(--rs-accent-fort); border-bottom: 0; }
:is(#content, body) .rs-app.rs-app .rs-payer { margin-top: 18px; }
:is(#content, body) .rs-app.rs-app .rs-paypal { max-width: 420px; margin-top: 10px; }

:is(#content, body) .rs-app.rs-app .rs-panier { background: var(--rs-jaune); border: 1px solid var(--rs-jaune-trait); border-radius: 4px; padding: 16px 18px; display: grid; gap: 10px; }
:is(#content, body) .rs-app.rs-app .rs-panier h3 { margin: 0; font-size: 14px; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; color: var(--rs-encre); }
:is(#content, body) .rs-app.rs-app .rs-panier-ligne { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; }
:is(#content, body) .rs-app.rs-app .rs-panier-ligne small { display: block; color: var(--rs-gris); font-size: 12px; }
:is(#content, body) .rs-app.rs-app .rs-panier-ligne.rs-total { font-size: 17px; font-weight: 900; border-top: 1px solid var(--rs-jaune-trait); padding-top: 10px; }
:is(#content, body) .rs-app.rs-app .rs-panier-ligne.rs-du { color: var(--rs-accent-fort); font-weight: 900; font-size: 16px; }
:is(#content, body) .rs-app.rs-app .rs-panier hr { border: 0; border-top: 1px solid var(--rs-jaune-trait); margin: 0; height: 0; width: auto; background: none; }
:is(#content, body) .rs-app.rs-app .rs-panier small { color: var(--rs-gris); font-size: 12px; }
:is(#content, body) .rs-app.rs-app .rs-panier p { margin: 0; }

:is(#content, body) .rs-app.rs-app .rs-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 22px; border-top: 1px solid var(--rs-trait); background: var(--rs-fond); flex-wrap: wrap; }
:is(#content, body) .rs-app.rs-app .rs-termine .rs-grand { font-size: 22px; font-weight: 700; margin: 8px 0; }

:is(#content, body) .rs-app.rs-solde .rs-carte { max-width: 640px; }

/* Petits écrans : les 5 jours tiennent sans défilement */
@container (max-width: 600px) {
	:is(#content, body) .rs-app.rs-app .rs-grille { grid-template-columns: 50px repeat(5, minmax(0, 1fr)); min-width: 0; }
	:is(#content, body) .rs-app.rs-app .rs-ligne-titre { padding: 6px 4px; font-size: 11px; }
	:is(#content, body) .rs-app.rs-app .rs-ligne-titre span { font-size: 10px; }
	:is(#content, body) .rs-app.rs-app .rs-jour { padding: 4px 1px; }
	:is(#content, body) .rs-app.rs-app .rs-j-nom { font-size: 12px; }
	:is(#content, body) .rs-app.rs-app .rs-j-date { font-size: 11px; }
	:is(#content, body) .rs-app.rs-app .rs-j-act { font-size: 10px; line-height: 1.15; }
	:is(#content, body) .rs-app.rs-app .rs-cellule { padding: 3px; }
	:is(#content, body) .rs-app.rs-app .rs-creneau { min-height: 48px; padding: 2px; font-size: 10px; }
	:is(#content, body) .rs-app.rs-app .rs-creneau b { font-size: 13px; }
	:is(#content, body) .rs-app.rs-app .rs-creneau .rs-c-lib { display: none; }
	:is(#content, body) .rs-app.rs-app .rs-plan-tete { padding: 10px; }
	:is(#content, body) .rs-app.rs-app .rs-option, :is(#content, body) .rs-app.rs-app .rs-plan-pied { padding: 10px; }
}

@media (max-width: 520px) {
	:is(#content, body) .rs-app.rs-app .rs-etape { padding: 16px; }
	:is(#content, body) .rs-app.rs-app .rs-etapes button { font-size: 13px; min-width: 96px; }
	:is(#content, body) .rs-app.rs-app .rs-nav { padding: 12px 16px; }
}