/*
 Theme Name:   IFP Hello Child
 Theme URI:    https://ifpfrance.org/
 Description:  Thème enfant Hello Elementor pour la refonte IFP France
 Author:       Atelier2S
 Author URI:   https://atelier2s.fr/
 Template:     hello-elementor
 Version:      1.0.0
 Text Domain:  ifp-hello-child
*/

/* =========================================================
   IFP - Styles globaux techniques
   ========================================================= */

/* Contact Form 7 */
.wpcf7 {
    font-family: Raleway, Arial, sans-serif;
}

.wpcf7-submit {
    cursor: pointer;
}

/* Slider latéral Je postule - WP Contact Slider */
#wpcs_tab_72219 {
    width: 170px !important;
    height: 40px !important;
    padding: 10px !important;
    top: 240px !important;
    position: fixed !important;
    right: -65px !important;
    text-align: center;
    font-family: Playfair Display, Georgia, serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: .2em;
    z-index: 9999999;
}

#wpcs_content_main_72219 {
    position: fixed;
    overflow-y: scroll;
    width: 500px;
    max-width: 100%;
    height: 100%;
    background: #558599;
    color: #000;
    top: 0;
    right: -500px;
    padding: 0;
    margin: 0;
    z-index: 9999999;
}

#wpcs_content_inner_72219 {
    max-width: 100%;
    min-height: 100%;
    background: #558599;
    padding: 20px;
    margin: 60px 40px;
    color: #fff;
    border: 1px solid #558599;
}

#wpcs_content_inner_72219 label {
    color: #fff;
}

#wpcs_overlay_72219 {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999;
    background: rgba(49, 49, 49, 0.65);
}

#wpcs_content_main_72219::-webkit-scrollbar {
    display: none;
}

#wpcs_close_slider_72219 {
    top: 0;
    left: 0;
    position: absolute;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: #0000007a;
    padding: 0;
    overflow: hidden;
}

div#wpcs_tab_132 {
	font-size: 18px;
    font-weight: 800;
    letter-spacing: .1em;
    height: 50px !important;
    padding: 8px 0px 8px 0px !important;
    top: 300px !important;
}

@media (max-width: 700px) {
    #wpcs_tab_72219,
    #wpcs_content_main_72219 {
        display: none !important;
    }
}

/* =========================================================
   IFP — WP Contact Slider 132
   Formulaire intérieur comme ancien site
   ========================================================= */

@media (min-width: 701px) {

    /* Conteneur du formulaire */
    #wpcs_content_inner_132 {
        background: #ed352d !important;
        border-color: #ed352d !important;
        color: #ffffff !important;
        font-family: Raleway, Arial, sans-serif !important;
        padding: 20px !important;
        margin: 60px 40px !important;
    }

    #wpcs_content_inner_132 .wpcf7,
    #wpcs_content_inner_132 .wpcf7-form {
        color: #ffffff !important;
        font-family: Raleway, Arial, sans-serif !important;
    }

    #wpcs_content_inner_132 .wpcf7-form p {
        margin: 0 0 16px !important;
    }

    /* Civilité */
    #wpcs_content_inner_132 .bout-radio-edep {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 18px !important;
        flex-wrap: wrap !important;
        margin-bottom: 18px !important;
        color: #ffffff !important;
    }

    #wpcs_content_inner_132 .wpcf7-list-item {
        margin: 0 !important;
    }

    #wpcs_content_inner_132 .wpcf7-list-item-label {
        color: #ffffff !important;
        font-size: 15px !important;
        font-weight: 500 !important;
    }

    /* Lignes Nom/Prénom et Email/Téléphone */
    #wpcs_content_inner_132 .wpcf7-inline-wrapper {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important;
        margin: 0 0 16px !important;
    }

    #wpcs_content_inner_132 .wpcf7-inline-field {
        margin: 0 !important;
        min-width: 0 !important;
    }

    /* Labels blancs */
    #wpcs_content_inner_132 label,
    #wpcs_content_inner_132 .wpfc7-label,
    #wpcs_content_inner_132 .wpcf7-quiz-label {
        color: #ffffff !important;
        font-family: Raleway, Arial, sans-serif !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;
    }

    #wpcs_content_inner_132 .wpfc7-label {
        display: block !important;
        margin-bottom: 8px !important;
    }

    /* Champs */
    #wpcs_content_inner_132 input.wpcf7-text,
    #wpcs_content_inner_132 input.wpcf7-email,
    #wpcs_content_inner_132 input.wpcf7-date,
    #wpcs_content_inner_132 input.wpcf7-quiz,
    #wpcs_content_inner_132 select.wpcf7-select,
    #wpcs_content_inner_132 textarea.wpcf7-textarea {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;

        background: #ffffff !important;
        color: #999999 !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;

        font-family: Raleway, Arial, sans-serif !important;
        font-size: 15px !important;
        font-weight: 400 !important;
        line-height: 1.25 !important;

        margin: 0 !important;
        padding: 11px 14px !important;
        min-height: 39px !important;
    }

    #wpcs_content_inner_132 textarea.wpcf7-textarea {
        min-height: 150px !important;
        resize: vertical !important;
    }

    /* Placeholder */
    #wpcs_content_inner_132 input::placeholder,
    #wpcs_content_inner_132 textarea::placeholder {
        color: #999999 !important;
        opacity: 1 !important;
        font-family: Raleway, Arial, sans-serif !important;
        font-weight: 400 !important;
    }

    #wpcs_content_inner_132 select.wpcf7-select {
        color: #999999 !important;
    }

    /* Question anti-spam */
    #wpcs_content_inner_132 .wpcf7-form-control-wrap[data-name="antispam-math"] > label {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 8px !important;
    }

    #wpcs_content_inner_132 input.wpcf7-quiz {
        max-width: 320px !important;
    }

    /* Messages CF7 */
    #wpcs_content_inner_132 .wpcf7-not-valid-tip {
        color: #ffffff !important;
        font-size: 13px !important;
        margin-top: 5px !important;
    }

    #wpcs_content_inner_132 .wpcf7-response-output {
        color: #ffffff !important;
        border-color: #ffffff !important;
        margin: 18px 0 0 !important;
        padding: 12px !important;
        font-size: 14px !important;
    }
}

html {
    background: #ffffff;
}

/* =========================================================
   CADRE BLANC GLOBAL IFP
   ========================================================= */

html {
    background: #ffffff !important;
}

@media (max-width: 445px) {
    body {
        padding: 0 !important;
    }
}

@media (min-width: 446px) {
    body {
        margin: 0 !important;
        padding: 1rem !important;
        min-height: 100vh;
        box-sizing: border-box !important;
        background: #ffffff !important;
        overflow-x: hidden !important;
    }

    .site-main,
    .elementor-location-header,
    .elementor-location-footer {
        max-width: 100%;
    }
}

/* =========================================================
   SÉPARATEURS ROUGES IFP
   À appliquer sur le widget Elementor « Séparateur »
   ========================================================= */

.ifp-divider .elementor-divider-separator {
    display: block;
    border-top-style: solid !important;
    border-top-color: #ed352d !important;
}

/* Petit séparateur sous titres courants */
.ifp-divider--small .elementor-divider-separator {
    width: 90px !important;
    border-top-width: 13px !important;
}

/* Grand séparateur standard */
.ifp-divider--large .elementor-divider-separator {
    width: 100px !important;
    border-top-width: 20px !important;
}

/* Grand séparateur du hero ou de certains bandeaux */
.ifp-divider--wide .elementor-divider-separator {
    width: 150px !important;
    border-top-width: 20px !important;
}

/* Centrage */
.ifp-divider--center .elementor-divider {
    text-align: center !important;
}

/* Mobile */
@media (max-width: 767px) {
    .ifp-divider--wide .elementor-divider-separator {
        width: 110px !important;
        border-top-width: 15px !important;
    }

    .ifp-divider--large .elementor-divider-separator {
        width: 90px !important;
        border-top-width: 15px !important;
    }
}
/* =========================================================
   BARRE ROUGE À GAUCHE DES PHOTOS / BANDEAUX
   ========================================================= */

.ifp-photo-accent-left {
    box-sizing: border-box;
    overflow: hidden;
    border-left: 40px solid #ed352d;
    line-height: 0;
}

.ifp-photo-accent-left img,
.ifp-photo-accent-left .elementor-widget-image a {
    display: block;
    width: 100%;
}

/* Tablette */
@media (max-width: 1024px) {
    .ifp-photo-accent-left {
        border-left-width: 30px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .ifp-photo-accent-left {
        border-left-width: 18px;
    }
}

/* =========================================================
   BARRE BLEUE À GAUCHE DES PHOTOS / BANDEAUX
   ========================================================= */

.ifp-photo-bleue-left {
    box-sizing: border-box;
    overflow: hidden;
    border-left: 40px solid #163f74;
    line-height: 0;
}

.ifp-photo-bleue-left img,
.ifp-photo-bleue-left .elementor-widget-image a {
    display: block;
    width: 100%;
}

/* Tablette */
@media (max-width: 1024px) {
    .ifp-photo-bleue-left {
        border-left-width: 30px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .ifp-photo-bleue-left {
        border-left-width: 18px;
    }
}

@media (min-width: 1024px) {
.postuler-mobile {
    display: none !important;
	}}


li.ifp-menu-don.postuler-mobile.menu-item.menu-item-type-post_type.menu-item-object-page.menu-item-9066 {
    background-color: #ed352d;
    color: #ffffff !important;
    border-radius: 999px;
    max-width: 230px;
	margin: 14px 16px;}

li.ifp-menu-don a.elementor-item {
    color: #ffffff !important;
}

/* =========================================================
   IFP — FORMULAIRE CF7 "JE POSTULE"
   Ciblé uniquement sur la section .ifp-postuler
   ========================================================= */

/* Empêche l’ancre d’être cachée sous le header sticky */
#postuler {
    scroll-margin-top: 110px;
}

/* Largeur générale du formulaire */
.ifp-postuler .wpcf7 {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}

.ifp-postuler .wpcf7-form {
    font-family: Raleway, Arial, sans-serif;
}

/* Espacement vertical général */
.ifp-postuler .wpcf7-form > p {
    margin: 0 0 14px !important;
}

/* Les deux lignes Nom / Prénom puis Email / Téléphone */
.ifp-postuler .wpcf7-inline-wrapper {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px !important;
    margin: 0 0 14px !important;
}

.ifp-postuler .wpcf7-inline-field {
    margin: 0 !important;
    min-width: 0;
}

.ifp-postuler .wpcf7-form-control-wrap {
    display: block;
}

/* Champs standards */
.ifp-postuler .wpcf7 input.wpcf7-text,
.ifp-postuler .wpcf7 input.wpcf7-email,
.ifp-postuler .wpcf7 input.wpcf7-date,
.ifp-postuler .wpcf7 select.wpcf7-select,
.ifp-postuler .wpcf7 textarea.wpcf7-textarea,
.ifp-postuler .wpcf7 input.wpcf7-quiz {
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 8px 14px !important;

    color: #2d2d2d !important;
    background: #f7f7f7 !important;
    border: 1px solid #d9d9d9 !important;
    border-radius: 2px !important;
    box-shadow: none !important;

    font-family: Raleway, Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
}

/* Hauteur des champs courts */
.ifp-postuler .wpcf7 input.wpcf7-text,
.ifp-postuler .wpcf7 input.wpcf7-email,
.ifp-postuler .wpcf7 input.wpcf7-date,
.ifp-postuler .wpcf7 select.wpcf7-select {
    height: 37px !important;
    min-height: 37px !important;
}

/* Textareas */
.ifp-postuler .wpcf7 textarea.wpcf7-textarea {
    min-height: 155px !important;
    resize: vertical;
}

.ifp-postuler .wpcf7 textarea[name="textarea-631"] {
    min-height: 165px !important;
}

/* Couleur des placeholders */
.ifp-postuler .wpcf7 input::placeholder,
.ifp-postuler .wpcf7 textarea::placeholder {
    color: #666666 !important;
    opacity: 1 !important;
}

/* Focus propre et visible */
.ifp-postuler .wpcf7 input:focus,
.ifp-postuler .wpcf7 textarea:focus,
.ifp-postuler .wpcf7 select:focus {
    border-color: #ed352d !important;
    outline: 2px solid rgba(237, 53, 45, 0.28) !important;
    outline-offset: 1px !important;
}

/* Civilité */
.ifp-postuler .bout-radio-edep {
    display: flex !important;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
}

.ifp-postuler .bout-radio-edep .wpcf7-list-item {
    display: inline-flex !important;
    align-items: center;
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 13px !important;
    line-height: 1 !important;
}

.ifp-postuler .bout-radio-edep input[type="radio"] {
    appearance: none !important;
    width: 13px !important;
    min-width: 13px !important;
    height: 13px !important;
    min-height: 13px !important;
    margin: 0 7px 0 0 !important;
    padding: 0 !important;

    border: 2px solid #ffffff !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
}

.ifp-postuler .bout-radio-edep input[type="radio"]:checked {
    background: #ffffff !important;
    box-shadow: inset 0 0 0 3px #1d477d !important;
}

.ifp-postuler .bout-radio-edep .wpcf7-list-item-label {
    color: #ffffff !important;
}

/* Le libellé de date n'était pas visible sur l'ancien rendu */
.ifp-postuler .label-contact-blanc {
    display: none !important;
}

/* Question anti-spam */
.ifp-postuler .wpfc7-label {
    display: block;
    margin: 18px 0 6px !important;
    color: #ffffff !important;
    text-align: center;
    font-family: Raleway, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

.ifp-postuler .wpcf7-form-control-wrap[data-name="antispam-math"] > label {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: #ffffff !important;
}

.ifp-postuler .wpcf7-quiz-label {
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

.ifp-postuler .wpcf7 input.wpcf7-quiz {
    width: 225px !important;
    max-width: 100%;
    height: 37px !important;
    min-height: 37px !important;
    text-align: center;
}

/* Bouton Envoyer : équivalent du cartouche blanc ancien */
.ifp-postuler .wpcf7-submit {
    display: block !important;
    width: 225px !important;
    max-width: 100% !important;
    min-height: 38px !important;
    margin: 0 auto !important;
    padding: 10px 18px !important;

    color: #163f74 !important;
    background: #ffffff !important;
    border: 1px solid #ffffff !important;
    border-radius: 1px !important;

    font-family: Raleway, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    cursor: pointer;
}

.ifp-postuler .wpcf7-submit:hover,
.ifp-postuler .wpcf7-submit:focus {
    color: #ffffff !important;
    background: #ed352d !important;
    border-color: #ed352d !important;
}

/* Messages CF7 */
.ifp-postuler .wpcf7-not-valid-tip {
    margin-top: 5px;
    color: #ffffff !important;
    font-size: 12px !important;
}

.ifp-postuler .wpcf7-response-output {
    margin: 18px 0 0 !important;
    padding: 12px !important;
    color: #ffffff !important;
    border-color: #ffffff !important;
    text-align: center;
}

/* Mobile */
@media (max-width: 767px) {
    #postuler {
        scroll-margin-top: 88px;
    }

    .ifp-postuler .wpcf7-inline-wrapper {
        grid-template-columns: 1fr;
        gap: 12px !important;
    }

    .ifp-postuler .wpcf7 input.wpcf7-text,
    .ifp-postuler .wpcf7 input.wpcf7-email,
    .ifp-postuler .wpcf7 input.wpcf7-date,
    .ifp-postuler .wpcf7 select.wpcf7-select {
        height: 44px !important;
        min-height: 44px !important;
    }

    .ifp-postuler .bout-radio-edep {
        gap: 12px;
    }

    .ifp-postuler .wpcf7-submit {
        width: 100% !important;
        max-width: 270px !important;
    }
}

/* =========================================================
   IFP — JetBlog Video Playlist responsive
   Corrige tablette / mobile sans casser desktop
   ========================================================= */

.ifp-video-playlist,
.ifp-video-playlist * {
    box-sizing: border-box;
}

.ifp-video-playlist {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

/* Empêche le widget de créer une largeur fantôme */
.ifp-video-playlist .elementor-widget-container,
.ifp-video-playlist .elementor-jet-blog-video-playlist,
.ifp-video-playlist .jet-blog,
.ifp-video-playlist .jet-blog-playlist {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

/* Vidéo principale : ratio propre */
.ifp-video-playlist .jet-blog-playlist__canvas {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 16 / 9;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #000;
}

/* L'iframe YouTube ne doit pas garder height=600 en responsive */
.ifp-video-playlist .jet-blog-playlist__canvas iframe {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
}

/* Zone des miniatures */
.ifp-video-playlist .jet-blog-playlist__items,
.ifp-video-playlist .jet-blog-playlist__items-list {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

/* Desktop : on garde le fonctionnement horizontal classique */
.ifp-video-playlist .jet-blog-playlist__items-list-content {
    max-width: 100%;
}

/* Tablette + mobile : miniatures en bande scrollable */
@media (max-width: 1024px) {
    .ifp-video-playlist .jet-blog-playlist {
        display: block !important;
    }

    .ifp-video-playlist .jet-blog-playlist__canvas {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
    }

    .ifp-video-playlist .jet-blog-playlist__items {
        margin-top: 10px !important;
    }

    .ifp-video-playlist .jet-blog-playlist__items-list {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 8px;
    }

    .ifp-video-playlist .jet-blog-playlist__items-list-content {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        width: max-content !important;
        min-width: 100% !important;
        max-width: none !important;
    }

    .ifp-video-playlist .jet-blog-playlist__item {
        position: relative;
        flex: 0 0 150px !important;
        width: 150px !important;
        max-width: 150px !important;
        min-width: 150px !important;
        margin: 0 !important;
    }

    .ifp-video-playlist .jet-blog-playlist__item-thumb {
        width: 100% !important;
        aspect-ratio: 16 / 9;
        height: auto !important;
        overflow: hidden !important;
    }

    .ifp-video-playlist .jet-blog-playlist__item-thumb img,
    .ifp-video-playlist .jet-blog-playlist__item-thumb-img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* On évite que les titres des miniatures élargissent la page */
    .ifp-video-playlist .jet-blog-playlist__item-content {
        display: none !important;
    }

    .ifp-video-playlist .jet-blog-playlist__item-index {
        position: absolute;
        top: 5px;
        left: 5px;
        z-index: 2;
    }
}

/* Mobile étroit : miniatures plus petites */
@media (max-width: 767px) {
    .ifp-video-playlist .jet-blog-playlist__item {
        flex-basis: 118px !important;
        width: 118px !important;
        max-width: 118px !important;
        min-width: 118px !important;
    }

    .ifp-video-playlist .jet-blog-playlist__items {
        margin-top: 8px !important;
    }
}