/*
 Theme Name:   Élevage des Atouts
 Theme URI:    https://elevagedesatouts.com
 Description:  Thème enfant personnalisé pour le site Élevage des Atouts, basé sur OceanWP
 Author:       Élevage des Atouts
 Author URI:   https://elevagedesatouts.com
 Template:     oceanwp
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  elevage-des-atouts
*/

/* =============================================================
   FOND DE PAGE
   ============================================================= */

body.post-type-archive-gestion_effectif,
body.tax-categorie_effectif,
body.single-gestion_effectif {
    background-color: #f5f2ed;
}

/* =============================================================
   BANDEAU PHOTO PLEINE LARGEUR
   ============================================================= */

.effectif-bandeau {
    width: 100%;
    height: 500px;
    overflow: hidden;
    background: #e8e4dc;
}

.effectif-bandeau img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* =============================================================
   TITRE DE PAGE / CATÉGORIE (sous le bandeau)
   ============================================================= */

.effectif-page-title {
    text-align: center;
    padding: 40px 20px 10px;
}

.effectif-page-title h1 {
    font-size: 4rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #1a1a1a;
    margin: 0;
}

/* =============================================================
   NAVIGATION CATÉGORIES — border-radius: 5px
   ============================================================= */

.effectif-cat-nav {
    text-align: center;
    padding: 0 20px 30px;
}

.effectif-cat-nav a {
    display: inline-block;
    margin: 6px 6px;
    padding: 6px 16px;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    color: #555;
    border: 1px solid #ccc;
    border-radius: 5px;
    transition: all 0.2s;
}

.effectif-cat-nav a:hover,
.effectif-cat-nav a.current {
    background: #117c21;
    border-color: #117c21;
    color: #fff;
}

/* =============================================================
   GRILLE DE CARTES — hauteur uniforme via flexbox
   ============================================================= */

.effectif-archive {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 30px 80px;
}

.effectif-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    /* align-items: stretch est le défaut sur grid, les cartes s'étendent */
}

/* =============================================================
   CARTE CHEVAL — hauteur égale, corps flexible
   ============================================================= */

.cheval-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.25s, transform 0.25s;
    /* Flexbox vertical pour pousser le lien en bas */
    display: flex;
    flex-direction: column;
    height: 100%;
}

.cheval-card:hover {
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.13);
    transform: translateY(-3px);
}

/* --- Slider diaporama --- */
.card-slider {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 4 / 3;
    background: #e8e4dc;
    flex-shrink: 0;
}

.card-slider-track {
    width: 100%;
    height: 100%;
}

.card-slide {
    display: none;
    width: 100%;
    height: 100%;
}

.card-slide.active {
    display: block;
}

.card-slide a {
    display: block;
    width: 100%;
    height: 100%;
}

.card-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.cheval-card:hover .card-slide.active img {
    transform: scale(1.04);
}

/* Flèches */
.slider-prev,
.slider-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.3);
    border: none;
    cursor: pointer;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    padding: 0;
    transition: background 0.2s, color 0.2s;
    z-index: 2;
}

.slider-prev {
    left: 10px;
}

.slider-next {
    right: 10px;
}

.slider-prev:hover,
.slider-next:hover {
    background: #fff;
    color: #0f7b0f;
}

/* Points indicateurs */
.slider-dots {
    position: absolute;
    bottom: 8px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
    z-index: 2;
}

.slider-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    transition: background 0.2s;
}

.slider-dot.active {
    background: #fff;
}

/* --- Corps de la carte — prend tout l'espace disponible --- */
.cheval-card .card-body {
    padding: 22px 24px 0;
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* --- Nom h3 --- */
.cheval-card .card-nom {
    display: block;
    text-decoration: none;
}

.cheval-card .card-nom h3 {
    font-size: 22px;
    line-height: 1.4;
    font-weight: 400;
    text-transform: uppercase;
    margin-bottom: 12px;
    color: #0f7b0f;
}

.cheval-card .card-nom:hover h3 {
    color: #0a5a0a;
}

/* --- Paragraphes infos --- */
.cheval-card .card-origine,
.cheval-card .card-naissance,
.cheval-card .card-infos {
    color: #373737;
    font-size: 14px;
    line-height: 1.5em;
    margin: 0 0 6px;
}

/* --- Origine --- */
.cheval-card .card-origine {
    font-weight: 400;
    text-transform: uppercase;
    color: #000;
    font-size: 16px;
}

/* --- Infos complémentaires : italique + limité en CSS --- */
.cheval-card .card-infos {
    font-style: italic;
    font-weight: 200;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    /* Le nombre de lignes est défini via la variable PHP $infos_max_lignes
       qui génère l'attribut style="-webkit-line-clamp: N" directement sur l'élément */
}

/* --- Espaceur flexible : pousse le lien vers le bas --- */
.cheval-card .card-spacer {
    flex: 1;
}

/* --- Lien "Voir la fiche" — toujours en bas de carte --- */
.cheval-card .card-lien {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-weight: 400;
    text-transform: uppercase;
    font-size: 12px;
    margin-top: 14px;
    margin-bottom: 20px;
    color: #0f7b0f;
    text-decoration: none;
    transition: gap 0.2s, color 0.2s;
}

.cheval-card .card-lien::after {
    content: '→';
    font-size: 13px;
    transition: transform 0.2s;
}

.cheval-card .card-lien:hover {
    color: #0a5a0a;
}

.cheval-card .card-lien:hover::after {
    transform: translateX(4px);
}

/* =============================================================
   VIDE
   ============================================================= */

.effectif-vide {
    grid-column: 1 / -1;
    padding: 60px 20px;
    text-align: center;
    color: #999;
    font-style: italic;
}

/* =============================================================
   PAGINATION
   ============================================================= */

.effectif-pagination {
    margin-top: 50px;
    text-align: center;
}

.effectif-pagination .page-numbers {
    display: inline-block;
    padding: 8px 14px;
    margin: 0 3px;
    border: 1px solid #ccc;
    border-radius: 4px;
    color: #555;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
}

.effectif-pagination .page-numbers:hover,
.effectif-pagination .page-numbers.current {
    background: #0f7b0f;
    border-color: #0f7b0f;
    color: #fff;
}

/* =============================================================
   FICHE SINGLE CHEVAL
   ============================================================= */

/* Breadcrumb */
.fiche-breadcrumb {
    background: #ffffff;
    border-bottom: 1px solid #e8e0d0;
    padding: 10px 0;
}
.fiche-breadcrumb-nav {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 30px;
    font-size: 1.3rem;
    font-weight: 300;
    color: #999;
}
.fiche-breadcrumb-nav a {
    color: #107b0e;
    text-decoration: none;
}
.fiche-breadcrumb-nav a:hover {
    color: #0a5a0a;
}

/* Navigation prev/next */
.fiche-prevnext {
    background: #fff;
    border-bottom: 1px solid #e8e0d0;
}
.fiche-prevnext-bottom {
    border-bottom: none;
    border-top: 1px solid #e8e0d0;
    margin-top: 50px;
}
.fiche-prevnext-inner {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.fiche-prevnext-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 0;
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    color: #555;
    transition: color 0.2s;
}
.fiche-prevnext-link:hover {
    color: #0f7b0f;
}
.fiche-prevnext-next {
    margin-left: auto;
}

/* Contenu principal */
.effectif-single {
    max-width: 960px;
    margin: 0 auto;
    padding: 36px 30px 80px;
}

/* Titre h1 */
.fiche-titre {
    font-size: 3.2rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #107B0E;
    margin: 0 0 10px;
    letter-spacing: 0.04em;
}

/* Origines h2 */
.fiche-origine {
    font-size: 2rem;
    font-weight: 400;
    text-transform: uppercase;
    color: #000;
    margin: 0 0 14px;
    letter-spacing: 0.04em;
}

/* Identité */
.fiche-identite {
    font-size: 16px;
    font-weight: 300;
    color: #373737;
    line-height: 1.5em;
    margin: 0 0 30px;
}

/* =============================================================
   FICHE — bloc d'actions (statut + IFCE + LeTrot + PDF)
   ============================================================= */
.fiche-actions {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    margin: -16px 0 30px;
}

/* Pill "À vendre" / "Vendu" — style filtre actif allongé */
.fiche-statut-pill {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 14px;
    border-radius: 5px;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    line-height: 1;
}
.fiche-statut-vendre { background: #0f7b0f; }
.fiche-statut-vendu  { background: #a75e15; }

/* Pictos d'action sur fiche (réutilise classes ifce-badge / letrot-badge / pdf-badge) */
.fiche-actions .ifce-badge,
.fiche-actions .letrot-badge,
.fiche-actions .pdf-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    box-sizing: border-box;
    border: 1px solid #0f7b0f;
    border-radius: 5px;
    transition: transform .25s ease, box-shadow .25s ease;
    flex-shrink: 0;
}
.fiche-actions .ifce-badge { background: #fff; overflow: hidden; }
.fiche-actions .ifce-badge img {
    width: 100%; height: 100%;
    object-fit: contain;
    padding: 2px; box-sizing: border-box;
    display: block;
}
.fiche-actions .letrot-badge { background: #142847; overflow: hidden; }
.fiche-actions .letrot-badge img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
}
.fiche-actions .pdf-badge { background: #fff; color: #0f7b0f; }
.fiche-actions .pdf-badge svg { width: 18px; height: 18px; }

.fiche-actions .ifce-badge:hover,
.fiche-actions .letrot-badge:hover,
.fiche-actions .pdf-badge:hover {
    transform: scale(1.15);
    box-shadow: 0 2px 8px rgba(0,0,0,.15);
}

/* =============================================================
   CARROUSEL FICHE SINGLE — full width breakout, contrôles en haut
   ============================================================= */

.fiche-carousel-wrap {
    width: 100%;
    background: #e8e4dc;
    overflow: hidden;
}

.fiche-carousel {
    position: relative;
    overflow: hidden;
}

/* Contrôles en overlay, en bas du carousel */
.fiche-carousel-controls {
    position: absolute;
    bottom: 16px;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    z-index: 4;
    pointer-events: none;
}

.fiche-carousel-prev,
.fiche-carousel-next {
    pointer-events: all;
    background: rgba(255, 255, 255, 0.45);
    border: none;
    cursor: pointer;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #181818;
    padding: 0;
    flex-shrink: 0;
    transition: background 0.2s;
}
.fiche-carousel-prev:hover,
.fiche-carousel-next:hover {
    background: rgba(255, 255, 255, 0.75);
    color: #1a1a1a;
}

/* Points indicateurs */
.fiche-carousel-dots {
    pointer-events: all;
    display: flex;
    gap: 7px;
    align-items: center;
}
.fiche-carousel-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: background 0.2s;
}
.fiche-carousel-dot.active {
    background: #fff;
}

/* Track : hauteur 600px, zéro espace entre slides */
.fiche-carousel-track {
    display: flex;
    height: 600px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    cursor: grab;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Centrer les slides si 1 ou 2 médias sur desktop */
@media (min-width: 769px) {
    .fiche-carousel-track[data-nb-slides="1"],
    .fiche-carousel-track[data-nb-slides="2"] {
        justify-content: center;
    }
}

.fiche-carousel-track:active {
    cursor: grabbing;
}

.fiche-carousel-track::-webkit-scrollbar {
    display: none;
}

/* Slide : largeur auto selon le ratio naturel de l'image, max 85% pour garder l'aperçu */
.fiche-carousel-slide {
    flex: 0 0 auto;
    max-width: 85%;
    scroll-snap-align: start;
    height: 600px;
    background: #e8e4dc;
    overflow: hidden;
}

.fiche-carousel-slide img {
    display: block !important;
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: unset !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Vidéo YouTube — largeur calculée sur ratio 16/9 à hauteur 600px */
.fiche-carousel-video {
    width: calc(600px * 16 / 9);
    max-width: 85vw;
    height: 600px;
    flex-shrink: 0;
}
.fiche-carousel-video iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

/* =============================================================
   INFOS COMPLÉMENTAIRES
   ============================================================= */

.fiche-infos-comp {
    margin-bottom: 36px;
    color: #555;
    line-height: 1.7;
    font-style: italic;
}
.fiche-infos-comp p {
    font-size: 1.7rem;
    font-weight: 200;
    margin: 0;
}

/* =============================================================
   PLACEHOLDER PEDIGREE
   ============================================================= */

.fiche-pedigree-placeholder {
    margin-bottom: 36px;
    border: 1px dashed #c8c0b0;
    border-radius: 8px;
    background: #faf8f4;
    padding: 24px 28px;
}
.fiche-pedigree-placeholder-inner {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    color: #aaa;
}
.fiche-pedigree-placeholder-inner svg {
    flex-shrink: 0;
    margin-top: 2px;
    color: #c0b8a8;
}
.fiche-pedigree-placeholder-title {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #999;
    margin: 0 0 4px;
}
.fiche-pedigree-placeholder-text {
    font-size: 1.82rem;
    color: #bbb;
    margin: 0;
    font-style: italic;
}

/* =============================================================
   FICHE PDF
   ============================================================= */

.fiche-pdf {
    margin-bottom: 40px;
}
.fiche-pdf-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 12px;
}
.fiche-pdf-title {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #999;
    margin: 0;
}
.fiche-pdf-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    color: #0f7b0f;
    border: 1px solid #0f7b0f;
    border-radius: 4px;
    padding: 8px 16px;
    transition: all 0.2s;
}
.fiche-pdf-btn:hover {
    background: #0f7b0f;
    color: #fff;
}
.fiche-pdf-viewer {
    width: 100%;
    border: 1px solid #e5e0d5;
    border-radius: 8px;
    overflow: hidden;
    background: #f5f2ed;
}
.fiche-pdf-viewer iframe {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1.41;
    height: auto;
    border: none;
}

/* =============================================================
   RESPONSIVE
   ============================================================= */

@media (max-width: 900px) {
    .effectif-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .fiche-carousel-track,
    .fiche-carousel-slide,
    .fiche-carousel-video {
        height: 420px;
    }
    .fiche-carousel-video {
        width: calc(420px * 16 / 9);
    }
    .fiche-carousel-slide {
        max-width: 90%;
    }
}

@media (max-width: 600px) {
    .effectif-grid {
        grid-template-columns: 1fr;
    }
    .effectif-bandeau {
        height: 200px;
    }
    .effectif-page-title h1 {
        font-size: 1.5rem;
    }
    .effectif-archive,
    .effectif-single {
        padding-left: 16px;
        padding-right: 16px;
    }
    .fiche-breadcrumb-nav {
        padding: 0 16px;
        font-size: 1rem;
    }
    .fiche-prevnext-inner {
        padding: 0 16px;
    }
    .fiche-carousel-track,
    .fiche-carousel-slide,
    .fiche-carousel-video {
        height: 260px;
    }
    .fiche-carousel-video {
        width: calc(260px * 16 / 9);
    }
    .fiche-carousel-slide {
        max-width: 92%;
    }
    .fiche-titre {
        font-size: 1.6rem;
    }
}

/* =============================================================
   TABLEAU DE PEDIGREE — Layout flex
   Affiché sur single-gestion_effectif.php
   ============================================================= */

.eda-ped-wrap {
    overflow-x: auto;
    background: #fff;
    border: 1px solid #e0dbd3;
    border-radius: 6px;
    padding: 2rem 1.5rem;
    margin: 2rem 0;
}

.eda-ped {
    display: flex;
    align-items: stretch;
    min-width: fit-content;
}

.eda-ped-col   { display: flex; flex-direction: column; flex-shrink: 0; }
.eda-ped-gap   { width: 12px; flex-shrink: 0; }

/* Paire père+mère */
.eda-ped-pair {
    display: flex;
    flex-direction: column;
    flex: 1;
    position: relative;
    min-height: 0;
}

/* Barre verticale gauche — relie père et mère */
.eda-ped-pair::before {
    content: '';
    position: absolute;
    left: 0; top: 25%; bottom: 25%;
    width: 1px;
    background: #b0aba3;
    z-index: 1;
}

/* Cellule individuelle */
.eda-ped-cell {
    display: flex;
    align-items: center;
    flex: 1;
    padding: 3px 8px 3px 14px;
    position: relative;
    min-height: 18px;
}

/* Trait horizontal gauche (depuis barre vers nom) */
.eda-ped-cell::before {
    content: '';
    position: absolute;
    left: 0; top: 50%;
    width: 12px; height: 1px;
    background: #b0aba3;
    transform: translateY(-50%);
    z-index: 1;
}

/* Trait horizontal droit (vers la génération suivante) */
.eda-ped-cell.eda-ped-has-children::after {
    content: '';
    position: absolute;
    right: -12px; top: 50%;
    width: 12px; height: 1px;
    background: #b0aba3;
    transform: translateY(-50%);
    z-index: 1;
}

/* Noms */
.eda-ped-n {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #1a1a1a;
    white-space: nowrap;
    line-height: 1.3;
}
.eda-ped-n.eda-ped-empty  { color: #ccc; font-weight: 400; }
.eda-ped-n.eda-ped-subject { color: #0f7b0f; font-size: 13px; }
.eda-ped-y {
    font-size: 9px;
    font-weight: 400;
    color: #888;
    margin-left: 4px;
    text-transform: none;
    letter-spacing: 0;
}

/* Colonne sujet */
.eda-ped-col-subject { min-width: 165px; }
.eda-ped-col-subject .eda-ped-pair  { justify-content: center; }
.eda-ped-col-subject .eda-ped-pair::before { display: none; }
.eda-ped-col-subject .eda-ped-cell  { padding-left: 0; padding-right: 0; }
.eda-ped-col-subject .eda-ped-cell::before { display: none; }
.eda-ped-col-subject .eda-ped-cell::after {
    content: '';
    position: absolute;
    right: -12px; top: 50%;
    width: 12px; height: 1px;
    background: #b0aba3;
    transform: translateY(-50%);
    z-index: 1;
}

/* Colonnes générationnelles */
.eda-ped-col-1 { min-width: 148px; }
.eda-ped-col-2 { min-width: 152px; }
.eda-ped-col-3 { min-width: 152px; }
.eda-ped-col-4 { min-width: 148px; }
.eda-ped-col-5 { min-width: 145px; }

/* Dernière colonne : pas de trait sortant vers la droite */
.eda-ped-col-last .eda-ped-cell.eda-ped-has-children::after { display: none; }

/* Titre de section */
.eda-pedigree-section h3 {
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: #888;
    margin-bottom: .8rem;
}

/* Responsive mobile */
@media (max-width: 600px) {
    .eda-ped-col-subject { min-width: 110px; }
    .eda-ped-col-1,
    .eda-ped-col-2,
    .eda-ped-col-3,
    .eda-ped-col-4,
    .eda-ped-col-5 { min-width: 90px; }
    .eda-ped-n    { font-size: 8px; letter-spacing: .02em; }
    .eda-ped-y    { font-size: 7px; margin-left: 2px; }
    .eda-ped-n.eda-ped-subject { font-size: 9px; }
    .eda-ped-gap  { width: 8px; }
    .eda-ped-cell { padding-left: 10px; padding-right: 4px; min-height: 14px; }
    .eda-ped-cell::before,
    .eda-ped-cell.eda-ped-has-children::after,
    .eda-ped-col-subject .eda-ped-cell::after { width: 8px; }
    .eda-ped-cell.eda-ped-has-children::after { right: -8px; }
    .eda-ped-col-subject .eda-ped-cell::after  { right: -8px; }
}

/* Source SIRE en bas du pedigree */
.fiche-pedigree-source {
    margin-top: 1rem;
    margin-bottom: 100px;
    font-size: 11px;
    color: #999;
    text-align: right;
    font-family: Georgia, serif;
}
.fiche-pedigree-source code {
    background: #f5f2ed;
    padding: 1px 6px;
    border-radius: 3px;
    font-size: 10px;
    color: #777;
}


/* =============================================================
   BARRE FILTRES + SWITCH VUE (catégories)
   ============================================================= */

.effectif-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    max-width: 1400px;
    margin: 0 auto 1.5rem;
    padding: 0 20px;
}

.effectif-filtres-sexe,
.effectif-filtres-categorie {
    display: flex;
    gap: 16px;
}

/* Filtre unifié (pages statut) : sexe + catégorie sur une seule ligne avec séparateurs */
.effectif-filtres-unifies {
    display: flex;
    gap: 16px;
    align-items: baseline;
    flex-wrap: wrap;
}
.filtre-sep {
    color: #d4d0c8;
    font-size: 14px;
    user-select: none;
    line-height: normal;
    margin: 0 4px;
}
/* Variante : trait vertical fin au lieu du point médian (utilisée sur /succes/) */
.filtre-sep--vertical {
    display: inline-block;
    width: 0;
    height: 0.85em;
    border-left: 1px solid #d4d0c8;
    vertical-align: -1px;
    margin: 0 8px;
}

.filtre-sexe,
.filtre-categorie,
.filtre-pill {
    display: inline-block;
    line-height: normal;
    padding: 0;
    font-size: 0.8em;
    font-weight: 200;
    text-decoration: none;
    color: #888;
    background: transparent;
    border: none;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    letter-spacing: .02em;
    transition: color .2s ease, border-color .2s ease;
}
.filtre-sexe:hover,
.filtre-categorie:hover,
.filtre-pill:hover {
    color: #0f7b0f;
    background: transparent;
    border-color: transparent;
}
.filtre-sexe.active,
.filtre-categorie.active,
.filtre-pill.active {
    color: #0f7b0f;
    background: transparent;
    border-bottom-color: #0f7b0f;
    font-weight: 500;
    font-size: 0.8em;
}

.effectif-switch-vue {
    display: flex;
    border: 1px solid #d4d0c8;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}
.switch-vue {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .9rem;
    font-size: 1rem;
    text-decoration: none;
    color: #555;
    background: #fff;
    transition: all .15s;
    border-right: 1px solid #d4d0c8;
}
.switch-vue:last-child { border-right: none; }
.switch-vue:hover { background: #f5f2ed; color: #0f7b0f; }
.switch-vue.active { background: #0f7b0f; color: #fff; }

/* ─── Bloc tri vues Effectif (v1.3, 2026-05-21) ──────────────────
   Wrapper qui regroupe le bloc tri + le switch Cartes/Tableau à droite
   de la toolbar, sans casser le justify-content:space-between du parent.
   v1.3.1 : flex-shrink:0 pour rester sur la même ligne que les filtres
   gauche sur desktop, et nowrap interne pour ne pas casser le bloc en 2. */
.effectif-toolbar-right {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
    flex-wrap: nowrap;
}

.effectif-tri {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
/* v1.3.1 : taille en rem (et non em) pour ne pas hériter d'un parent
   OceanWP qui aurait un font-size custom. Aligné avec .eda-succes-filtres
   .filtre-label qui fait 0.8em sur un parent à font-size 1rem. */
.effectif-tri .filtre-label {
    font-style: italic;
    color: #aaa;
    font-size: 0.8rem;
    letter-spacing: .02em;
    line-height: 1;
}

/* Switch tri effectif (style identique au switch Cartes/Tableau)
   La taille typo est légèrement réduite (cf .85rem comme sur Succès)
   pour différencier visuellement le tri du switch de vue. */
.eda-effectif-tri-switch {
    display: flex;
    border: 1px solid #d4d0c8;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}
.eda-effectif-tri-switch .switch-vue {
    font-size: 0.85rem;
    padding: .35rem .8rem;
}

/* Responsive : sur écran étroit (≤ 600px), la toolbar passe en colonne
   (déjà géré par .effectif-toolbar flex-wrap), et le bloc droit s'aligne
   à gauche. On garde le tri + switch vue ensemble sur la même ligne. */
@media (max-width: 600px) {
    .effectif-toolbar-right {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}

/* =============================================================
   TABLEAU PUBLIC EFFECTIF (Yearlings/Foals)
   ============================================================= */

.effectif-table-wrap {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
    overflow-x: auto;
}

.effectif-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

.effectif-table thead {
    background: #f5f2ed;
}

.effectif-table th {
    text-align: left;
    padding: .9rem 1rem;
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #777;
    font-weight: 300;
    border-bottom: 2px solid #e8e4dc;
}

.effectif-table td {
    padding: .9rem 1rem;
    font-size: 1.1rem;
    border-bottom: 1px solid #f0ece5;
    vertical-align: middle;
}

.effectif-table tr:last-child td { border-bottom: none; }
.effectif-table tr:hover td { background: #faf8f4; }

.effectif-table .col-photo {
    width: 70px;
    padding: .5rem .8rem;
    text-align: center;
    vertical-align: middle;
}
.effectif-table .col-photo img,
.effectif-table .col-photo .photo-placeholder {
    width: 50px;
    height: 50px;
    border-radius: 4px;
    object-fit: cover;
    display: inline-block;
    vertical-align: middle;
}
.effectif-table .col-photo .photo-placeholder {
    background: #e8e4dc;
}

.effectif-table .col-nom a {
    color: #0f7b0f;
    text-decoration: none;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 1.2rem;
    letter-spacing: .03em;
}
.effectif-table .col-nom a:hover { text-decoration: underline; }

/* ─── Colonne Production (poulinières uniquement) — v1.0-alpha.1 ─── */
/* IMPORTANT : sélecteur `td.col-production` pour ne pas affecter le `<th>`
   qui doit garder la taille et le style des autres en-têtes du tableau.
   (v1.0-alpha.3 — fix taille en-tête PRODUCTION) */
.effectif-table td.col-production {
    min-width: 220px;
    vertical-align: middle;
    font-size: 1.15rem;
    line-height: 1.5;
}
.effectif-table .col-production .production-row {
    display: block;
    padding: 2px 0;
}
.effectif-table .col-production .production-row + .production-row {
    margin-top: 4px;
    padding-top: 6px;
    border-top: 1px dotted #e8e3d8;
}
.effectif-table .col-production .production-label {
    color: #999;
    font-size: 0.85em;
    font-weight: 300;
    letter-spacing: .02em;
    margin-right: 6px;
}
.effectif-table .col-production .production-value {
    color: #333;
}
.effectif-table .col-production .production-link {
    color: #0f7b0f;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color .2s ease;
}
.effectif-table .col-production .production-link:hover {
    border-bottom-color: #0f7b0f;
}
/* Distinguer subtilement les liens externes (IFCE) des internes (effectif) */
.effectif-table .col-production .production-link--external::after {
    content: " ↗";
    font-size: 0.8em;
    opacity: 0.5;
}
/* Foal sans retainedName (déclaré IFCE mais pas encore nommé)
   → affichage "(NOM ÉTALON)" en italique gris, pas de lien */
.effectif-table .col-production .production-no-name {
    color: #777;
    font-style: italic;
}

.effectif-table .col-action,
.effectif-table .col-actions {
    text-align: right;
}

/* ─── Cellule actions : flex aligné à droite ─── */
.effectif-table .actions-inline {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
}

/* ─── Pastilles d'action — TAILLE UNIFIÉE 28×28 ─── */
.effectif-table .ifce-badge,
.effectif-table .letrot-badge,
.effectif-table .pdf-badge,
.effectif-table .btn-fiche-icon,
.effectif-table .statut-pastille {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    box-sizing: border-box;
}

/* Hover : scale + ombre douce sur les éléments cliquables uniquement */
.effectif-table .ifce-badge,
.effectif-table .letrot-badge,
.effectif-table .pdf-badge,
.effectif-table .btn-fiche-icon {
    border: 1px solid #0f7b0f;
    transition: transform .25s ease, box-shadow .25s ease;
}
.effectif-table .ifce-badge:hover,
.effectif-table .letrot-badge:hover,
.effectif-table .pdf-badge:hover,
.effectif-table .btn-fiche-icon:hover {
    transform: scale(1.15);
    box-shadow: 0 2px 8px rgba(0,0,0,.15);
}

/* Œil fiche — cercle blanc bordure verte */
.effectif-table .btn-fiche-icon {
    color: #0f7b0f;
    border-radius: 50%;
    background: #fff;
}
.effectif-table .btn-fiche-icon:hover {
    background: #f0faf0;
}
.effectif-table .btn-fiche-icon svg {
    width: 18px;
    height: 18px;
}

/* IFCE Info chevaux — carré arrondi blanc */
.effectif-table .ifce-badge {
    border-radius: 5px;
    background: #fff;
    overflow: hidden;
}
.effectif-table .ifce-badge img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 2px;
    box-sizing: border-box;
    display: block;
}

/* LeTrot.com — carré arrondi, fond bleu marine d'origine */
.effectif-table .letrot-badge {
    border-radius: 5px;
    overflow: hidden;
    background: #142847;
}
.effectif-table .letrot-badge img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* PDF pedigree — carré arrondi blanc, icône verte */
.effectif-table .pdf-badge {
    border-radius: 5px;
    background: #fff;
    color: #0f7b0f;
}
.effectif-table .pdf-badge svg {
    width: 18px;
    height: 18px;
}

/* Pastilles statut commercial (À vendre / Vendu) — purement informatives */
.effectif-table .statut-pastille {
    border-radius: 50%;
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: .03em;
    line-height: 1;
}
.statut-pastille-vendre { background: #0f7b0f; }
.statut-pastille-vendu  { background: #a75e15; }

@media (max-width: 768px) {
    .effectif-table .col-pere,
    .effectif-table .col-mere,
    .effectif-table .col-pere-mere,
    .effectif-table .col-robe { display: none; }
}


/* =============================================================
   BADGE "À VENDRE" EN ÉCHARPE
   ============================================================= */

.card-slider {
    position: relative;
}

.card-badge-vendre {
    position: absolute;
    top: 18px;
    left: -28px;
    z-index: 10;
    background: #0f7b0f;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .1em;
    padding: 5px 36px;
    transform: rotate(-45deg);
    box-shadow: 0 2px 6px rgba(0,0,0,.18);
    pointer-events: none;
    white-space: nowrap;
}

/* Variante "Vendu" — couleur camel/cuir */
.card-badge-vendre.card-badge-vendu {
    background: #a75e15;
}

/* Père de mère : retour à la ligne forcé sur les cartes et fiches */
span.pere-de-mere {
    display: block;
    font-weight: 200;
    text-transform: uppercase;
    color: #636363;
    font-size: 16px;
}

/* =============================================================
   LOAD MORE
   ============================================================= */

.load-more-wrap {
    text-align: center;
    padding: 2rem 0 1rem;
}

.load-more-btn {
    display: inline-block;
    padding: .7rem 2.5rem;
    background: #fff;
    color: #0f7b0f;
    border: 1.5px solid #0f7b0f;
    border-radius: 30px;
    font-family: inherit;
    font-size: .85rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all .2s;
}
.load-more-btn:hover {
    background: #0f7b0f;
    color: #fff;
}
.load-more-btn:disabled {
    opacity: .4;
    cursor: default;
}
.load-more-loading {
    display: block;
    color: #999;
    font-size: .85rem;
    padding: .5rem;
}


/* =============================================================
   ARTICLE — ACTUALITÉS (single-post.php)
   ============================================================= */

.article-single-wrap {
    max-width: 820px;
    margin: 3rem auto 5rem;
    padding: 0 24px;
}

/* Photo encadrée */
.article-photo {
    margin-bottom: 2rem;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
}
.article-photo img {
    display: block;
    width: 100%;
    height: auto;
}

/* Titre */
.article-titre {
    font-size: 2.1rem;
    font-weight: 700;
    color: #107B0E;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.25;
    margin: 0 0 .8rem;
}

/* Date */
.article-date {
    font-size: 1.5rem;
    font-weight: 200;
    color: #999;
    text-transform: uppercase;
    letter-spacing: .1em;
    margin: 0 0 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e8e4dc;
}

/* Contenu éditeur */
.single-post.content-max-width .article-contenu {
    font-size: 1rem;
    line-height: 1.75;
    color: #373737;
}
.single-post.content-max-width .article-contenu p { 
    font-size: 1.5rem;
    line-height: 1.75;
    color: #373737;
    font-weight: 300;
    margin-bottom: 1.2em; }

.single-post.content-max-width .article-contenu h2 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #107B0E;
    margin: 2rem 0 .8rem;
}
.single-post.content-max-width .article-contenu h3 {
    font-size: 1rem;
    font-weight: 600;
    margin: 1.5rem 0 .6rem;
}
.single-post.content-max-width .article-contenu img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin: 1rem 0;
}
.single-post.content-max-width .article-contenu a {
    color: #107B0E;
    text-decoration: underline;
}

/* Navigation prev/next */
.article-nav {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 3rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e8e4dc;
}
.article-nav a {
    font-size: 1.3rem;
    text-transform: uppercase;
    letter-spacing: 0;
    color: #107B0E;
    text-decoration: none;
    max-width: 45%;
    line-height: 2;
}
.article-nav a:hover { text-decoration: underline; }
.article-nav-next { text-align: right; margin-left: auto; }

@media (max-width: 600px) {
    .article-titre { font-size: 1.4rem; }
    .article-nav { flex-direction: column; }
    .article-nav-next { text-align: left; margin-left: 0; }
}


/* =============================================================
   BOUTON "À VENDRE" DANS LA NAV CATÉGORIES
   ============================================================= */

.effectif-cat-nav a.avendre {
    color: #0f7b0f;
    border-color: #0f7b0f;
    font-weight: 600;
}
.effectif-cat-nav a.avendre:hover {
    background: #0f7b0f;
    color: #fff;
}
.effectif-cat-nav a.avendre.current {
    background: #0f7b0f;
    color: #fff;
    border-color: #0f7b0f;
}


/* =============================================================
   OCEANWP MAGAZINE GRID — Toute la carte cliquable
   Widget Ocean Extra (préfixe .oew-magazine-grid-*)
   ============================================================= */

/* Conteneur de la carte en position relative */
.oew-magazine-grid-post-item,
.oew-magazine-grid-post-item-inner {
    position: relative;
}

/* L'overlay de fond ne doit pas bloquer les clics */
.oew-magazine-grid-bg-overlay {
    pointer-events: none;
}

/* Le lien du titre s'étend à toute la carte via pseudo-élément */
.oew-magazine-grid-post-title a {
    position: static;
}
.oew-magazine-grid-post-title a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
}

/* Image et autres liens restent cliquables au-dessus du pseudo-élément */
.oew-magazine-grid-post-image-holder,
.oew-magazine-grid-post-info-category,
.oew-magazine-grid-post-info-date {
    position: relative;
    z-index: 6;
}

/* Curseur pointer sur toute la carte */
.oew-magazine-grid-post-item-inner {
    cursor: pointer;
}


/* =============================================================
   BREADCRUMB ARTICLE (single-post)
   ============================================================= */

.article-breadcrumb {
    margin: 0 0 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    text-align: left;
    color: #888;
}
.article-breadcrumb a,
.article-breadcrumb .breadcrumb_last {
    color: #107B0E;
    text-decoration: none;
}
.article-breadcrumb a:hover {
    text-decoration: underline;
}
.article-breadcrumb svg {
    color: #107B0E;
}

/* =============================================================
   ACTUALITÉS — CPT actualite (archive + single + cards)
   ============================================================= */

/* ---------- Archive : header de page ---------- */
.actualite-archive-header {
    text-align: center;
    margin: 0 auto 30px;
    max-width: 960px;
    padding: 0 30px;
}
.actualite-archive-title {
    font-size: 42px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 .4rem;
}
.actualite-archive-subtitle {
    font-size: 20px;
    font-weight: 200;
    text-transform: uppercase;
    color: #888;
    letter-spacing: 0;
    margin: 0;
}

/* ---------- Archive : grille de cards ---------- */
.actualite-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    max-width: 1280px;
    margin: 0 auto 60px;
    padding: 0 30px;
}
/* Variante shortcode (page d'accueil) : 3 colonnes par défaut */
.actualite-grid-shortcode {
    grid-template-columns: repeat(3, 1fr);
    margin: 0 auto;
    padding: 0 30px;
}
@media (max-width: 1100px) {
    .actualite-grid-shortcode {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 768px) {
    .actualite-grid,
    .actualite-grid-shortcode {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 0 16px;
    }
}

/* ---------- Overrides shortcode (page d'accueil uniquement) ---------- */
/* Cards plus compactes en accueil : titre/date plus petits, tag masqué */
.actualite-grid-shortcode .actualite-card-tag {
    display: none;
}
.actualite-grid-shortcode .actualite-card-titre-wrap {
    padding: 4px 8px;
}
.actualite-grid-shortcode .actualite-card-titre {
    font-size: 1.5rem;
    font-weight: 600;
}
.actualite-grid-shortcode .actualite-card-date {
    font-size: 1.2rem;
    font-weight: 300;
}

/* ---------- Card actualité ---------- */
.actualite-card {
    position: relative;
    display: block;
    border-radius: 6px;
    overflow: hidden;
    aspect-ratio: 3/2;
    background: #1a1a1a;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
    transition: transform .25s ease, box-shadow .25s ease;
}
.actualite-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0,0,0,.35);
}
.actualite-card-media {
    position: absolute;
    inset: 0;
    overflow: hidden;
}
.actualite-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}
.actualite-card:hover .actualite-card-media img {
    transform: scale(1.04);
}
.actualite-card-body {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    padding: 20px 80px 20px 35px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, .55) 100%);
    color: #fff;
}
/* Tag "Actualités" : juste au-dessus du titre, pas en haut de la card */
.actualite-card-tag {
    display: inline-block;
    width: fit-content;
    padding: 1px 12px;
    background: #0F7B0F;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    border-radius: 0;
    margin-bottom: 5px;
}
/* Bandeau blanc autour du titre uniquement (pas pleine largeur) */
.actualite-card-titre-wrap {
    background: #fff;
    margin: 0;
    padding: 14px 20px;
    width: fit-content;
    max-width: 100%;
    box-sizing: border-box;
}
.actualite-card-titre {
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.2;
    color: #1a1a1a;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .02em;
}
.actualite-card-date {
    font-size: 1.5rem;
    color: rgba(255, 255, 255, .95);
    font-weight: 400;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .6);
    padding-left: 4px;
}

/* ---------- v1.3.4 (2026-05-21) : la pagination WP a été remplacée par
   le système load-more / scroll infini. Les styles .actualite-pagination
   ont été supprimés (orphelins). Style des boutons load-more partagé
   avec Effectif/Succès. ---------- */
.actualite-vide {
    text-align: center;
    padding: 60px 20px;
    color: #888;
    font-style: italic;
}

/* ---------- Single actualité : grille 2 colonnes texte / actions ---------- */
.actualite-content-grid {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 40px;
    margin: 30px 0 40px;
}
@media (max-width: 900px) {
    .actualite-content-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}
.actualite-texte {
    font-size: 17px;
    line-height: 1.5;
    color: #585858;
    font-weight: 300;
}
.actualite-texte p { margin: 0 0 1em; }
.actualite-texte a { color: #0f7b0f; }
.actualite-texte a:hover { text-decoration: underline; }

/* ---------- Single actualité : bloc actions (sidebar droite) ---------- */
.actualite-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-self: start;
}
.actu-action {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: #fff;
    border: 1px solid #0f7b0f;
    border-radius: 5px;
    color: #0f7b0f;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.actu-action:hover {
    transform: translateX(2px);
    box-shadow: 0 2px 8px rgba(0,0,0,.1);
    background: #f0faf0;
}
.actu-action-icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 5px;
    color: #0f7b0f;
}
.actu-action-icon svg {
    width: 20px;
    height: 20px;
}
.actu-action-label {
    flex: 1;
    line-height: 1.3;
    font-size: 1.3rem;
    font-weight: 300;
}

/* Variantes vidéo : couleur de plateforme dans l'icône */
.actu-action-video-youtube .actu-action-icon { color: #c4302b; }
.actu-action-video-vimeo   .actu-action-icon { color: #1ab7ea; }
.actu-action-video-letrot  .actu-action-icon { color: #0f7b0f; }

@media (max-width: 900px) {
    .actu-action {
        font-size: 0.85rem;
    }
}

/* =============================================================
   MAP — Bloc Leaflet + OpenStreetMap
   ============================================================= */

.eda-map-block {
    width: 100%;
    margin: 40px 0;
    padding: 0;
}
/* Si la map est dans un container Elementor avec une largeur max, décommenter
   pour la forcer à occuper tout le viewport (full bleed) :
.eda-map-block {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}
*/
.eda-map-block .eda-map-info {
    max-width: 1280px;
    margin: 16px auto 0;
    padding: 0 30px;
}

/* Container map : ratio 16/7 desktop, plus carré mobile */
.eda-map {
    width: 100%;
    height: 480px;
    overflow: hidden;
    box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);
    z-index: 0; /* éviter qu'il passe au-dessus des éléments overlay */
}
@media (max-width: 768px) {
    .eda-map { height: 320px; }
    .eda-map-block .eda-map-info { padding: 0 16px; }
}

/* Bloc info sous la carte : adresse + boutons */
.eda-map-info {
    margin-top: 16px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.eda-map-address {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.eda-map-address strong {
    font-size: 1.3rem;
    font-weight: 600;
    color: #1a1a1a;
}
.eda-map-address span {
    font-size: 1.3rem;
    color: #666;
    font-weight: 300;
}

.eda-map-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.eda-map-actions-label {
    font-size: 1.3rem;
    color: #888;
    font-weight: 300;
    margin-right: 4px;
}
.eda-map-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #fff;
    border: 1px solid #0f7b0f;
    border-radius: 5px;
    color: #0f7b0f;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: 500;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.eda-map-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0,0,0,.1);
    background: #f0faf0;
    color: #0f7b0f;
}
.eda-map-btn svg { flex-shrink: 0; }

/* Override Leaflet pour cohérence visuelle */
.leaflet-control-layers {
    border: 1px solid #ddd !important;
    border-radius: 5px !important;
    background: rgba(255,255,255,.95) !important;
    font-size: 0.85rem !important;
}
.leaflet-control-layers-expanded {
    padding: 8px 12px !important;
}
.leaflet-container a.leaflet-popup-close-button { color: #0f7b0f; }

@media (max-width: 600px) {
    .eda-map-info { flex-direction: column; align-items: flex-start; }
    .eda-map-actions { width: 100%; justify-content: flex-start; }
    .eda-map-btn { font-size: 0.85rem; padding: 6px 10px; }
}

/* =============================================================
   CONTACT FORM — Styles A (underline) et B (box / floating labels)
   ============================================================= */

.eda-contact-form {
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    font-family: inherit;
}

.eda-contact-form .eda-form-row {
    margin-bottom: 28px;
    position: relative;
}

.eda-contact-form input,
.eda-contact-form textarea {
    width: 100%;
    font-family: inherit;
    font-size: 1rem;
    color: #1a1a1a;
    background: transparent;
    box-sizing: border-box;
    transition: border-color .25s ease, box-shadow .25s ease;
}

.eda-contact-form textarea {
    resize: vertical;
    min-height: 120px;
}

.eda-contact-form input:focus,
.eda-contact-form textarea:focus {
    outline: none;
}

/* Honeypot anti-spam : caché visuellement, accessible aux bots */
.eda-form-honeypot {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Bouton submit */
.eda-form-actions {
    text-align: right;
    margin-top: 8px;
}
.eda-form-submit {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    background: #0f7b0f;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 0.95rem;
    font-weight: 500;
    letter-spacing: .5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.eda-form-submit:hover:not(:disabled) {
    background: #0c660c;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 123, 15, 0.25);
}
.eda-form-submit:disabled {
    opacity: .6;
    cursor: wait;
}

/* Feedback message */
.eda-form-feedback {
    margin-top: 16px;
    padding: 12px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    display: none;
}
.eda-form-feedback.success {
    display: block;
    background: #e8f5e8;
    color: #0f7b0f;
    border-left: 3px solid #0f7b0f;
}
.eda-form-feedback.error {
    display: block;
    background: #fdecea;
    color: #b71c1c;
    border-left: 3px solid #b71c1c;
}

/* ===== STYLE A — UNDERLINE (minimaliste) ===== */
/* Avec ordre HTML : input → label, on inverse visuellement avec flex column-reverse */
.eda-form-underline .eda-form-row {
    display: flex;
    flex-direction: column-reverse;
}
.eda-form-underline label {
    display: block;
    font-size: 0.85rem;
    color: #888;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 6px;
    transition: color .25s ease;
}
.eda-form-underline input,
.eda-form-underline textarea {
    border: none;
    border-bottom: 1px solid #ccc;
    border-radius: 0;
    padding: 8px 0;
}
.eda-form-underline input:focus,
.eda-form-underline textarea:focus {
    border-bottom-color: #0f7b0f;
}
.eda-form-underline input:focus + label,
.eda-form-underline textarea:focus + label,
.eda-form-underline input:not(:placeholder-shown) + label,
.eda-form-underline textarea:not(:placeholder-shown) + label {
    color: #0f7b0f;
}

/* ===== STYLE B — BOX avec floating labels ===== */
.eda-form-box .eda-form-row {
    position: relative;
    padding-top: 6px;
}
.eda-form-box label {
    position: absolute;
    top: 18px;
    left: 14px;
    font-size: 1rem;
    color: #999;
    font-weight: 400;
    pointer-events: none;
    background: #fff;
    padding: 0 6px;
    transition: top .2s ease, font-size .2s ease, color .2s ease;
}
.eda-form-box input,
.eda-form-box textarea {
    border: 1px solid #d4d4d4;
    border-radius: 5px;
    padding: 14px 14px;
    background: #fff;
}
.eda-form-box input:focus,
.eda-form-box textarea:focus {
    border-color: #0f7b0f;
    box-shadow: 0 0 0 3px rgba(15, 123, 15, 0.1);
}
/* Le label monte quand le champ est focus ou rempli */
.eda-form-box input:focus + label,
.eda-form-box input:not(:placeholder-shown) + label,
.eda-form-box input:valid + label,
.eda-form-box textarea:focus + label,
.eda-form-box textarea:not(:placeholder-shown) + label,
.eda-form-box textarea:valid + label {
    top: -2px;
    font-size: 0.75rem;
    color: #0f7b0f;
    font-weight: 500;
}
/* Trick pour que le floating label fonctionne sans placeholder visible :
   on met un placeholder vide (espace) côté HTML, ou on utilise :not(:placeholder-shown).
   Solution : ajouter placeholder=" " sur les champs (à faire dans le PHP) */

/* =============================================================
   PAGE ARCHIVE SUCCÈS — /succes/
   Inspiration : Haras de Montaigu (grid 2 cols, photo gauche)
   Charte EDA : couleurs vert #0f7b0f
   ============================================================= */

.eda-succes-archive-header {
    text-align: center;
    margin: 0 auto 30px;
    max-width: 960px;
    padding: 0 30px;
}
.eda-succes-archive-title {
    font-size: 42px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #1a1a1a;
    margin: 0 0 .4rem;
    line-height: 1.1;
}
.eda-succes-archive-subtitle {
    font-size: 20px;
    font-weight: 200;
    text-transform: uppercase;
    color: #888;
    letter-spacing: 0;
    margin: 0;
    line-height: 1.5;
}

/* ─── Barre de filtres archive Succès ─────────────────────────── */
.eda-succes-toolbar {
    max-width: 1280px;
    margin: 30px auto 10px;
    padding: 0 30px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 30px;
    flex-wrap: wrap;
}
.eda-succes-filtres {
    display: flex;
    gap: 16px;
    align-items: baseline;
    flex-wrap: wrap;
}
/* Bloc filtres droite : tri (A→Z, Gains) */
.eda-succes-filtres--tri {
    justify-content: flex-end;
    align-items: center;
}
.eda-succes-filtres--tri .filtre-label {
    font-style: italic;
    color: #aaa;
    font-size: 0.8em;
    letter-spacing: .02em;
    margin-right: 4px;
}
/* Wrapper du switch tri (style identique à .effectif-switch-vue Cartes/Tableau) */
.eda-succes-tri-switch {
    display: flex;
    border: 1px solid #d4d0c8;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}
.eda-succes-tri-switch .switch-vue {
    font-size: 0.85rem;
    padding: .35rem .8rem;
}
/* Responsive : sur écran étroit, on empile le bloc tri sous les filtres gauche */
@media (max-width: 900px) {
    .eda-succes-toolbar {
        flex-direction: column;
        gap: 12px;
    }
    .eda-succes-filtres--tri {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
    /* Sur mobile : on défait l'aspect "switch" (bord/fond/radius) pour aligner
       visuellement les boutons tri avec les pills statut/sexe ci-dessus.
       Les pictos SVG sont conservés mais réduits. La typo passe à 0.8em
       comme .filtre-pill (statut/sexe) pour une cohérence parfaite. */
    .eda-succes-tri-switch {
        border: none;
        border-radius: 0;
        background: transparent;
        overflow: visible;
        gap: 16px;
        /* hérite display:flex du desktop */
    }
    .eda-succes-tri-switch .switch-vue {
        padding: 0;
        font-size: 0.8em;
        font-weight: 200;
        color: #888;
        background: transparent;
        border: none;
        border-right: none;
        border-bottom: 1px solid transparent;
        border-radius: 0;
        letter-spacing: .02em;
        transition: color .2s ease, border-color .2s ease;
        gap: .3rem;
    }
    .eda-succes-tri-switch .switch-vue:hover {
        background: transparent;
        color: #0f7b0f;
    }
    .eda-succes-tri-switch .switch-vue.active {
        background: transparent;
        color: #0f7b0f;
        border-bottom-color: #0f7b0f;
        font-weight: 500;
    }
    /* SVG réduit (14px) pour s'aligner sur la baseline du texte */
    .eda-succes-tri-switch .switch-vue svg {
        width: 14px;
        height: 14px;
        flex-shrink: 0;
    }
}

/* ─── Grille 2 colonnes desktop, 1 colonne mobile ─────────────── */
.eda-succes-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px 60px;
    max-width: 1280px;
    margin: 50px auto 40px;
    padding: 0 30px;
}
@media (max-width: 900px) {
    .eda-succes-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }
}

/* Trait bleu marine entre cards (style Montaigu) */
.eda-succes-card {
    display: grid;
    grid-template-columns: 38% 1fr;
    gap: 24px;
    padding-bottom: 30px;
    border-bottom: 1px solid #0f7b0f;
}
@media (max-width: 600px) {
    .eda-succes-card {
        grid-template-columns: 1fr;
        gap: 18px;
    }
}

/* ─── Colonne gauche : photo + actions ─────────────────────────── */
.eda-succes-card__media {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.eda-succes-card__photo {
    display: block;
    aspect-ratio: 3 / 2;
    overflow: hidden;
    border-radius: 4px;
    background: #f5f5f5;
    cursor: zoom-in;
}
.eda-succes-card__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}
.eda-succes-card__photo:hover img {
    transform: scale(1.04);
}
.eda-succes-card__photo--empty {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    color: #ccc;
}

/* Pictos action sous la photo (IFCE / LeTrot / PDF / YouTube) */
.eda-succes-card__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.eda-succes-card__action {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    color: #555;
    text-decoration: none;
    transition: all .2s ease;
}
.eda-succes-card__action:hover {
    background: #f0faf0;
    border-color: #0f7b0f;
    color: #0f7b0f;
    transform: translateY(-1px);
}
.eda-succes-card__action img {
    width: 18px;
    height: 18px;
    object-fit: contain;
}
.eda-succes-card__action svg {
    width: 18px;
    height: 18px;
}

/* ─── Colonne droite : infos cheval ─────────────────────────────── */
.eda-succes-card__body {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.eda-succes-card__header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    margin-bottom: 0px;
}
.eda-succes-card__name {
    font-size: 2.2rem;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0;
    color: #0f7b0f;
    margin: 0;
    line-height: 1;
}
/* Indicateur sexe (m)/(f)/(h) en italique, plus petit que le nom, gris discret */
.eda-succes-card__sexe {
    font-style: italic;
    font-weight: 300;
    font-size: 0.7em;
    text-transform: lowercase;
    color: #888;
    margin-left: 0.4em;
    letter-spacing: 0;
}
/* Statut inline (chrono - Gr.X - libre) à droite du nom, sans pill */
.eda-succes-card__statut {
    font-size: 1.45rem;
    font-weight: 300;
    color: #555;
    letter-spacing: 0;
    line-height: 1;
}

.eda-succes-card__origines {
    font-size: 1.1rem;
    font-style: italic;
    color: #666;
    margin: 0;
    font-weight: 400;
    line-height: 1.45;
}

/* ─── Liste des performances ────────────────────────────────────── */
.eda-succes-card__perfs {
    list-style: none;
    padding: 0;
    margin: 0;
}
.eda-succes-card__perf {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 5px 0;
    border-bottom: 1px solid #d4e7d4;
    font-size: 1.2rem;
    color: #333;
    font-weight: 400;
    line-height: 1.4;
}
.eda-succes-card__perf:last-child {
    border-bottom: none;
}
.eda-succes-card__perf-text {
    flex: 1;
    position: relative;
    padding-left: 18px;
}
/* Carré vert devant chaque perf, type Montaigu */
.eda-succes-card__perf-text::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 5px;
    background: #0f7b0f;
}

.eda-succes-card__perf-video {
    color: #b8860b;
    line-height: 0;
    text-decoration: none;
    transition: color .2s ease, transform .2s ease;
    flex-shrink: 0;
}
.eda-succes-card__perf-video:hover {
    color: #0f7b0f;
    transform: scale(1.15);
}
/* Picto vidéo plus grand (taille fixe au-dessus des 18px par défaut du SVG) */
.eda-succes-card__perf-video svg {
    width: 24px;
    height: 24px;
}

/* ─── Apparition en cascade des pictos vidéo au chargement ────── */
@keyframes eda-perf-video-in {
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
.eda-succes-card__perf .eda-succes-card__perf-video {
    opacity: 0;
    transform: translateX(8px);
    animation: eda-perf-video-in .5s ease forwards;
}
.eda-succes-card__perf:nth-child(1) .eda-succes-card__perf-video { animation-delay: .15s; }
.eda-succes-card__perf:nth-child(2) .eda-succes-card__perf-video { animation-delay: .30s; }
.eda-succes-card__perf:nth-child(3) .eda-succes-card__perf-video { animation-delay: .45s; }
.eda-succes-card__perf:nth-child(4) .eda-succes-card__perf-video { animation-delay: .60s; }
.eda-succes-card__perf:nth-child(5) .eda-succes-card__perf-video { animation-delay: .75s; }
.eda-succes-card__perf:nth-child(6) .eda-succes-card__perf-video { animation-delay: .90s; }
.eda-succes-card__perf:nth-child(7) .eda-succes-card__perf-video { animation-delay: 1.05s; }
.eda-succes-card__perf:nth-child(8) .eda-succes-card__perf-video { animation-delay: 1.20s; }
@media (prefers-reduced-motion: reduce) {
    .eda-succes-card__perf .eda-succes-card__perf-video {
        opacity: 1;
        transform: none;
        animation: none;
    }
}

/* ─── Texte libre (italique, bas de card) ──────────────────────── */
.eda-succes-card__texte {
    font-size: 1.3rem;
    font-weight: 300;
    font-style: italic;
    color: #777;
    line-height: 1.55;
    margin: 10px 0 0;
    padding: 10px 0 0;
    border-top: 1px dashed #e0e0e0;
}

/* ─── État vide ────────────────────────────────────────────────── */
.eda-succes-empty {
    text-align: center;
    color: #888;
    font-style: italic;
    font-size: 1.1rem;
    padding: 60px 20px;
}

/* ═══════════════════════════════════════════════════════════════════
   LIGHTBOX — agrandissement photo Succès au clic
   ═══════════════════════════════════════════════════════════════════ */

.eda-lightbox {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .92);
    z-index: 99999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s ease;
    cursor: zoom-out;
}
.eda-lightbox.is-open {
    opacity: 1;
    pointer-events: auto;
}

.eda-lightbox__img {
    max-width: min(1200px, 92vw);
    max-height: 80vh;
    object-fit: contain;
    box-shadow: 0 10px 50px rgba(0, 0, 0, .5);
    transform: scale(.96);
    transition: transform .25s ease;
}
.eda-lightbox.is-open .eda-lightbox__img {
    transform: scale(1);
}

.eda-lightbox__caption {
    color: #fff;
    font-size: 1.15rem;
    font-weight: 300;
    text-align: center;
    margin-top: 18px;
    max-width: 92vw;
    line-height: 1.45;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}
.eda-lightbox__caption:empty {
    display: none;
}

.eda-lightbox__close {
    position: absolute;
    top: 18px;
    right: 22px;
    background: transparent;
    border: 0;
    color: #fff;
    font-size: 36px;
    line-height: 1;
    padding: 6px 12px;
    cursor: pointer;
    opacity: .75;
    transition: opacity .2s ease;
}
.eda-lightbox__close:hover {
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
    .eda-lightbox,
    .eda-lightbox__img {
        transition: none;
    }
}

/* =============================================================
   v1.3.5 (2026-05-21) — Uniformisation pages WP
   ============================================================= */

/* Masquer le fil d'Ariane OceanWP sur les pages WP en fallback CSS
   (en plus des filtres PHP ocean_display_breadcrumb / breadcrumbs).
   Certaines versions OceanWP ignorent le filtre PHP ou affichent le
   breadcrumb via le moteur Yoast ou un widget Elementor → ceinture-bretelles. */
.page .site-breadcrumbs,
.page .oceanwp-breadcrumb,
.page #breadcrumb-trail,
.page .breadcrumb-trail {
    display: none !important;
}

/* Alléger le corps de texte Gutenberg sur les pages WP.
   Approche chirurgicale : on touche aux paragraphes/listes/citations,
   PAS aux titres (qui restent en gras) ni aux <strong>/<b> (qui doivent
   rester en gras pour leur sémantique).

   font-weight: 300 = light. Si la police chargée par OceanWP n'a pas
   le poids 300 disponible, le navigateur tombera sur le plus proche
   (probablement 400). Pas de fallback à prévoir. */
.entry-content,
.entry-content p,
.entry-content li,
.entry-content blockquote,
.entry-content dd,
.entry-content dt {
    font-weight: 300;
}
/* Préserver les emphases sémantiques */
.entry-content strong,
.entry-content b,
.entry-content th {
    font-weight: 600;
}
/* Les titres gardent leur poids hérité du thème */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    font-weight: 600;
}