/* ============================================
   IDENTITÉ GF ENTREPRISES — surcharge template
   ============================================ */
:root {
    --gf-or: #6b6b6b;
    --gf-noir: #1c1410;
    --gf-accent: #cccccc;
}

/* ===== Supprime l'espace header/slider ===== */
body { margin: 0 !important; padding: 0 !important; }
.navbar-front { margin-bottom: 0 !important; }
.hero-slider, .hero-slider .owl-carousel, .owl-carousel { margin: 0 !important; }
.hero-slider { padding-top: 0 !important; }

/* ===== HEADER FIXE AU DÉFILEMENT ===== */
/* position: sticky testée d'abord (comportement idéal : reste dans le flux,
   donc aucune compensation d'espace nécessaire) mais neutralisée dans ce
   projet : common.css pose `html, body { overflow-x: hidden }` (anti-scroll
   horizontal), ce qui force le navigateur à calculer overflow-y en "auto"
   sur body (règle CSS Overflow : dès qu'un axe n'est pas "visible", l'autre
   axe "visible" devient "auto"). body devient alors son propre conteneur de
   défilement au sens de la spec sticky, qui décroche du viewport réel — le
   header scrollait alors hors champ au lieu de rester collé (vérifié dans un
   navigateur réel : rectTop passait à -900px après un défilement de 900px).
   `position: fixed` n'a pas ce problème (toujours relatif au viewport, sauf
   ancêtre avec transform — aucun ici) ; en contrepartie il sort le header du
   flux, d'où le padding-top de compensation sur .wrapper ci-dessous, mesuré
   sur la hauteur réelle du header (81px desktop / 67px mobile). */
.front-header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000; /* sous la lightbox (9999) et les boutons flottants (999x) */
    width: 100%;
    /* Opaque impérativement : une fois au-dessus du contenu clair, un fond
       transparent rendrait le texte du contenu illisible en transparence. */
    background-color: #000000;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
}

/* .wrapper (conteneur injecté par bootsnav.js autour de toute la page,
   header inclus) : compense l'espace que le header réservait dans le flux
   avant de passer en fixed, pour qu'aucun contenu ne soit masqué dessous au
   chargement. */
.wrapper {
    padding-top: 81px;
}
@media (max-width: 767px) {
    .wrapper {
        padding-top: 67px;
    }
}

/* ============================================
   SURVOL DES LIENS — jamais d'orange
   Menu (fond sombre) : blanc au survol
   Contenu (fond clair) : gris foncé au survol
   ============================================ */

/* Par défaut, tous les liens au survol : gris foncé (fond clair) + souligné */
a:hover, a:focus, a:active {
    color: #1c1410 !important;
    text-decoration: underline !important;
}

/* Liens du MENU (navbar sombre) : fond gris (jamais orange) au survol */
.navbar-front .navbar-nav > li > a {
    color: #fff !important;
    transition: background-color 0.2s, color 0.2s;
}
.navbar-front .navbar-nav > li > a:hover,
.navbar-front .navbar-nav > li > a:focus,
.navbar-front .navbar-nav > li.active > a {
    background-color: #333333 !important;
    color: #fff !important;
    text-decoration: underline !important;
}

/* Liens du FOOTER (fond sombre) : fond gris (jamais orange) au survol */
.footer-front a {
    color: #cccccc !important;
    transition: background-color 0.2s, color 0.2s;
}
.footer-front a:hover {
    background-color: #333333 !important;
    color: #fff !important;
    text-decoration: underline !important;
}

/* ============================================
   SURVOL DES BOUTONS — fond légèrement grisé,
   texte souligné, jamais d'orange
   ============================================ */
.btn {
    text-decoration: none !important;
}
.btn:hover, .btn:focus {
    filter: brightness(1.3);
    text-decoration: underline !important;
}

/* ============================================
   NEUTRALISER LE ROUGE #da0833 DU TEMPLATE
   ============================================ */

/* Owl carousel : dots et nav en or (pas rouge) */
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: #6b6b6b !important;
}
.owl-theme .owl-nav [class*='owl-']:hover {
    background: #6b6b6b !important;
    color: #fff !important;
}

/* Boutons : fond gris, texte blanc — jamais d'orange (cf. corrections précédentes) */
.btn-primary, .btn-danger {
    background-color: #4a4a4a !important;
    border-color: #4a4a4a !important;
    color: #fff !important;
    transition: background 0.2s;
}
.btn-primary:hover, .btn-primary:focus,
.btn-danger:hover, .btn-danger:focus {
    background-color: #333333 !important;
    border-color: #333333 !important;
    color: #fff !important;
}

/* Boutons sombres (ex: RECHERCHER, EN SAVOIR PLUS sur slider) */
.btn-dark, .btn-noir {
    background-color: #1c1410 !important;
    border-color: #1c1410 !important;
    color: #fff !important;
}
.btn-dark:hover, .btn-noir:hover {
    background-color: #000 !important;
    color: #fff !important;
}

/* Champs formulaire au focus : bordure or discrète */
.form-control:focus {
    border-color: #6b6b6b !important;
    box-shadow: 0 0 0 2px rgba(107,107,107,0.12) !important;
}

/* Neutralise toute couleur rouge résiduelle du template */
[style*="da0833"], [style*="#da0833"],
.text-danger, .theme-color, .color-1 {
    color: inherit !important;
}
[style*="da0833"], [style*="#da0833"] {
    border-color: #6b6b6b !important;
}

/* ===== ANIMATIONS DOUCES AU SURVOL DES CARDS ===== */

/* Cards services et biens : légère élévation au survol */
.service-card, .bien-card {
    transition: transform 0.35s ease, box-shadow 0.35s ease !important;
    overflow: hidden;
}
.service-card:hover, .bien-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 12px 30px rgba(0,0,0,0.12) !important;
}

/* Zoom léger de l'image dans les cards au survol */
.service-card img, .bien-card > div:first-child {
    transition: transform 0.5s ease !important;
}
.service-card:hover img {
    transform: scale(1.05) !important;
}

/* Cards à images de fond (biens) : zoom du fond au survol */
.bien-card:hover > div:first-child {
    transform: scale(1.05) !important;
}

/* ===== GRILLE CATALOGUE BIENS — cartes de même hauteur par ligne =====
   .row devient un conteneur flex : les colonnes s'étirent (stretch, valeur
   par défaut de align-items) à la hauteur de la plus grande carte de la
   ligne. .bien-card (height:100%, display:flex en colonne, voir le style
   inline) occupe alors toute cette hauteur, et son bloc prix/bouton "Voir"
   est poussé en bas via margin-top:auto — aligné même quand le contenu
   au-dessus (caractéristiques d'un terrain vs d'une villa) diffère en
   longueur. */
.biens-grille-col {
    display: flex;
}
/* En dessous de 768px, ni .col-sm-6 ni .col-md-4 ne fixent de largeur
   (comportement bloc normal habituellement) : une fois transformée en item
   flex par .biens-grille, la colonne ne prendrait plus 100% de large par
   défaut sans cette règle — l'empilement mobile serait cassé. */
@media (max-width: 767px) {
    .biens-grille-col {
        width: 100%;
    }
}

/* Card partenaire : élévation douce au survol */
.partenaire-card {
    transition: transform 0.35s ease, box-shadow 0.35s ease !important;
}
.partenaire-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1) !important;
    border-color: #ddd !important;
}

/* Cards actualités : élévation douce au survol */
.actu-card, .actu-une {
    transition: transform 0.35s ease, box-shadow 0.35s ease !important;
}
.actu-card:hover, .actu-une:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,0.12) !important;
}

/* Contenu article : images responsive */
.article-contenu img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 8px;
    margin: 15px 0;
}
.article-contenu h2, .article-contenu h3 {
    color: #1c1410;
    margin-top: 30px;
}

/* Responsive : article à la une en colonne sur mobile */
@media (max-width: 767px) {
    .actu-une {
        flex-direction: column !important;
    }
    .actu-une > div:first-child {
        min-height: 220px !important;
    }
}

/* Pagination en gris/noir */
.pagination > .active > span,
.pagination > .active > a {
    background-color: #1c1410 !important;
    border-color: #1c1410 !important;
}
.pagination > li > a {
    color: #1c1410 !important;
}

/* Champs formulaire contact : focus gris foncé */
.contact-form input:focus,
.contact-form textarea:focus,
input:focus, textarea:focus {
    border-color: #1c1410 !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(28,20,16,0.08) !important;
}

/* Boutons à fond sombre (Appeler, WhatsApp) : texte blanc conservé au survol */
a[href^="tel:"]:hover,
a[href^="https://wa.me"]:hover {
    color: #fff !important;
}

/* ===== BOUTON WHATSAPP FLOTTANT ===== */
.whatsapp-flottant {
    position: fixed;
    bottom: 25px;
    right: 25px;
    width: 58px;
    height: 58px;
    background: #25d366;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(37, 211, 102, 0.4);
    z-index: 9998;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-decoration: none;
}

.whatsapp-flottant:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 22px rgba(37, 211, 102, 0.55);
}

.whatsapp-flottant:hover,
.whatsapp-flottant:focus,
.whatsapp-flottant:active {
    color: #fff !important;
    text-decoration: none !important;
    background: #25d366 !important;
}
.whatsapp-flottant:hover i {
    color: #fff !important;
}

.whatsapp-flottant i {
    color: #fff !important;
    font-size: 32px;
}

/* Effet pulse doux autour du bouton */
.whatsapp-pulse {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: #25d366;
    z-index: -1;
    animation: whatsapp-pulse-anim 2s infinite;
}

@keyframes whatsapp-pulse-anim {
    0% {
        transform: scale(1);
        opacity: 0.6;
    }
    70% {
        transform: scale(1.6);
        opacity: 0;
    }
    100% {
        transform: scale(1.6);
        opacity: 0;
    }
}

/* Responsive : légèrement plus petit sur mobile */
@media (max-width: 767px) {
    .whatsapp-flottant {
        width: 52px;
        height: 52px;
        bottom: 18px;
        right: 18px;
    }
    .whatsapp-flottant i {
        font-size: 28px;
    }
}

/* ===== CHATBOT (bulle en bas à GAUCHE) ===== */
#chatbot-toggle {
    position: fixed;
    bottom: 25px;
    left: 25px;
    width: 58px;
    height: 58px;
    background: #1c1410;
    border: none;
    border-radius: 50%;
    color: #fff;
    font-size: 26px;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(0,0,0,0.3);
    z-index: 9998;
    transition: transform 0.3s ease;
}
#chatbot-toggle:hover { transform: scale(1.08); }

#chatbot-window {
    position: fixed;
    bottom: 95px;
    left: 25px;
    width: 350px;
    max-width: calc(100vw - 50px);
    height: 480px;
    max-height: calc(100vh - 130px);
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
    z-index: 9998;
    flex-direction: column;
    overflow: hidden;
}

#chatbot-header {
    background: #1c1410;
    padding: 15px;
    flex-shrink: 0;
}

#chatbot-messages {
    flex: 1;
    overflow-y: auto;
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #f9f9f9;
}

.chatbot-msg {
    max-width: 80%;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.5;
    word-wrap: break-word;
}
.chatbot-msg-bot {
    background: #fff;
    color: #333;
    align-self: flex-start;
    border: 1px solid #eee;
    border-bottom-left-radius: 4px;
}
.chatbot-msg-user {
    background: #1c1410;
    color: #fff;
    align-self: flex-end;
    border-bottom-right-radius: 4px;
}

#chatbot-input-zone {
    display: flex;
    padding: 12px;
    border-top: 1px solid #eee;
    background: #fff;
    flex-shrink: 0;
    gap: 8px;
}
#chatbot-input {
    flex: 1;
    padding: 10px 14px;
    border: 1px solid #ddd;
    border-radius: 20px;
    font-size: 14px;
    outline: none;
}
#chatbot-input:focus { border-color: #1c1410; }
#chatbot-send {
    width: 40px;
    height: 40px;
    background: #1c1410;
    border: none;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    flex-shrink: 0;
}
#chatbot-send:disabled { opacity: 0.5; cursor: not-allowed; }

.chatbot-dots { animation: chatbot-blink 1.4s infinite; }
@keyframes chatbot-blink { 0%, 100% { opacity: 0.3; } 50% { opacity: 1; } }

/* Responsive */
@media (max-width: 767px) {
    #chatbot-toggle { width: 52px; height: 52px; bottom: 18px; left: 18px; font-size: 22px; }
    #chatbot-window { bottom: 80px; left: 15px; height: 60vh; }
}

/* ===== BOUTON RETOUR EN HAUT — discret, utilitaire, gris/noir (jamais d'or) ===== */
#back-to-top {
    position: fixed;
    right: 25px;
    bottom: 95px; /* AU-DESSUS du bouton WhatsApp (58px de haut + 25px de bas + 12px d'espace) */
    width: 44px;   /* plus petit que le WhatsApp (58px) */
    height: 44px;
    background: #1c1410;
    color: #fff;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.25);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
    z-index: 9997; /* sous le WhatsApp/chatbot (9998) et la lightbox (9999) */
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#back-to-top.visible {
    opacity: 0.85;
    visibility: visible;
    transform: translateY(0);
}

#back-to-top:hover {
    opacity: 1;
    background: #000;
}

#back-to-top i { color: #fff !important; }

/* Mobile : un peu plus petit et repositionné au-dessus du WhatsApp mobile */
@media (max-width: 767px) {
    #back-to-top {
        right: 18px;
        bottom: 82px; /* au-dessus du WhatsApp mobile (52px de haut + 18px de bas + 12px d'espace) */
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
}

/* ===== CONTENU DES PAGES CMS (mentions légales, confidentialité, etc.) ===== */
.page-contenu h2 {
    color: #1c1410;
    font-size: 20px;
    margin-top: 34px;
    margin-bottom: 12px;
}
.page-contenu h2:first-child {
    margin-top: 0;
}
.page-contenu h3 {
    color: #1c1410;
    font-size: 17px;
    margin-top: 24px;
    margin-bottom: 10px;
}
.page-contenu p {
    margin-bottom: 14px;
}
.page-contenu ul {
    margin-bottom: 14px;
    padding-left: 22px;
}
.page-contenu ul li {
    margin-bottom: 8px;
}