/**
 * Blocs d'article — Calepin Parentalité
 *
 * Partagé entre le front (articles) et l'éditeur de blocs (add_editor_style),
 * pour que l'auteur voie ce que verra le lecteur. Ne dépend que des tokens
 * --cp-* de style.css ; ils sont redéclarés dans cp-editor.css pour l'éditeur.
 *
 * @package CalepiParentalite
 */

/* ── Sommaire (généré par le thème depuis les h2) ────────────────────────────── */

.cp-toc {
    background:    var(--cp-peach);
    border:        var(--cp-border) rgba(44, 44, 42, 0.12);
    border-radius: var(--cp-radius-card);
    padding:       1rem 1.25rem;
    margin:        1.75rem 0 2.25rem;
    font-family:   'Lato', sans-serif;
}
.cp-toc summary {
    cursor:         pointer;
    font-weight:    700;
    font-size:      12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color:          var(--cp-teal);
    list-style:     none;
}
.cp-toc summary::-webkit-details-marker { display: none; }
.cp-toc summary::after {
    content:     '▾';
    margin-left: 0.5rem;
    font-size:   11px;
}
.cp-toc[open] summary::after { content: '▴'; }
.cp-toc ol {
    margin:  0.75rem 0 0;
    padding: 0 0 0 1.25rem;
}
.cp-toc li {
    margin:      0.3rem 0;
    font-size:   14px;
    line-height: 1.4;
}
.cp-toc a {
    color:           var(--cp-graphite);
    text-decoration: none;
}
.cp-toc a:hover { color: var(--cp-coral); text-decoration: underline; }

/* ── « En bref » ─────────────────────────────────────────────────────────────── */

.cp-en-bref {
    background:    #fff;
    border-left:   4px solid var(--cp-teal);
    border-radius: 0 var(--cp-radius-card) var(--cp-radius-card) 0;
    box-shadow:    0 1px 2px rgba(44, 44, 42, 0.06);
    padding:       1.25rem 1.5rem;
    margin:        1.75rem 0;
}
.cp-en-bref h2,
.cp-en-bref .wp-block-heading {
    font-size:      12px !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color:          var(--cp-teal);
    margin:         0 0 0.75rem !important;
}
.cp-en-bref ul { margin: 0; padding-left: 1.2rem; }
.cp-en-bref li { margin: 0.4rem 0; font-size: 15px; line-height: 1.55; }

/* ── Encadré conseil ─────────────────────────────────────────────────────────── */

.cp-encadre {
    background:    var(--cp-peach);
    border-radius: var(--cp-radius-card);
    padding:       1rem 1.25rem;
    margin:        1.5rem 0;
}
.cp-encadre p:last-child { margin-bottom: 0; }

/* ── Questions fréquentes (bloc Détails) ─────────────────────────────────────── */

.wp-block-details {
    border:        var(--cp-border) rgba(44, 44, 42, 0.16);
    border-radius: var(--cp-radius-btn);
    padding:       0.75rem 1rem;
    margin:        0 0 0.6rem;
    background:    #fff;
}
.wp-block-details summary {
    cursor:      pointer;
    font-weight: 700;
    font-size:   15px;
    line-height: 1.4;
    color:       var(--cp-graphite);
}
.wp-block-details summary:hover { color: var(--cp-coral); }
.wp-block-details[open] summary { margin-bottom: 0.5rem; }
.wp-block-details > :not(summary) { font-size: 15px; }
.wp-block-details > p:last-child { margin-bottom: 0; }

/* ── Boutons (livres, rapports, affiliés) ────────────────────────────────────── */

.wp-block-button__link,
.wp-block-button .wp-element-button {
    background:      var(--cp-coral) !important;
    color:           #fff !important;
    border:          none;
    border-radius:   50px !important;
    font-family:     'Lato', sans-serif;
    font-weight:     700;
    font-size:       14px;
    padding:         0.65rem 1.4rem;
    text-decoration: none !important;
    transition:      background 0.15s ease;
}
.wp-block-button__link:hover,
.wp-block-button .wp-element-button:hover {
    background: var(--cp-orange) !important;
    color:      #fff !important;
}

/* ── Images, galeries, légendes, vidéos ──────────────────────────────────────── */

.wp-block-image img,
.wp-block-gallery .wp-block-image img {
    border-radius: var(--cp-radius-card);
    height:        auto;
}
.wp-block-image figcaption,
.wp-element-caption {
    font-family: 'Lato', sans-serif;
    font-size:   13px;
    color:       var(--cp-muted);
    font-style:  italic;
    margin-top:  0.5rem;
}
.wp-block-embed iframe { border-radius: var(--cp-radius-card); }
.wp-block-quote {
    border-left:   3px solid var(--cp-coral);
    padding:       0.875rem 1.25rem;
    margin:        1.75rem 0;
    background:    var(--cp-peach);
    border-radius: 0 var(--cp-radius-btn) var(--cp-radius-btn) 0;
    font-style:    italic;
}
.wp-block-quote p:last-child { margin-bottom: 0; }

/* ── Sources citées (générées ou rédigées) ───────────────────────────────────── */

.cp-sources {
    margin-top:  2.5rem;
    padding-top: 1.5rem;
    border-top:  var(--cp-border) rgba(44, 44, 42, 0.16);
}
.cp-sources h2 { font-size: 1.1rem !important; margin-top: 0 !important; }
.cp-sources ol { padding-left: 1.25rem; margin: 0; }
.cp-sources li { font-size: 14px; margin: 0.35rem 0; line-height: 1.45; }
.cp-sources__host {
    color:       var(--cp-muted);
    font-size:   12px;
    margin-left: 0.35rem;
}

/* ── Appel à l'action de fin d'article ───────────────────────────────────────── */

.cp-article-cta {
    background:    var(--cp-cacao);
    color:         #fff;
    border-radius: var(--cp-radius-card);
    padding:       1.5rem 1.75rem;
    margin:        2.5rem 0 0;
}
.cp-article-cta__titre {
    font-family: 'Caveat', cursive;
    font-size:   1.9rem;
    line-height: 1.1;
    margin:      0 0 0.5rem;
    color:       #fff;
}
.cp-article-cta__texte {
    color:       var(--cp-on-cacao);
    font-size:   14px;
    line-height: 1.55;
    margin:      0 0 1rem;
}
.cp-article-cta__bouton {
    display:         inline-block;
    background:      var(--cp-coral);
    color:           #fff !important;
    border-radius:   50px;
    padding:         0.7rem 1.5rem;
    font-family:     'Lato', sans-serif;
    font-weight:     700;
    font-size:       14px;
    text-decoration: none !important;
}
.cp-article-cta__bouton:hover { background: var(--cp-orange); }