/* =====================================================================
   PAGE CENTRE (lieux_detail.php) -- Samy 16/10/2026, 2e passe
   Tout est porte par .pe-centre : aucune regle ne sort de cette page.
   Retour arriere : retirer le lien vers ce fichier dans lieux_detail.php.
   ===================================================================== */

/* le conteneur enferme ses colonnes flottantes : sans cela le dernier bloc blanc
   (« Autres formations disponibles dans ce centre ») passait SOUS le pied de page rouge. */
.pe-centre:after{content:"";display:table;clear:both}
.pe-centre{margin-bottom:28px}

/* ---- LE CADRE DE LA PAGE ----
   Le titre et le texte de presentation etaient poses sur le fond gris, au-dessus du
   cadre : la page commencait par deux elements detaches. Ils sont maintenant DANS le
   cadre et en forment l'en-tete. */
.pe-centre .pe-bloc{padding:38px 40px 34px;border:1px solid #e4e6ef;border-radius:6px;
	box-shadow:0 1px 4px rgba(16,24,64,.05)}
.pe-centre .pe-entete{padding:0 0 26px;margin:0 0 30px;border-bottom:1px solid #edeff6}
.pe-centre .pe-entete h1{font-size:31px;line-height:1.22;margin:0 0 12px;color:#151c64}
.pe-centre .pe-intro{font-size:17px;line-height:1.68;color:#3a3f52;text-align:justify;
	-webkit-hyphens:none;-ms-hyphens:none;hyphens:none;max-width:92ch;margin:0}

/* ---- les titres de section : le bleu du site, souligne d'un trait rouge court ---- */
.pe-centre h2{color:#151c64;font-size:21px;font-weight:600;line-height:1.3;margin:0 0 16px}
.pe-centre .pe-col-texte h2{position:relative;padding-bottom:11px}
.pe-centre .pe-col-texte h2:after{content:"";position:absolute;left:0;bottom:0;
	width:44px;height:3px;background:#cc3013;border-radius:2px}

/* ---- la colonne de texte ---- */
.pe-centre .pe-col-texte{font-size:16px;line-height:1.68;color:#3a3f52;text-align:justify;
	-webkit-hyphens:none;-ms-hyphens:none;hyphens:none;padding-right:34px}
.pe-centre .pe-col-texte p{font-size:16px;line-height:1.68;margin:0 0 14px}
.pe-centre .pe-col-texte ul{margin:0 0 14px 20px;padding:0}
.pe-centre .pe-col-texte li{list-style:disc;margin:6px 0}
.pe-centre .pe-col-suite{font-size:16px;line-height:1.68;color:#3a3f52;text-align:justify;
	-webkit-hyphens:none;-ms-hyphens:none;hyphens:none;margin-top:26px;padding-top:26px;
	border-top:1px solid #edeff6}

/* ---- les cartes de droite ---- */
.pe-centre .pe-carte{border:1px solid #e4e6ef;border-radius:6px;background:#fff;
	margin:0 0 22px;overflow:hidden}
.pe-centre .pe-carte-titre{background:#f6f7fb;border-bottom:1px solid #e9ebf3;
	padding:14px 18px;font-size:15px;font-weight:600;color:#151c64;letter-spacing:.01em}
.pe-centre .pe-carte-titre .fa{margin-right:7px;color:#151c64}
.pe-centre .pe-carte-corps{padding:20px}

/* une ligne « intitule / valeur » */
.pe-centre .pe-champ{margin:0 0 14px;font-size:16px;line-height:1.5;color:#2b2f3f}
.pe-centre .pe-champ:last-child{margin-bottom:0}
.pe-centre .pe-etiquette{display:block;font-size:11px;font-weight:700;letter-spacing:.09em;
	text-transform:uppercase;color:#8b90a6;margin-bottom:3px}

/* une ligne d'information avec sa petite icone */
.pe-centre .pe-info{font-size:16px;line-height:1.5;margin:0 0 11px;padding-left:26px;
	position:relative;color:#2b2f3f}
.pe-centre .pe-info .fa{position:absolute;left:0;top:3px;color:#8b90a6;width:16px;text-align:center}
.pe-centre .pe-date{font-weight:700;color:#151c64}
.pe-centre .pe-prix{font-weight:700;font-size:23px;color:#151c64;letter-spacing:-.01em}

/* la disponibilite, en pastille */
.pe-centre .pe-dispo,.pe-centre .pe-reste{display:inline-block;margin:2px 0 16px;padding:4px 12px;
	border-radius:14px;font-size:13px;font-weight:700;letter-spacing:.02em}
.pe-centre .pe-dispo{background:#e9f6ee;color:#1b6b3a}
.pe-centre .pe-reste{background:#fdeceb;color:#b32b23}

/* le bouton d'inscription : c'est l'action de la page, il se voit */
.pe-centre .pe-cta{display:block;width:100%;padding:13px 10px;border:1px solid #151c64;
	border-radius:6px;background:#151c64;color:#fff;font-size:17px;font-weight:600;
	text-align:center;cursor:pointer;box-shadow:0 1px 2px rgba(16,24,64,.18);
	transition:background .2s,color .2s}
.pe-centre .pe-cta:hover,.pe-centre .pe-cta:focus{background:#fff;color:#151c64}
.pe-centre .pe-ferme{display:block;width:100%;padding:13px 10px;border:1px solid #e4e6ef;
	border-radius:6px;background:#f4f5f9;color:#6b7083;font-size:16px;text-align:center}

/* ---- le bloc du tableau et celui des autres formations, au meme dessin ---- */
.pe-centre .col-md-9.cadre_pref{border:1px solid #e4e6ef;border-radius:6px;
	box-shadow:0 1px 4px rgba(16,24,64,.05);padding:32px 30px}
.pe-centre .col-md-9.cadre_pref h2{margin-bottom:20px}

/* ---- la colonne de droite (villes du departement, region) : meme dessin ---- */
.pe-centre #exploitation,.pe-centre #exploitation2{border:1px solid #e4e6ef;border-radius:6px;
	box-shadow:0 1px 4px rgba(16,24,64,.05);padding:20px 22px;margin-bottom:22px}
.pe-centre .simh3{display:block;text-align:left;color:#151c64;font-size:13px;font-weight:700;
	text-transform:uppercase;letter-spacing:.07em;padding-bottom:10px;margin-bottom:8px;
	border-bottom:1px solid #edeff6}
.pe-centre #exploitation li,.pe-centre #exploitation2 li{border-bottom:1px solid #f1f2f7;
	line-height:1.45;padding:7px 0;margin:0}
.pe-centre #exploitation li:last-child,.pe-centre #exploitation2 li:last-child{border-bottom:0}
.pe-centre #exploitation a,.pe-centre #exploitation2 a{color:#3a3f52;font-size:15px}
.pe-centre #exploitation a:hover,.pe-centre #exploitation2 a:hover{color:#151c64}

/* ---- le bloc « Autres formations disponibles dans ce centre » ---- */
/* clear:both -- defaut PRESENT AVANT ce lot : le bloc du tableau est flottant
   (classe col-xs-12 de Bootstrap, flottante a toutes les largeurs) et ce bloc-ci ne
   l'est pas. Sur telephone il remontait donc DERRIERE le tableau, sur 3 695 px. */
.pe-centre .pe-autres{clear:both;border:1px solid #e4e6ef;border-radius:6px;background:#fff;
	box-shadow:0 1px 4px rgba(16,24,64,.05);padding:30px 32px;margin-top:30px}
.pe-centre .pe-autres h2{margin-bottom:14px}
.pe-centre .pe-autres ul{margin:0 0 0 20px;padding:0}
.pe-centre .pe-autres li{list-style:disc;margin:8px 0;font-size:16px}

/* ---- le tableau des sessions ----
   On ne touche NI a la hauteur des lignes NI a la taille du texte : mesure faite,
   le remplissage reel est de 8 px (Bootstrap), pas les 20 px annonces par theme.css.
   Deux defauts seulement : un texte flou (ombre portee heritee de theme.css) et un
   survol qui passait TOUTE la ligne en rouge, prix et dates compris. */
.pe-centre .table-fill td{text-shadow:none}
.pe-centre table tr:hover td,.pe-centre table tr:nth-child(odd):hover td{color:#333;background:#eef1f8}

/* ---- telephone et tablette ---- */
@media screen and (max-width:991px){
	/* la prochaine session passe AVANT le long texte reglementaire :
	   sur telephone, elle etait rejetee a 1 500 px du haut de page. */
	.pe-centre .pe-bloc{display:-webkit-box;display:-ms-flexbox;display:flex;
		-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;
		flex-direction:column;padding:26px 22px}
	.pe-centre .pe-entete{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0;
		padding-bottom:20px;margin-bottom:24px}
	.pe-centre .pe-col-infos{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}
	.pe-centre .pe-col-texte{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;
		margin-top:26px;padding-right:0}
	.pe-centre .pe-col-suite{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}
	.pe-centre .pe-entete h1{font-size:24px}
	.pe-centre .pe-intro{font-size:16px}
	.pe-centre h2{font-size:19px}
	.pe-centre .col-md-9.cadre_pref{padding:24px 18px}
	.pe-centre .pe-autres{padding:24px 20px;margin-top:24px}
}