/*
Theme Name:        Divi Child – Offset5
Theme URI:         https://www.offset5.com
Description:       Thème enfant de Divi pour le site Offset5. Toutes les personnalisations CSS et PHP sont isolées ici afin de préserver les mises à jour du thème parent.
Author:            Graffocean
Author URI:        https://www.graffocean.com
Template:          Divi
Version:           1.0.0
License:           GNU General Public License v2 or later
License URI:       https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:       divi-child-offset5
*/

/* ============================================================
   IMPORTS & DÉPENDANCES
   Les styles du thème parent sont chargés via functions.php
   (wp_enqueue_style). Ne pas utiliser @import ici.
   ============================================================ */


/* ============================================================
   1. GLOBAL — HEADER & FOOTER
   ============================================================ */

header#main-header {
    border-bottom: 2px solid #004F9F;
}

#main-footer {
    background-color: #003C68 !important;
}

#footer-bottom {
    display: none;
}


/* ============================================================
   2. NAVIGATION — CTA MENU
   ============================================================ */

/* CTA principal — Demande de devis */
#menu-item-31257 > a {
    background: #0b57d0 !important;
    color: #ffffff !important;
    border: 1px solid #0b57d0 !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}
#menu-item-31257 > a:hover {
    filter: brightness(0.95) !important;
}

/* CTA secondaire — Espace client */
#menu-item-45230 > a {
    background: rgba(11, 87, 208, 0.10) !important;
    color: #0b57d0 !important;
    border: 1px solid rgba(11, 87, 208, 0.35) !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}
#menu-item-45230 > a:hover {
    background: rgba(11, 87, 208, 0.15) !important;
    border-color: rgba(11, 87, 208, 0.55) !important;
}

/* Eviter que l'etat "active" n'ecrase les styles CTA */
#menu-item-31257.current-menu-item > a,
#menu-item-31257.current_page_item > a,
#menu-item-45230.current-menu-item > a,
#menu-item-45230.current_page_item > a {
    background: inherit !important;
    color: inherit !important;
}

#top-menu li {
    padding-right: 12px;
}


/* ============================================================
   3. TYPOGRAPHIE
   ============================================================ */

h3 {
    font-family: courier;
    font-size: large;
}

h1.entry-title {
    border-left: 10px solid;
    padding-left: 14px;
    padding-bottom: 0px;
    margin-bottom: 20px;
}


/* ============================================================
   4. IMAGES & MEDIAS
   ============================================================ */

.et_pb_image_container img,
.et_pb_post a img {
    border: solid 1px lightgrey !important;
}

.mfp-title {
    display: none;
}


/* ============================================================
   5. MISE EN PAGE — SIDEBAR & CONTENU
   ============================================================ */

#content-area {
    display: flex;
    gap: 40px;
}

#main-content .container:before {
    display: none !important;
}

@media (min-width: 981px) {
    #sidebar {
        width: 300px !important;
        padding-left: 10px;
        float: left;
    }
    #left-area {
        width: calc(100% - 300px) !important;
        float: left;
    }
}

@media (max-width: 980px) {
    #sidebar {
        display: none !important;
    }
    #left-area {
        width: 100% !important;
        float: none !important;
        clear: both !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    #main-content .container:before {
        display: none !important;
    }
}


/* ============================================================
   6. ARCHIVES & RECHERCHE (layout maconnerie)
   ============================================================ */

.search #left-area,
.archive #left-area {
    -moz-column-count: 3;
         column-count: 3;
    -moz-column-gap: 60px;
         column-gap: 60px;
}

.archive .et_pb_post > a,
.search .et_pb_post > a {
    margin: -20px -20px 10px;
    display: block;
}

.search #left-area .et_pb_post,
.archive #left-area .et_pb_post {
    overflow: hidden;
    page-break-inside: avoid;
    break-inside: avoid-column;
    width: 100%;
    padding: 19px;
    border: 1px solid #d8d8d8;
    background-color: #fff;
    word-wrap: break-word;
    display: inline-block;
}

.search #left-area .et_pb_post h2,
.archive #left-area .et_pb_post h2 {
    font-size: 18px;
}

.search #left-area .et_pb_post.format-link,
.search #left-area .et_pb_post.format-quote,
.search #left-area .et_pb_post.format-audio,
.archive #left-area .et_pb_post.format-link,
.archive #left-area .et_pb_post.format-quote,
.archive #left-area .et_pb_post.format-audio {
    padding: 0;
}

.archive .et_pb_post .et_pb_image_container,
.archive .et_pb_post .et_main_video_container,
.archive .et_pb_post .et_audio_content,
.archive .et_pb_post .et_pb_slider,
.search .et_pb_post .et_pb_image_container,
.search .et_pb_post .et_main_video_container,
.search .et_pb_post .et_audio_content,
.search .et_pb_post .et_pb_slider {
    margin: -20px -20px 10px;
}

.archive .et_pb_post.format-audio .et_audio_content {
    margin: 0px -38px 0px;
}

.archive .et_pb_post .et_pb_slider .et_pb_slide,
.search .et_pb_post .et_pb_slider .et_pb_slide {
    min-height: 180px;
}

.archive .pagination,
.search .pagination {
    padding: 20px 0;
}

.search #main-content .container::before,
.archive #main-content .container::before {
    display: none;
}
.search #left-area,
.archive #left-area {
    width: 100%;
    float: none;
    padding-right: 0;
}
.search #sidebar,
.archive #sidebar {
    display: none;
}

@media screen and (max-width: 980px) {
    .search #left-area,
    .archive #left-area {
        -moz-column-count: 2;
             column-count: 2;
    }
}

@media screen and (max-width: 767px) {
    .search #left-area,
    .archive #left-area {
        -moz-column-count: 1;
             column-count: 1;
    }
    .search .et_pb_post.format-audio .et_audio_content,
    .archive .et_pb_post.format-audio .et_audio_content {
        margin: 0;
    }
    .search #left-area .et_pb_post.format-audio .et_audio_container .mejs-controls div.mejs-time-rail,
    .archive #left-area .et_pb_post.format-audio .et_audio_container .mejs-controls div.mejs-time-rail,
    .search #left-area .et_pb_post.format-audio .et_audio_container .mejs-controls .mejs-time-rail .mejs-time-total,
    .archive #left-area .et_pb_post.format-audio .et_audio_container .mejs-controls .mejs-time-rail .mejs-time-total {
        min-width: 300px !important;
        width: 300px !important;
    }
}


/* ============================================================
   7. BOUTONS & FORMULAIRES
   ============================================================ */

/* Bouton "Devis en ligne" (bounce) */
.devis {
    padding: 3px !important;
    font-size: 13px !important;
    background-color: #BB2A2B;
    font-weight: bold;
    text-shadow: 1px 1px #BB2A2B;
    color: #ffffff;
    border-radius: 5px;
    border: 1px solid #BB2A2B;
    cursor: pointer;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
    animation: et_bounce 2s infinite;
}

.devis2 {
    padding: 5px !important;
    font-size: 15px !important;
    background-color: #BB2A2B;
    color: #ffffff;
    border-radius: 5px !important;
    cursor: pointer;
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
    animation: et_bounce 2s infinite;
}

@keyframes et_bounce {
    0%   { transform: translateY(0); }
    40%  { transform: translateY(-10px); }
    100% { transform: translateY(0px); }
}

/* Contact Form 7 */
.wpcf7-submit {
    padding: 10px 80px 11px !important;
    font-size: 18px !important;
    background-color: #57d6c7;
    font-weight: bold;
    color: #ffffff;
    border-radius: 5px;
    border: 1px solid #57D6C7;
    cursor: pointer;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
}

.wpcf7-mail-sent-ok {
    border: 3px solid #57d6c7;
    border-radius: 5px;
}

div.custom-form .wpcf7-form-control {
    max-width: 100%;
}

.custom-form {
    padding: 10px !important;
    background-color: #D7CCC8;
    border-radius: 5px;
    border: 1px solid #D7CCC8;
    cursor: pointer;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
}

.custom-form-article {
    padding: 10px !important;
    background-color: #ededed;
    border-radius: 5px;
    border: 1px solid #ededed;
    cursor: pointer;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
}

/* Gravity Forms — boutons globaux */
.gform_button,
.gform_next_button,
.gform_previous_button {
    padding: 10px 20px 11px !important;
    font-size: 21px !important;
    background-color: #003c68;
    font-weight: bold;
    color: #ffffff;
    border-radius: 10px;
    border: 1px solid #003c68;
    cursor: pointer;
    box-shadow: 0 1px 0 #003c68 inset;
    white-space: normal !important;
}

/* Gravity Forms — boutons par formulaire */
#gform_submit_button_180,
#gform_submit_button_181 {
    background-color: #e3021b !important;
    border-color: #e3021b !important;
    color: #ffffff !important;
}
#gform_submit_button_180:hover,
#gform_submit_button_181:hover {
    background-color: #c80018 !important;
    border-color: #c80018 !important;
}

#gform_submit_button_185,
#gform_submit_button_186 {
    background-color: #32aa46 !important;
    border-color: #32aa46 !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

#gform_submit_button_187 {
    background-color: #003160 !important;
    border-color: #003160 !important;
    color: #ffffff !important;
}
#gform_submit_button_187:hover {
    background-color: #00264d !important;
    border-color: #00264d !important;
}

/* Gravity Forms — champs */
body .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]),
body .gform_wrapper textarea.textarea,
body div.form_saved_message div.form_saved_message_emailform form input[type=text] {
    padding: 5px !important;
}

body .gform_wrapper select {
    height: 25px !important;
}

body .gform_wrapper ul li.gfield {
    margin-top: 5px !important;
}

.gform_wrapper .top_label li.gfield.gf_left_half .ginput_container:not(.gfield_time_hour):not(.gfield_time_minute):not(.gfield_time_ampm):not(.ginput_container_date):not(.ginput_quantity):not(.datepicker),
.gform_wrapper .top_label li.gfield.gf_right_half .ginput_container:not(.gfield_time_hour):not(.gfield_time_minute):not(.gfield_time_ampm):not(.ginput_container_date):not(.ginput_quantity):not(.datepicker) {
    margin: 0 !important;
}

.gform_wrapper .gsection {
    margin: 0 !important;
}

body .gform_wrapper .top_label div.ginput_container {
    margin-top: 0 !important;
}

.gform_drop_area {
    padding: 10px !important;
}

.mon-formulaire-style .gfield_description {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
}

.gform_wrapper.gravity-theme .ginput_container_image_choice .gchoice_187_35_0,
.gform_wrapper.gravity-theme .ginput_container_image_choice .gchoice_187_35_1,
.gform_wrapper.gravity-theme .ginput_container_image_choice .gchoice_187_35_2 {
    inline-size: 325px !important;
    max-inline-size: 325px !important;
    min-inline-size: 325px !important;
}


/* ============================================================
   8. PLUGINS TIERS
   ============================================================ */

/* Avis clients (rplg-badge2) */
.rplg-badge2 .rplg-badge2-btn {
    background: #141414 !important;
}
.rplg-badge2 .rplg-badge2-btn.rplg-badge2-clickable:hover {
    background: #141414 !important;
}

/* Cookie banner */
#cookie-law-info-bar {
    width: 350px !important;
}

/* Commentaires */
#reply-title { display: none; }
.logged-in-as { display: none; }
.comment-reply-link { display: block !important; }
#comment-wrap { display: none; }

/* Ratings */
.wppcr_rating { font-size: 20px; }


/* ============================================================
   9. MODULES DIVI
   ============================================================ */

.et_pb_promo {
    border-radius: 10px;
}

.et_project_meta {
    display: none;
}

div.uploader-editor {
    display: none;
}


/* ============================================================
   10. BLOC CTA CONTACT
   ============================================================ */

.cta-contact {
    margin: 3rem auto;
    padding: 1.5rem 1rem;
    text-align: center;
    max-width: 720px;
    background: #f3f7fb;
    border-radius: 999px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
}

.cta-contact a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.9rem 2.8rem;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 700;
    font-size: 1.05rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    background: linear-gradient(135deg, #005caa, #003f78);
    color: #ffffff;
    border: 0;
    box-shadow: 0 10px 30px rgba(0, 60, 120, 0.35);
    position: relative;
    overflow: hidden;
    transition: transform 0.18s ease-out, box-shadow 0.18s ease-out;
}

.cta-contact a::after {
    content: '';
    position: absolute;
    inset: auto 18% -4px 18%;
    height: 4px;
    border-radius: 999px;
    background: #e30613;
    opacity: 0.9;
}

.cta-contact a:hover,
.cta-contact a:focus {
    transform: translateY(-2px);
    box-shadow: 0 14px 36px rgba(0, 60, 120, 0.45);
}

.cta-contact a:focus-visible {
    outline: 3px solid #ffcf33;
    outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
    .cta-contact a,
    .cta-contact a:hover,
    .cta-contact a:focus {
        transition: none;
        transform: none;
    }
}

@media (max-width: 768px) {
    .cta-contact {
        margin: 2.5rem 1rem;
        border-radius: 24px;
        padding: 1.2rem 0.8rem;
    }
    .cta-contact a {
        width: 100%;
        max-width: 100%;
        padding: 0.9rem 1.4rem;
        font-size: 0.95rem;
        letter-spacing: 0.06em;
    }
    .cta-contact a::after {
        inset: auto 22% -3px 22%;
    }
}


/* ============================================================
   11. ENCADRE INFO (classe utilitaire)
   ============================================================ */

.qeico5 {
    background: #eef2f7;
    border: 1px solid #d6dde6;
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
    padding: 24px;
    margin: 30px 0;
    border-radius: 8px;
}

.qeico5 p {
    margin: 0;
    color: #444;
    line-height: 1.6;
}


/* ============================================================
   12. PAGES SPECIFIQUES (par ID)
   ============================================================ */

/* postid-35580 : landing page sans header/footer */
.postid-35580 #main-header { display: none; }
.postid-35580 #main-footer { display: none; }
.postid-35580 #page-container { padding-top: 0 !important; }

/* Widget social masque sur certaines pages */
.page-id-37161 .et_social_sidebar_networks,
.page-id-37161 .et_social_heading,
.page-id-37342 .et_social_sidebar_networks,
.page-id-37342 .et_social_heading,
.page-id-37357 .et_social_sidebar_networks,
.page-id-37357 .et_social_heading,
.page-id-38035 .et_social_sidebar_networks,
.page-id-38035 .et_social_heading,
.page-id-38916 .et_social_sidebar_networks,
.page-id-38916 .et_social_heading,
.page-id-39221 .et_social_sidebar_networks,
.page-id-39221 .et_social_heading,
.page-id-38218 .et_social_sidebar_networks,
.page-id-38218 .et_social_heading,
.page-id-39181 .et_social_sidebar_networks,
.page-id-39181 .et_social_heading {
    display: none;
}

/* Element .sc-fzXfNP masque sur certaines pages */
.page-id-35910 .sc-fzXfNP,
.page-id-35905 .sc-fzXfNP,
.page-id-37342 .sc-fzXfNP,
.page-id-37357 .sc-fzXfNP,
.page-id-38035 .sc-fzXfNP,
.page-id-38916 .sc-fzXfNP,
.page-id-39221 .sc-fzXfNP,
.page-id-38218 .sc-fzXfNP,
.page-id-39181 .sc-fzXfNP {
    display: none;
}

/* Radios masques */
.hideradio input[type="radio"] {
    display: none;
}


/* ============================================================
   13. PERSONNALISATIONS — A VENIR (interventions Graffocean - David)
   ============================================================ */

/* Logo centré toujours visible au scroll */
/* Logo visible en mode header scrollé */
.et-fixed-header .logo_container {
    height: auto !important;
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
}

.et-fixed-header #logo,
.et-fixed-header .centered-inline-logo-wrap #logo {
    height: 36px !important;
    max-height: 36px !important;
    width: auto !important;
    opacity: 1 !important;
}

.et-fixed-header .centered-inline-logo-wrap {
    opacity: 1 !important;
}