/*
 * Les 4 anciennes pages Divi (accueil, Parents, Professionnels, Espace membre), en blocs.
 * Grille de Divi : sections 4 % (54 px dès 1350 px), rangées à 80 % / 1080 px, retrait 2 %
 * (27 px), gouttière 5,5 %, marge sous chaque module 2,75 % d'une rangée pleine.
 * Classes reprises du CSS additionnel de Divi (#22) : box, rose, blue, yellow, blue-bg.
 */

.ideas-page-divi > .ideas-contenu { padding-top: 0; }

/* ---------- Grille ---------- */

.ideas-section { position: relative; padding: 4% 0; }
@media (min-width: 1350px) { .ideas-section { padding: 54px 0; } }
.ideas-rangee { width: 80%; max-width: 1080px; margin-left: auto; margin-right: auto; padding: 2% 0; box-sizing: border-box; }
@media (min-width: 1350px) { .ideas-rangee { padding: 27px 0; } }
/* Rangée réglée à 100 % dans Divi (Actualités / Parrainage) : pleine largeur, 1080 px au plus */
.ideas-rangee--pleine { width: 100%; }
.ideas-rangee.wp-block-columns { display: flex; gap: 5.5%; margin-bottom: 0; flex-wrap: nowrap; align-items: stretch; }
.ideas-rangee.wp-block-columns > .wp-block-column { flex-grow: 0; flex-shrink: 0; min-width: 0; }
/* Divi : section sans retrait en haut quand une rangée remonte (Actualités de l'accueil) */
.ideas-section > .ideas-rangee:first-child[style*="margin-top:-"] { padding-top: 0; }

/* Marges entre modules, comme Divi (pourcentages de la largeur de la colonne) */
.ideas-rangee > * + *, .wp-block-column > * + * { margin-top: 0; }
.ideas-rangee:not(.wp-block-columns) > *:not(:last-child) { margin-bottom: 2.75%; }
.wp-block-column > *:not(:last-child) { margin-bottom: 5.82%; }
.wp-block-column[style*="29.6667%"] > *:not(:last-child) { margin-bottom: 9.27%; }

/* ---------- Module Texte ---------- */

.ideas-texte { overflow-wrap: break-word; }
.ideas-texte > * + * { margin-top: 0; }
.ideas-texte p { padding-bottom: 1em; }
.ideas-texte p:last-child { padding-bottom: 0; }
.ideas-texte ul, .ideas-texte ol { padding-bottom: 1em; }
.ideas-texte.ideas-centre { text-align: center; }
.ideas-texte__lien, .ideas-texte__lien:hover { color: inherit; display: block; }

/* Cases de profil de l'accueil (CSS #22 : .box, .rose, .blue, .yellow) */
.box {
	align-content: center; align-items: center; flex: 1 1 auto;
	border-top-right-radius: 15px; border-bottom-left-radius: 15px;
	color: #fff; margin: 3px auto; min-height: 8vh; height: auto;
	padding-top: 10px; padding-bottom: 10px; vertical-align: middle !important;
}
.box, .box a, .box p { color: #fff; }
.rose { background: #c61c7b; }
.blue { background: #0fa1c8; }
.yellow { background: #d5893a; }
.blue-bg { background: #0fa1c8; color: #fff; }
.box p { line-height: inherit; }

/* Accueil : texte d'introduction en Lato 17 px comme le module Divi */
.ideas-texte[style*="font-size:17px"] p { font-family: Lato, 'Roboto Slab', sans-serif; padding-bottom: 17px; }
.ideas-texte[style*="font-size:17px"] p:last-child { padding-bottom: 0; }
.ideas-texte h1, .ideas-texte h2, .ideas-texte h3 { margin: 0; }
.ideas-texte.has-background h2 { color: #333; font-size: 26px; padding-bottom: 10px; }

/* ---------- Image, bouton, code ---------- */

.ideas-image { margin: 0; line-height: 0; }
.ideas-image img { max-width: 100%; height: auto; }
.ideas-image.aligncenter { text-align: center; }
.ideas-image.aligncenter img { margin: 0 auto; }
.ideas-texte img.aligncenter { display: block; margin: 0 auto; }

.ideas-bouton-divi .wp-block-button__link {
	background: transparent; color: #2ea3f2; border: 2px solid #2ea3f2; border-radius: 3px;
	font-size: 20px; line-height: 1.7em; font-weight: 500; padding: 6px 20px; transition: all .2s;
}
.ideas-bouton-divi .wp-block-button__link:hover { background: rgba(0, 0, 0, .05); border-color: transparent; }

/* ---------- Accordéons (module Bascule de Divi) → bloc Détails ---------- */

.ideas-accordeon { border: 1px solid #009bc3; padding: 20px; background: #009bc3; }
.ideas-accordeon > summary {
	list-style: none; cursor: pointer; position: relative;
	font-family: 'Roboto Condensed', 'Arial Narrow', Arial, sans-serif; font-size: 16px; line-height: 1em; font-weight: 700;
	color: #fff; padding: 0 50px 0 0;
}
.ideas-accordeon > summary::-webkit-details-marker { display: none; }
/* Rond « + » / « − » à droite (icônes E050 / E04F de Divi) */
.ideas-accordeon > summary::after {
	content: ''; position: absolute; right: 0; top: 50%; width: 22px; height: 22px; margin-top: -11px;
	border-radius: 50%; background: #fff center / 12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23009bc3' d='M5 0h2v12H5zM0 5h12v2H0z'/%3E%3C/svg%3E");
}
.ideas-accordeon[open] { background: #fff; }
.ideas-accordeon[open] > summary { background: #0b9bc3; padding: 20px 70px 20px 20px; font-weight: 500; }
.ideas-accordeon[open] > summary::after {
	right: 20px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%230b9bc3' d='M0 5h12v2H0z'/%3E%3C/svg%3E");
}
.ideas-accordeon[open] > summary ~ * { margin-top: 0; }
.ideas-accordeon[open] > summary + * { margin-top: 20px; }
.ideas-accordeon > :not(summary) { padding: 0; }
.ideas-accordeon h1, .ideas-accordeon h2, .ideas-accordeon h3 { margin-top: 22px; margin-bottom: 11px; }
.ideas-accordeon p { padding-bottom: 15px; }
/* Espace membre : bleu #0fa1c8, titres de 20 px */
.ideas-accordeon--membre { background: #0fa1c8; }
.ideas-accordeon--membre > summary { font-size: 20px; font-weight: 500; }
.ideas-accordeon--membre[open] { color: #666; }

/* ---------- Bandeaux photo du haut des pages ---------- */

.ideas-bandeau { padding: 4% 0; }
.ideas-bandeau .wp-block-cover__inner-container { width: 80%; max-width: 1080px; }

/* ---------- Listes d'articles de l'accueil (module Blog de Divi) ---------- */

.ideas-blog__articles { list-style: none; margin: 0; padding: 0; }
.ideas-blog--cadres { padding: 5px 10px; }
.ideas-blog--cadres .ideas-blog__articles > li {
	border: 1px solid #0fa1c8; border-radius: 1px; padding: 20px; margin-bottom: 60px; overflow: hidden;
}
/* Vignette de Divi : 350 × 197 au plus, recadrée, à gauche, 30 px dessous */
.ideas-blog__image { margin: 0 0 30px; }
.ideas-blog__image img { width: 350px; max-width: 100%; aspect-ratio: 350 / 197; object-fit: cover; display: block; }
.ideas-blog__titre { margin: 0; padding-bottom: 10px; font-size: 27px; line-height: 35px; font-weight: 700; color: #0fa1c8; }
.ideas-blog__titre a { color: #0fa1c8; }
.ideas-blog__extrait p { padding: 0; }
.ideas-blog__extrait .wp-block-post-excerpt__more-text { margin: 0; text-align: right; }
.ideas-blog__extrait .wp-block-post-excerpt__more-link { display: block; text-transform: uppercase; font-size: 18px; color: #2ea3f2; }
.ideas-blog__categories { font-size: 14px; padding-bottom: 15px; }
.ideas-blog__categories a { color: #666; }
.ideas-blog--complet { padding: 0 10px; }
.ideas-blog__contenu p { padding-bottom: 1em; }

/* ---------- Petits écrans : colonnes l'une sous l'autre, comme Divi sous 981 px ---------- */

@media (max-width: 980px) {
	.ideas-section { padding: 50px 0; }
	.ideas-rangee { padding: 30px 0; }
	/* Le cœur impose nowrap !important au-dessus de 782 px : Divi empile dès 980 px */
	.ideas-rangee.wp-block-columns { flex-wrap: wrap !important; gap: 0; }
	.ideas-rangee.wp-block-columns > .wp-block-column { flex-basis: 100% !important; margin-bottom: 30px; }
	.ideas-rangee.wp-block-columns > .wp-block-column:last-child { margin-bottom: 0; }
	.wp-block-column > *:not(:last-child), .ideas-rangee:not(.wp-block-columns) > *:not(:last-child) { margin-bottom: 30px; }
}
