/* ==========================================================================
   Contenu enrichi des articles : blocs insérés par l'éditeur (boutons, cartes,
   colonnes, alertes, onglets…) et mise en forme du texte.

   Ce fichier est chargé à la fois par le site public (page article) et par
   l'éditeur (iframe TinyMCE + admin), afin que l'aperçu dans l'éditeur soit
   identique à ce que voit le visiteur. Les classes sont toutes préfixées
   « ifps- » (ou « mce-accordion » pour l'accordéon de TinyMCE).
   Les règles réservées à l'éditeur sont sous « .mce-content-body ».
   ========================================================================== */

/* -------------------------------------------------------------------------
   Éditeur uniquement : typographie de base et mode sombre
   ------------------------------------------------------------------------- */
.mce-content-body {
    font-family: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
    font-size: 17px;
    line-height: 1.75;
    color: #2b3447;
    padding: 12px 18px;
}

.mce-content-body h2,
.mce-content-body h3,
.mce-content-body h4 {
    color: #002d72;
    line-height: 1.25;
    margin: 1.6rem 0 .8rem;
}

.mce-content-body h2 { font-size: 1.75rem; }
.mce-content-body h3 { font-size: 1.4rem; }
.mce-content-body h4 { font-size: 1.15rem; }

.mce-content-body a { color: #002d72; }

.mce-content-body.ifps-editor-dark {
    background: #0f1724;
    color: #e6ebf5;
}

.mce-content-body.ifps-editor-dark h2,
.mce-content-body.ifps-editor-dark h3,
.mce-content-body.ifps-editor-dark h4,
.mce-content-body.ifps-editor-dark a { color: #8fd0f0; }

.mce-content-body .ifps-col {
    outline: 1px dashed #b9c4d8;
    outline-offset: -1px;
    padding: 8px;
    min-height: 44px;
}

.mce-content-body .ifps-tab { outline: 1px dashed #b9c4d8; padding: 8px 12px; margin-bottom: 8px; }
.mce-content-body .ifps-slide { min-width: 0; }

/* -------------------------------------------------------------------------
   Texte : images, tableaux, citations, code, médias
   ------------------------------------------------------------------------- */
:is(.ifps-article-body, .mce-content-body) img { max-width: 100%; height: auto; }

:is(.ifps-article-body, .mce-content-body) figure.image { margin: 1.25rem 0; }
:is(.ifps-article-body, .mce-content-body) figcaption {
    font-size: .9rem;
    color: #5b6577;
    text-align: center;
    margin-top: .4rem;
}

:is(.ifps-article-body, .mce-content-body) table {
    border-collapse: collapse;
    width: 100%;
    margin: 1.25rem 0;
}

:is(.ifps-article-body, .mce-content-body) th,
:is(.ifps-article-body, .mce-content-body) td {
    padding: 10px 12px;
    border: 1px solid #e6eaf2;
    vertical-align: top;
}

:is(.ifps-article-body, .mce-content-body) th { background: #f7f9fd; text-align: left; }

:is(.ifps-article-body, .mce-content-body) table.ifps-table--zebra tbody tr:nth-child(even) td { background: #f7f9fd; }
:is(.ifps-article-body, .mce-content-body) table.ifps-table--bordered th,
:is(.ifps-article-body, .mce-content-body) table.ifps-table--bordered td { border: 2px solid #002d72; }
:is(.ifps-article-body, .mce-content-body) table.ifps-table--plain th,
:is(.ifps-article-body, .mce-content-body) table.ifps-table--plain td { border: 0; }

:is(.ifps-article-body, .mce-content-body) blockquote {
    border-left: 4px solid #e4002b;
    margin: 1.25rem 0;
    padding: .6rem 1.25rem;
    background: #f7f9fd;
    color: #2b3447;
    border-radius: 0 8px 8px 0;
}

:is(.ifps-article-body, .mce-content-body) pre {
    background: #0d1b36;
    color: #e8eef9;
    padding: 16px;
    border-radius: 10px;
    overflow: auto;
    font-size: .9rem;
    line-height: 1.55;
}

:is(.ifps-article-body, .mce-content-body) :not(pre) > code {
    background: #eef1f7;
    color: #002d72;
    padding: .1em .4em;
    border-radius: 4px;
    font-size: .92em;
}

:is(.ifps-article-body, .mce-content-body) iframe { max-width: 100%; border: 0; }
:is(.ifps-article-body, .mce-content-body) iframe[src*="youtube"],
:is(.ifps-article-body, .mce-content-body) iframe[src*="vimeo"] { width: 100%; aspect-ratio: 16 / 9; height: auto; }
:is(.ifps-article-body, .mce-content-body) video { max-width: 100%; height: auto; border-radius: 8px; }

:is(.ifps-article-body, .mce-content-body) mark { background: #fff3a8; padding: 0 3px; }

/* Effets d'image (liste « Classe » de la fenêtre Image) */
.ifps-img--bw { filter: grayscale(1); }
.ifps-img--sepia { filter: sepia(.9); }
.ifps-img--shadow { box-shadow: 0 10px 24px rgba(10, 22, 40, .22); }
.ifps-img--round { border-radius: 50%; aspect-ratio: 1 / 1; object-fit: cover; }
.ifps-img--r169 { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; height: auto; }
.ifps-img--r43 { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; height: auto; }
.ifps-img--r11 { aspect-ratio: 1 / 1; object-fit: cover; }

/* Lettrine */
.ifps-dropcap::first-letter {
    float: left;
    font-size: 3.6em;
    line-height: .85;
    font-weight: 800;
    color: #002d72;
    padding: .08em .12em 0 0;
}

/* Liste de cases à cocher */
ul.ifps-checklist { list-style: none; padding-left: 0; }
ul.ifps-checklist > li { position: relative; padding-left: 1.9em; margin: .4em 0; }
ul.ifps-checklist > li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .25em;
    width: 1.15em;
    height: 1.15em;
    border: 2px solid #002d72;
    border-radius: 4px;
    box-sizing: border-box;
}
ul.ifps-checklist > li.is-checked { color: #5b6577; }
ul.ifps-checklist > li.is-checked::before {
    background: #002d72 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3L13 4.5' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 75% no-repeat;
}

/* Formules et notes de bas de page */
.ifps-math { font-family: "Cambria Math", "STIX Two Math", Georgia, serif; }
.ifps-math--block { display: block; text-align: center; margin: 1rem 0; overflow-x: auto; }
.mce-content-body .ifps-math { background: #eef1f7; padding: 0 .3em; border-radius: 4px; }

.ifps-fnref a { text-decoration: none; font-weight: 700; }
.ifps-footnotes {
    border-top: 1px solid #e6eaf2;
    margin-top: 2rem;
    padding-top: .75rem;
    font-size: .9rem;
    color: #5b6577;
}
.ifps-footnotes__title { font-weight: 700; margin: 0 0 .25rem; }

/* -------------------------------------------------------------------------
   Boutons d'action (CTA)
   ------------------------------------------------------------------------- */
.ifps-btn {
    --c: #e4002b;
    --on: #ffffff;
    display: inline-flex;
    align-items: center;
    gap: .55em;
    font-family: inherit;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none !important;
    cursor: pointer;
    box-sizing: border-box;
    margin: .25rem .4rem .25rem 0;
    border: 2px solid var(--c);
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease, background-color .2s ease, color .2s ease;
}

.ifps-btn--rouge { --c: #e4002b; --on: #ffffff; }
.ifps-btn--bleu { --c: #002d72; --on: #ffffff; }
.ifps-btn--turquoise { --c: #189bd3; --on: #06283a; }
.ifps-btn--noir { --c: #1d2433; --on: #ffffff; }

.ifps-btn--sm { font-size: 13px; padding: 7px 16px; }
.ifps-btn--md { font-size: 15px; padding: 11px 24px; }
.ifps-btn--lg { font-size: 18px; padding: 15px 34px; }

.ifps-btn--carre { border-radius: 0; }
.ifps-btn--arrondi { border-radius: 8px; }
.ifps-btn--pilule { border-radius: 999px; }

.ifps-btn--plein { background: var(--c); color: var(--on) !important; }
.ifps-btn--contour { background: transparent; color: var(--c) !important; }
.ifps-btn--minimal {
    background: transparent;
    color: var(--c) !important;
    border-color: transparent;
    padding-left: 0;
    padding-right: 0;
    text-decoration: underline !important;
}

.ifps-btn--block { display: flex; width: 100%; justify-content: center; margin-right: 0; }
.ifps-btn__icon { font-size: 1.1em; line-height: 1; }

.ifps-btn--hover-dark:hover { filter: brightness(.82); box-shadow: 0 6px 16px rgba(10, 22, 40, .22); }
.ifps-btn--hover-lift:hover { transform: translateY(-3px); box-shadow: 0 10px 22px rgba(10, 22, 40, .25); }
.ifps-btn--hover-invert.ifps-btn--plein:hover { background: transparent; color: var(--c) !important; }
.ifps-btn--hover-invert.ifps-btn--contour:hover,
.ifps-btn--hover-invert.ifps-btn--minimal:hover { background: var(--c); color: var(--on) !important; border-color: var(--c); }

/* -------------------------------------------------------------------------
   Cartes et grilles
   ------------------------------------------------------------------------- */
.ifps-card {
    border: 1px solid #e6eaf2;
    border-radius: 12px;
    overflow: hidden;
    background: #ffffff;
    box-sizing: border-box;
}

.ifps-card__img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.ifps-card__body { padding: 16px; }
.ifps-card__body > :last-child { margin-bottom: 0; }
.ifps-card__title { font-size: 1.15rem; font-weight: 700; color: #002d72; margin: 0 0 .4rem; line-height: 1.3; }

.ifps-card--fond-gris { background: #f7f9fd; }
.ifps-card--fond-bleu { background: #002d72; border-color: #002d72; color: #ffffff; }
.ifps-card--fond-degrade { background: linear-gradient(135deg, #002d72, #189bd3); border-color: #002d72; color: #ffffff; }
.ifps-card--fond-bleu .ifps-card__title,
.ifps-card--fond-degrade .ifps-card__title,
.ifps-card--fond-bleu a:not(.ifps-btn),
.ifps-card--fond-degrade a:not(.ifps-btn) { color: #ffffff; }

.ifps-card--bord-epais { border: 3px solid #002d72; }
.ifps-card--bord-aucun { border: 0; }
.ifps-card--arrondi { border-radius: 22px; }

.ifps-shadow-sm { box-shadow: 0 2px 6px rgba(10, 22, 40, .10); }
.ifps-shadow-md { box-shadow: 0 8px 20px rgba(10, 22, 40, .16); }
.ifps-shadow-lg { box-shadow: 0 16px 34px rgba(10, 22, 40, .24); }

.ifps-grid { display: grid; gap: 18px; margin: 1.5rem 0; }
.ifps-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ifps-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ifps-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* -------------------------------------------------------------------------
   Colonnes
   ------------------------------------------------------------------------- */
.ifps-cols { display: grid; gap: 24px; margin: 1.5rem 0; }
.ifps-cols--50-50 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ifps-cols--33-33-33 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ifps-cols--70-30 { grid-template-columns: 7fr 3fr; }
.ifps-cols--30-70 { grid-template-columns: 3fr 7fr; }
.ifps-cols--25-25-25-25 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ifps-col { min-width: 0; }
.ifps-col > :first-child { margin-top: 0; }
.ifps-col > :last-child { margin-bottom: 0; }

/* -------------------------------------------------------------------------
   Bannière (hero), séparateurs, espaceur
   ------------------------------------------------------------------------- */
.ifps-hero {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 230px;
    margin: 1.5rem 0;
    border-radius: 14px;
    overflow: hidden;
    background: #0d1b36;
    color: #ffffff;
}
.ifps-hero--rouge { background: #a80020; }
.ifps-hero--bleu { background: #002d72; }
.ifps-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; }
.ifps-hero__body { position: relative; padding: 34px 38px; }
.ifps-hero__title { font-size: 2rem; font-weight: 800; line-height: 1.2; color: #ffffff; margin: 0 0 .5rem; }
.ifps-hero p { color: #e8eef9; }

.ifps-divider { height: 48px; margin: 2rem 0; background-repeat: no-repeat; background-size: 100% 100%; }
.ifps-divider--wave {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 48' preserveAspectRatio='none'%3E%3Cpath d='M0 24 Q150 0 300 24 T600 24 T900 24 T1200 24 V48 H0 Z' fill='%23002d72'/%3E%3C/svg%3E");
}
.ifps-divider--slant {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 48' preserveAspectRatio='none'%3E%3Cpath d='M0 40 L1200 8 V48 H0 Z' fill='%23002d72'/%3E%3C/svg%3E");
}
.ifps-divider--spikes {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 48' preserveAspectRatio='none'%3E%3Cpolygon points='0,48 0,30 60,8 120,30 180,8 240,30 300,8 360,30 420,8 480,30 540,8 600,30 660,8 720,30 780,8 840,30 900,8 960,30 1020,8 1080,30 1140,8 1200,30 1200,48' fill='%23002d72'/%3E%3C/svg%3E");
}

.ifps-spacer { display: block; height: 48px; }
.ifps-spacer--sm { height: 24px; }
.ifps-spacer--md { height: 48px; }
.ifps-spacer--lg { height: 96px; }
.ifps-spacer--xl { height: 144px; }
.mce-content-body .ifps-spacer { background: repeating-linear-gradient(45deg, #f0f3fa, #f0f3fa 6px, #e3e8f3 6px, #e3e8f3 12px); }

/* -------------------------------------------------------------------------
   Alertes, badges, barre de progression
   ------------------------------------------------------------------------- */
.ifps-alert {
    --bg: #e8f3fb;
    --bd: #b9dcf1;
    --tx: #0a3c57;
    --ic: #189bd3;
    --ic-tx: #06283a;
    position: relative;
    margin: 1.25rem 0;
    padding: 14px 18px 14px 56px;
    border: 1px solid var(--bd);
    border-radius: 10px;
    background: var(--bg);
    color: var(--tx);
}
.ifps-alert::before {
    content: "i";
    position: absolute;
    left: 16px;
    top: 14px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--ic);
    color: var(--ic-tx);
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ifps-alert p { margin: 0 0 .4rem; color: inherit; }
.ifps-alert > :last-child { margin-bottom: 0; }
.ifps-alert__title { font-weight: 700; }
.ifps-alert--success { --bg: #e6f4ee; --bd: #a6d6bf; --tx: #0b4a33; --ic: #0d6f5a; --ic-tx: #ffffff; }
.ifps-alert--success::before { content: "\2713"; }
.ifps-alert--warning { --bg: #fff4dc; --bd: #f0d28a; --tx: #6a4a00; --ic: #f0a500; --ic-tx: #2b1d00; }
.ifps-alert--warning::before { content: "!"; }
.ifps-alert--error { --bg: #fdebee; --bd: #f0b8c0; --tx: #7a0016; --ic: #b3001f; --ic-tx: #ffffff; }
.ifps-alert--error::before { content: "\00d7"; font-size: 1.2em; }

.ifps-badge {
    display: inline-block;
    padding: .15em .75em;
    border-radius: 999px;
    font-size: .78em;
    font-weight: 700;
    line-height: 1.6;
    vertical-align: middle;
    background: #e4002b;
    color: #ffffff;
}
.ifps-badge--bleu { background: #002d72; color: #ffffff; }
.ifps-badge--turquoise { background: #189bd3; color: #06283a; }
.ifps-badge--vert { background: #e6f4ee; color: #0b4a33; }
.ifps-badge--gris { background: #e3e8f3; color: #3a4658; }

.ifps-progress { margin: 1.25rem 0; }
.ifps-progress__label { font-weight: 600; margin: 0 0 .35rem; }
.ifps-progress__track { height: 12px; background: #e6eaf2; border-radius: 6px; overflow: hidden; }
.ifps-progress__bar { height: 100%; background: #002d72; border-radius: 6px; }
.ifps-w-0 { width: 0; }
.ifps-w-5 { width: 5%; }
.ifps-w-10 { width: 10%; }
.ifps-w-15 { width: 15%; }
.ifps-w-20 { width: 20%; }
.ifps-w-25 { width: 25%; }
.ifps-w-30 { width: 30%; }
.ifps-w-35 { width: 35%; }
.ifps-w-40 { width: 40%; }
.ifps-w-45 { width: 45%; }
.ifps-w-50 { width: 50%; }
.ifps-w-55 { width: 55%; }
.ifps-w-60 { width: 60%; }
.ifps-w-65 { width: 65%; }
.ifps-w-70 { width: 70%; }
.ifps-w-75 { width: 75%; }
.ifps-w-80 { width: 80%; }
.ifps-w-85 { width: 85%; }
.ifps-w-90 { width: 90%; }
.ifps-w-95 { width: 95%; }
.ifps-w-100 { width: 100%; }

/* -------------------------------------------------------------------------
   Accordéon (plugin TinyMCE : <details class="mce-accordion">)
   ------------------------------------------------------------------------- */
details.mce-accordion {
    border: 1px solid #e6eaf2;
    border-radius: 10px;
    margin: .75rem 0;
    overflow: hidden;
    background: #ffffff;
}
details.mce-accordion > summary {
    position: relative;
    padding: 14px 44px 14px 18px;
    background: #f7f9fd;
    font-weight: 700;
    color: #002d72;
    cursor: pointer;
    list-style: none;
}
details.mce-accordion > summary::-webkit-details-marker { display: none; }
details.mce-accordion > summary::after {
    content: "+";
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.3em;
    font-weight: 700;
}
details.mce-accordion[open] > summary::after { content: "\2212"; }
details.mce-accordion > *:not(summary) { padding: 12px 18px; margin: 0; }

/* -------------------------------------------------------------------------
   Onglets et carrousel (améliorés par ifps-content.js ; lisibles sans JavaScript)
   ------------------------------------------------------------------------- */
.ifps-tabs { margin: 1.5rem 0; }
.ifps-tab__title { font-weight: 700; color: #002d72; font-size: 1.1rem; margin: 0 0 .4rem; }
.ifps-tabs.is-enhanced .ifps-tab { display: none; padding: 16px 4px; }
.ifps-tabs.is-enhanced .ifps-tab.is-active { display: block; }
.ifps-tabs.is-enhanced .ifps-tab__title { display: none; }
.ifps-tabs__nav { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 2px solid #e6eaf2; }
.ifps-tabs__btn {
    border: 0;
    background: transparent;
    padding: 10px 16px;
    font: inherit;
    font-weight: 600;
    color: #5b6577;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
}
.ifps-tabs__btn:hover { color: #002d72; }
.ifps-tabs__btn.is-active { color: #002d72; font-weight: 700; border-bottom-color: #e4002b; }

.ifps-carousel-wrap { position: relative; margin: 1.5rem 0; }
.ifps-carousel {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    margin: 1.5rem 0;
    padding-bottom: 6px;
}
.ifps-carousel-wrap > .ifps-carousel { margin: 0; }
.ifps-slide {
    flex: 0 0 100%;
    box-sizing: border-box;
    scroll-snap-align: start;
    padding: 18px 22px;
    border: 1px solid #e6eaf2;
    border-radius: 12px;
    background: #f7f9fd;
}
.ifps-slide > :first-child { margin-top: 0; }
.ifps-slide > :last-child { margin-bottom: 0; }
.ifps-slide img { display: block; margin: 0 auto; }
.ifps-carousel__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid #ccd3e2;
    background: #ffffff;
    color: #002d72;
    font-size: 16px;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(10, 22, 40, .15);
    z-index: 1;
}
.ifps-carousel__btn--prev { left: -12px; }
.ifps-carousel__btn--next { right: -12px; }
.ifps-carousel__dots { display: flex; justify-content: center; gap: 6px; margin-top: 10px; }
.ifps-carousel__dot { width: 8px; height: 8px; border-radius: 4px; border: 0; padding: 0; background: #ccd3e2; cursor: pointer; transition: width .2s ease; }
.ifps-carousel__dot.is-active { width: 22px; background: #002d72; }

/* Sommaire inséré dans le texte (rempli par ifps-content.js) */
.ifps-toc-inline {
    border: 1px solid #e6eaf2;
    background: #f7f9fd;
    border-radius: 10px;
    padding: 16px 22px;
    margin: 1.5rem 0;
}
.ifps-toc-inline__title {
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: #e4002b;
    margin: 0 0 .5rem;
}
.ifps-toc-inline ol { margin: 0; padding-left: 1.3rem; }
.ifps-toc-inline a { text-decoration: none; font-weight: 600; }

/* -------------------------------------------------------------------------
   Petits écrans
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
    .ifps-grid--2,
    .ifps-grid--3,
    .ifps-grid--4,
    .ifps-cols--50-50,
    .ifps-cols--33-33-33,
    .ifps-cols--70-30,
    .ifps-cols--30-70,
    .ifps-cols--25-25-25-25 { grid-template-columns: minmax(0, 1fr); }

    .ifps-hero__body { padding: 24px 20px; }
    .ifps-hero__title { font-size: 1.5rem; }
    .ifps-carousel__btn--prev { left: -4px; }
    .ifps-carousel__btn--next { right: -4px; }
    :is(.ifps-article-body) table { font-size: .9rem; }
}
