/*
Theme Name: Houzez Child
Theme URI: http://www.favethemes.com/
Author: Favethemes
Author URI: http://www.favethemes.com/
Description: Houzez is a premium WordPress theme for real estate agents where modern aesthetics are combined with tasteful simplicity, and where the ease of use is achieved without compromise in your ability to customise the design. Whether you are a real estate agent looking to build a website for your company or a web developer seeking a perfect WordPress theme for your next project, you are certain to appreciate the numerous features and benefits that our theme provides.
Version: 1.0
Tags: white, right-sidebar, left-sidebar, custom-colors, custom-menu, featured-images, post-formats, theme-options, translation-ready
License: GNU General Public License version 3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: houzez
Template: houzez
*/


@import url("../houzez/style.css");

/* ── Bordure dorée bas de la section principale (toutes pages sauf homepage) ─ */
body:not(.home) .content-wrap {
    border-bottom: 3px solid #C8A24B;
    border-radius: 0 0 8px 8px;
}

/* Your CSS code goes here
-------------------------------------- */

/* ── Palette officielle Scroll Immo ─────────────────────────────────────────── */
:root {
    --si-primary:   #1B3A8C;   /* Bleu Royal   — header, nav, titres          */
    --si-secondary: #16306F;   /* Bleu Profond — footer, survols               */
    --si-accent:    #C8A24B;   /* Or Premium   — filets, icônes, prix          */
    --si-bg:        #F7F4EF;   /* Sable Clair  — fonds de page                 */
    --si-text:      #1C2434;   /* Gris Charbon — corps de texte                */
    --si-cta:       #D4AF37;   /* Or Vibrant   — boutons CTA                   */
}

/* ── Sidebar : tabs Planifier / Demander des infos ──────────────────────────── */
.property-form-tabs-wrap {
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .12);
    border: 1px solid rgba(200, 162, 75, .25);
}

.property-form-tabs .nav-tabs {
    border-bottom: none;
    background: var(--si-primary);
    padding: 6px 6px 0;
    gap: 4px;
    display: flex;
}

.property-form-tabs .nav-tabs .nav-item {
    flex: 1;
}

.property-form-tabs .nav-tabs .nav-link {
    border: none;
    border-radius: 10px 10px 0 0;
    color: rgba(255, 255, 255, .55);
    font-weight: 600;
    font-size: 12.5px;
    padding: 11px 8px;
    transition: all .2s ease;
    text-align: center;
    background: transparent;
    width: 100%;
}

.property-form-tabs .nav-tabs .nav-link:hover:not(.active) {
    color: rgba(255, 255, 255, .85);
    background: rgba(255, 255, 255, .1);
}

.property-form-tabs .nav-tabs .nav-link.active {
    background: #ffffff;
    color: var(--si-primary);
    font-weight: 700;
}

/* Contenu des tabs — fond blanc, pas de hauteur forcée */
.property-form-tabs .tab-content {
    background: #ffffff;
    padding: 20px;
}

/* Fix espace blanc : le form schedule peut avoir un wrapper trop haut */
.property-schedule-tour-form-wrap,
.property-schedule-tour-day-form,
.property-form-wrap {
    min-height: unset !important;
}

/* ── Boutons sidebar : compact auto-width, couleur Or Premium ───────────────── */

/* Hauteur réduite, largeur inchangée (pleine largeur Houzez) */
.property-form-tabs .tab-pane .btn,
.property-form-tabs .tab-pane a.btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4;
    transition: all .2s;
}

/* Bouton Envoyer — Or Premium */
.property-form-tabs .tab-pane .btn-secondary:not(.btn-secondary-outlined),
.property-form-tabs .tab-pane button[type="submit"],
.schedule_contact_form.houzez-ele-button {
    background: var(--si-accent) !important;
    border-color: var(--si-accent) !important;
    color: #fff !important;
    font-weight: 700;
}

.property-form-tabs .tab-pane .btn-secondary:not(.btn-secondary-outlined):hover,
.schedule_contact_form.houzez-ele-button:hover {
    background: #b8902e !important;
    border-color: #b8902e !important;
    box-shadow: 0 4px 16px rgba(200, 162, 75, .35) !important;
}

/* Bouton Appeler — contour Or */
.property-form-tabs .tab-pane .btn-secondary-outlined,
.property-form-tabs .tab-pane a[href^="tel"] {
    background: transparent !important;
    border: 2px solid var(--si-accent) !important;
    color: var(--si-accent) !important;
}

.property-form-tabs .tab-pane .btn-secondary-outlined:hover,
.property-form-tabs .tab-pane a[href^="tel"]:hover {
    background: var(--si-accent) !important;
    color: #fff !important;
}

/* Bouton WhatsApp — vert officiel + icône */
.property-form-tabs .tab-pane a[href*="whatsapp"],
.property-form-tabs .tab-pane a[href*="wa.me"],
.property-form-tabs .tab-pane .btn-whatsapp,
.si-rental-form a.btn[href*="whatsapp"] {
    background: #25D366 !important;
    border-color: #25D366 !important;
    color: #fff !important;
    font-weight: 600;
}

.property-form-tabs .tab-pane a[href*="whatsapp"]:hover,
.si-rental-form a.btn[href*="whatsapp"]:hover {
    background: #1ebe59 !important;
    border-color: #1ebe59 !important;
    box-shadow: 0 4px 16px rgba(37, 211, 102, .35) !important;
}

/* Rangée boutons alignée à gauche */
.property-form-tabs .tab-pane .form-group:last-of-type,
.contact-form-agent-btns {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

/* Prix mise en avant — Or Premium */
.price-wrap .item-price,
.listing-price {
    color: var(--si-accent) !important;
}

/* ── Sélecteur de devise custom desktop (.si-cs) ────────────────────────────── */

.si-cs {
    display: inline-block;
    position: relative;
}

.si-cs-btn {
    display: flex;
    align-items: center;
    gap: 5px;
    background: transparent;
    border: 1.5px solid var(--si-primary);
    color: var(--si-primary);
    border-radius: 6px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.4px;
    cursor: pointer;
    transition: all .2s;
    white-space: nowrap;
    line-height: 1.3;
}

.si-cs-btn:hover,
.si-cs.si-cs-open .si-cs-btn {
    background: var(--si-accent);
    border-color: var(--si-accent);
    color: #fff;
}

.si-cs-arrow {
    font-size: 9px;
    line-height: 1;
    display: inline-block;
    transition: transform .2s;
}

.si-cs.si-cs-open .si-cs-arrow {
    transform: rotate(180deg);
}

/* Dropdown — position:fixed pour échapper overflow:hidden du header */
.si-cs-menu {
    position: fixed;
    display: none;
    min-width: 76px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 6px 24px rgba(0, 0, 0, .13);
    z-index: 999999;
    padding: 4px 0;
}

.si-cs.si-cs-open .si-cs-menu {
    display: block;
}

.si-cs-item {
    padding: 9px 16px;
    font-size: 13px;
    font-weight: 600;
    color: var(--si-text);
    cursor: pointer;
    transition: background .12s, color .12s;
}

.si-cs-item:hover,
.si-cs-item.si-cs-on {
    background: var(--si-bg);
    color: var(--si-primary);
}

/* ── Devise mobile (dans l'offcanvas) ───────────────────────────────────────── */
.si-currency-mobile {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    border-bottom: 1px solid #eee;
}

.si-currency-mobile-label {
    font-size: 12px;
    font-weight: 600;
    color: #888;
    white-space: nowrap;
}

/* Masquer le bouton toggle sur mobile — afficher les items directement */
.si-currency-mobile .currency-switcher-wrap .btn.dropdown-toggle {
    display: none !important;
}

.si-currency-mobile .currency-switcher-wrap .dropdown-menu {
    position: static !important;
    display: flex !important;
    gap: 6px;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    background: transparent !important;
    z-index: auto !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    min-width: auto !important;
    border-radius: 0 !important;
}

.si-currency-mobile .currency-switcher-wrap .dropdown-menu li {
    border: 1.5px solid var(--si-primary) !important;
    border-radius: 5px !important;
    padding: 4px 12px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: var(--si-primary) !important;
    background: transparent !important;
    display: inline-block !important;
}

.si-currency-mobile .currency-switcher-wrap .dropdown-menu li:hover,
.si-currency-mobile .currency-switcher-wrap .dropdown-menu li.si-cur-active {
    background: var(--si-primary) !important;
    color: #fff !important;
}

/* ── Bouton WhatsApp hôte (fiches location) ─────────────────────────────────── */
.si-btn-host-wa {
    background: #25D366;
    border: none;
    color: #fff !important;
    font-weight: 600;
    font-size: 13px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    transition: background .2s;
}
.si-btn-host-wa:hover {
    background: #1ebe59;
    color: #fff !important;
    box-shadow: 0 4px 16px rgba(37,211,102,.35);
}

/* Placeholder carte masquée */
.si-map-hidden-placeholder {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 20px;
    background: #f8f9fc;
    border: 1.5px dashed #c5cde8;
    border-radius: 10px;
    color: #1B3A8C;
    font-size: 14px;
    font-weight: 600;
    margin-top: 16px;
}
.si-map-hidden-placeholder span {
    color: #555;
    font-weight: 500;
}

/* ── Carte booking location (style Airbnb/Booking) ──────────────────────────── */
.si-booking-card {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 6px 32px rgba(0,0,0,.13);
    border: 1px solid #e8e4de;
    padding: 20px 20px 16px;
}

/* Titre "Sélectionnez des dates" */
.si-booking-hint {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--si-text);
    margin: 0 0 12px;
}

/* Input Flatpickr caché — display:none pour que Flatpickr inline s'affiche après */
.si-fp-input {
    display: none !important;
}

.si-fp-wrap {
    position: relative;
    margin-bottom: 4px;
}

/* ── Calendrier Flatpickr inline : reset complet + couleurs SI ───────────────── */

/* Conteneur calendrier */
.si-fp-wrap .flatpickr-calendar {
    display: block !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
    font-family: inherit;
    width: 100% !important;
    margin-bottom: 4px;
}

.si-fp-wrap .flatpickr-innerContainer,
.si-fp-wrap .flatpickr-rContainer {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
}

/* Grid des jours — Flatpickr calcule mal avec width:100%, on force flex */
.si-fp-wrap .flatpickr-days {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
}

.si-fp-wrap .dayContainer {
    display: flex !important;
    flex-wrap: wrap !important;
    padding: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

/* Cellules jour */
.si-fp-wrap .flatpickr-day {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 calc(100% / 7) !important;
    width: calc(100% / 7) !important;
    max-width: calc(100% / 7) !important;
    height: 34px !important;
    max-height: 34px !important;
    line-height: 1 !important;
    font-size: 12.5px;
    border-radius: 50%;
    box-sizing: border-box;
    margin: 0;
    border: 1px solid transparent;
    cursor: pointer;
}

/* En-tête mois */
.si-fp-wrap .flatpickr-months {
    display: flex !important;
    align-items: center !important;
    height: 40px !important;
    padding-bottom: 4px;
}

.si-fp-wrap .flatpickr-month {
    height: 36px !important;
    line-height: 36px;
}

.si-fp-wrap .flatpickr-current-month {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: var(--si-primary) !important;
    padding-top: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.si-fp-wrap .flatpickr-current-month .numInputWrapper {
    width: 56px !important;
}

/* ── FLÈCHES — Houzez les agrandit via héritage SVG, on reset tout ─────────── */
.si-fp-wrap .flatpickr-prev-month,
.si-fp-wrap .flatpickr-next-month {
    position: relative !important;
    top: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    padding: 0 !important;
    line-height: 1 !important;
    color: var(--si-primary) !important;
    cursor: pointer;
}

.si-fp-wrap .flatpickr-prev-month svg,
.si-fp-wrap .flatpickr-next-month svg {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    max-width: 14px !important;
    fill: var(--si-primary) !important;
    display: block !important;
}

.si-fp-wrap .flatpickr-prev-month path,
.si-fp-wrap .flatpickr-next-month path {
    fill: var(--si-primary) !important;
}

/* ── Jours de la semaine ─────────────────────────────────────────────────────── */
.si-fp-wrap .flatpickr-weekdays {
    display: flex !important;
    height: 28px !important;
    align-items: center !important;
    overflow: hidden;
}

.si-fp-wrap .flatpickr-weekdaycontainer {
    display: flex !important;
    flex: 1 !important;
}

.si-fp-wrap span.flatpickr-weekday {
    display: flex !important;
    flex: 1 !important;
    justify-content: center !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    color: #aaa !important;
    cursor: default;
    line-height: 1;
}

/* ── États des jours ─────────────────────────────────────────────────────────── */
.si-fp-wrap .flatpickr-day:hover:not(.selected):not(.startRange):not(.endRange):not(.flatpickr-disabled) {
    background: rgba(27,58,140,.08) !important;
    border-color: transparent !important;
}

.si-fp-wrap .flatpickr-day.today:not(.selected):not(.startRange):not(.endRange) {
    border-color: var(--si-accent) !important;
    color: var(--si-primary) !important;
    font-weight: 700 !important;
}

.si-fp-wrap .flatpickr-day.selected,
.si-fp-wrap .flatpickr-day.startRange,
.si-fp-wrap .flatpickr-day.endRange {
    background: var(--si-primary) !important;
    border-color: var(--si-primary) !important;
    color: #fff !important;
}

.si-fp-wrap .flatpickr-day.startRange { border-radius: 50% 0 0 50% !important; }
.si-fp-wrap .flatpickr-day.endRange   { border-radius: 0 50% 50% 0 !important; }
.si-fp-wrap .flatpickr-day.startRange.endRange { border-radius: 50% !important; }

.si-fp-wrap .flatpickr-day.inRange {
    background: rgba(27,58,140,.1) !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.si-fp-wrap .flatpickr-day.flatpickr-disabled,
.si-fp-wrap .flatpickr-day.prevMonthDay,
.si-fp-wrap .flatpickr-day.nextMonthDay {
    color: #d0d0d0 !important;
    background: transparent !important;
}

/* ── Bandeau Arrivée / Départ ────────────────────────────────────────────────── */
.si-booking-dates-row {
    display: flex;
    align-items: stretch;
    border: 1.5px solid #dde3ee;
    border-radius: 10px;
    overflow: hidden;
    margin: 10px 0 14px;
}

.si-booking-date-box {
    flex: 1;
    padding: 9px 14px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.si-booking-dates-sep {
    width: 1px;
    background: #dde3ee;
    flex-shrink: 0;
}

.si-bdl {
    font-size: 10px;
    font-weight: 700;
    color: #999;
    letter-spacing: 0.7px;
    display: block;
}

.si-bdv {
    font-size: 14px;
    font-weight: 600;
    color: var(--si-text);
}

/* ── Voyageurs dropdown ──────────────────────────────────────────────────────── */
.si-booking-field {
    margin-bottom: 14px;
}

.si-booking-select-wrap {
    border: 1.5px solid #dde3ee;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 5px;
}

.si-booking-select-wrap select {
    width: 100%;
    border: none;
    padding: 10px 14px;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--si-text);
    background: #fff;
    appearance: auto;
    cursor: pointer;
}

.si-booking-select-wrap select:focus {
    outline: none;
}

/* ── Bouton Se renseigner ────────────────────────────────────────────────────── */
.si-booking-wa-btn {
    background: #1a7f4b !important;
    border-color: #1a7f4b !important;
    color: #fff !important;
    font-weight: 700;
    font-size: 14.5px;
    border-radius: 10px;
    padding: 14px 16px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: background .2s, box-shadow .2s;
    text-decoration: none;
}

.si-booking-wa-btn:hover {
    background: #136138 !important;
    border-color: #136138 !important;
    color: #fff !important;
    box-shadow: 0 4px 18px rgba(26,127,75,.35);
}

.si-booking-wa-btn i {
    font-size: 17px;
}

/* ── Sous-texte WhatsApp ─────────────────────────────────────────────────────── */
.si-booking-wa-sub {
    font-size: 11.5px;
    color: #aaa;
    text-align: center;
    margin: 8px 0 0;
}

/* ── Bouton "Déposer une annonce" header — couleur forcée tous navigateurs ───── */
.header-main-wrap .btn-create-listing,
.navi-login-register .btn-create-listing,
.login-register .btn-create-listing,
.nav-mobile .btn-create-listing {
    background-color: var(--si-primary) !important;
    border-color: var(--si-primary) !important;
    color: #fff !important;
}

.header-main-wrap .btn-create-listing:hover,
.header-main-wrap .btn-create-listing:focus,
.navi-login-register .btn-create-listing:hover,
.navi-login-register .btn-create-listing:focus,
.nav-mobile .btn-create-listing:hover,
.nav-mobile .btn-create-listing:focus,
a.btn-create-listing:hover,
a.btn-create-listing:focus {
    background-color: var(--si-secondary) !important;
    border-color: var(--si-secondary) !important;
    color: #fff !important;
}

/* ── Section listing — même traitement que .content-wrap ────────────────────── */
.listing-wrap {
    border-bottom: 3px solid #C8A24B !important;
    border-radius: 0 0 8px 8px !important;
}
}