/* ==========================================================
   LE VOYAGEUR MYSTIQUE — THÈME PRESTIGE COMPLET
   SimplyBook — Bleu nuit, bleu royal et or
========================================================== */

@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,500&display=swap");

:root {
    --vm-night: #020712;
    --vm-night-2: #041126;
    --vm-navy: #071b42;
    --vm-blue: #0b3185;
    --vm-royal: #1459d7;
    --vm-gold: #d7ad56;
    --vm-gold-light: #f2d88d;
    --vm-white: #f8f3e8;
    --vm-muted: #d9d8d2;
    --vm-border: rgba(219, 178, 88, 0.82);
    --vm-panel: rgba(2, 10, 29, 0.94);
    --vm-shadow: 0 18px 42px rgba(0, 0, 0, 0.58);
}

/* ==========================================================
   1 — BASE GÉNÉRALE
========================================================== */

html,
body {
    background-color: var(--vm-night) !important;
    color: var(--vm-white) !important;
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 17px !important;
}

body {
    background-attachment: fixed !important;
}

#sb-main-container,
#main,
#sb_main,
#main-content,
#content-view,
#steps,
#steps-content {
    color: var(--vm-white) !important;
}

p,
label,
li,
td,
th {
    color: var(--vm-white) !important;
}

a {
    color: var(--vm-gold-light) !important;
    text-decoration: none !important;
}

/* ==========================================================
   2 — EN-TÊTE ET NAVIGATION
========================================================== */

#header {
    position: relative !important;
    min-height: 92px !important;

    background:
        radial-gradient(circle at 50% 0%, rgba(32, 87, 198, 0.18), transparent 60%),
        linear-gradient(90deg, rgba(2, 8, 24, 0.98), rgba(7, 25, 61, 0.97), rgba(2, 8, 24, 0.98)) !important;

    border-top: 1px solid rgba(215, 173, 86, 0.72) !important;
    border-bottom: 1px solid var(--vm-gold) !important;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.55),
        inset 0 0 28px rgba(31, 83, 188, 0.10) !important;
}

/* Cache l’ancien logo carré */

#header img,
#header .logo,
#header .company-logo,
#header .logo-container {
    display: none !important;
}

/* Cartouche Le Voyageur Mystique à gauche */

#header::before {
    content: "LE VOYAGEUR\A MYSTIQUE" !important;
    white-space: pre !important;

    position: absolute !important;
    left: 28px !important;
    top: 50% !important;
    z-index: 20 !important;

    transform: translateY(-50%) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 205px !important;
    min-height: 62px !important;
    padding: 9px 17px !important;

    box-sizing: border-box !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    letter-spacing: 1.6px !important;
    text-align: center !important;

    color: var(--vm-gold-light) !important;

    background:
        radial-gradient(circle at top, rgba(34, 89, 198, 0.22), transparent 65%),
        linear-gradient(145deg, rgba(2, 9, 28, 0.98), rgba(7, 26, 65, 0.97)) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 14px !important;

    box-shadow:
        0 9px 24px rgba(0, 0, 0, 0.52),
        0 0 14px rgba(215, 173, 86, 0.18),
        inset 0 0 18px rgba(34, 90, 202, 0.10) !important;

    text-shadow:
        0 0 9px rgba(215, 173, 86, 0.32),
        0 2px 5px rgba(0, 0, 0, 0.90) !important;
}

/* Laisse la place au cartouche */

#header .column,
#header .container,
#header .container-fluid {
    padding-left: 255px !important;
}

/* Liens Accueil / Commentaires / Mes réservations */

#main-buttons a,
#header a {
    font-family: "Cinzel", Georgia, serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 0.7px !important;
    text-transform: uppercase !important;

    color: var(--vm-gold-light) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;

    text-shadow:
        0 2px 7px rgba(0, 0, 0, 0.88),
        0 0 9px rgba(215, 173, 86, 0.20) !important;
}

/* Onglet actif, sans grosse pilule bleue */

#main-buttons .active,
#main-buttons a.active,
#main-buttons .btn.active {
    position: relative !important;

    color: #fff3c9 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

#main-buttons .active::after,
#main-buttons a.active::after {
    content: "" !important;

    position: absolute !important;
    left: 18% !important;
    right: 18% !important;
    bottom: -9px !important;

    height: 2px !important;

    background:
        linear-gradient(90deg, transparent, var(--vm-gold-light), transparent) !important;

    box-shadow: 0 0 10px rgba(242, 216, 141, 0.65) !important;
}

/* ==========================================================
   3 — PAGE D’ENTRÉE
========================================================== */

#main-buttons .company-name,
#main-buttons h1,
#main-buttons .title-main,
.company-name {
    display: block !important;

    width: 100% !important;
    max-width: 1050px !important;

    margin: 0 auto 26px !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: clamp(54px, 7vw, 96px) !important;
    font-weight: 500 !important;
    line-height: 0.96 !important;
    letter-spacing: 5px !important;

    text-align: center !important;
    text-transform: uppercase !important;

    color: var(--vm-gold-light) !important;

    text-shadow:
        0 2px 0 #82601f,
        0 0 14px rgba(242, 216, 141, 0.50),
        0 6px 18px rgba(0, 0, 0, 0.90) !important;
}

#main-buttons .company-name::after,
#main-buttons h1::after,
#main-buttons .title-main::after,
.company-name::after {
    content: "✦" !important;

    display: block !important;
    width: min(520px, 72%) !important;

    margin: 22px auto 0 !important;
    padding-bottom: 8px !important;

    color: var(--vm-gold-light) !important;
    font-family: Georgia, serif !important;
    font-size: 18px !important;
    line-height: 1 !important;
    text-align: center !important;

    border-bottom: 1px solid rgba(242, 216, 141, 0.68) !important;
}

#main-buttons .btn,
#main-buttons button,
#main-buttons input[type="submit"] {
    min-width: 250px !important;
    min-height: 58px !important;

    padding: 13px 34px !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    letter-spacing: 1.4px !important;
    text-transform: uppercase !important;

    color: var(--vm-gold-light) !important;

    background:
        linear-gradient(180deg, #1455d1 0%, #0a328c 52%, #041747 100%) !important;

    border: 1px solid var(--vm-gold-light) !important;
    border-radius: 35px !important;

    box-shadow:
        0 0 0 3px rgba(2, 8, 24, 0.78),
        0 8px 22px rgba(0, 0, 0, 0.48),
        0 0 18px rgba(215, 173, 86, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

/* ==========================================================
   4 — PANNEAUX D’ACCUEIL
========================================================== */

.section,
.section-pd,
section#schedule .section-pd,
section#about-us .section-pd,
section#contact-us .section-pd,
section#contacts .section-pd {
    color: var(--vm-white) !important;

    background:
        radial-gradient(circle at 50% 0%, rgba(27, 78, 184, 0.23), transparent 55%),
        linear-gradient(150deg, rgba(2, 9, 27, 0.97), rgba(6, 24, 61, 0.95)) !important;

    border: 1px solid var(--vm-border) !important;
    border-radius: 20px !important;

    box-shadow:
        var(--vm-shadow),
        0 0 18px rgba(215, 173, 86, 0.13),
        inset 0 0 26px rgba(30, 85, 199, 0.09) !important;

    overflow: hidden !important;
}

.section .title-main,
.section h2,
.section h3 {
    font-family: "Cinzel", Georgia, serif !important;
    font-weight: 600 !important;
    letter-spacing: 1.2px !important;
    text-align: center !important;
    text-transform: uppercase !important;

    color: var(--vm-gold-light) !important;
}

/* Bloc central avec décoration */

section#about-us .section-pd {
    position: relative !important;
    padding: 72px 38px 62px !important;
    text-align: center !important;
}

section#about-us .section-pd::before {
    content: "✦  ───────  ✦  ───────  ✦" !important;

    position: absolute !important;
    top: 24px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    width: 78% !important;

    font-family: Georgia, serif !important;
    font-size: 13px !important;
    letter-spacing: 4px !important;
    text-align: center !important;

    color: var(--vm-gold) !important;

    text-shadow: 0 0 10px rgba(215, 173, 86, 0.45) !important;
}

section#about-us .section-pd::after {
    content: "──────  ✦  ──────" !important;

    position: absolute !important;
    bottom: 20px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    width: 62% !important;

    font-family: Georgia, serif !important;
    font-size: 12px !important;
    letter-spacing: 3px !important;
    text-align: center !important;

    color: rgba(215, 173, 86, 0.75) !important;
}

section#about-us .title-main {
    font-size: 29px !important;
}

section#about-us .txt,
section#about-us .txt p {
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
    text-align: center !important;

    color: var(--vm-white) !important;
}

/* Décoration Horaires */

section#schedule .section-pd {
    position: relative !important;
    padding: 68px 22px 48px !important;
}

section#schedule .section-pd::before {
    content: "✦  ─────  ✦" !important;

    position: absolute !important;
    top: 22px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    color: var(--vm-gold) !important;
    font-size: 13px !important;
    letter-spacing: 3px !important;
    white-space: nowrap !important;
}

section#schedule .section-pd::after {
    content: "────  ✦  ────" !important;

    position: absolute !important;
    bottom: 16px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    color: rgba(215, 173, 86, 0.70) !important;
    font-size: 11px !important;
    white-space: nowrap !important;
}

/* Décoration Contact */

section#contact-us .section-pd,
section#contacts .section-pd,
#contact-us .section-pd,
#contacts .section-pd {
    position: relative !important;
    padding: 68px 22px 52px !important;
}

section#contact-us .section-pd::before,
section#contacts .section-pd::before,
#contact-us .section-pd::before,
#contacts .section-pd::before {
    content: "✦  ─────  ✦" !important;

    position: absolute !important;
    top: 22px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    color: var(--vm-gold) !important;
    font-size: 13px !important;
    letter-spacing: 3px !important;
    white-space: nowrap !important;
}

section#contact-us .section-pd::after,
section#contacts .section-pd::after,
#contact-us .section-pd::after,
#contacts .section-pd::after {
    content: "────  ✦  ────" !important;

    position: absolute !important;
    bottom: 18px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    color: rgba(215, 173, 86, 0.70) !important;
    font-size: 11px !important;
    white-space: nowrap !important;
}

/* Jours et horaires */

#schedule .overview tr td {
    padding: 9px 6px !important;
    border-bottom: 1px solid rgba(215, 173, 86, 0.16) !important;
}

#schedule .overview tr td.day {
    font-family: "Cinzel", Georgia, serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.7px !important;
    text-transform: uppercase !important;
    font-style: normal !important;

    color: var(--vm-gold-light) !important;
}

#schedule .overview tr td.time {
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    font-style: normal !important;

    color: var(--vm-white) !important;
}

/* ==========================================================
   5 — FRISE DE RÉSERVATION PRESTIGE
========================================================== */

#sb_booking_info .booking-info {
    position: relative !important;

    padding: 15px 30px 12px !important;

    background:
        radial-gradient(circle at 50% 0%, rgba(31, 89, 207, 0.18), transparent 60%),
        linear-gradient(90deg, rgba(2, 8, 23, 0.99), rgba(7, 27, 68, 0.98), rgba(2, 8, 23, 0.99)) !important;

    border-top: 1px solid var(--vm-gold) !important;
    border-bottom: 1px solid var(--vm-gold) !important;

    box-shadow:
        0 12px 30px rgba(0, 0, 0, 0.55),
        inset 0 0 24px rgba(31, 83, 188, 0.10) !important;
}

#sb_booking_info .booking-info ul.clearfix {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;

    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
}

#sb_booking_info .booking-info ul.clearfix::before,
#sb_booking_info .booking-info ul.clearfix::after,
#sb_booking_info .booking-info::before,
#sb_booking_info .booking-info::after {
    content: none !important;
    display: none !important;
}

/* Suppression du rectangle bleu clair à gauche */

#sb_booking_info li:empty,
#sb_booking_info .step_info_item:empty {
    display: none !important;
}

#sb_booking_info .step_info_item {
    position: relative !important;
    flex: 1 1 20% !important;

    margin: 0 !important;
    padding: 0 9px !important;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

#sb_booking_info .step_info_item > a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;

    min-height: 83px !important;
    padding: 0 !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    letter-spacing: 0.7px !important;
    text-align: center !important;
    text-transform: uppercase !important;

    color: #e9d39c !important;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Médaillons ronds sobres */

#sb_booking_info .step_info_item > a::before {
    content: "" !important;

    display: block !important;

    width: 40px !important;
    height: 40px !important;

    margin: 0 auto 10px !important;

    background:
        radial-gradient(circle, rgba(25, 72, 165, 0.92), rgba(2, 9, 28, 0.99)) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 12px rgba(215, 173, 86, 0.22),
        inset 0 0 12px rgba(38, 95, 211, 0.16) !important;
}

/* Trait doré entre les médaillons */

#sb_booking_info .step_info_item:not(:last-child)::after {
    content: "" !important;

    position: absolute !important;
    top: 20px !important;
    left: calc(50% + 29px) !important;
    right: calc(-50% + 29px) !important;

    height: 1px !important;

    background:
        linear-gradient(90deg, rgba(215, 173, 86, 0.70), rgba(215, 173, 86, 0.22)) !important;
}

/* Étape active */

#sb_booking_info .step_info_item.active {
    background: transparent !important;
    box-shadow: none !important;
}

#sb_booking_info .step_info_item.active > a {
    color: #ffffff !important;
}

#sb_booking_info .step_info_item.active > a::before {
    background:
        radial-gradient(circle, #2876ed 0%, #0c398f 55%, #020a20 100%) !important;

    border-color: #f0ce78 !important;

    box-shadow:
        0 0 0 3px rgba(2, 10, 29, 0.96),
        0 0 20px rgba(43, 111, 255, 0.60),
        0 0 14px rgba(240, 206, 120, 0.28) !important;
}

/* ==========================================================
   6 — CARTOUCHE HEURE EUROPE/PARIS
========================================================== */

#time-settings {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;
    min-height: 78px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
}

#sb_booking_company_time {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    position: relative !important;
    float: none !important;

    width: 260px !important;
    max-width: calc(100% - 40px) !important;

    margin: 13px 24px 13px auto !important;
    padding: 13px 50px 13px 18px !important;

    box-sizing: border-box !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.42 !important;
    text-align: left !important;

    color: var(--vm-white) !important;

    background:
        radial-gradient(circle at right, rgba(26, 81, 187, 0.22), transparent 50%),
        linear-gradient(145deg, rgba(2, 9, 27, 0.99), rgba(7, 27, 67, 0.98)) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 12px !important;

    box-shadow:
        0 9px 22px rgba(0, 0, 0, 0.48),
        inset 0 0 17px rgba(34, 88, 198, 0.11) !important;
}

#sb_booking_company_time::after {
    content: "☾" !important;

    position: absolute !important;
    right: 13px !important;
    top: 50% !important;

    transform: translateY(-50%) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 29px !important;
    height: 29px !important;

    font-family: Georgia, serif !important;
    font-size: 17px !important;

    color: var(--vm-gold-light) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 50% !important;
}

/* Cache seulement l’ancienne grosse icône séparée */

#time-settings .clock,
#time-settings .time-icon,
#time-settings button,
#time-settings > .btn {
    display: none !important;
}

/* ==========================================================
   7 — CARTES DES CATÉGORIES
========================================================== */

.tab.tab-col.tab-with-popup {
    position: relative !important;
    overflow: hidden !important;

    padding: 0 !important;
    margin-bottom: 26px !important;

    background: transparent !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 18px !important;

    box-shadow:
        0 16px 34px rgba(0, 0, 0, 0.55),
        0 0 16px rgba(215, 173, 86, 0.14) !important;

    transition:
        transform 0.26s ease,
        box-shadow 0.26s ease !important;
}

.tab.tab-col.tab-with-popup:hover {
    transform: translateY(-4px) !important;

    box-shadow:
        0 21px 42px rgba(0, 0, 0, 0.62),
        0 0 23px rgba(215, 173, 86, 0.22) !important;
}

.tab.tab-col.tab-with-popup .excerpt-info {
    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.tab.tab-col.tab-with-popup .preloader,
.tab.tab-col.tab-with-popup .preloader.custom-image {
    border-radius: 17px 17px 0 0 !important;
}

/* Petite bande uniquement pour le bouton */

.tab.tab-col.tab-with-popup .tab-pd {
    min-height: 0 !important;
    height: auto !important;

    margin: 0 !important;
    padding: 11px 13px 13px !important;

    background:
        linear-gradient(180deg, rgba(4, 18, 46, 0.98), rgba(2, 8, 23, 0.99)) !important;

    border-top: 1px solid rgba(215, 173, 86, 0.55) !important;
    box-shadow: none !important;
}

.tab.tab-col.tab-with-popup .content {
    min-height: 0 !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Le nom est déjà écrit sur tes images */

.tab.tab-col.tab-with-popup .cap.short {
    display: none !important;
}

/* Zone du bouton */

.tab.tab-col.tab-with-popup .btn-bar {
    display: block !important;

    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Neutralisation de tous les emballages du bouton */

.tab.tab-col.tab-with-popup .btn-bar > div,
.tab.tab-col.tab-with-popup .btn-bar > span {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Un seul véritable bouton */

.tab.tab-col.tab-with-popup .btn-bar > a,
.tab.tab-col.tab-with-popup .btn-bar a.btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 90% !important;
    min-height: 44px !important;

    margin: 0 auto !important;
    padding: 0 18px !important;

    box-sizing: border-box !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.9px !important;
    text-transform: uppercase !important;

    color: var(--vm-gold-light) !important;

    background:
        linear-gradient(180deg, #1454ce 0%, #0a3289 55%, #05194d 100%) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 27px !important;

    outline: none !important;

    box-shadow:
        0 6px 14px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

/* Supprime le faux second bouton intérieur */

.tab.tab-col.tab-with-popup .btn-bar a .btn,
.tab.tab-col.tab-with-popup .btn-bar .btn a,
.tab.tab-col.tab-with-popup .btn-bar .btn:not(a) {
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    color: inherit !important;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    outline: none !important;
    box-shadow: none !important;
}

.tab.tab-col.tab-with-popup .btn-bar *::before,
.tab.tab-col.tab-with-popup .btn-bar *::after {
    content: none !important;
    display: none !important;
}

/* ==========================================================
   8 — BOUTONS GÉNÉRAUX
========================================================== */

.btn,
button,
input[type="submit"],
input[type="button"],
a.btn {
    font-family: "Cinzel", Georgia, serif !important;
    font-weight: 600 !important;

    color: var(--vm-gold-light) !important;

    background:
        linear-gradient(180deg, #1453cc, #082b77) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 28px !important;

    box-shadow:
        0 7px 17px rgba(0, 0, 0, 0.40),
        inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;

    transition:
        transform 0.22s ease,
        filter 0.22s ease,
        box-shadow 0.22s ease !important;
}

.btn:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
a.btn:hover {
    transform: translateY(-2px) !important;
    filter: brightness(1.10) !important;

    box-shadow:
        0 10px 22px rgba(0, 0, 0, 0.48),
        0 0 17px rgba(215, 173, 86, 0.28) !important;
}

/* Bouton Retour prestige */

#sb_back_button,
a.back,
.btn.back,
.back-btn,
#sb_booking_content .back,
#sb_booking_content a[href*="back"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 138px !important;
    min-height: 42px !important;

    margin: 14px 0 18px !important;
    padding: 9px 21px !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.9px !important;
    text-transform: uppercase !important;

    color: var(--vm-gold-light) !important;

    background:
        linear-gradient(145deg, rgba(2, 12, 35, 0.99), rgba(8, 33, 79, 0.98)) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 10px !important;

    box-shadow:
        0 7px 17px rgba(0, 0, 0, 0.42),
        inset 0 0 12px rgba(37, 94, 209, 0.10) !important;
}

/* ==========================================================
   9 — CALENDRIER
========================================================== */

.datetime-step,
.datetime-step .section-pd,
.weeks-date,
.calendar,
#sb_time_slots_container,
.time-container {
    background:
        radial-gradient(circle at 50% 0%, rgba(27, 79, 183, 0.17), transparent 62%),
        linear-gradient(145deg, rgba(2, 9, 27, 0.98), rgba(5, 22, 56, 0.96)) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 17px !important;

    box-shadow:
        0 13px 32px rgba(0, 0, 0, 0.48),
        inset 0 0 22px rgba(30, 84, 196, 0.08) !important;
}

.weeks-date,
.weeks-date *,
.calendar,
.calendar * {
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-style: normal !important;
}

.weeks-date .day,
.calendar .day {
    color: var(--vm-white) !important;
    font-weight: 600 !important;
}

.weeks-date .sat,
.weeks-date .sun,
.calendar .sat,
.calendar .sun {
    color: #ef9eac !important;
}

.weeks-date .selected,
.weeks-date .active,
.calendar .selected,
.calendar .active {
    color: #ffffff !important;

    background:
        radial-gradient(circle, #2875ed, #0a348d) !important;

    border: 1px solid var(--vm-gold-light) !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 15px rgba(43, 111, 255, 0.52) !important;
}

/* Créneaux */

#sb_time_slots_container .btn,
#sb_time_slots_container a,
.time-slot,
.slot {
    font-family: "Cinzel", Georgia, serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;

    color: var(--vm-gold-light) !important;

    background:
        linear-gradient(180deg, rgba(17, 61, 151, 0.98), rgba(4, 19, 57, 0.99)) !important;

    border: 1px solid rgba(215, 173, 86, 0.78) !important;
    border-radius: 9px !important;

    box-shadow:
        0 5px 13px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.10) !important;
}

/* ==========================================================
   10 — SERVICES ET PRESTATAIRES
========================================================== */

.service-item,
.provider-item,
.booking-item,
.event-item,
.package-item {
    overflow: hidden !important;

    background:
        linear-gradient(150deg, rgba(2, 10, 29, 0.97), rgba(6, 23, 58, 0.95)) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 18px !important;

    box-shadow:
        0 15px 34px rgba(0, 0, 0, 0.52),
        0 0 15px rgba(215, 173, 86, 0.12) !important;
}

.service-item h3,
.provider-item h3,
.booking-item h3,
.service-item .title,
.provider-item .title {
    font-family: "Cinzel", Georgia, serif !important;
    color: var(--vm-gold-light) !important;
}

.price,
.service-price,
.item-price {
    color: var(--vm-gold-light) !important;
    font-family: "Cinzel", Georgia, serif !important;
    font-weight: 700 !important;
}

/* ==========================================================
   11 — FORMULAIRES ET CONFIRMATION
========================================================== */

.form-control,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
textarea,
select {
    color: #ffffff !important;

    background: rgba(2, 9, 27, 0.94) !important;

    border: 1px solid rgba(215, 173, 86, 0.68) !important;
    border-radius: 9px !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 17px !important;

    box-shadow:
        inset 0 2px 7px rgba(0, 0, 0, 0.40) !important;
}

.form-control:focus,
input:focus,
textarea:focus,
select:focus {
    border-color: var(--vm-gold-light) !important;

    box-shadow:
        0 0 0 2px rgba(215, 173, 86, 0.12),
        0 0 14px rgba(31, 87, 210, 0.24) !important;

    outline: none !important;
}

::placeholder {
    color: rgba(244, 240, 230, 0.64) !important;
}

.current-booking-info,
.booking-details,
.booking-info,
.payment-info,
.invoice {
    background:
        linear-gradient(145deg, rgba(2, 9, 27, 0.98), rgba(6, 23, 58, 0.96)) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 17px !important;

    box-shadow:
        0 13px 31px rgba(0, 0, 0, 0.46) !important;
}

/* ==========================================================
   12 — COMMENTAIRES
========================================================== */

.review-item,
.comment-item,
.feedback-item,
.reviews-list .item,
.modal-content {
    color: var(--vm-white) !important;

    background:
        linear-gradient(145deg, rgba(2, 9, 27, 0.98), rgba(6, 23, 58, 0.96)) !important;

    border: 1px solid var(--vm-gold) !important;
    border-radius: 17px !important;

    box-shadow:
        0 13px 31px rgba(0, 0, 0, 0.48) !important;
}

.rating,
.rating span,
.stars,
.star {
    color: #ffd65b !important;
}

/* ==========================================================
   13 — BARRE DE DÉFILEMENT
========================================================== */

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: var(--vm-night);
}

::-webkit-scrollbar-thumb {
    background:
        linear-gradient(180deg, var(--vm-gold-light), #77561b);

    border: 2px solid var(--vm-night);
    border-radius: 10px;
}

/* ==========================================================
   14 — MOBILE
========================================================== */

@media (max-width: 768px) {

    #header {
        min-height: 150px !important;
    }

    #header::before {
        position: relative !important;
        left: auto !important;
        top: auto !important;

        transform: none !important;

        width: calc(100% - 30px) !important;
        max-width: 330px !important;

        margin: 12px auto 6px !important;

        font-size: 13px !important;
    }

    #header .column,
    #header .container,
    #header .container-fluid {
        padding-left: 15px !important;
    }

    #main-buttons .company-name,
    #main-buttons h1,
    #main-buttons .title-main,
    .company-name {
        font-size: 42px !important;
        line-height: 1 !important;
        letter-spacing: 2px !important;
    }

    section#about-us .section-pd {
        padding: 66px 18px 54px !important;
    }

    #sb_booking_info .booking-info {
        padding: 10px 3px !important;
    }

    #sb_booking_info .step_info_item {
        padding: 0 2px !important;
    }

    #sb_booking_info .step_info_item > a {
        min-height: 65px !important;
        font-size: 7px !important;
        letter-spacing: 0 !important;
    }

    #sb_booking_info .step_info_item > a::before {
        width: 29px !important;
        height: 29px !important;
        margin-bottom: 6px !important;
    }

    #sb_booking_info .step_info_item::after {
        display: none !important;
    }

    #sb_booking_company_time {
        width: calc(100% - 30px) !important;
        max-width: none !important;
        margin: 10px auto !important;
    }

    .tab.tab-col.tab-with-popup {
        border-radius: 15px !important;
    }
}/* ==========================================================
   CORRECTIONS FINALES — LE VOYAGEUR MYSTIQUE
   À COLLER TOUT EN BAS DU CSS ACTUEL
========================================================== */


/* ==========================================================
   1 — ACCUEIL : ENLEVER LES ZONES NOIRES SOUS LES 3 CADRES
========================================================== */

/* Les cadres extérieurs ne doivent plus créer de fond noir */
#schedule,
#about-us,
#contact-us,
#contacts {
    display: flex !important;
    align-items: stretch !important;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Le panneau bleu remplit toute la hauteur du cadre */
#schedule > .section-pd,
#about-us > .section-pd,
#contact-us > .section-pd,
#contacts > .section-pd {
    flex: 1 1 auto !important;

    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;

    margin: 0 !important;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(34, 92, 214, 0.27),
            transparent 56%
        ),
        linear-gradient(
            155deg,
            rgba(4, 19, 58, 0.99),
            rgba(8, 48, 145, 0.96),
            rgba(3, 17, 52, 0.99)
        ) !important;
}

/* Même hauteur visuelle pour les trois colonnes */
#schedule .section-pd,
#about-us .section-pd,
#contact-us .section-pd,
#contacts .section-pd {
    box-sizing: border-box !important;
}


/* ==========================================================
   2 — HORAIRES D’OUVERTURE : CHIFFRES PLUS ÉLÉGANTS
========================================================== */

#schedule .overview td.time,
#schedule .overview td.time *,
#schedule .overview tr td:last-child {
    font-family:
        "Cormorant Garamond",
        Georgia,
        serif !important;

    font-size: 15px !important;
    font-weight: 600 !important;
    font-style: normal !important;
    letter-spacing: 0.2px !important;

    color: #fff5d8 !important;

    text-shadow:
        0 1px 4px rgba(0, 0, 0, 0.75) !important;
}

/* Jours sobres et prestigieux */
#schedule .overview td.day {
    font-family:
        "Cinzel",
        Georgia,
        serif !important;

    font-size: 12px !important;
    font-weight: 600 !important;
    font-style: normal !important;
    letter-spacing: 0.7px !important;

    color: #f0d382 !important;
}


/* ==========================================================
   3 — FRISE : BELLE ÉTOILE DANS CHAQUE ROND
========================================================== */

#sb_booking_info .step_info_item > a::before {
    content: "✦" !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    font-family: Georgia, serif !important;
    font-size: 17px !important;
    font-weight: normal !important;

    color: #f2d278 !important;

    background:
        radial-gradient(
            circle at 40% 35%,
            #246be0 0%,
            #0c398e 42%,
            #03102f 78%
        ) !important;

    border:
        1px solid
        #e2bb62 !important;

    box-shadow:
        0 0 0 3px rgba(2, 9, 28, 0.92),
        0 0 16px rgba(44, 111, 255, 0.48),
        inset 0 0 11px rgba(255, 255, 255, 0.12) !important;

    text-shadow:
        0 0 8px rgba(242, 210, 120, 0.70) !important;
}

/* Cercle actif plus lumineux */
#sb_booking_info .step_info_item.active > a::before {
    color: #fff2bc !important;

    background:
        radial-gradient(
            circle at 40% 35%,
            #438cff 0%,
            #1451c5 45%,
            #04143c 80%
        ) !important;

    border-color: #f2d278 !important;

    box-shadow:
        0 0 0 3px rgba(2, 9, 28, 0.95),
        0 0 22px rgba(46, 119, 255, 0.78),
        0 0 13px rgba(242, 210, 120, 0.42) !important;
}


/* ==========================================================
   4 — POLICE CATÉGORIE / SERVICE / PRESTATAIRE / HEURE
========================================================== */

#sb_booking_info .step_info_item > a,
#sb_booking_info .step_info_item > a span,
#steps-nav li a,
#steps-nav li a span {
    font-family:
        "Cinzel",
        Georgia,
        serif !important;

    font-size: 11px !important;
    font-weight: 600 !important;
    font-style: normal !important;
    line-height: 1.3 !important;
    letter-spacing: 0.8px !important;

    text-transform: uppercase !important;
    text-align: center !important;

    color: #f0d897 !important;

    text-shadow:
        0 2px 5px rgba(0, 0, 0, 0.82) !important;
}

/* Texte secondaire affiché sous l’étape */
#sb_booking_info .step_info_item > a small,
#sb_booking_info .step_info_item > a .title-small {
    font-family:
        "Cormorant Garamond",
        Georgia,
        serif !important;

    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.15px !important;
    text-transform: none !important;

    color: #ffffff !important;
}


/* ==========================================================
   5 — CARTES CATÉGORIES : SUPPRIMER LE NOIR SOUS LE BOUTON
========================================================== */

#sb_category_step_container .tab.tab-col.tab-with-popup,
.categories-list .tab.tab-col.tab-with-popup,
.category-item {
    background:
        linear-gradient(
            180deg,
            rgba(5, 26, 74, 0.98),
            rgba(3, 16, 48, 0.99)
        ) !important;
}

/* Tous les emballages sous l’image ont le même bleu nuit */
#sb_category_step_container .tab.tab-col.tab-with-popup .excerpt-info,
#sb_category_step_container .tab.tab-col.tab-with-popup .tab-pd,
#sb_category_step_container .tab.tab-col.tab-with-popup .content,
#sb_category_step_container .tab.tab-col.tab-with-popup .btn-bar,
.categories-list .tab .excerpt-info,
.categories-list .tab .tab-pd,
.categories-list .tab .content,
.categories-list .tab .btn-bar {
    min-height: 0 !important;
    height: auto !important;

    margin: 0 !important;

    background:
        linear-gradient(
            180deg,
            rgba(7, 35, 100, 0.98),
            rgba(3, 17, 51, 0.99)
        ) !important;

    border: none !important;
    box-shadow: none !important;
}

/* Bande beaucoup plus fine sous les images */
#sb_category_step_container .tab.tab-col.tab-with-popup .tab-pd,
.categories-list .tab.tab-col.tab-with-popup .tab-pd {
    padding: 9px 12px 11px !important;

    border-top:
        1px solid
        rgba(224, 184, 95, 0.72) !important;
}

/* Supprime les fonds ou bandes ajoutés après la carte */
#sb_category_step_container .tab.tab-col.tab-with-popup::after,
#sb_category_step_container .tab.tab-col.tab-with-popup .content::after,
#sb_category_step_container .tab.tab-col.tab-with-popup .btn-bar::after {
    content: none !important;
    display: none !important;
}

/* Un seul bouton compact */
#sb_category_step_container .btn-bar a,
.categories-list .btn-bar a {
    width: 92% !important;
    min-height: 42px !important;

    margin: 0 auto !important;

    background:
        linear-gradient(
            180deg,
            #175ce0 0%,
            #0b3da8 54%,
            #061e61 100%
        ) !important;

    border:
        1px solid
        #e2bb62 !important;

    border-radius: 25px !important;

    box-shadow:
        0 5px 13px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

/* Aucun espace noir sous le bouton */
#sb_category_step_container .tab.tab-col.tab-with-popup .btn-bar {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}


/* ==========================================================
   6 — CORRIGER LE CARTOUCHE NOTRE HEURE / VOTRE HEURE
========================================================== */

/* Le grand contour vide est totalement supprimé */
#time-settings {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;

    margin: 0 !important;
    padding: 10px 24px !important;

    box-sizing: border-box !important;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

#time-settings::before,
#time-settings::after {
    content: none !important;
    display: none !important;
}

/* Petit cartouche unique et propre */
#sb_booking_company_time {
    display: block !important;
    position: relative !important;
    float: none !important;

    width: 245px !important;
    max-width: calc(100% - 20px) !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 11px 45px 11px 16px !important;

    box-sizing: border-box !important;

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif !important;

    font-size: 13px !important;
    font-weight: 600 !important;
    font-style: normal !important;
    line-height: 1.32 !important;
    letter-spacing: 0.15px !important;

    color: #fff4d6 !important;
    text-align: left !important;

    background:
        radial-gradient(
            circle at right center,
            rgba(39, 96, 215, 0.23),
            transparent 52%
        ),
        linear-gradient(
            145deg,
            rgba(3, 13, 39, 0.99),
            rgba(7, 34, 91, 0.98)
        ) !important;

    border:
        1px solid
        #dfb75e !important;

    border-radius: 12px !important;

    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.48),
        inset 0 0 15px rgba(49, 105, 220, 0.10) !important;
}

/* Petite lune propre intégrée au cartouche */
#sb_booking_company_time::after {
    content: "☾" !important;

    position: absolute !important;
    top: 50% !important;
    right: 10px !important;

    transform: translateY(-50%) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 27px !important;
    height: 27px !important;

    font-family: Georgia, serif !important;
    font-size: 16px !important;

    color: #f1ce78 !important;

    background: rgba(4, 18, 54, 0.78) !important;

    border:
        1px solid
        #dfb75e !important;

    border-radius: 50% !important;

    box-shadow:
        0 0 9px rgba(223, 183, 94, 0.25) !important;
}

/* Cache l’ancienne horloge indépendante */
#time-settings > .clock,
#time-settings > .time-icon,
#time-settings > button,
#time-settings > a.btn,
#time-settings .clock-button {
    display: none !important;
}


/* ==========================================================
   7 — ENLEVER LA CARTE DU PRESTATAIRE SOUS LA PRESTATION
   SUR LA PAGE DES HORAIRES
========================================================== */

#sb_timeview_container .tab-provider-col,
#sb_timeview_container .provider-item,
#sb_timeview_container .provider,
#sb_dateview_container .tab-provider-col,
.datetime-step .tab-provider-col,
.datetime-step .provider-item {
    display: none !important;
}

/* Le bloc de la prestation reste seul à gauche */
#sb_timeview_container .tab-service-col,
#sb_dateview_container .tab-service-col,
.datetime-step .tab-service-col {
    margin-bottom: 0 !important;
}


/* ==========================================================
   8 — PETITES CORRECTIONS RESPONSIVES
========================================================== */

@media (max-width: 768px) {

    #time-settings {
        justify-content: center !important;
        padding: 8px 10px !important;
    }

    #sb_booking_company_time {
        width: calc(100% - 10px) !important;
        max-width: 320px !important;
    }

    #sb_booking_info .step_info_item > a {
        font-size: 7px !important;
        letter-spacing: 0 !important;
    }

    #sb_booking_info .step_info_item > a::before {
        width: 30px !important;
        height: 30px !important;
        font-size: 12px !important;
    }
}/* ==========================================================
   CORRECTIONS FINALES — PAGES INTÉRIEURES UNIQUEMENT
   NE MODIFIE PAS LA PAGE D’ACCUEIL
========================================================== */


/* ==========================================================
   1 — FRISE CATÉGORIE / SERVICE / PRESTATAIRE / HEURE / CLIENT
========================================================== */

#sb_booking_info .booking-info {
    padding: 12px 24px 10px !important;

    background:
        radial-gradient(circle at 50% 0%,
        rgba(32, 91, 210, 0.24),
        transparent 60%),
        linear-gradient(90deg,
        #030b21 0%,
        #08235c 48%,
        #030b21 100%) !important;

    border-top: 1px solid #d9b45b !important;
    border-bottom: 1px solid #d9b45b !important;
    border-radius: 0 0 18px 18px !important;

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.45),
        inset 0 0 25px rgba(25, 81, 198, 0.12) !important;
}

/* Supprime le rectangle bleu clair à gauche */

#sb_booking_info .booking-info::before,
#sb_booking_info .booking-info::after,
#sb_booking_info ul::before,
#sb_booking_info ul::after,
#sb_booking_info li:empty {
    content: none !important;
    display: none !important;
}

#sb_booking_info .booking-info ul {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;

    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
}

/* Chaque étape */

#sb_booking_info .step_info_item {
    flex: 1 1 20% !important;

    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 7px !important;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

#sb_booking_info .step_info_item > a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;

    min-height: 78px !important;
    padding: 0 !important;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    letter-spacing: 0.7px !important;

    text-align: center !important;
    text-transform: uppercase !important;

    color: #f0d58e !important;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.85) !important;

    overflow: visible !important;
}

/* Étoile premium dans les ronds */

#sb_booking_info .step_info_item > a::before {
    content: "✦" !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 38px !important;
    height: 38px !important;

    margin: 0 auto 8px !important;

    font-family: Georgia, serif !important;
    font-size: 16px !important;

    color: #f6dc91 !important;

    background:
        radial-gradient(circle at 35% 30%,
        #2d77f0 0%,
        #1248af 42%,
        #03102f 80%) !important;

    border: 1px solid #e1bc65 !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 0 3px rgba(2, 9, 27, 0.95),
        0 0 16px rgba(45, 112, 255, 0.55),
        inset 0 0 10px rgba(255, 255, 255, 0.13) !important;
}

/* Valeur sélectionnée sous le titre : visible et non coupée */

#sb_booking_info .step_info_item small,
#sb_booking_info .step_info_item .title-small,
#sb_booking_info .step_info_item .step-title,
#sb_booking_info .step_info_item span {
    display: block !important;

    width: 100% !important;
    max-width: 190px !important;

    margin-top: 3px !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;

    text-transform: none !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;

    color: #ffffff !important;
}


/* ==========================================================
   2 — CARTES DES CATÉGORIES : PLUS AUCUN NOIR SOUS LE BOUTON
========================================================== */

#sb_category_step_container .tab.tab-col.tab-with-popup,
#sb_category_step_container .category-item,
.categories-list .tab.tab-col.tab-with-popup {
    padding: 0 !important;
    overflow: hidden !important;

    background: #061c4c !important;

    border: 1px solid #deb95f !important;
    border-radius: 18px !important;

    box-shadow:
        0 15px 32px rgba(0, 0, 0, 0.52),
        0 0 16px rgba(222, 185, 95, 0.13) !important;
}

/* Tous les éléments sous l’image prennent exactement le même bleu */

#sb_category_step_container .excerpt-info,
#sb_category_step_container .tab-pd,
#sb_category_step_container .content,
#sb_category_step_container .btn-bar,
#sb_category_step_container .btn-bar > div,
#sb_category_step_container .btn-bar > span,
.categories-list .excerpt-info,
.categories-list .tab-pd,
.categories-list .content,
.categories-list .btn-bar {
    min-height: 0 !important;
    height: auto !important;

    margin: 0 !important;

    background:
        linear-gradient(180deg,
        #0b3186 0%,
        #061c4c 100%) !important;

    border: none !important;
    box-shadow: none !important;
}

/* Une bande très fine pour le bouton */

#sb_category_step_container .tab-pd,
.categories-list .tab-pd {
    padding: 10px 12px 12px !important;

    border-top: 1px solid rgba(222, 185, 95, 0.72) !important;
}

/* Aucun espace après le bouton */

#sb_category_step_container .btn-bar,
#sb_category_step_container .content,
#sb_category_step_container .tab-pd {
    padding-bottom: 10px !important;
    margin-bottom: 0 !important;
}

#sb_category_step_container .tab::after,
#sb_category_step_container .content::after,
#sb_category_step_container .btn-bar::after {
    content: none !important;
    display: none !important;
}


/* ==========================================================
   3 — PAGE SERVICES : DESCRIPTION COMPLÈTE
========================================================== */

/* Cartes services bleu nuit et or */

#sb_service_step_container .tab,
#sb_service_step_container .service-item,
#sb_service_step_container .tab.tab-col {
    overflow: hidden !important;

    background:
        linear-gradient(155deg,
        #08296e 0%,
        #04163e 100%) !important;

    border: 1px solid #deb95f !important;
    border-radius: 18px !important;

    box-shadow:
        0 15px 32px rgba(0, 0, 0, 0.50),
        0 0 15px rgba(222, 185, 95, 0.13) !important;
}

/* Affiche toute la description */

#sb_service_step_container .description,
#sb_service_step_container .txt,
#sb_service_step_container .excerpt,
#sb_service_step_container .service-description,
#sb_service_step_container .excerpt-info {
    display: block !important;

    max-height: none !important;
    height: auto !important;

    overflow: visible !important;
    white-space: normal !important;
    text-overflow: initial !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;

    color: #fff8e8 !important;
}

/* Cache Afficher plus */

#sb_service_step_container .read-more,
#sb_service_step_container .show-more,
#sb_service_step_container a[href*="more"],
#sb_service_step_container .more,
#sb_service_step_container .btn-more {
    display: none !important;
}

/* Le mot Sélectionner devient un vrai bouton */

#sb_service_step_container .btn-bar {
    padding: 12px !important;

    background:
        linear-gradient(180deg,
        #0b3186,
        #061b4a) !important;

    border-top: 1px solid rgba(222, 185, 95, 0.72) !important;
}

#sb_service_step_container .btn-bar a,
#sb_service_step_container a.btn.select,
#sb_service_step_container .btn.select {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 88% !important;
    min-height: 43px !important;

    margin: 0 auto !important;
    padding: 8px 18px !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;

    color: #f5dda0 !important;

    background:
        linear-gradient(180deg,
        #1760e5 0%,
        #0b3ba4 55%,
        #051c59 100%) !important;

    border: 1px solid #e1bd66 !important;
    border-radius: 25px !important;

    box-shadow:
        0 6px 15px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.20) !important;
}


/* ==========================================================
   4 — NOTRE HEURE / VOTRE HEURE : TEXTE DORÉ SEUL À DROITE
========================================================== */

#time-settings {
    display: block !important;

    min-height: 42px !important;
    height: auto !important;

    margin: 0 !important;
    padding: 8px 28px 8px !important;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    text-align: right !important;
}

#sb_booking_company_time {
    display: inline-block !important;
    position: relative !important;
    float: none !important;

    width: auto !important;
    max-width: none !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: 0.2px !important;

    color: #f0cf7c !important;
    text-align: right !important;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    text-shadow:
        0 2px 5px rgba(0, 0, 0, 0.92),
        0 0 8px rgba(240, 207, 124, 0.20) !important;
}

/* Enlève lune, horloge et encadrements */

#sb_booking_company_time::before,
#sb_booking_company_time::after,
#time-settings::before,
#time-settings::after,
#time-settings .clock,
#time-settings .time-icon,
#time-settings button,
#time-settings a.btn {
    content: none !important;
    display: none !important;
}


/* ==========================================================
   5 — PLANNING : CHIFFRES PLUS LISIBLES
========================================================== */

.weeks-date,
.weeks-date *,
.calendar,
.calendar *,
.datetime-step .calendar,
.datetime-step .calendar * {
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-style: normal !important;
}

/* Jours de la semaine */

.weeks-date .day,
.calendar .day,
.datetime-step .day {
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px !important;

    color: #fff5d9 !important;

    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.86) !important;
}

/* Chiffres des dates */

.weeks-date .date,
.weeks-date a,
.calendar .date,
.calendar a,
.datetime-step .weeks-date a {
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;

    color: #ffffff !important;

    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.88) !important;
}

/* Samedi et dimanche */

.weeks-date .sat,
.weeks-date .sun,
.calendar .sat,
.calendar .sun {
    color: #f3a1ae !important;
}

/* Date sélectionnée */

.weeks-date .selected,
.weeks-date .active,
.calendar .selected,
.calendar .active {
    color: #ffffff !important;

    background:
        radial-gradient(circle,
        #2f7cf7,
        #0d3c9a) !important;

    border: 1px solid #f1d182 !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 15px rgba(47, 124, 247, 0.60) !important;
}


/* ==========================================================
   6 — PAGE COMMENTAIRES : PETITES CARTES BLEUES
========================================================== */

/* Le fond général devient bleu nuit */

#reviews,
#reviews-view,
#sb_reviews_container,
.reviews-container,
.reviews-list {
    background:
        radial-gradient(circle at 50% 0%,
        rgba(28, 81, 190, 0.20),
        transparent 60%),
        linear-gradient(150deg,
        rgba(4, 19, 56, 0.97),
        rgba(2, 10, 31, 0.98)) !important;

    border: 1px solid rgba(218, 180, 91, 0.65) !important;
    border-radius: 18px !important;

    box-shadow:
        0 14px 32px rgba(0, 0, 0, 0.48) !important;
}

/* Liste des avis sous forme de grille */

.reviews-list,
#sb_reviews_container .reviews-list,
#reviews .reviews-list {
    display: grid !important;

    grid-template-columns:
        repeat(auto-fit, minmax(260px, 1fr)) !important;

    align-items: start !important;
    gap: 16px !important;

    padding: 18px !important;
}

/* Chaque commentaire devient un petit rectangle */

.review-item,
.comment-item,
.feedback-item,
.reviews-list .item,
#sb_reviews_container .item {
    display: block !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;

    margin: 0 !important;
    padding: 18px !important;

    color: #fff8e8 !important;

    background:
        radial-gradient(circle at 20% 0%,
        rgba(37, 94, 215, 0.22),
        transparent 55%),
        linear-gradient(145deg,
        #0a3285 0%,
        #061b4a 100%) !important;

    border: 1px solid #dcb860 !important;
    border-radius: 15px !important;

    box-shadow:
        0 10px 22px rgba(0, 0, 0, 0.38),
        inset 0 0 16px rgba(39, 93, 209, 0.08) !important;

    overflow: visible !important;
}

/* Texte des commentaires */

.review-item *,
.comment-item *,
.feedback-item *,
.reviews-list .item * {
    font-family: "Cormorant Garamond", Georgia, serif !important;
}

.review-item .title,
.comment-item .title,
.feedback-item .title,
.reviews-list .item h3 {
    font-family: "Cinzel", Georgia, serif !important;
    font-size: 15px !important;
    line-height: 1.25 !important;

    color: #f2d68e !important;
}

.review-item p,
.comment-item p,
.feedback-item p,
.reviews-list .item p {
    font-size: 15px !important;
    line-height: 1.35 !important;

    color: #fff8e8 !important;
}

/* Étoiles */

.review-item .stars,
.comment-item .stars,
.feedback-item .stars,
.rating,
.rating span {
    color: #ffd65b !important;
}

/* Formulaire pour laisser un commentaire plus petit */

#reviews .form,
#reviews .review-form,
#sb_reviews_container .review-form,
.review-form-container {
    width: 100% !important;
    max-width: 520px !important;

    margin: 18px auto !important;
    padding: 22px !important;

    background:
        linear-gradient(145deg,
        #092c75,
        #051943) !important;

    border: 1px solid #dcb860 !important;
    border-radius: 16px !important;

    box-shadow:
        0 11px 25px rgba(0, 0, 0, 0.42) !important;
}


/* ==========================================================
   7 — MOBILE
========================================================== */

@media (max-width: 768px) {

    #sb_booking_info .step_info_item > a {
        font-size: 8px !important;
        letter-spacing: 0 !important;
    }

    #sb_booking_info .step_info_item > a::before {
        width: 29px !important;
        height: 29px !important;
        font-size: 12px !important;
    }

    #sb_booking_info .step_info_item small,
    #sb_booking_info .step_info_item span {
        font-size: 8px !important;
    }

    #time-settings {
        padding-right: 12px !important;
    }

    #sb_booking_company_time {
        font-size: 13px !important;
    }

    .reviews-list,
    #sb_reviews_container .reviews-list {
        grid-template-columns: 1fr !important;
    }
}/* ==========================================================
   CORRECTIF SÛR — HEURE + MENU MOBILE
========================================================== */

/* Supprimer totalement Notre heure / Votre heure et l’horloge */
#time-settings,
#sb_booking_company_time,
#sb_booking_company_time *,
#time-settings *,
.time-settings,
.company-time,
.timezone-info {
    display: none !important;
}

/* Supprimer l’espace laissé vide par le bloc de l’heure */
#steps-content #time-settings,
#sb-timeline #time-settings,
#sb_booking_header #time-settings {
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* VERSION TÉLÉPHONE UNIQUEMENT */
@media only screen and (max-width: 768px) {

    /* En-tête mobile */
    #header,
    header,
    .navbar,
    .sb-header {
        position: relative !important;
    }

    /* Bouton rond avec les trois traits : placé proprement à droite */
    .navbar-toggle,
    .menu-toggle,
    .mobile-menu-toggle,
    .sb-mobile-menu,
    #sb_menu_toggle,
    button.navbar-toggle {
        position: absolute !important;
        top: 50% !important;
        right: 18px !important;
        left: auto !important;

        transform: translateY(-50%) !important;

        width: 48px !important;
        height: 48px !important;
        margin: 0 !important;
        padding: 0 !important;

        border: 1px solid #dfbb64 !important;
        border-radius: 50% !important;

        background:
            linear-gradient(
                180deg,
                #1763e8 0%,
                #0a3ca4 55%,
                #061d5c 100%
            ) !important;

        box-shadow:
            0 6px 16px rgba(0, 0, 0, 0.38),
            inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;

        z-index: 9999 !important;
    }

    /* Traits du menu */
    .navbar-toggle .icon-bar,
    .menu-toggle span,
    .mobile-menu-toggle span {
        display: block !important;

        width: 23px !important;
        height: 2px !important;

        margin: 4px auto !important;

        background: #f4d98e !important;
        border-radius: 2px !important;
    }

    /* Laisse de la place au bouton à droite */
    #header .container,
    header .container,
    .navbar .container {
        position: relative !important;
        padding-right: 78px !important;
    }

    /* Les cartes restent entières sur mobile */
    #sb_category_step_container .tab,
    #sb_category_step_container .category-item,
    .categories-list .tab {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
    }
}/* ==========================================================
   BOUTON RETOUR — VERSION CORRIGÉE SANS DOUBLON
========================================================== */

/* Style général du bouton */
#steps-content .btn.back,
#steps-content a.btn.back,
#steps-content .back-button,
#steps-content .back,
#sb_back_button,
#sb_back_button a,
#sb_booking_content .btn.back,
#sb_booking_content a.btn.back {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 140px !important;
    min-height: 44px !important;
    padding: 9px 22px !important;

    color: #f6dc91 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0.7px !important;
    text-transform: uppercase !important;
    text-indent: 0 !important;

    background:
        linear-gradient(
            180deg,
            #1764ed 0%,
            #0a3fae 55%,
            #061e61 100%
        ) !important;

    border: 1px solid #e1bd67 !important;
    border-radius: 25px !important;

    box-shadow:
        0 6px 15px rgba(0, 0, 0, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.20) !important;

    opacity: 1 !important;
    visibility: visible !important;
}

/* Rend visible le vrai texte SimplyBook */
#steps-content .btn.back *,
#steps-content .back-button *,
#steps-content .back *,
#sb_back_button *,
#sb_booking_content .btn.back * {
    display: inline !important;
    color: #f6dc91 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-indent: 0 !important;
}

/* Interdit tout ajout artificiel de RETOUR */
#steps-content .btn.back::before,
#steps-content .btn.back::after,
#steps-content .back-button::before,
#steps-content .back-button::after,
#steps-content .back::before,
#steps-content .back::after,
#sb_back_button::before,
#sb_back_button::after,
#sb_back_button a::before,
#sb_back_button a::after,
#sb_booking_content .btn.back::before,
#sb_booking_content .btn.back::after {
    content: none !important;
    display: none !important;
}

/* Flèche propre uniquement quand SimplyBook en possède déjà une */
#steps-content .btn.back i,
#steps-content .back-button i,
#sb_back_button i,
#sb_booking_content .btn.back i {
    display: inline-block !important;
    margin-right: 7px !important;
    color: #f6dc91 !important;
}/* ==========================================================
   FRISE ÉTAPES — CIBLAGE EXACT SIMPLYBOOK
========================================================== */

#sb_booking_info .booking-info ul,
#sb_booking_info ul.clearfix,
#steps-nav {
    position: relative !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-around !important;

    width: 100% !important;
    padding: 22px 35px 18px !important;
    margin: 0 !important;

    background:
        radial-gradient(circle at 50% 0%, rgba(29, 91, 220, .35), transparent 65%),
        linear-gradient(90deg, #06102d 0%, #0a3ba2 50%, #06102d 100%) !important;

    border-top: 1px solid #ddb85f !important;
    border-bottom: 1px solid #ddb85f !important;
    box-shadow:
        inset 0 0 30px rgba(33, 91, 215, .22),
        0 10px 25px rgba(0, 0, 0, .35) !important;

    overflow: visible !important;
}

/* Les 5 étapes */
#sb_booking_info .step_info_item,
#steps-nav li {
    position: relative !important;
    flex: 1 1 20% !important;

    padding: 0 12px !important;
    margin: 0 !important;

    text-align: center !important;
    background: transparent !important;
    border: none !important;
    overflow: visible !important;
}

/* Lien de chaque étape */
#sb_booking_info .step_info_item > a,
#steps-nav li > a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;

    min-height: 118px !important;
    padding: 0 !important;

    color: #f2d487 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
    overflow: visible !important;
}

/* Grand cercle */
#sb_booking_info .step_info_item > a::before,
#steps-nav li > a::before {
    content: "✦" !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 76px !important;
    height: 76px !important;
    margin: 0 auto 12px !important;

    font-family: Georgia, serif !important;
    font-size: 33px !important;
    line-height: 1 !important;
    color: #ffdc78 !important;

    background:
        radial-gradient(circle at 35% 28%, #3f91ff 0%, #1455ce 42%, #04163f 82%) !important;

    border: 2px solid #e3bd63 !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 0 5px rgba(3, 12, 39, .96),
        0 0 18px rgba(58, 123, 255, .75),
        0 0 12px rgba(226, 187, 99, .35),
        inset 0 0 16px rgba(255, 255, 255, .15) !important;

    text-shadow:
        0 0 8px #fff1b5,
        0 0 18px rgba(255, 209, 91, .85) !important;
}

/* Titres */
#sb_booking_info .step_info_item > a,
#steps-nav li > a {
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: .7px !important;
    text-transform: uppercase !important;

    color: #f4d98f !important;
    text-shadow:
        0 2px 4px rgba(0, 0, 0, .9),
        0 0 7px rgba(238, 203, 119, .24) !important;
}

/* Texte choisi sous le titre */
#sb_booking_info .step_info_item small,
#sb_booking_info .step_info_item span,
#steps-nav li small,
#steps-nav li span {
    display: block !important;
    max-width: 200px !important;
    margin-top: 5px !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
    white-space: normal !important;

    color: #ffffff !important;
}

/* Trait doré entre chaque cercle */
#sb_booking_info .step_info_item:not(:last-child)::after,
#steps-nav li:not(:last-child)::after {
    content: "" !important;

    position: absolute !important;
    top: 38px !important;
    right: -34% !important;

    width: 68% !important;
    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            #cda44c 15%,
            #fff0a8 50%,
            #cda44c 85%,
            transparent 100%
        ) !important;

    box-shadow:
        0 0 7px rgba(226, 187, 99, .65) !important;

    z-index: 0 !important;
}

/* Petit diamant au milieu du trait */
#sb_booking_info .step_info_item:not(:last-child)::before,
#steps-nav li:not(:last-child)::before {
    content: "✦" !important;

    position: absolute !important;
    top: 29px !important;
    right: -5px !important;

    font-family: Georgia, serif !important;
    font-size: 15px !important;
    color: #ffdd7b !important;

    text-shadow:
        0 0 8px rgba(255, 221, 123, .8) !important;

    z-index: 3 !important;
}

/* Supprime les anciennes flèches et anciens dessins */
#sb_booking_info .step_info_item > a > i,
#sb_booking_info .step_info_item > a > svg,
#steps-nav li > a > i,
#steps-nav li > a > svg {
    display: none !important;
}

/* Étape active */
#sb_booking_info .step_info_item.active > a::before,
#steps-nav li.active > a::before {
    background:
        radial-gradient(circle at 35% 28%, #67a7ff 0%, #1b67ef 45%, #052061 85%) !important;

    box-shadow:
        0 0 0 5px rgba(3, 12, 39, .96),
        0 0 24px rgba(60, 135, 255, 1),
        0 0 16px rgba(255, 216, 107, .55),
        inset 0 0 18px rgba(255, 255, 255, .2) !important;
}

/* VERSION TÉLÉPHONE */
@media only screen and (max-width: 768px) {

    #sb_booking_info .booking-info ul,
    #sb_booking_info ul.clearfix,
    #steps-nav {
        padding: 14px 5px 12px !important;
    }

    #sb_booking_info .step_info_item,
    #steps-nav li {
        padding: 0 3px !important;
    }

    #sb_booking_info .step_info_item > a::before,
    #steps-nav li > a::before {
        width: 42px !important;
        height: 42px !important;
        margin-bottom: 7px !important;

        font-size: 20px !important;
        border-width: 1px !important;

        box-shadow:
            0 0 0 3px rgba(3, 12, 39, .96),
            0 0 12px rgba(58, 123, 255, .72) !important;
    }

    #sb_booking_info .step_info_item > a,
    #steps-nav li > a {
        min-height: 72px !important;

        font-size: 9px !important;
        letter-spacing: 0 !important;
    }

    #sb_booking_info .step_info_item small,
    #sb_booking_info .step_info_item span,
    #steps-nav li small,
    #steps-nav li span {
        display: none !important;
    }

    #sb_booking_info .step_info_item:not(:last-child)::after,
    #steps-nav li:not(:last-child)::after {
        top: 21px !important;
        right: -28% !important;
        width: 56% !important;
        height: 1px !important;
    }

    #sb_booking_info .step_info_item:not(:last-child)::before,
    #steps-nav li:not(:last-child)::before {
        display: none !important;
    }
}/* ===== ESPACE ENTRE LE BANDEAU ET LES CARTES ===== */

#sb_booking_content,
#sb_services,
.sb-service-items,
#service_categories,
.category-items{
    margin-top:45px !important;
}

/* ===== GROS TITRES ===== */

#sb_booking_info .step_info_item>a,
#steps-nav li>a{
    font-size:23px !important;
    font-weight:700 !important;
    letter-spacing:1px !important;
    line-height:1.25 !important;
    padding-top:10px !important;
}

/* ===== PLUS D'ESPACE SOUS LES RONDS ===== */

#sb_booking_info .step_info_item>a::before,
#steps-nav li>a::before{
    margin-bottom:18px !important;
}/* ============================
   ESPACE ENTRE LE BANDEAU ET LES CARTES
============================ */

#sb_booking_content,
#sb_services_list,
.sb-service-items,
.category-items,
.service-items{
    margin-top:60px !important;
    padding-top:20px !important;
}


/* ============================
   BOUTON RETOUR
============================ */

.back-button,
.btn-back,
.sb-back-button,
.sb-return-btn{

    margin-top:30px !important;
    margin-bottom:35px !important;

    position:relative !important;
    z-index:50 !important;
}


/* ============================
   GROS TITRES
============================ */

#steps-nav a,
#sb_booking_info a{

    font-size:30px !important;

    font-weight:700 !important;

    letter-spacing:2px !important;

    line-height:1.4 !important;

    padding-top:24px !important;

    text-transform:uppercase !important;

    color:#f5deb0 !important;

    font-family:"Cinzel",serif !important;
}/* ==========================================================
   URGENCE — RÉPARATION DU BANDEAU TROP GRAND
========================================================== */

/* Supprime l’immense zone bleue vide */
#sb_booking_info,
#sb_booking_info .booking-info,
#sb_booking_info ul.clearfix,
#steps-nav {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    padding-top: 12px !important;
    padding-bottom: 12px !important;

    margin-top: 0 !important;
    margin-bottom: 0 !important;

    overflow: visible !important;
}

/* Remet les étapes sur une hauteur raisonnable */
#sb_booking_info .step_info_item,
#steps-nav li {
    height: auto !important;
    min-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Réduit la hauteur de chaque lien */
#sb_booking_info .step_info_item > a,
#steps-nav li > a {
    min-height: 105px !important;
    height: auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Ronds : on garde leur belle taille */
#sb_booking_info .step_info_item > a::before,
#steps-nav li > a::before {
    width: 68px !important;
    height: 68px !important;
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    font-size: 30px !important;
}

/* Texte visible et plus grand */
#sb_booking_info .step_info_item > a,
#steps-nav li > a,
#sb_booking_info .step_info_item > a span,
#steps-nav li > a span {
    font-size: 17px !important;
    line-height: 1.15 !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px !important;
}

/* Supprime les anciens traits multiples qui se chevauchent */
#sb_booking_info .step_info_item::before,
#sb_booking_info .step_info_item::after,
#steps-nav li::before,
#steps-nav li::after {
    content: none !important;
    display: none !important;
}

/* Un seul trait doré propre entre chaque rond */
#sb_booking_info .step_info_item:not(:last-child) > a::after,
#steps-nav li:not(:last-child) > a::after {
    content: "" !important;
    display: block !important;

    position: absolute !important;
    top: 33px !important;
    left: calc(50% + 45px) !important;

    width: calc(100% - 90px) !important;
    height: 2px !important;

    background: linear-gradient(
        90deg,
        #b88a33,
        #ffe39a,
        #b88a33
    ) !important;

    box-shadow: 0 0 6px rgba(255, 218, 120, 0.65) !important;
}

/* Descend correctement le bouton Retour sous le bandeau */
#sb_back_button,
#steps-content .btn.back,
#steps-content a.btn.back,
#sb_booking_content .btn.back,
#sb_booking_content a.btn.back {
    position: relative !important;
    top: auto !important;
    left: auto !important;

    margin-top: 25px !important;
    margin-bottom: 35px !important;
}

/* Espace avant les cartes */
#sb_category_step_container,
#sb_category_step_container .categories-list,
.categories-list,
.category-items {
    margin-top: 0 !important;
    padding-top: 0 !important;
}/* =========================================
   TEXTE DU BANDEAU (Catégorie, Service...)
========================================= */

#sb_booking_info .step_info_item > a,
#steps-nav li > a{
    font-size:22px !important;
    font-weight:700 !important;
    letter-spacing:.8px !important;
    color:#F8E7A6 !important;
    text-transform:none !important;
    text-shadow:
        0 0 6px rgba(255,220,120,.45),
        0 0 2px #000 !important;
}

#sb_booking_info .step_info_item > a span,
#steps-nav li > a span{
    display:block !important;
    font-size:22px !important;
    font-weight:700 !important;
    line-height:1.2 !important;
    margin-top:14px !important;
}.step_info_item .title,
.step_info_item .name,
#steps-nav .title,
#steps-nav .name{
    font-size:22px !important;
    font-weight:700 !important;
    color:#F8E7A6 !important;
}/* ==========================================================
   AGRANDIR UNIQUEMENT LES TITRES DES ÉTAPES
========================================================== */

#sb_booking_info .step_info_item > a,
#steps-nav li > a,
#sb_booking_info .step_info_item > a span,
#steps-nav li > a span,
#sb_booking_info .step_info_item .title,
#steps-nav li .title,
#sb_booking_info .step_info_item .part1,
#steps-nav li .part1 {
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 23px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
    color: #f7dfa0 !important;
    text-shadow:
        0 2px 3px rgba(0, 0, 0, 0.9),
        0 0 8px rgba(255, 217, 112, 0.35) !important;
}

/* Empêche SimplyBook de réduire les textes */
#sb_booking_info .step_info_item *,
#steps-nav li * {
    max-width: none !important;
}

/* Téléphone */
@media only screen and (max-width: 768px) {
    #sb_booking_info .step_info_item > a,
    #steps-nav li > a,
    #sb_booking_info .step_info_item > a span,
    #steps-nav li > a span,
    #sb_booking_info .step_info_item .title,
    #steps-nav li .title,
    #sb_booking_info .step_info_item .part1,
    #steps-nav li .part1 {
        font-size: 14px !important;
        line-height: 1.1 !important;
        letter-spacing: 0.2px !important;
    }
}/* AGRANDIR LES MOTS CATÉGORIE / SERVICE / PRESTATAIRE / HEURE / CLIENT */

#sb-timeline #steps-nav .title-small,
#steps-nav .step_info_item .title-small,
#sb_booking_info .step_info_item .title-small {
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color: #f7dfa0 !important;
    text-shadow: 0 0 8px rgba(255, 215, 100, 0.45) !important;
}

/* VERSION TÉLÉPHONE */
@media screen and (max-width: 768px) {
    #sb-timeline #steps-nav .title-small,
    #steps-nav .step_info_item .title-small,
    #sb_booking_info .step_info_item .title-small {
        font-size: 10px !important;
        line-height: 1.15 !important;
        letter-spacing: 0.3px !important;
    }
}/* ==========================================================
   TÉLÉPHONE — UNIQUEMENT À PARTIR DES PAGES DE RÉSERVATION
   Ne touche pas à la page d’accueil
========================================================== */

@media screen and (max-width: 768px) {

    /* Centre tout le contenu du parcours de réservation */
    #sb-timeline,
    #sb-timeline #steps,
    #sb-timeline #steps-content,
    #sb_booking_content,
    #sb_booking_content .container,
    #sb_booking_content .container-fluid,
    #steps-content,
    #steps-content .container,
    #steps-content .container-fluid,
    #content-view {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        box-sizing: border-box !important;
    }

    /* Empêche uniquement les pages de réservation de partir à gauche */
    #sb-timeline .row,
    #steps-content .row,
    #sb_booking_content .row,
    #content-view .row {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    /* Bandeau Catégorie / Service / Prestataire / Heure / Client */
    #sb_booking_info,
    #sb_booking_info .booking-info,
    #sb_booking_info ul.clearfix,
    #steps-nav {
        width: calc(100% - 20px) !important;
        max-width: calc(100% - 20px) !important;
        min-width: 0 !important;
        margin: 18px auto 0 !important;
        padding: 14px 4px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    #sb_booking_info ul.clearfix,
    #steps-nav {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: flex-start !important;
    }

    #sb_booking_info .step_info_item,
    #steps-nav li {
        flex: 0 0 20% !important;
        width: 20% !important;
        max-width: 20% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 1px !important;
        box-sizing: border-box !important;
    }

    #sb_booking_info .step_info_item > a,
    #steps-nav li > a {
        width: 100% !important;
        min-width: 0 !important;
        padding: 3px 0 !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
    }

    /* Texte des étapes */
    #sb-timeline #steps-nav .title-small,
    #steps-nav .step_info_item .title-small,
    #sb_booking_info .step_info_item .title-small {
        width: 100% !important;
        margin-top: 7px !important;
        font-size: 11px !important;
        line-height: 1.15 !important;
        text-align: center !important;
        white-space: normal !important;
        overflow: visible !important;
        color: #f7dfa0 !important;
    }

    #sb_booking_info .title-sub,
    #steps-nav .title-sub {
        display: none !important;
    }

    /* Bouton Retour centré dans la largeur utile */
    #sb_back_button,
    #steps-content .btn.back,
    #steps-content a.btn.back,
    #sb_booking_content .btn.back,
    #sb_booking_content a.btn.back {
        display: block !important;
        width: 175px !important;
        max-width: calc(100% - 30px) !important;
        margin: 28px auto 38px !important;
        box-sizing: border-box !important;
        text-align: center !important;
    }

    /* Cartes Catégories / Services centrées */
    #sb_category_step_container,
    #sb_service_step_container,
    .categories-list,
    .services-list,
    .category-list,
    .service-list {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }

    #sb_category_step_container .item,
    #sb_service_step_container .item,
    .categories-list .item,
    .services-list .item,
    .category-item,
    .service-item {
        float: none !important;
        width: calc(100% - 12px) !important;
        max-width: 540px !important;
        margin: 0 auto 18px !important;
        box-sizing: border-box !important;
    }
}/* ==================================================
   BOUTIQUE MYSTIQUE — TEST DE DÉTECTION
   ================================================== */

/* Fond général de la boutique */
body:has([class*="product"]),
body:has([id*="product"]) {
    background-color: #02091d !important;
}

/* Zone principale des produits */
[class*="product-list"],
[class*="products-list"],
[id*="products"] {
    background:
        radial-gradient(circle at 50% 10%,
            rgba(20, 78, 195, 0.35),
            transparent 45%),
        linear-gradient(145deg,
            rgba(2, 10, 31, 0.97),
            rgba(4, 21, 69, 0.96)) !important;

    border: 1px solid rgba(224, 185, 91, 0.75) !important;
    border-radius: 24px !important;
    padding: 35px !important;
}

/* Cartes des produits */
[class*="product-item"],
[class*="product-card"] {
    background:
        linear-gradient(160deg,
            rgba(5, 25, 82, 0.98),
            rgba(1, 8, 29, 0.98)) !important;

    border: 2px solid #d8b45b !important;
    border-radius: 22px !important;
    overflow: hidden !important;

    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.55),
        0 0 22px rgba(40, 105, 255, 0.24),
        inset 0 0 20px rgba(255, 215, 120, 0.05) !important;
}

/* Titres et textes */
[class*="product-item"] h1,
[class*="product-item"] h2,
[class*="product-item"] h3,
[class*="product-item"] .title,
[class*="product-card"] h1,
[class*="product-card"] h2,
[class*="product-card"] h3 {
    color: #f5d77a !important;
    font-family: Georgia, "Times New Roman", serif !important;
    text-transform: uppercase !important;
    letter-spacing: 1.2px !important;
}

/* Prix */
[class*="product-item"] [class*="price"],
[class*="product-card"] [class*="price"] {
    color: #f5d77a !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 22px !important;
    font-weight: 700 !important;
}

/* Boutons de la boutique */
[class*="product"] button,
[class*="product"] .btn,
[class*="product"] a.btn,
[id*="product"] button,
[id*="product"] .btn {
    color: #fff4ca !important;
    background:
        linear-gradient(180deg,
            #1764ef 0%,
            #0639ae 55%,
            #031b61 100%) !important;

    border: 1px solid #e2bd61 !important;
    border-radius: 999px !important;
    min-height: 48px !important;
    padding: 12px 30px !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;

    box-shadow:
        0 7px 16px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.35),
        0 0 12px rgba(45, 110, 255, 0.25) !important;
}

/* Effet au passage de la souris */
[class*="product"] button:hover,
[class*="product"] .btn:hover,
[id*="product"] button:hover,
[id*="product"] .btn:hover {
    filter: brightness(1.15) !important;
    transform: translateY(-2px) !important;
}

/* Panier latéral */
[class*="cart"],
[id*="cart"] {
    color: #fff8df !important;
}

/* Panneau du panier */
[class*="cart-popup"],
[class*="cart-modal"],
[class*="shopping-cart"] {
    background:
        linear-gradient(155deg,
            #041641 0%,
            #020819 100%) !important;

    border-left: 2px solid #d8b45b !important;
    box-shadow: -15px 0 40px rgba(0, 0, 0, 0.65) !important;
}

/* Cadres de commande et de paiement */
[class*="invoice"],
[class*="order-summary"],
[class*="payment"] {
    background:
        linear-gradient(145deg,
            rgba(4, 20, 64, 0.98),
            rgba(2, 8, 26, 0.98)) !important;

    color: #fff8df !important;
    border: 1px solid #d8b45b !important;
    border-radius: 22px !important;

    box-shadow:
        0 18px 45px rgba(0, 0, 0, 0.55),
        0 0 22px rgba(42, 100, 255, 0.18) !important;
}

/* Titres de commande */
[class*="invoice"] h1,
[class*="invoice"] h2,
[class*="invoice"] h3,
[class*="order-summary"] h1,
[class*="order-summary"] h2,
[class*="order-summary"] h3 {
    color: #f5d77a !important;
    font-family: Georgia, "Times New Roman", serif !important;
    text-transform: uppercase !important;
}

/* Tableau de commande */
[class*="invoice"] table,
[class*="order-summary"] table {
    background: rgba(1, 7, 23, 0.72) !important;
    color: #fff8df !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Version téléphone */
@media screen and (max-width: 767px) {

    [class*="product-list"],
    [class*="products-list"],
    [id*="products"] {
        width: calc(100% - 24px) !important;
        margin: 20px auto !important;
        padding: 14px !important;
        border-radius: 18px !important;
    }

    [class*="product-item"],
    [class*="product-card"] {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto 22px !important;
    }

    [class*="product"] button,
    [class*="product"] .btn,
    [id*="product"] button,
    [id*="product"] .btn {
        width: calc(100% - 24px) !important;
        margin: 10px 12px !important;
        font-size: 16px !important;
    }
}/* =========================================================
   CORRECTIF FINAL — BOUTIQUE DU VOYAGEUR MYSTIQUE
   À COLLER TOUT EN BAS DU CSS
   ========================================================= */


/* ---------------------------------------------------------
   1. EN-TÊTE DE LA BOUTIQUE
   --------------------------------------------------------- */


/* Menu sur une seule ligne */
#header .nav,
#header nav,
#header .navbar-nav,
header .nav,
header nav {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}

/* Remplace visuellement PRODUCTS par BOUTIQUE */
#header a[href*="products"],
header a[href*="products"] {
    font-size: 0 !important;
}

#header a[href*="products"]::after,
header a[href*="products"]::after {
    content: "BOUTIQUE";
    font-size: 18px;
    color: #f6d878;
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 700;
    letter-spacing: 1px;
}


/* ---------------------------------------------------------
   2. SUPPRIMER LE GROS FOND GRIS ET FLOU
   --------------------------------------------------------- */

#products,
.products-page,
.products-container,
.product-list-page,
[class*="products-page"],
[class*="products-container"],
[class*="product-list-container"] {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* Conteneurs gris transparents présents derrière la boutique */
#main [class*="overlay"],
#main [class*="backdrop"],
#main [class*="blur"],
#main [class*="content-wrapper"],
body:has(a[href*="products"]) #main {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}


/* ---------------------------------------------------------
   3. TITRES ANGLAIS ET INFORMATIONS INUTILES
   --------------------------------------------------------- */

/* Cache le mot Products au-dessus des catégories */
.products-page > h1,
.products-page > h2,
.products-container > h1,
.products-container > h2,
[class*="products"] > .title,
[class*="products"] > .page-title {
    display: none !important;
}

/* Cache “1 products” */
[class*="product-count"],
[class*="products-count"],
[class*="items-count"],
.category-card [class*="count"] {
    display: none !important;
}

/* Cache le tri Sort by / Default / Name / Price */
[class*="sort-by"],
[class*="sorting"],
[class*="product-sort"],
select[name*="sort"],
label[for*="sort"] {
    display: none !important;
}


/* ---------------------------------------------------------
   4. CARTES DES CATÉGORIES DE PRODUITS
   --------------------------------------------------------- */

[class*="product-category"],
[class*="category-card"],
.products-category-item {
    background: rgba(2, 12, 42, 0.93) !important;
    border: 1px solid rgba(221, 181, 82, 0.75) !important;
    border-radius: 18px !important;
    box-shadow:
        0 14px 35px rgba(0, 0, 0, 0.38),
        0 0 18px rgba(38, 99, 230, 0.12) !important;
    overflow: hidden !important;
}

/* Supprime les contours dorés à l’intérieur des cartes */
[class*="product-category"] *,
[class*="category-card"] * {
    outline: none !important;
}

/* Bouton Explore devient Découvrir */
[class*="product-category"] a,
[class*="category-card"] a,
[class*="product-category"] button,
[class*="category-card"] button {
    position: relative !important;
    font-size: 0 !important;
    border: 1px solid #dfbb5d !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #1767ef, #07399f) !important;
    color: #fff4c4 !important;
}

[class*="product-category"] a::after,
[class*="category-card"] a::after,
[class*="product-category"] button::after,
[class*="category-card"] button::after {
    content: "DÉCOUVRIR";
    font-size: 16px !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    color: #fff4c4 !important;
}


/* ---------------------------------------------------------
   5. CARTES DES PRODUITS
   --------------------------------------------------------- */

[class*="product-card"],
[class*="product-item"],
.products-list .item {
    background: rgba(2, 13, 47, 0.96) !important;
    border: 1px solid rgba(221, 181, 82, 0.72) !important;
    border-radius: 18px !important;
    box-shadow:
        0 14px 35px rgba(0, 0, 0, 0.38),
        0 0 18px rgba(35, 94, 220, 0.12) !important;
    overflow: hidden !important;
}

/* Enlève tous les petits cadres dorés intérieurs */
[class*="product-card"] .content,
[class*="product-card"] .info,
[class*="product-card"] .price,
[class*="product-item"] .content,
[class*="product-item"] .info,
[class*="product-item"] .price {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Prix plus propre */
[class*="product-card"] [class*="price"],
[class*="product-item"] [class*="price"] {
    color: #f4d471 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    padding: 12px 14px 4px !important;
}


/* ---------------------------------------------------------
   6. AFFICHER TOUTE LA DESCRIPTION
   --------------------------------------------------------- */

[class*="product-card"] [class*="description"],
[class*="product-item"] [class*="description"],
.product-description,
.product-description-short,
[class*="description-short"] {
    display: block !important;
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    white-space: normal !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    opacity: 1 !important;
}

/* Supprime Afficher plus / Show more */
[class*="show-more"],
[class*="read-more"],
[class*="view-more"],
a[href*="show-more"] {
    display: none !important;
}


/* ---------------------------------------------------------
   7. BOUTON ACHETER
   --------------------------------------------------------- */

[class*="product-card"] button,
[class*="product-item"] button,
[class*="product-card"] .btn,
[class*="product-item"] .btn {
    min-height: 48px !important;
    border: 1px solid #dfbb5d !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #1768ef, #0739a3) !important;
    color: #fff4c4 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    box-shadow:
        0 7px 15px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}


/* ---------------------------------------------------------
   8. PANIER LATÉRAL
   --------------------------------------------------------- */

[class*="cart-popup"],
[class*="cart-drawer"],
[class*="shopping-cart"],
#cart-popup {
    background:
        radial-gradient(circle at 50% 0%,
            rgba(20, 80, 205, 0.42),
            transparent 50%),
        linear-gradient(155deg, #061a53, #02091f) !important;

    border-left: 1px solid rgba(221, 181, 82, 0.7) !important;
}

/* Your cart devient Votre panier */
[class*="cart-title"],
[class*="cart-header"] h1,
[class*="cart-header"] h2,
[class*="cart-header"] h3 {
    font-size: 0 !important;
    color: #f4d471 !important;
}

[class*="cart-title"]::after,
[class*="cart-header"] h1::after,
[class*="cart-header"] h2::after,
[class*="cart-header"] h3::after {
    content: "VOTRE PANIER";
    font-size: 22px !important;
    color: #f4d471 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

/* Ligne d’un produit dans le panier */
[class*="cart-item"] {
    border: 1px solid rgba(221, 181, 82, 0.58) !important;
    border-radius: 16px !important;
    background: rgba(3, 18, 58, 0.72) !important;
    box-shadow: none !important;
}

/* Corrige les boutons ronds vides + et - */
[class*="cart-item"] button {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    color: #fff4c4 !important;
    font-size: 22px !important;
    line-height: 36px !important;
    background: linear-gradient(180deg, #1768ef, #0739a3) !important;
    border: 1px solid #dfbb5d !important;
}

/* Bouton Ajouter d’autres produits */
[class*="add-more"],
[class*="continue-shopping"] {
    font-size: 0 !important;
}

[class*="add-more"]::after,
[class*="continue-shopping"]::after {
    content: "CONTINUER MES ACHATS";
    font-size: 16px !important;
    color: #fff4c4 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-weight: 700 !important;
}


/* ---------------------------------------------------------
   9. FORMULAIRE CLIENT DE LA BOUTIQUE
   --------------------------------------------------------- */

[class*="product-client"],
[class*="customer-form"],
[class*="checkout-form"] {
    background:
        linear-gradient(155deg,
            rgba(5, 25, 75, 0.96),
            rgba(2, 10, 33, 0.97)) !important;

    border: 1px solid rgba(221, 181, 82, 0.72) !important;
    border-radius: 22px !important;
    box-shadow:
        0 18px 40px rgba(0, 0, 0, 0.45),
        0 0 22px rgba(35, 95, 225, 0.15) !important;
}

/* Titre du formulaire */
[class*="customer-form"] h1,
[class*="customer-form"] h2,
[class*="checkout-form"] h1,
[class*="checkout-form"] h2 {
    color: #f4d471 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    letter-spacing: 1px !important;
}

/* Champs */
[class*="customer-form"] input,
[class*="checkout-form"] input {
    background: rgba(1, 9, 29, 0.68) !important;
    color: #fff !important;
    border: 1px solid rgba(226, 190, 98, 0.58) !important;
    border-radius: 10px !important;
}


/* ---------------------------------------------------------
   10. VERSION TÉLÉPHONE
   --------------------------------------------------------- */

@media screen and (max-width: 767px) {

    /* Centre toute la boutique */
    .products-page,
    .products-container,
    [class*="products-page"],
    [class*="products-container"] {
        width: 100% !important;
        max-width: 100% !important;
        padding: 18px 12px !important;
        margin: 0 auto !important;
    }

    [class*="product-category"],
    [class*="category-card"],
    [class*="product-card"],
    [class*="product-item"] {
        width: calc(100% - 16px) !important;
        max-width: 520px !important;
        margin: 0 auto 24px !important;
    }

    /* Panier sur toute la largeur du téléphone */
    [class*="cart-popup"],
    [class*="cart-drawer"],
    [class*="shopping-cart"] {
        width: 100% !important;
        max-width: 100% !important;
    }
}/* Remplace le texte du menu */
a[href*="#products"] span,
a[href*="#products"] {
    font-size: 0 !important;
}

a[href*="#products"]::after{
    content:"BOUTIQUE MYSTIQUE";
    font-size:20px;
    color:#f4d98d;
    font-weight:700;
}/* ============================================================
   BOUTIQUE MYSTIQUE — CORRECTIONS COMPLÈTES
   À COLLER TOUT EN BAS DU CSS ACTUEL
   ============================================================ */


/* ============================================================
   1 — MENU : BOUTIQUE devient BOUTIQUE MYSTIQUE
   ============================================================ */

#header a[href*="#products"],
#header a[href*="/products"],
header a[href*="#products"],
header a[href*="/products"] {
    font-size: 0 !important;
}

#header a[href*="#products"]::after,
#header a[href*="/products"]::after,
header a[href*="#products"]::after,
header a[href*="/products"]::after {
    content: "BOUTIQUE MYSTIQUE";
    display: inline-block;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 1.1px !important;
    color: #f6dc8f !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}


/* ============================================================
   2 — SUPPRESSION DU GROS FOND GRIS ET FLOU
   ============================================================ */

#product-view,
.products-view--wrapper,
#sb_list_container,
.step-content--product,
#product-view .container-fluid,
#product-view .column {
    background: transparent !important;
    background-color: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
}

#product-view::before,
.products-view--wrapper::before,
#sb_list_container::before,
.step-content--product::before {
    display: none !important;
    content: none !important;
}


/* ============================================================
   3 — MASQUER LE MOT "PRODUCTS" EN HAUT
   ============================================================ */

.product-view--history,
.product-view--history_list,
.product-view--history_item {
    display: none !important;
}


/* ============================================================
   4 — MISE EN PAGE DES CATÉGORIES ET PRODUITS
   ============================================================ */

.step-content--product > div,
#sb_list_container > div {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 28px !important;
    margin: 0 auto !important;
    padding: 30px 22px 50px !important;
    width: 100% !important;
    max-width: 1400px !important;
}


/* ============================================================
   5 — CARTE DE CATÉGORIE / CARTE DE PRODUIT
   On enlève le double cadre et le cadre arrière
   ============================================================ */

.product-item.item,
[class*="product-card"],
[class*="product-item"] {
    width: 380px !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    background:
        linear-gradient(
            180deg,
            rgba(4, 20, 61, 0.98),
            rgba(2, 10, 34, 0.99)
        ) !important;

    border: 1px solid rgba(224, 187, 92, 0.82) !important;
    border-radius: 18px !important;
    box-shadow:
        0 16px 35px rgba(0, 0, 0, 0.32),
        0 0 16px rgba(27, 86, 210, 0.12) !important;

    overflow: hidden !important;
    transform: none !important;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease !important;
}

.product-item.item:hover,
[class*="product-card"]:hover,
[class*="product-item"]:hover {
    transform: translateY(-4px) !important;
    border-color: #f0cf72 !important;
    box-shadow:
        0 20px 42px rgba(0, 0, 0, 0.4),
        0 0 22px rgba(35, 99, 225, 0.22) !important;
}


/* Suppression du cadre supplémentaire derrière la carte */

.product-item.item > .tab,
.product-item.item .tab.tab-col,
.product-item.item .tab-with-popup,
.product-item.item .excerpt-info,
[class*="product-card"] .excerpt-info {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}


/* ============================================================
   6 — IMAGES DES PRODUITS
   ============================================================ */

.product-item .preloader,
.product-item .preloader img,
.product-item img,
[class*="product-card"] img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.product-item .preloader {
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
}


/* ============================================================
   7 — PARTIE TEXTE SOUS L’IMAGE
   ============================================================ */

.product-item .tab-pd,
.product-item .content,
.product-item .txt,
.product-item .txt.short,
[class*="product-card"] .tab-pd {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;

    margin: 0 !important;
    padding: 15px 18px !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    color: #fff8df !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
}


/* ============================================================
   8 — MASQUER "1 PRODUCTS"
   ============================================================ */

.product-item--count,
.product-item-count,
.changed-items-num:not(.btn-bar) {
    display: none !important;
}


/* ============================================================
   9 — TITRES DES CATÉGORIES / PRODUITS
   ============================================================ */

.product-item--title-and-count .cap.short,
.product-item .cap.short,
.product-item .title,
.product-item h3,
.product-item h4 {
    display: block !important;
    width: 100% !important;

    margin: 0 !important;
    padding: 17px 18px 8px !important;

    color: #f5d981 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 23px !important;
    line-height: 1.2 !important;
    font-weight: 600 !important;
    letter-spacing: 0.6px !important;
    text-align: center !important;
    text-transform: uppercase !important;

    background: transparent !important;
}


/* ============================================================
   10 — PRIX
   ============================================================ */

.product-item .price,
.product-item [class*="price"],
.product-item .product-price {
    display: block !important;
    width: auto !important;
    margin: 12px 18px 5px !important;
    padding: 0 !important;

    color: #f3d272 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 22px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}


/* ============================================================
   11 — AFFICHER TOUTE LA DESCRIPTION
   ============================================================ */

.product-item .txt,
.product-item .txt.short,
.product-item [class*="description"],
.product-item [class*="excerpt"] {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;

    -webkit-line-clamp: unset !important;
    -webkit-box-orient: initial !important;
    white-space: normal !important;
    text-overflow: unset !important;

    color: #fff8df !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
}


/* Masquer "Afficher plus" */

.product-item a.more,
.product-item .more,
.product-item [class*="show-more"],
.product-item [class*="read-more"] {
    display: none !important;
}


/* ============================================================
   12 — BOUTON EXPLORE → DÉCOUVRIR
   ============================================================ */

.product-item .btn-bar {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 8px 18px 18px !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.product-item .btn-bar .btn.select {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 12px 20px !important;

    border: 1px solid #e2bd5f !important;
    border-radius: 30px !important;

    background:
        linear-gradient(
            180deg,
            #1761ef 0%,
            #0c41ba 52%,
            #082a7e 100%
        ) !important;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.3),
        0 7px 16px rgba(0, 0, 0, 0.28),
        0 0 12px rgba(33, 98, 229, 0.18) !important;

    color: transparent !important;
    font-size: 0 !important;
    text-decoration: none !important;
}

.product-item .btn-bar .btn.select::after {
    content: "DÉCOUVRIR";
    color: #fff7d8 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 17px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

.product-item .btn-bar .btn.select:hover {
    background:
        linear-gradient(
            180deg,
            #2773ff 0%,
            #1451d0 52%,
            #0a348f 100%
        ) !important;

    transform: translateY(-1px) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.36),
        0 9px 20px rgba(0, 0, 0, 0.34),
        0 0 18px rgba(41, 109, 255, 0.28) !important;
}


/* ============================================================
   13 — BOUTON ACHETER
   ============================================================ */

.product-item a[href*="cart"],
.product-item button[class*="cart"],
.product-item .add-to-cart,
.product-item .btn-add-to-cart {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: calc(100% - 36px) !important;
    min-height: 48px !important;
    margin: 10px 18px 18px !important;
    padding: 12px 20px !important;

    border: 1px solid #e2bd5f !important;
    border-radius: 30px !important;
    background: linear-gradient(180deg, #1761ef, #0b3596) !important;

    color: #fff7d8 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-align: center !important;
    text-decoration: none !important;
}


/* ============================================================
   14 — "ADDED TO CART" → AJOUTÉ AU PANIER
   ============================================================ */

.product-item .added-to-cart,
.product-item [class*="added"] {
    font-size: 0 !important;
    color: transparent !important;
}

.product-item .added-to-cart::after,
.product-item [class*="added"]::after {
    content: "AJOUTÉ AU PANIER";
    display: block !important;
    padding: 12px 18px 18px !important;

    color: #f4d779 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 0.7px !important;
    text-align: center !important;
}


/* ============================================================
   15 — MASQUER LE TRI "SORT BY / DEFAULT / NAME / PRICE"
   ============================================================ */

#product-view [class*="sort"],
.products-view--wrapper [class*="sort"],
.step-content--product [class*="sort"] {
    display: none !important;
}


/* ============================================================
   16 — PANIER : GRAND FOND BLEU PROPRE
   ============================================================ */

#sb_cart_popup,
#sb_cart_popup .modal-content,
[class*="cart-popup"],
[class*="cart-modal"],
[class*="shopping-cart"] {
    background:
        radial-gradient(
            circle at 50% 15%,
            rgba(22, 89, 217, 0.34),
            transparent 45%
        ),
        linear-gradient(
            160deg,
            #061c4d 0%,
            #031232 60%,
            #020a20 100%
        ) !important;

    color: #fff8df !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* ============================================================
   17 — "YOUR CART" → VOTRE PANIER
   ============================================================ */

#sb_cart_popup h1,
#sb_cart_popup h2,
#sb_cart_popup h3,
#sb_cart_popup [class*="cart-title"],
[class*="cart-popup"] [class*="title"] {
    font-size: 0 !important;
}

#sb_cart_popup h1::after,
#sb_cart_popup h2::after,
#sb_cart_popup h3::after,
#sb_cart_popup [class*="cart-title"]::after,
[class*="cart-popup"] [class*="title"]::after {
    content: "VOTRE PANIER";
    color: #f4d779 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 24px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}


/* ============================================================
   18 — LIGNE DU PRODUIT DANS LE PANIER
   ============================================================ */

#sb_cart_popup [class*="cart-item"],
[class*="cart-popup"] [class*="cart-item"] {
    background: rgba(4, 21, 63, 0.76) !important;
    border: 1px solid rgba(224, 187, 92, 0.58) !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    color: #fff8df !important;
}


/* ============================================================
   19 — RONDS VIDES DU PANIER
   On conserve les commandes mais on enlève l’apparence vide
   ============================================================ */

#sb_cart_popup button,
#sb_cart_popup .btn,
[class*="cart-popup"] button,
[class*="cart-popup"] .btn {
    color: #fff7d8 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-weight: 700 !important;

    border: 1px solid rgba(225, 188, 91, 0.85) !important;
    border-radius: 25px !important;

    background: linear-gradient(180deg, #1761ef, #0a318e) !important;
    box-shadow: none !important;
}


/* ============================================================
   20 — "ADD MORE TO CART" → CONTINUER MES ACHATS
   ============================================================ */

#sb_cart_popup [class*="add-more"],
#sb_cart_popup a[href*="products"],
[class*="cart-popup"] [class*="add-more"] {
    font-size: 0 !important;
}

#sb_cart_popup [class*="add-more"]::after,
#sb_cart_popup a[href*="products"]::after,
[class*="cart-popup"] [class*="add-more"]::after {
    content: "CONTINUER MES ACHATS";
    color: #fff7d8 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 0.7px !important;
}


/* ============================================================
   21 — BOUTON PASSER À LA CAISSE
   ============================================================ */

#sb_cart_popup [class*="checkout"],
#sb_cart_popup a[href*="checkout"],
[class*="cart-popup"] [class*="checkout"] {
    min-height: 50px !important;
    border-radius: 28px !important;
    border: 1px solid #e4bd5f !important;

    background: linear-gradient(180deg, #1761ef, #0a318e) !important;
    color: #fff7d8 !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    letter-spacing: 0.8px !important;
}


/* ============================================================
   22 — FORMULAIRE CLIENT DE LA BOUTIQUE
   ============================================================ */

#product-view form,
[class*="product"] form,
[class*="checkout"] form {
    background:
        linear-gradient(
            180deg,
            rgba(4, 20, 58, 0.97),
            rgba(2, 10, 31, 0.98)
        ) !important;

    color: #fff8df !important;
    border: 1px solid rgba(225, 188, 91, 0.72) !important;
    border-radius: 20px !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.38) !important;
}


/* Champs */

#product-view input,
#product-view textarea,
#product-view select,
[class*="checkout"] input,
[class*="checkout"] textarea,
[class*="checkout"] select {
    background: rgba(2, 12, 39, 0.86) !important;
    color: #fff8df !important;

    border: 1px solid rgba(229, 195, 105, 0.62) !important;
    border-radius: 12px !important;

    box-shadow: none !important;
}


/* ============================================================
   23 — VERSION TÉLÉPHONE
   ============================================================ */

@media screen and (max-width: 767px) {

    #header a[href*="#products"]::after,
    #header a[href*="/products"]::after,
    header a[href*="#products"]::after,
    header a[href*="/products"]::after {
        font-size: 14px !important;
        letter-spacing: 0.5px !important;
    }

    .step-content--product > div,
    #sb_list_container > div {
        display: block !important;
        width: 100% !important;
        padding: 22px 14px 40px !important;
    }

    .product-item.item,
    [class*="product-card"],
    [class*="product-item"] {
        display: block !important;
        width: 100% !important;
        max-width: 440px !important;
        margin: 0 auto 24px !important;
        float: none !important;
    }

    .product-item--title-and-count .cap.short,
    .product-item .cap.short,
    .product-item .title,
    .product-item h3,
    .product-item h4 {
        font-size: 20px !important;
    }

    .product-item .tab-pd,
    .product-item .content,
    .product-item .txt,
    .product-item .txt.short {
        font-size: 15px !important;
        line-height: 1.5 !important;
    }

    #sb_cart_popup,
    #sb_cart_popup .modal-content,
    [class*="cart-popup"],
    [class*="cart-modal"] {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 18px 12px !important;
    }
}/* ============================================================
   CORRECTION DU MOT « BOUTIQUE MYSTIQUE »
   ============================================================ */


/* 1 — ANNULER L’AJOUT INDÉSIRABLE SUR LES CARTES DE CATÉGORIES */

.product-item a[href*="products"]::after,
.product-item a[href*="#products"]::after,
.product-item .cap.short::after,
.product-item .cap.short::before,
.product-item--title-and-count::after,
.product-item--title-and-count::before {
    content: none !important;
    display: none !important;
}


/* Le texte et l’image de la carte retrouvent toute leur largeur */

.product-item .preloader,
.product-item .preloader img {
    width: 100% !important;
    max-width: 100% !important;
}

.product-item .cap.short {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}


/* 2 — MENU PRINCIPAL :
   LE DEUXIÈME BOUTON DEVIENT « BOUTIQUE MYSTIQUE » */

#header nav li:nth-child(2) > a,
#header .nav li:nth-child(2) > a,
#header .navbar-nav li:nth-child(2) > a,
header nav li:nth-child(2) > a,
header .nav li:nth-child(2) > a,
header .navbar-nav li:nth-child(2) > a {
    font-size: 0 !important;
    white-space: nowrap !important;
}


/* Masquer l’ancien texte BOUTIQUE placé dans un élément intérieur */

#header nav li:nth-child(2) > a *,
#header .nav li:nth-child(2) > a *,
#header .navbar-nav li:nth-child(2) > a *,
header nav li:nth-child(2) > a *,
header .nav li:nth-child(2) > a *,
header .navbar-nav li:nth-child(2) > a * {
    display: none !important;
}


/* Afficher le nouveau nom */

#header nav li:nth-child(2) > a::after,
#header .nav li:nth-child(2) > a::after,
#header .navbar-nav li:nth-child(2) > a::after,
header nav li:nth-child(2) > a::after,
header .nav li:nth-child(2) > a::after,
header .navbar-nav li:nth-child(2) > a::after {
    content: "BOUTIQUE MYSTIQUE" !important;
    display: inline-block !important;

    color: #f6dc8f !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}


/* 3 — CONSERVER LE JOLI LIEN BOUTIQUE MYSTIQUE
   EN HAUT DE LA PAGE DES PRODUITS */

.product-view--history {
    display: flex !important;
}

.product-view--history_list {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
}

.product-view--history_item:first-child {
    display: inline-flex !important;
    align-items: center !important;

    color: #f4d779 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
}


/* Remplacer uniquement le premier fil d’Ariane « Products » */

.product-view--history_item:first-child {
    font-size: 0 !important;
}

.product-view--history_item:first-child::after {
    content: "BOUTIQUE MYSTIQUE" !important;
    display: inline-block !important;

    color: #f4d779 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
}


/* 4 — VERSION TÉLÉPHONE */

@media screen and (max-width: 767px) {

    #header nav li:nth-child(2) > a::after,
    #header .nav li:nth-child(2) > a::after,
    #header .navbar-nav li:nth-child(2) > a::after,
    header nav li:nth-child(2) > a::after,
    header .nav li:nth-child(2) > a::after,
    header .navbar-nav li:nth-child(2) > a::after {
        font-size: 15px !important;
        letter-spacing: 0.4px !important;
    }

    .product-view--history_item:first-child::after {
        font-size: 16px !important;
    }
}/* PAGE CATÉGORIES BOUTIQUE :
   remplacer EXPLORE par DÉCOUVRIR */

#product-view .product-item .btn-bar a.btn.select {
    position: relative !important;
    color: transparent !important;
    font-size: 0 !important;
}

#product-view .product-item .btn-bar a.btn.select::after {
    content: "DÉCOUVRIR" !important;
    display: block !important;
    color: #fff1b8 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    line-height: normal !important;
    text-align: center !important;
}/* ==========================================
   FICHE PRODUIT — PRIX EN BOUTON PREMIUM
   ========================================== */

#product-view .product-item--price,
#product-view .product-item-price,
#product-view .price {
    display: table !important;
    margin: 28px auto 30px auto !important;
    padding: 14px 34px !important;

    background: linear-gradient(
        180deg,
        rgba(12, 45, 150, 0.98),
        rgba(3, 19, 72, 0.98)
    ) !important;

    border: 2px solid #d9b45a !important;
    border-radius: 28px !important;

    color: #d9b45a !important;
text-shadow: 0 0 8px rgba(217,180,90,.35);
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-align: center !important;

    box-shadow:
        0 0 18px rgba(218, 181, 84, 0.42),
        inset 0 0 15px rgba(44, 104, 255, 0.30) !important;
}/* ==========================================
   FICHE PRODUIT — DESCRIPTION ÉLÉGANTE
   ========================================== */

#product-view .product-item .txt,
#product-view .product-item .txt.short,
#product-view .product-item .product-description,
#product-view .product-item .description {
    width: 88% !important;
    max-width: 620px !important;
    margin: 0 auto 28px auto !important;

    color: #fff4d1 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 13px !important;
    line-height: 1.8 !important;
    font-weight: 400 !important;

    text-align: center !important;
    letter-spacing: 0.15px !important;
}

/* Espacement entre les paragraphes */
#product-view .product-item .txt p,
#product-view .product-item .product-description p,
#product-view .product-item .description p {
    margin: 0 0 14px 0 !important;
}

/* Première ligne légèrement plus prestigieuse */
#product-view .product-item .txt p:first-child,
#product-view .product-item .product-description p:first-child,
#product-view .product-item .description p:first-child {
    color: #f4d77f !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}/* ===== PRODUITS - IMAGE PLUS GRANDE ===== */

.product-item .product-image,
.product-item .img,
.product-item img{
    height:260px !important;
    max-height:260px !important;
    object-fit:cover !important;
}

/* ===== DESCRIPTION PLUS COMPACTE ===== */

.tab-pd{
    padding:8px 14px 14px !important;
    min-height:auto !important;
}

/* ===== TEXTE DESCRIPTION ===== */

.tab-pd p,
.tab-pd .txt,
.tab-pd .txt.short{
    font-size:13px !important;
    line-height:1.55 !important;
    margin-bottom:10px !important;
}

/* ===== ESPACE AUTOUR DU PRIX ===== */

.product-item--price{
    margin-bottom:10px !important;
}/* ===== VERSION PREMIUM ===== */

/* Image beaucoup plus grande */
.product-item img{
    height: 310px !important;
    max-height: 310px !important;
    object-fit: cover !important;
}

/* Carte plus compacte */
.tab-pd{
    padding: 4px 14px 10px !important;
}

/* Description plus petite */
.tab-pd p,
.tab-pd .txt,
.tab-pd .txt.short{
    font-size: 12px !important;
    line-height: 1.35 !important;
    margin: 6px 0 !important;
}

/* Réduire les espaces entre les paragraphes */
.tab-pd br{
    display:none;
}

/* Le prix plus proche de l'image */
.product-item--price{
    margin: 8px 0 12px !important;
}/* ===== VERSION ULTRA PREMIUM ===== */

/* Image immense */
.product-item img{
    width:100% !important;
    height:360px !important;
    max-height:360px !important;
    object-fit:cover !important;
}

/* Le bloc texte prend beaucoup moins de place */
.tab-pd{
    padding:2px 12px 8px !important;
}

/* Description très compacte */
.tab-pd p,
.tab-pd .txt,
.tab-pd .txt.short{
    font-size:11px !important;
    line-height:1.25 !important;
    margin:3px 0 !important;
}

/* Plus d'espaces inutiles */
.tab-pd br{
    display:none !important;
}

/* Prix collé sous l'image */
.product-item--price{
    margin:4px 0 8px !important;
}

/* Supprime les marges des titres */
.tab-pd h1,
.tab-pd h2,
.tab-pd h3,
.tab-pd h4{
    margin:2px 0 6px !important;
}/* ===== COMPACTER LE BLOC DESCRIPTION ===== */

.tab-pd{
    height: fit-content !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 12px 10px !important;
}

.tab-pd > *{
    margin-top: 4px !important;
    margin-bottom: 4px !important;
}

/* La carte ne garde plus une hauteur imposée */
.product-item,
.product-card{
    height: auto !important;
    min-height: 0 !important;
}/* Réduire réellement le bloc description */
.step-content--product > div .item .tab-pd{
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 6px 12px 10px !important;
}

/* Le texte prend juste la place nécessaire */
.step-content--product > div .item .tab-pd p{
    margin: 6px 0 !important;
}

/* L'image prend davantage de place */
.product-item img,
.product-card img{
    height: 245px !important;
    object-fit: cover !important;
}/* ===== VRAI BOUTON D’ACHAT VISIBLE ===== */

.product-item .btn-bar,
.product-item .btn-bar.changed-items-num{
    display:flex !important;
    justify-content:center !important;
    margin:12px 0 18px !important;
}

/* Le véritable bouton Acheter */
.product-item .btn-bar a,
.product-item .btn-bar button,
.product-item a.btn.select,
.product-item button.btn.select{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:170px !important;
    min-height:52px !important;
    margin:auto !important;

    background:linear-gradient(180deg,#145cff 0%,#062d91 100%) !important;
    border:2px solid #e5bd52 !important;
    border-radius:30px !important;
    box-shadow:
        0 0 16px rgba(229,189,82,.35),
        inset 0 0 12px rgba(255,255,255,.12) !important;

    color:#f3d77b !important;
    font-size:16px !important;
    font-weight:700 !important;
    text-transform:uppercase !important;
    cursor:pointer !important;
    pointer-events:auto !important;
    position:relative !important;
    z-index:20 !important;
}

/* Empêche le bloc de description de recouvrir le bouton */
.product-item .tab-pd,
.product-item .excerpt-info{
    pointer-events:auto !important;
    position:relative !important;
    z-index:1 !important;
}/* ===== RÉTABLIR LE VRAI BOUTON D'AJOUT AU PANIER ===== */

#sb_list_container.step-content--product .product-item .btn-bar,
#sb_list_container.step-content--product .item .btn-bar{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
    position:relative !important;
    width:100% !important;
    height:auto !important;
    min-height:54px !important;
    margin:14px 0 18px !important;
    padding:0 18px !important;
    justify-content:center !important;
    align-items:center !important;
    pointer-events:auto !important;
    z-index:50 !important;
}

/* Vrai bouton SimplyBook */
#sb_list_container.step-content--product .btn-bar a,
#sb_list_container.step-content--product .btn-bar button,
#sb_list_container.step-content--product a.btn.select,
#sb_list_container.step-content--product button.btn.select{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
    position:relative !important;
    inset:auto !important;

    width:100% !important;
    max-width:260px !important;
    min-height:50px !important;
    margin:0 auto !important;

    align-items:center !important;
    justify-content:center !important;

    background:linear-gradient(180deg,#1764ff 0%,#07319d 100%) !important;
    border:2px solid #e6bd54 !important;
    border-radius:30px !important;
    box-shadow:
        0 0 16px rgba(230,189,84,.35),
        inset 0 0 12px rgba(255,255,255,.15) !important;

    color:#f6d87a !important;
    font-size:16px !important;
    font-weight:700 !important;
    text-transform:uppercase !important;
    cursor:pointer !important;
    pointer-events:auto !important;
    z-index:60 !important;
}

/* Empêche un ancien code de recouvrir le bouton */
#sb_list_container.step-content--product .tab-pd,
#sb_list_container.step-content--product .excerpt-info,
#sb_list_container.step-content--product .product-item--title-and-price{
    overflow:visible !important;
}

/* Le prix reste décoratif, mais n'imite plus un bouton cliquable */
#sb_list_container.step-content--product .product-item--price,
#sb_list_container.step-content--product .product-item--price .badge{
    pointer-events:none !important;
    cursor:default !important;
}/* Remplace le texte du bouton */
#sb_list_container .btn-bar a,
#sb_list_container .btn-bar button{
    font-size:0 !important;
}

#sb_list_container .btn-bar a::after,
#sb_list_container .btn-bar button::after{
    content:"Ajouter au panier";
    font-size:16px;
    font-weight:700;
    color:#f6d87a;
    text-transform:uppercase;
}/* ===== TEXTE EXACT DU BOUTON PRODUIT ===== */

#sb_list_container button.btn.select.disabled.sb-open-cart{
    font-size:0 !important;
    color:transparent !important;
    text-indent:-9999px !important;
    overflow:hidden !important;
}

#sb_list_container button.btn.select.disabled.sb-open-cart::after{
    content:"AJOUTER AU PANIER" !important;
    display:block !important;
    width:100% !important;
    font-size:16px !important;
    line-height:1.2 !important;
    font-weight:700 !important;
    color:#f6d87a !important;
    text-indent:0 !important;
    text-align:center !important;
    text-transform:uppercase !important;
}/* ==================================================
   PANIER — VERSION PREMIUM LE VOYAGEUR MYSTIQUE
   ================================================== */

/* Image de fond derrière la partie gauche du panier */
#sb_cart_popup,
#sb_cart_popup .modal-dialog,
#sb_cart_popup .modal-content{
    background:
        linear-gradient(
            90deg,
            rgba(2, 8, 30, 0.12) 0%,
            rgba(2, 8, 30, 0.28) 48%,
            rgba(2, 8, 30, 0.96) 52%,
            rgba(2, 8, 30, 0.98) 100%
        ),
        url("/uploads/levoyageurmystique/image_files/background/4f81752e9395b837b10fd20c4bc850e5.png")
        center center / cover no-repeat fixed !important;
}

/* Partie droite du panier */
#sb_cart_popup .cart-container,
#sb_cart_popup .cart-content,
#sb_cart_popup .right-side{
    background:rgba(2, 13, 47, 0.92) !important;
    border-left:1px solid rgba(226, 184, 75, 0.65) !important;
}

/* Titre : Votre sélection */
#sb_cart_popup .cart-title,
#sb_cart_popup h3,
#sb_cart_popup h2{
    font-size:0 !important;
}

#sb_cart_popup .cart-title::after,
#sb_cart_popup h3::after,
#sb_cart_popup h2::after{
    content:"VOTRE SÉLECTION" !important;
    font-size:26px !important;
    color:#f3d77b !important;
    font-weight:700 !important;
    letter-spacing:1px !important;
}

/* Réafficher les symboles des petits boutons */
#sb_cart_popup button,
#sb_cart_popup .btn{
    color:#f6d87a !important;
    font-size:18px !important;
    text-indent:0 !important;
    opacity:1 !important;
    visibility:visible !important;
}

/* Bouton moins */
#sb_cart_popup button[class*="minus"]::after,
#sb_cart_popup .minus::after{
    content:"−" !important;
    color:#f6d87a !important;
    font-size:26px !important;
}

/* Bouton plus */
#sb_cart_popup button[class*="plus"]::after,
#sb_cart_popup .plus::after{
    content:"+" !important;
    color:#f6d87a !important;
    font-size:24px !important;
}

/* Bouton supprimer */
#sb_cart_popup button[class*="delete"]::after,
#sb_cart_popup button[class*="remove"]::after,
#sb_cart_popup .remove::after{
    content:"×" !important;
    color:#f6d87a !important;
    font-size:24px !important;
}

/* Bouton fermeture du panier */
#sb_cart_popup .close::after,
#sb_cart_popup button[class*="close"]::after{
    content:"×" !important;
    color:#f6d87a !important;
    font-size:24px !important;
}
/* Deuxième bouton : Continuer mes achats */
#sb_cart_popup a[href*="products"],
#sb_cart_popup button[class*="add-more"],
#sb_cart_popup .add-more{
    font-size:0 !important;
}

#sb_cart_popup a[href*="products"]::after,
#sb_cart_popup button[class*="add-more"]::after,
#sb_cart_popup .add-more::after{
    content:"CONTINUER MES ACHATS" !important;
    font-size:16px !important;
    color:#f6d87a !important;
    font-weight:700 !important;
    text-transform:uppercase !important;
}/* =====================================================
   PANIER — CORRECTION FINALE
   ===================================================== */

/* 1. Enlever le grand fond bleu opaque
   pour laisser apparaître le fond du site derrière */
#sb_cart_popup,
#sb_cart_popup .cart-container,
#sb_cart_popup .full-info--cart,
#sb_cart_popup .full-info--cart_cover{
    background:transparent !important;
    background-color:transparent !important;
    background-image:none !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}

/* Partie droite du panier :
   bleu nuit transparent pour voir le décor derrière */
#sb_cart_popup .full-info--cart_module{
    background:
        linear-gradient(
            180deg,
            rgba(3,18,62,0.90) 0%,
            rgba(1,9,35,0.94) 100%
        ) !important;

    border-left:1px solid rgba(230,190,90,0.75) !important;
    box-shadow:-12px 0 35px rgba(0,0,0,0.28) !important;
}


/* =====================================================
   TITRE : VOTRE SÉLECTION
   ===================================================== */

#sb_cart_dialog_title{
    font-family:Georgia, "Times New Roman", serif !important;
    font-size:28px !important;
    font-weight:700 !important;
    font-style:normal !important;
    letter-spacing:1px !important;
    color:#f4d67c !important;
    text-transform:uppercase !important;
    text-shadow:0 0 12px rgba(235,190,74,0.30) !important;
}


/* =====================================================
   ÉCRITURE DU CONTENU DU PANIER
   ===================================================== */

#sb_cart_popup .full-info--cart_body,
#sb_cart_popup .full-info--cart_item-info{
    font-family:Georgia, "Times New Roman", serif !important;
    font-style:normal !important;
    color:#ffffff !important;
}

/* Noms des produits */
#sb_cart_popup .full-info--cart_item-info{
    font-size:15px !important;
    line-height:1.35 !important;
    font-weight:600 !important;
}


/* =====================================================
   CHIFFRES ET PRIX PLUS LISIBLES
   ===================================================== */

#sb_cart_popup .full-info--cart_item-price,
#sb_cart_popup .full-info--cart_item-controls,
#sb_cart_popup .full-info--cart_price-info,
#sb_cart_popup .full-info--cart_price-info *,
#sb_cart_popup .full-info--cart_item-controls *{
    font-family:Arial, Helvetica, sans-serif !important;
    font-style:normal !important;
    font-weight:700 !important;
    letter-spacing:0 !important;
}

/* Prix des produits */
#sb_cart_popup .full-info--cart_item-price{
    color:#f4d67c !important;
    font-size:16px !important;
}

/* Quantité entre le moins et le plus */
#sb_cart_popup .full-info--cart_item-controls{
    color:#ffffff !important;
    font-size:16px !important;
}

/* Total */
#sb_cart_popup .full-info--cart_price-info{
    color:#f4d67c !important;
    font-size:17px !important;
}

}#sb_cart_popup .sb-cart-popup-close{
    color:transparent !important;
    font-size:0 !important;
    line-height:0 !important;
    text-indent:-9999px !important;
    overflow:hidden !important;
    position:relative !important;
}

#sb_cart_popup .sb-cart-popup-close::after{
    content:"CONTINUER MES ACHATS";
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;

    font-family:Georgia,"Times New Roman",serif;
    font-size:16px;
    font-weight:700;
    color:#f6d87a;
    text-indent:0;
}#sb_cart_dialog_title i,
#sb_cart_popup .fa-shopping-cart,
#sb_cart_popup .fa-cart-shopping,
#sb_cart_popup svg{
    color:#f6d87a !important;
    fill:#f6d87a !important;
}

/* =====================================================
   PETITS BOUTONS −  +  ×
   ===================================================== */

#sb_cart_popup .full-info--cart_item-controls button,
#sb_cart_popup .full-info--cart_close-btn{
    font-family:Arial, Helvetica, sans-serif !important;
    font-style:normal !important;
    font-weight:700 !important;
    color:#f6d87a !important;

}



    font-family:Georgia,"Times New Roman",serif;
    font-size:17px;
    font-weight:700;
    color:#f6d87a;
    text-indent:0;
}#sb_cart_popup .sb-cart-popup-close{
    color:transparent !important;
    font-size:0 !important;
    line-height:0 !important;
    text-indent:-9999px !important;
    overflow:hidden !important;
    position:relative !important;
}

#sb_cart_popup .sb-cart-popup-close::after{
    content:"CONTINUER MES ACHATS";
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;

    font-family:Georgia,"Times New Roman",serif;
    font-size:16px;
    font-weight:700;
    color:#f6d87a;
    text-indent:0;
}#sb_cart_dialog_title i,
#sb_cart_popup .fa-shopping-cart,
#sb_cart_popup .fa-cart-shopping,
#sb_cart_popup svg{
    color:#f6d87a !important;
    fill:#f6d87a !important;
}/* =====================================================
   PANIER — CORRECTION DES TEXTES + ICÔNE DORÉE
   ===================================================== */

/* Titre du panier */
#sb_cart_dialog_title{
    font-family:Georgia, "Times New Roman", serif !important;
    font-size:30px !important;
    font-weight:700 !important;
    font-style:normal !important;
    letter-spacing:1px !important;
    color:#f4d67c !important;
    text-transform:uppercase !important;
    text-shadow:0 0 12px rgba(244,214,124,.35) !important;
}

/* Petit caddie doré */
#sb_cart_dialog_title::before,
#sb_cart_dialog_title i,
#sb_cart_dialog_title svg,
#sb_cart_popup .title--has-icon::before{
    color:#f4d67c !important;
    fill:#f4d67c !important;
}

/* Bouton CONTINUER MES ACHATS */
#sb_cart_popup .sb-checkout-block >
button.btn.btn-primary-outline.sb-cart-popup-close{
    font-size:0 !important;
    color:transparent !important;
    text-indent:-9999px !important;
    overflow:hidden !important;
    position:relative !important;
}

#sb_cart_popup .sb-checkout-block >
button.btn.btn-primary-outline.sb-cart-popup-close::before{
    content:none !important;
    display:none !important;
}

#sb_cart_popup .sb-checkout-block >
button.btn.btn-primary-outline.sb-cart-popup-close::after{
    content:"CONTINUER MES ACHATS" !important;
    position:absolute !important;
    inset:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    font-family:Georgia, "Times New Roman", serif !important;
    font-size:16px !important;
    font-weight:700 !important;
    color:#f6d87a !important;
    text-indent:0 !important;
    line-height:1 !important;
}/* =====================================================
   PANIER — SUPPRESSION DES TEXTES SUPERPOSÉS
   ===================================================== */

}


/* On masque réellement le texte original du second bouton */
#sb_cart_popup .sb-checkout-block > button.sb-cart-popup-close{
    position:relative !important;
    color:transparent !important;
    font-size:0 !important;
    line-height:0 !important;
    text-indent:-9999px !important;
    text-shadow:none !important;
    overflow:hidden !important;
}

/* Un seul nouveau texte, sans le X parasite */
#sb_cart_popup .sb-checkout-block > button.sb-cart-popup-close::before{
    content:"CONTINUER MES ACHATS" !important;
    display:flex !important;
    position:absolute !important;
    inset:0 !important;
    align-items:center !important;
    justify-content:center !important;

    color:#f6d87a !important;
    font-family:Georgia, "Times New Roman", serif !important;
    font-size:16px !important;
    line-height:1.2 !important;
    font-weight:700 !important;
    letter-spacing:.4px !important;
    text-indent:0 !important;
    text-transform:uppercase !important;
}/* =====================================================
   PANIER — CORRECTION FINALE DES DEUX BOUTONS
   ===================================================== */

/* Enlever l’encadrement global autour des deux boutons */
#sb_cart_popup .sb-checkout-block,
#sb_cart_popup .btn-bar.sb-checkout-block{
    border:none !important;
    outline:none !important;
    box-shadow:none !important;
    background:transparent !important;
    padding:0 !important;

}/* =====================================================
   TÉLÉPHONE — REMONTER LE TITRE DE LA PAGE D’ACCUEIL
   ===================================================== */

/* =====================================================
   ACCUEIL MOBILE — SUPPRESSION DU GRAND ESPACE VIDE
   ===================================================== */

/* =====================================================
   ACCUEIL MOBILE — SUPPRIMER LE GRAND VIDE
   Cible exacte du thème SimplyBook
   ===================================================== */

/* PANIER — BOUTON FINALISER PROPRE */

#sb_cart_checkout_btn{
    font-size:0 !important;
    color:transparent !important;
    text-shadow:none !important;
    position:relative !important;
    overflow:hidden !important;
}

#sb_cart_checkout_btn::before,
#sb_cart_checkout_btn::after{
    content:none !important;
    display:none !important;
}

#sb_cart_checkout_btn::after{
    content:"FINALISER MA COMMANDE" !important;
    display:flex !important;
    position:absolute !important;
    inset:0 !important;
    align-items:center !important;
    justify-content:center !important;
    color:#f6d87a !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:17px !important;
    font-weight:700 !important;
    line-height:1.2 !important;
    text-indent:0 !important;
    white-space:nowrap !important;
}

/* Enlever le cadre autour des deux boutons */
#sb_cart_popup .sb-checkout-block{
    border:none !important;
    outline:none !important;
    box-shadow:none !important;
    background:transparent !important;
    padding:0 !important;
}/* =========================================================
   PANIER — BOUTONS SANS AUCUN TEXTE SUPERPOSÉ
   ========================================================= */

/* Supprimer tous les anciens textes artificiels */
html body #sb_cart_popup #sb_cart_checkout_btn::before,
html body #sb_cart_popup #sb_cart_checkout_btn::after,
html body #sb_cart_popup #sb_cart_checkout_btn *::before,
html body #sb_cart_popup #sb_cart_checkout_btn *::after,

html body #sb_cart_popup button.sb-cart-popup-close::before,
html body #sb_cart_popup button.sb-cart-popup-close::after,
html body #sb_cart_popup button.sb-cart-popup-close *::before,
html body #sb_cart_popup button.sb-cart-popup-close *::after {
    content: none !important;
    display: none !important;
    visibility: hidden !important;
}

/* Masquer les véritables textes présents dans les boutons */
html body #sb_cart_popup #sb_cart_checkout_btn,
    text-indent: -99999px !important;
    text-shadow: none !important;
    overflow: hidden !important;
    position: relative !important;
}


/* =========================================================
   PREMIER BOUTON : FINALISER MA COMMANDE
   ========================================================= */

html body #sb_cart_popup #sb_cart_checkout_btn {
    min-height: 52px !important;

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='70' viewBox='0 0 900 70'%3E%3Ctext x='450' y='43' text-anchor='middle' font-family='Georgia,Times New Roman,serif' font-size='23' font-weight='700' fill='%23f6d87a'%3EFINALISER MA COMMANDE%3C/text%3E%3C/svg%3E"),
        linear-gradient(180deg,#1764ff 0%25,#07319d 100%25) !important;

    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 100% 100%, 100% 100% !important;

    border: 1px solid #e6bd5b !important;
    border-radius: 28px !important;
}


/* =========================================================
   DEUXIÈME BOUTON : CONTINUER MES ACHATS
   ========================================================= */

html body #sb_cart_popup button.btn.btn--primary-outline.sb-cart-popup-close {
    min-height: 52px !important;
    margin-top: 10px !important;

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='70' viewBox='0 0 900 70'%3E%3Ctext x='450' y='43' text-anchor='middle' font-family='Georgia,Times New Roman,serif' font-size='23' font-weight='700' fill='%23f6d87a'%3ECONTINUER MES ACHATS%3C/text%3E%3C/svg%3E"),
        linear-gradient(180deg,#1764ff 0%25,#07319d 100%25) !important;

    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 100% 100%, 100% 100% !important;

    border: 1px solid #e6bd5b !important;
    border-radius: 28px !important;
}


/* =========================================================
   ENLEVER L’ENCADREMENT AUTOUR DES DEUX BOUTONS
   ========================================================= */

html body #sb_cart_popup .btn-bar.sb-checkout-block,
html body #sb_cart_popup .sb-checkout-block,
html body #sb_cart_popup .full-info--cart_footer,
html body #sb_cart_popup .full-info--cart_footer::before,
html body #sb_cart_popup .full-info--cart_footer::after {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}/* =========================================================
   PANIER — CORRECTION DES DEUX BOUTONS
   ========================================================= */

/* Supprimer les anciens textes ajoutés autour du panier */
html body #sb_cart_popup .sb-checkout-block::before,
html body #sb_cart_popup .sb-checkout-block::after,
html body #sb_cart_popup .btn-bar::before,
html body #sb_cart_popup .btn-bar::after,
html body #sb_cart_popup #sb_cart_package_link,
html body #sb_cart_popup #sb_cart_package_link::before,
html body #sb_cart_popup #sb_cart_package_link::after {
    content: none !important;
    display: none !important;
}

/* Enlever l’encadrement qui englobe les deux boutons */
html body #sb_cart_popup .btn-bar.sb-checkout-block,
html body #sb_cart_popup .sb-checkout-block {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
}

/* =========================================================
   PREMIER BOUTON
   ========================================================= */

html body #sb_cart_popup button#sb_cart_checkout_btn {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 52px !important;
    overflow: hidden !important;

    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    text-indent: 0 !important;
    text-shadow: none !important;
}

html body #sb_cart_popup button#sb_cart_checkout_btn::before {
    content: none !important;
    display: none !important;
}

html body #sb_cart_popup button#sb_cart_checkout_btn::after {
    content: "FINALISER MA COMMANDE" !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: absolute !important;
    inset: 0 !important;

    color: #f6d87a !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px !important;
    text-indent: 0 !important;
    white-space: nowrap !important;
}

/* =========================================================
   DEUXIÈME BOUTON
   ========================================================= */

html body #sb_cart_popup button.btn.btn--primary-outline.sb-cart-popup-close {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 52px !important;
    margin-top: 10px !important;
    overflow: hidden !important;

    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    text-indent: 0 !important;
    text-shadow: none !important;
}

html body #sb_cart_popup button.btn.btn--primary-outline.sb-cart-popup-close::before {
    content: none !important;
    display: none !important;
}

html body #sb_cart_popup button.btn.btn--primary-outline.sb-cart-popup-close::after {
    content: "CONTINUER MES ACHATS" !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: absolute !important;
    inset: 0 !important;

    color: #f6d87a !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px !important;
    text-indent: 0 !important;
    white-space: nowrap !important;
}/* PANIER — SUPPRIMER LES +, − ET × EN DOUBLE */

#sb_cart_popup .full-info--cart_item-controls button::before,
#sb_cart_popup .full-info--cart_item-controls button::after,
#sb_cart_popup .full-info--cart_item-controls .btn::before,
#sb_cart_popup .full-info--cart_item-controls .btn::after {
    content: none !important;
    display: none !important;
}/* =====================================================
   PANIER — REMETTRE −, + ET × UNE SEULE FOIS
   ===================================================== */

/* Empêcher les anciens textes de flotter sur le fond du panier */
#sb_cart_popup .sb-cart-popup-close:not(button)::before,
#sb_cart_popup .sb-cart-popup-close:not(button)::after,
#sb_cart_popup .full-info--cart_cover::before,
#sb_cart_popup .full-info--cart_cover::after {
    content: none !important;
    display: none !important;
}

/* Préparation des petits boutons */
#sb_cart_popup .full-info--cart_item-controls button {
    position: relative !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    text-indent: 0 !important;
    overflow: hidden !important;
}

/* Supprimer tous les anciens signes artificiels */
#sb_cart_popup .full-info--cart_item-controls button::before {
    content: none !important;
    display: none !important;
}

/* Bouton MOINS */
#sb_cart_popup
.full-info--cart_item-controls:not(:last-child)
button:first-child::after {
    content: "−" !important;
}

/* Bouton PLUS */
#sb_cart_popup
.full-info--cart_item-controls:not(:last-child)
button:last-child::after {
    content: "+" !important;
}

/* Bouton SUPPRIMER */
#sb_cart_popup
.full-info--cart_item-controls:last-child
button::after {
    content: "×" !important;
}

/* Apparence commune des trois signes */
#sb_cart_popup .full-info--cart_item-controls button::after {
    display: flex !important;
    position: absolute !important;
    inset: 0 !important;
    align-items: center !important;
    justify-content: center !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 25px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    color: #f6d87a !important;
    text-indent: 0 !important;
    text-shadow: none !important;
    visibility: visible !important;
    opacity: 1 !important;
}/* =====================================================
   PANIER — TEXTE DES DEUX GRANDS BOUTONS
   ===================================================== */

/* Premier bouton */
html body #sb_cart_popup
.btn-bar.sb-checkout-block
button#sb_cart_checkout_btn {
    position: relative !important;
    font-size: 0 !important;
    color: transparent !important;
    text-indent: 0 !important;
    overflow: hidden !important;
}

html body #sb_cart_popup
.btn-bar.sb-checkout-block
button#sb_cart_checkout_btn::before {
    content: "FINALISER MA COMMANDE" !important;
    display: flex !important;
    position: absolute !important;
    inset: 0 !important;
    align-items: center !important;
    justify-content: center !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    color: #f6d87a !important;
    text-indent: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
}

/* Deuxième bouton */
html body #sb_cart_popup
.btn-bar.sb-checkout-block
button.sb-cart-popup-close {
    position: relative !important;
    font-size: 0 !important;
    color: transparent !important;
    text-indent: 0 !important;
    overflow: hidden !important;
}

html body #sb_cart_popup
.btn-bar.sb-checkout-block
button.sb-cart-popup-close::before {
    content: "CONTINUER MES ACHATS" !important;
    display: flex !important;
    position: absolute !important;
    inset: 0 !important;
    align-items: center !important;
    justify-content: center !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 18px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    color: #f6d87a !important;
    text-indent: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
}/* CROIX DU PETIT BOUTON ROND — SANS BLOQUER LA PAGE */

#sb_cart_popup button.full-info--cart_close-btn{
    color: transparent !important;
    font-size: 0 !important;
    text-indent: 0 !important;
    position: relative !important;
}

#sb_cart_popup button.full-info--cart_close-btn::before,
#sb_cart_popup button.full-info--cart_close-btn::after{
    content: none !important;
    display: none !important;
}

#sb_cart_popup button.full-info--cart_close-btn::after{
    content: "×" !important;
    display: block !important;
    position: static !important;

    color: #f6d87a !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 27px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
}/* CROIX DU PANIER — CORRECTION DÉFINITIVE */

html body #sb_cart_popup
button.sb-cart-popup-close.full-info--cart_close-btn {
    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    text-indent: 0 !important;
    font-size: 0 !important;
    line-height: 1 !important;
    color: transparent !important;

    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Neutralise seulement les anciens faux textes */
html body #sb_cart_popup
button.sb-cart-popup-close.full-info--cart_close-btn::before {
    content: none !important;
    display: none !important;
}

/* Recrée la croix */
html body #sb_cart_popup
button.sb-cart-popup-close.full-info--cart_close-btn::after {
    content: "×" !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: absolute !important;
    inset: 0 !important;

    text-indent: 0 !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 28px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    color: #f6d87a !important;

    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
}/* MOBILE — réduction de l’espace avant le titre principal */
/* MOBILE — remonter le titre et supprimer le grand vide */

/* ==========================================================
   LE VOYAGEUR MYSTIQUE — V2 STABILITÉ RESPONSIVE
   Bloc unique de normalisation mobile/tablette
   ========================================================== */

/* Empêche les anciens déplacements artificiels de pages. */
#sb_main,
#main,
#main-content,
#sb-timeline,
#steps,
#steps-content,
#content-view {
    scroll-margin-top: 0 !important;
}

/* TABLETTE */
@media screen and (min-width: 769px) and (max-width: 1100px) {
    #header .column,
    #header .container,
    #header .container-fluid {
        padding-left: 235px !important;
        padding-right: 20px !important;
    }

    #header::before {
        left: 18px !important;
        width: 195px !important;
    }

    #main-buttons .company-name,
    #main-buttons h1,
    #main-buttons .title-main,
    .company-name {
        font-size: clamp(48px, 7vw, 72px) !important;
    }

    .step-content--product > div,
    #sb_list_container > div {
        gap: 20px !important;
        padding-left: 18px !important;
        padding-right: 18px !important;
    }
}

/* TÉLÉPHONE */
@media screen and (max-width: 768px) {
    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* HEADER */
    #header {
        min-height: 145px !important;
        height: auto !important;
        padding: 10px 0 12px !important;
    }

    #header::before {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        transform: none !important;
        width: calc(100% - 110px) !important;
        max-width: 330px !important;
        min-height: 58px !important;
        margin: 0 auto 8px !important;
        padding: 8px 14px !important;
        font-size: 13px !important;
    }

    #header .column,
    #header .container,
    #header .container-fluid {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin: 0 auto !important;
    }

    /* ACCUEIL — une seule logique de hauteur, aucun translateY */
    body #main #main-buttons,
    #sb_main.page--index #main-buttons,
    #main-buttons {
        position: relative !important;
        top: auto !important;
        transform: none !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        width: 100% !important;
        height: auto !important;
        min-height: min(78vh, 680px) !important;
        max-height: none !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    body #main #main-buttons > .container-fluid.column,
    body #main #main-buttons > .container-fluid,
    body #main #main-buttons .wrapper,
    #main-buttons .wrapper {
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        min-height: min(78vh, 680px) !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
    }

    body #main #main-buttons .wrapper > .inner,
    #main #main-buttons .wrapper .inner,
    #main-buttons .wrapper .inner {
        position: relative !important;
        inset: auto !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        transform: none !important;
        width: 100% !important;
        min-height: min(78vh, 680px) !important;
        height: auto !important;
        box-sizing: border-box !important;
        padding: clamp(92px, 18vh, 145px) 18px 58px !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
    }

    #main-buttons .company-name,
    #main-buttons h1,
    #main-buttons .title-main,
    .company-name {
        width: 100% !important;
        max-width: 94vw !important;
        margin: 0 auto 28px !important;
        font-size: clamp(34px, 10vw, 48px) !important;
        line-height: 1.02 !important;
        letter-spacing: clamp(1px, 0.8vw, 3px) !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    #main-buttons .company-name::after,
    #main-buttons h1::after,
    #main-buttons .title-main::after,
    .company-name::after {
        width: min(76vw, 340px) !important;
        margin-top: 16px !important;
    }

    #main-buttons .btn,
    #main-buttons button,
    #main-buttons input[type="submit"] {
        width: min(88vw, 360px) !important;
        min-width: 0 !important;
        min-height: 52px !important;
        padding: 12px 18px !important;
        font-size: 15px !important;
    }

    /* PAGES INTÉRIEURES — jamais de remontée artificielle */
    #sb_main.page--booking #main-content,
    #sb_main.page--booking #sb-timeline,
    #sb_main.page--booking #steps,
    #sb_main.page--booking #steps-content,
    #sb_main.page--booking #content-view,
    #sb_booking_content {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        transform: none !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Frise de réservation : visible et compacte. */
    #sb_main.page--booking #sb_booking_info,
    #sb_booking_info {
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    #sb_booking_info .booking-info,
    #sb_booking_info .booking-info ul.clearfix,
    #steps-nav {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #sb_booking_info .booking-info {
        padding: 10px 4px 9px !important;
    }

    #sb_booking_info .booking-info ul.clearfix,
    #steps-nav {
        display: flex !important;
        align-items: flex-start !important;
        justify-content: space-between !important;
        gap: 0 !important;
        padding: 0 !important;
    }

    #sb_booking_info .step_info_item,
    #steps-nav li {
        flex: 1 1 20% !important;
        min-width: 0 !important;
        padding: 0 2px !important;
    }

    #sb_booking_info .step_info_item > a,
    #steps-nav li > a {
        min-height: 58px !important;
        padding: 0 !important;
        font-size: 9px !important;
        line-height: 1.08 !important;
        letter-spacing: 0 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    #sb_booking_info .step_info_item > a::before,
    #steps-nav li > a::before {
        width: 30px !important;
        height: 30px !important;
        margin-bottom: 5px !important;
        font-size: 12px !important;
    }

    #sb_booking_info .step_info_item:not(:last-child)::after,
    #steps-nav li:not(:last-child)::after {
        display: none !important;
    }

    /* Fuseau horaire */
    #time-settings {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        min-height: 0 !important;
        padding: 8px 12px !important;
        box-sizing: border-box !important;
    }

    #sb_booking_company_time {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: min(100%, 330px) !important;
        max-width: 330px !important;
        margin: 0 auto !important;
        padding: 11px 44px 11px 15px !important;
        font-size: 13px !important;
    }

    /* CALENDRIER — largeur et alignement stables */
    .datetime-step,
    .datetime-step .section-pd,
    .weeks-date,
    .calendar,
    #sb_time_slots_container,
    .time-container {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .weeks-date,
    .calendar {
        overflow: visible !important;
    }

    .weeks-date table,
    .calendar table,
    .datetime-step table {
        width: 100% !important;
        table-layout: fixed !important;
        border-collapse: separate !important;
        border-spacing: 2px !important;
    }

    .weeks-date th,
    .weeks-date td,
    .calendar th,
    .calendar td,
    .datetime-step th,
    .datetime-step td {
        width: 14.2857% !important;
        min-width: 0 !important;
        max-width: 14.2857% !important;
        box-sizing: border-box !important;
        padding-left: 1px !important;
        padding-right: 1px !important;
        text-align: center !important;
        vertical-align: middle !important;
    }

    .weeks-date th,
    .calendar th,
    .datetime-step th {
        font-size: clamp(9px, 2.7vw, 12px) !important;
        line-height: 1.05 !important;
        white-space: nowrap !important;
    }

    .weeks-date td,
    .calendar td,
    .datetime-step td {
        font-size: clamp(11px, 3.2vw, 14px) !important;
    }

    /* CARTES / BOUTIQUE */
    .step-content--product > div,
    #sb_list_container > div {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 18px 12px 34px !important;
        box-sizing: border-box !important;
    }

    .product-item.item,
    [class*="product-card"],
    [class*="product-item"] {
        float: none !important;
        width: 100% !important;
        max-width: 440px !important;
        margin: 0 auto 20px !important;
        box-sizing: border-box !important;
    }

    .product-item img,
    [class*="product-card"] img,
    [class*="product-item"] img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        object-fit: cover !important;
    }

    /* FORMULAIRES */
    input,
    select,
    textarea,
    .form-control {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Modales/panier : pas de débordement horizontal */
    #sb_cart_popup,
    #sb_cart_popup .modal-content,
    [class*="cart-popup"],
    [class*="cart-modal"] {
        max-width: 100vw !important;
        box-sizing: border-box !important;
    }
}

/* PETITS TÉLÉPHONES */
@media screen and (max-width: 390px) {
    #header::before {
        width: calc(100% - 100px) !important;
        font-size: 12px !important;
    }

    #main-buttons .company-name,
    #main-buttons h1,
    #main-buttons .title-main,
    .company-name {
        font-size: 34px !important;
        letter-spacing: 1px !important;
    }

    #sb_booking_info .step_info_item > a,
    #steps-nav li > a {
        font-size: 8px !important;
    }

    .weeks-date th,
    .calendar th,
    .datetime-step th {
        font-size: 9px !important;
    }
}
/* ==========================================================
   LE VOYAGEUR MYSTIQUE
   PANIER + COMPTE — VERSION PRESTIGE
   ========================================================== */


/* ----------------------------------------------------------
   BOUTON PANIER
   ---------------------------------------------------------- */

#header #sb_cart .cart-container .sb-cart-btn {

    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;

    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background:
        radial-gradient(
            circle at 50% 25%,
            rgba(28, 77, 175, 0.28) 0%,
            rgba(5, 24, 66, 0.98) 68%,
            rgba(2, 12, 36, 1) 100%
        ) !important;

    border: 1.5px solid #d7ad56 !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 12px rgba(215, 173, 86, 0.18),
        inset 0 0 15px rgba(40, 92, 210, 0.10) !important;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease !important;
}


/* Icône panier */
#header #sb_cart .cart-container .sb-cart-btn .fa-shopping-cart {

    color: #f2d88d !important;

    font-size: 21px !important;

    text-shadow:
        0 0 7px rgba(215, 173, 86, 0.25) !important;
}


/* ----------------------------------------------------------
   COMPTE / CONNEXION
   ---------------------------------------------------------- */

#header #sb_client_info .login-container .avatar.item-container {

    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;

    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background:
        radial-gradient(
            circle at 50% 25%,
            rgba(28, 77, 175, 0.28) 0%,
            rgba(5, 24, 66, 0.98) 68%,
            rgba(2, 12, 36, 1) 100%
        ) !important;

    border: 1.5px solid #d7ad56 !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 12px rgba(215, 173, 86, 0.18),
        inset 0 0 15px rgba(40, 92, 210, 0.10) !important;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease !important;
}


/* Icône SVG connexion */
#header #sb_client_info
.login-container
.avatar.item-container
svg {

    width: 21px !important;
    height: 21px !important;

    color: #f2d88d !important;
}


/* Traits de l'icône */
#header #sb_client_info
.login-container
.avatar.item-container
svg path {

    stroke: #f2d88d !important;
}


/* ----------------------------------------------------------
   COMPTEUR PANIER
   ---------------------------------------------------------- */

#header #sb_cart .counter.sb-qty {

    position: absolute !important;

    top: -4px !important;
    right: -5px !important;

    min-width: 19px !important;
    height: 19px !important;

    padding: 0 5px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #e4bd62 !important;

    color: #06183d !important;

    border: 1px solid #071b42 !important;
    border-radius: 20px !important;

    font-family: Georgia, serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;

    line-height: 1 !important;

    box-shadow:
        0 0 8px rgba(215, 173, 86, 0.40) !important;
}


/* Le parent doit servir de repère au compteur */
#header #sb_cart .cart-container {

    position: relative !important;
}


/* ----------------------------------------------------------
   SURVOL ORDINATEUR
   ---------------------------------------------------------- */

@media (hover:hover) {

    #header #sb_cart .cart-container .sb-cart-btn:hover,
    #header #sb_client_info .login-container .avatar.item-container:hover {

        transform: translateY(-2px) scale(1.04) !important;

        border-color: #f4d98d !important;

        box-shadow:
            0 0 21px rgba(215, 173, 86, 0.36),
            inset 0 0 17px rgba(40, 92, 210, 0.15) !important;
    }
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media screen and (max-width: 768px) {

    #header #sb_cart .cart-container .sb-cart-btn,
    #header #sb_client_info .login-container .avatar.item-container {

        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;

        border-width: 1px !important;
    }


    #header #sb_cart .cart-container .sb-cart-btn .fa-shopping-cart {

        font-size: 18px !important;
    }


    #header #sb_client_info
    .login-container
    .avatar.item-container
    svg {

        width: 18px !important;
        height: 18px !important;
    }


    #header #sb_cart .counter.sb-qty {

        top: -5px !important;
        right: -5px !important;

        min-width: 17px !important;
        height: 17px !important;

        font-size: 9px !important;
    }
}
/* ==========================================================
   MOBILE FINAL — HEADER + ACCUEIL
   Objectif :
   [Panier] [Compte]     [Menu]        [Payer]
   + réduction de l'espace avant le titre
   ========================================================== */

@media screen and (max-width: 768px) {

  /* ---------- HEADER ---------- */

  #header {
    position: relative !important;
  }

  #header .container-fluid,
  #header .row,
  #header .header-controls {
    position: relative !important;
  }

  #header .header-controls {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 64px !important;

    margin: 0 !important;
    padding: 0 !important;
  }


  /* ---------- PANIER + COMPTE À GAUCHE ---------- */

  #header .items-wrapper {
    position: absolute !important;

    left: 14px !important;
    right: auto !important;

    top: 50% !important;
    transform: translateY(-50%) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    gap: 8px !important;

    width: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    z-index: 40 !important;
  }

  #header #sb_cart,
  #header #sb_client_info {
    position: relative !important;

    margin: 0 !important;
    padding: 0 !important;

    width: auto !important;
    height: auto !important;
  }

  #header #sb_cart .cart-container .sb-cart-btn,
  #header #sb_client_info .login-container .avatar.item-container {
    width: 42px !important;
    height: 42px !important;

    min-width: 42px !important;
    min-height: 42px !important;

    margin: 0 !important;
  }


  /* ---------- HAMBURGER CENTRÉ DANS L'ÉCRAN ---------- */

  #header .nav-trigger {
    position: absolute !important;

    left: 50vw !important;
    right: auto !important;

    top: 50% !important;

    transform: translate(-50%, -50%) !important;

    width: 46px !important;
    height: 46px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    z-index: 45 !important;
  }

  #header .nav-trigger .fa-bars {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
  }


  /* ---------- BOUTON PAYER À DROITE ---------- */

  #paypal-float {
    position: absolute !important;

    right: 12px !important;
    left: auto !important;

    top: 50% !important;
    bottom: auto !important;

    transform: translateY(-50%) !important;

    margin: 0 !important;

    padding: 9px 15px !important;

    font-size: 13px !important;

    z-index: 50 !important;
  }

  #paypal-float:hover {
    transform: translateY(-50%) scale(1.04) !important;
  }


  /* ======================================================
     SUPPRESSION DU GROS ESPACE AVANT "LE VOYAGEUR MYSTIQUE"
     ====================================================== */

  .index-page #main-buttons {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .index-page #main-buttons .container-fluid,
  .index-page #main-buttons .wrapper {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .index-page #main-buttons .inner {
    margin-top: 0 !important;

    padding-top: 18px !important;
    padding-bottom: 32px !important;
  }

  .index-page #main-buttons .company-name,
  .index-page #main-buttons .company-logo-and-name {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .index-page #main-buttons .company-name {
    margin-bottom: 12px !important;
  }


  /* ---------- VERSION TRÈS PETITS TÉLÉPHONES ---------- */

  @media screen and (max-width: 390px) {

    #header .items-wrapper {
      left: 9px !important;
      gap: 5px !important;
    }

    #header #sb_cart .cart-container .sb-cart-btn,
    #header #sb_client_info .login-container .avatar.item-container {
      width: 38px !important;
      height: 38px !important;

      min-width: 38px !important;
      min-height: 38px !important;
    }

    #header .nav-trigger {
      width: 42px !important;
      height: 42px !important;
    }

    #paypal-float {
      right: 8px !important;

      padding: 8px 11px !important;

      font-size: 12px !important;
    }

  }

}
/* =========================================================
   HEADER - VERSION SÛRE
   NE TOUCHE PAS AU CONTENEUR DU MENU
   ========================================================= */


/* =========================================================
   ORDINATEUR
   ========================================================= */

@media screen and (min-width: 768px) {

    /* On éloigne seulement panier + connexion de PayPal */
    #header .items-wrapper {
        margin-right: 185px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 767px) {

    /*
       IMPORTANT :
       on NE modifie PAS .header-controls
       on NE modifie PAS .nav-wrapper
       on NE modifie PAS #sb_menu
       donc le menu déroulant reste géré normalement par SimplyBook.
    */


    /* -----------------------------------------------------
       HAMBURGER
       ----------------------------------------------------- */

    #header .nav-trigger {
        position: relative !important;

        left: -32px !important;
        right: auto !important;

        top: auto !important;

        transform: none !important;

        width: 40px !important;
        height: 40px !important;

        min-width: 40px !important;
        min-height: 40px !important;

        margin: 0 auto !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border: 1.5px solid #d7ad56 !important;
        border-radius: 50% !important;

        background:
            linear-gradient(
                180deg,
                #071b42 0%,
                #020917 100%
            ) !important;

        box-shadow:
            0 0 10px rgba(215, 173, 86, 0.24),
            inset 0 0 7px rgba(20, 89, 215, 0.18)
            !important;

        z-index: 40 !important;
    }


    /* Icône hamburger */

    #header .nav-trigger .fa-bars {
        color: #f2d88d !important;

        font-size: 18px !important;
        line-height: 1 !important;

        width: auto !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;

        text-shadow:
            0 0 5px rgba(242, 216, 141, 0.25)
            !important;
    }


    /* -----------------------------------------------------
       PANIER + CONNEXION
       ----------------------------------------------------- */

    #header .items-wrapper {
        position: absolute !important;

        left: 12px !important;
        right: auto !important;

        top: 50% !important;

        transform: translateY(-50%) !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;

        gap: 6px !important;

        z-index: 45 !important;
    }


    #header #sb_cart,
    #header #sb_client_info {
        position: relative !important;

        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;

        margin: 0 !important;

        transform: none !important;
    }

}
/* =========================================================
   CORRECTION ESPACE FANTÔME DU PANIER - MOBILE
   ========================================================= */

@media screen and (max-width: 767px) {

    /* Le conteneur du panier fermé ne doit plus prendre
       toute la hauteur du téléphone dans la page */
    #sb_cart_popup {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;

        height: 0 !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
        z-index: 9999 !important;
    }

    /* Petit espace propre entre le header et le contenu */
    #main {
        margin-top: 14px !important;
    }
}
/* =========================================================
   MOBILE — ZONE TACTILE HAMBURGER PLUS GRANDE
   Ne change PAS sa position ni son apparence
   ========================================================= */

@media screen and (max-width: 767px) {

    #header .nav-trigger {
        width: 48px !important;
        height: 48px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        cursor: pointer !important;
    }

}/* =========================================================
   MOBILE — EMPÊCHER PANIER/CONNEXION DE RECOUVRIR HAMBURGER
   ========================================================= */

@media screen and (max-width: 767px) {

    #header .items-wrapper {
        width: auto !important;
        max-width: 110px !important;
        right: auto !important;
    }

    #header .nav-trigger {
        z-index: 100 !important;
        pointer-events: auto !important;
    }

}
/* =========================================================
   MOBILE — CARTES DE PRESTATIONS PLUS COMPACTES
   ========================================================= */

@media screen and (max-width: 767px) {

    /* Carte prestation */
    #sb_booking_content .service-item .tab-pd {
        padding: 8px 8px 10px !important;
        margin: 0 !important;
    }

    /* Image */
    #sb_booking_content .service-item img.user-img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
    }

    /* Zone texte */
    #sb_booking_content .service-item .content {
        padding: 6px 8px 4px !important;
        margin: 0 !important;
    }

    /* Ligne durée + prix */
    #sb_booking_content .service-item .bar-service {
        min-height: 0 !important;
        height: auto !important;

        margin: 0 !important;
        padding: 5px 8px !important;

        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
    }

    /* Prix */
    #sb_booking_content .service-item .bar-service .service-price,
    #sb_booking_content .service-item .bar-service [class*="price"] {
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        letter-spacing: 0 !important;
    }

    /* Zone du bouton */
    #sb_booking_content .service-item .btn-bar {
        min-height: 0 !important;
        height: auto !important;

        margin: 0 !important;
        padding: 8px !important;
    }

    #sb_booking_content .service-item .btn.select.custom {
        min-height: 0 !important;
        height: auto !important;

        margin: 0 auto !important;
        padding: 0 !important;
    }

    /* Vrai bouton SÉLECTIONNER */
    #sb_booking_content .service-item .btn.select.custom a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 36px !important;
        height: 36px !important;

        margin: 0 auto !important;
        padding: 0 18px !important;

        font-size: 12px !important;
        line-height: 1 !important;

        width: auto !important;
        max-width: 170px !important;
    }
}
/* =========================================================
   MOBILE — BOUTIQUE + BAS DE PAGE
   ========================================================= */

@media screen and (max-width: 767px) {

    /* =====================================================
       1 — BOUTIQUE : CARTES DE CATÉGORIES PLUS PETITES
       ===================================================== */

    #product-view .product-item {
        width: calc(100% - 28px) !important;
        max-width: 330px !important;

        margin: 10px auto !important;
        padding: 0 !important;

        min-height: 0 !important;
        height: auto !important;
    }


    #product-view .product-item .tab-pd {
        padding: 7px 8px 9px !important;
        margin: 0 !important;

        min-height: 0 !important;
        height: auto !important;
    }


    /* Image catégorie */
    #product-view .product-item img.user-img,
    #product-view .product-item img.sb-buy-user-img {
        width: 100% !important;
        height: auto !important;

        display: block !important;

        margin: 0 !important;
    }


    /* Zone sous l'image */
    #product-view .product-item .content {
        padding: 5px 8px !important;
        margin: 0 !important;

        min-height: 0 !important;
        height: auto !important;
    }


    /* Titre / texte */
    #product-view .product-item .txt.short {
        margin: 0 !important;
        padding: 4px 6px !important;

        font-size: 12px !important;
        line-height: 1.25 !important;

        min-height: 0 !important;
        height: auto !important;
    }


    /* Zone bouton */
    #product-view .product-item .btn-bar {
        margin: 0 !important;
        padding: 7px 8px !important;

        min-height: 0 !important;
        height: auto !important;
    }


    /* Bouton DÉCOUVRIR / ACHETER */
    #product-view .product-item .btn.select {
        margin: 0 auto !important;
        padding: 0 !important;

        min-height: 0 !important;
        height: auto !important;
    }


    #product-view .product-item .btn.select a {
        min-height: 34px !important;
        height: 34px !important;

        width: auto !important;
        max-width: 170px !important;

        margin: 0 auto !important;
        padding: 0 20px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 11px !important;
        line-height: 1 !important;
    }


    /* =====================================================
       2 — PRIX BOUTIQUE : PLUS PETIT ET LISIBLE
       ===================================================== */

    #product-view .product-item .product-item--title-and-price,
    #product-view .product-item [class*="price"] {

        font-family: Arial, Helvetica, sans-serif !important;

        font-size: 15px !important;
        font-weight: 700 !important;

        line-height: 1.2 !important;
        letter-spacing: 0 !important;

        min-height: 0 !important;
        height: auto !important;
    }



    /* =====================================================
       3 — BAS DE PAGE MOBILE : NE PLUS DÉBORDER
       ===================================================== */

    #footer,
    .footer-links {

        width: 100% !important;
        max-width: 100% !important;

        overflow: hidden !important;

        box-sizing: border-box !important;
    }


    /* On empêche n'importe quel texte de créer
       une largeur supérieure au téléphone */

    .footer-links *,
    #footer * {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}
/* =========================================================
   MOBILE — SERVICES + FOOTER RÉSEAUX
   VERSION CORRIGÉE
   ========================================================= */

@media screen and (max-width: 767px) {

    /* =====================================================
       1. SERVICES — CARTES PLUS COMPACTES
       ===================================================== */

    #sb_service_step_container .service-item,
    #sb_service_step_container .tab,
    #sb_service_step_container .tab.tab-col {
        width: calc(100% - 24px) !important;
        max-width: 320px !important;

        margin: 8px auto !important;

        min-height: 0 !important;
        height: auto !important;
    }

    /* Partie sous l'image */
    #sb_service_step_container .tab-pd {
        min-height: 0 !important;
        height: auto !important;

        margin: 0 !important;
        padding: 5px 7px !important;
    }

    /* Zone texte */
    #sb_service_step_container .content {
        min-height: 0 !important;
        height: auto !important;

        margin: 0 !important;
        padding: 3px 5px !important;
    }

    /* Nom / description */
    #sb_service_step_container .content .txt,
    #sb_service_step_container .content .txt.short {
        margin: 0 !important;
        padding: 2px 3px !important;

        font-size: 12px !important;
        line-height: 1.2 !important;
    }


    /* =====================================================
       2. DURÉE + PRIX — PLUS PETITS ET PLUS LISIBLES
       ===================================================== */

    #sb_service_step_container .bar-service {
        min-height: 0 !important;
        height: auto !important;

        margin: 0 !important;
        padding: 4px 7px !important;

        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 11px !important;
        line-height: 1.1 !important;
    }

    /* Prix */
    #sb_service_step_container .bar-service .service-price,
    #sb_service_step_container .bar-service [class*="price"],
    #sb_service_step_container [class*="price"] {
        font-family: Arial, Helvetica, sans-serif !important;

        font-size: 12px !important;
        font-weight: 700 !important;

        line-height: 1 !important;
        letter-spacing: 0 !important;
    }

    /* Durée */
    #sb_service_step_container .bar-service .duration,
    #sb_service_step_container .bar-service [class*="duration"] {
        font-family: Arial, Helvetica, sans-serif !important;

        font-size: 11px !important;
        font-weight: 600 !important;

        line-height: 1 !important;
    }


    /* =====================================================
       3. BOUTON SÉLECTIONNER — PLUS PETIT
       ===================================================== */

    #sb_service_step_container .btn-bar {
        min-height: 0 !important;
        height: auto !important;

        margin: 0 !important;
        padding: 4px 5px 6px !important;
    }

    #sb_service_step_container .btn.select,
    #sb_service_step_container .btn.select.custom {
        width: auto !important;
        min-width: 0 !important;

        height: auto !important;
        min-height: 0 !important;

        margin: 0 auto !important;
        padding: 0 !important;
    }

    #sb_service_step_container .btn.select a,
    #sb_service_step_container .btn.select.custom a {
        width: 108px !important;
        max-width: 108px !important;

        height: 26px !important;
        min-height: 26px !important;

        margin: 0 auto !important;
        padding: 0 7px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 9px !important;
        line-height: 1 !important;
    }


    /* =====================================================
       4. FOOTER — SUPPRIMER "BOUTIQUE MYSTIQUE"
       AJOUTÉ PAR LE ::after DES LIENS SOCIAUX
       ===================================================== */

    .footer-links a.facebook::after,
    .footer-links a.google::after,
    .footer-links a.twitter::after,
    .footer-links a.instagram::after,
    .footer-links a.custom::after {
        content: none !important;
        display: none !important;
    }


    /* =====================================================
       5. RÉSEAUX CÔTE À CÔTE
       ===================================================== */

    .footer-links {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 8px 0 !important;

        overflow: visible !important;
        text-align: center !important;
    }

    .footer-links .brand {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        flex-wrap: nowrap !important;

        gap: 8px !important;

        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;

        margin: 0 auto !important;
        padding: 0 !important;
    }

    .footer-links .brand a.btn.custom {
        display: inline-flex !important;
        flex: 0 0 34px !important;

        align-items: center !important;
        justify-content: center !important;

        width: 34px !important;
        height: 34px !important;

        min-width: 34px !important;
        min-height: 34px !important;

        margin: 0 !important;
        padding: 0 !important;

        font-size: 0 !important;
        line-height: 0 !important;
    }

    .footer-links .brand a.btn.custom img {
        display: block !important;

        width: 21px !important;
        height: 21px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

}
/* =========================================================
   MOBILE — BOUTON DÉCOUVRIR VRAIMENT COMPACT
   ========================================================= */

@media screen and (max-width:767px) {

  #product-view .product-item .btn-bar a.btn.select,
  #product-view .product-item a.btn.select,
  #product-view .btn.select.custom,
  #product-view a.btn.custom {

    width:auto !important;
    min-width:92px !important;
    max-width:115px !important;

    height:28px !important;
    min-height:28px !important;

    margin:4px auto !important;
    padding:0 12px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    font-family:Arial,Helvetica,sans-serif !important;
    font-size:10px !important;
    font-weight:600 !important;
    line-height:1 !important;

    border-radius:18px !important;
  }

  #product-view .product-item .btn-bar {
    min-height:0 !important;
    height:auto !important;

    padding:4px !important;
    margin:0 !important;
  }
}
/* =========================================================
   MOBILE — SERVICES COMPACTS / PRIX LISIBLES
   ========================================================= */

@media screen and (max-width:767px) {

  /* CARTE */
  #sb_service_step_container .tab.tab-col,
  #sb_service_step_container .service-item {

    width:calc(100% - 30px) !important;
    max-width:315px !important;

    min-height:0 !important;
    height:auto !important;

    margin:8px auto !important;
    padding:0 !important;
  }


  /* PARTIE TEXTE */
  #sb_service_step_container .tab-pd,
  #sb_service_step_container .content {

    min-height:0 !important;
    height:auto !important;

    margin:0 !important;
    padding:5px 7px !important;
  }


  /* DESCRIPTION */
  #sb_service_step_container .txt,
  #sb_service_step_container .txt.short,
  #sb_service_step_container .content p {

    margin:0 !important;
    padding:0 !important;

    font-size:12px !important;
    line-height:1.12 !important;

    letter-spacing:0 !important;
  }


  /* évite les grands espaces entre paragraphes */
  #sb_service_step_container .content p + p {
    margin-top:3px !important;
  }


  /* LIGNE DURÉE / PRIX */
  #sb_service_step_container .bar-service {

    min-height:0 !important;
    height:auto !important;

    margin:0 !important;
    padding:4px 7px !important;

    font-family:Arial,Helvetica,sans-serif !important;
    font-size:11px !important;
    line-height:1 !important;

    letter-spacing:0 !important;
  }


  /* TOUS LES PRIX */
  #sb_service_step_container [class*="price"],
  #sb_service_step_container .service-price {

    font-family:Arial,Helvetica,sans-serif !important;

    font-size:12px !important;
    font-weight:700 !important;
    line-height:1 !important;

    letter-spacing:0 !important;
  }


  /* DURÉE */
  #sb_service_step_container [class*="duration"] {

    font-family:Arial,Helvetica,sans-serif !important;

    font-size:11px !important;
    font-weight:600 !important;
    line-height:1 !important;
  }


  /* ZONE BOUTON */
  #sb_service_step_container .btn-bar {

    min-height:0 !important;
    height:auto !important;

    margin:0 !important;
    padding:4px !important;
  }


  /* ACHETER / SÉLECTIONNER */
  #sb_service_step_container .btn-bar a,
  #sb_service_step_container a.btn.select,
  #sb_service_step_container .btn.select a {

    width:auto !important;
    min-width:100px !important;
    max-width:120px !important;

    height:28px !important;
    min-height:28px !important;

    margin:3px auto !important;
    padding:0 10px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    font-family:Arial,Helvetica,sans-serif !important;
    font-size:10px !important;
    font-weight:600 !important;
    line-height:1 !important;

    border-radius:18px !important;
  }

}
@media screen and (max-width: 767px) {

  #product-view .product-item .btn-bar a.btn.select,
  #product-view .product-item a.btn.select,
  #product-view .btn.select.custom,
  #product-view a.btn.custom {

    font-size: 8px !important;
    line-height: 1 !important;

    height: 24px !important;
    min-height: 24px !important;

    padding: 0 8px !important;

    max-width: 105px !important;
  }

  #product-view .product-item .btn-bar {
    padding: 2px 4px !important;
    min-height: 0 !important;
    height: auto !important;
  }
}
/* =========================================================
   MOBILE — BOUTIQUE COMPACTE + RÉSEAUX
   ========================================================= */

@media screen and (max-width: 767px) {

    /* =====================================================
       CATÉGORIES BOUTIQUE
       ===================================================== */

    #product-view #sb_list_container .product-item {
        height: auto !important;
        min-height: 0 !important;

        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }


    /* GROS VIDE SOUS L'IMAGE : ON LE SUPPRIME */
    #product-view #sb_list_container .product-item .tab-pd {
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;

        margin: 0 !important;
        padding: 3px 5px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }


    #product-view #sb_list_container .product-item .tab-pd .content {
        display: none !important;
    }


    #product-view #sb_list_container .product-item .btn-bar {
        width: 100% !important;

        height: 38px !important;
        min-height: 38px !important;

        margin: 0 !important;
        padding: 4px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }


    /* =====================================================
       DÉCOUVRIR
       ===================================================== */

    #product-view #sb_list_container a.btn.select {
        width: 105px !important;
        min-width: 105px !important;
        max-width: 105px !important;

        height: 26px !important;
        min-height: 26px !important;
        max-height: 26px !important;

        padding: 0 !important;
        margin: 0 auto !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 0 !important;

        overflow: visible !important;
    }


    #product-view #sb_list_container a.btn.select::after {
        font-family: Arial, Helvetica, sans-serif !important;

        font-size: 9px !important;
        font-weight: 700 !important;

        line-height: 26px !important;

        white-space: nowrap !important;

        width: auto !important;
        height: 26px !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
    }


    /* =====================================================
       FICHE PRODUIT APRÈS DÉCOUVRIR
       ===================================================== */

    #product-view .product-item--title-and-price {
        height: auto !important;
        min-height: 0 !important;

        margin: 5px 8px 3px !important;
        padding: 3px !important;

        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 11px !important;
        line-height: 1.1 !important;
    }


    #product-view .product-item--title-and-price * {
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 11px !important;
        line-height: 1.1 !important;
    }


    #product-view .txt.short {
        height: auto !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 2px 8px !important;

        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 10px !important;
        line-height: 1.15 !important;
    }


    #product-view .txt.short p,
    #product-view .txt.short div {
        margin-top: 2px !important;
        margin-bottom: 2px !important;

        line-height: 1.15 !important;
    }


    /* ACHETER */
    #product-view button.sb-buy.btn.select {
        width: 105px !important;
        min-width: 105px !important;
        max-width: 105px !important;

        height: 27px !important;
        min-height: 27px !important;

        margin: 4px auto !important;
        padding: 0 8px !important;

        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 9px !important;
        font-weight: 700 !important;

        line-height: 27px !important;
    }


    /* =====================================================
       FOOTER CRÉÉ PAR TAG MANAGER
       ===================================================== */

    .footer-links .social.buttons.row-flex-xs,
    .footer-links .social.buttons.row-flex-xs .brand {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;

        align-items: center !important;
        justify-content: center !important;

        gap: 7px !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 5px 0 !important;
    }


    .footer-links .vm-social {
        width: 30px !important;
        height: 30px !important;

        min-width: 30px !important;
        min-height: 30px !important;

        margin: 0 !important;
        padding: 5px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        color: #f2d88d !important;

        border: 1px solid #d7ad56 !important;
        border-radius: 50% !important;

        background: #061c4c !important;

        text-decoration: none !important;
    }


    .footer-links .vm-social::before,
    .footer-links .vm-social::after {
        content: none !important;
        display: none !important;
    }


    .footer-links .vm-social svg {
        width: 17px !important;
        height: 17px !important;

        display: block !important;
    }

}
/* =========================================================
   MOBILE — BOUTON DÉCOUVRIR UNIQUEMENT
   ========================================================= */

@media screen and (max-width: 767px) {

    #product-view .item.v1 .btn.select a,
    #product-view .item.v1 .btn-bar .btn.select a {
        width: 122px !important;
        max-width: 122px !important;

        height: 30px !important;
        min-height: 30px !important;

        padding: 0 10px !important;

        font-size: 11px !important;
        line-height: 30px !important;
    }

}
/* =========================================================
   BOUTIQUE — AJUSTEMENT SANS TOUCHER AUX IMAGES
   ========================================================= */

@media screen and (min-width: 768px) {

    /* Cadre doré plus visible */
    #product-view .product-item .tab {
        border: 3px solid #d7ad56 !important;
        border-radius: 18px !important;
    }

    /* Réduire UNIQUEMENT la zone bleue sous l'image */
    #product-view .product-item .tab-pd {
        padding: 0 !important;
        min-height: 0 !important;
        height: auto !important;
    }

    #product-view .product-item .btn-bar {
        margin: 0 !important;
        padding: 14px 8px !important;
        min-height: 0 !important;
        height: auto !important;
    }
}


/* MOBILE : on ne touche PAS à l'image */
@media screen and (max-width: 767px) {

    #product-view .product-item .tab {
        border: 2px solid #d7ad56 !important;
        border-radius: 14px !important;
    }

    #product-view .product-item .tab-pd {
        padding: 0 !important;
        min-height: 0 !important;
        height: auto !important;
    }

    #product-view .product-item .btn-bar {
        margin: 0 !important;
        padding: 8px 5px !important;
        min-height: 0 !important;
        height: auto !important;
    }
}
/* =========================================================
   BOUTIQUE — IMAGE + BOUTON SANS CHEVAUCHEMENT
   ========================================================= */

#product-view #sb_list_container .product-item .tab,
#product-view #sb_list_container .product-item .excerpt-info {
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}


/* IMAGE */
#product-view #sb_list_container .product-item .preloader,
#product-view #sb_list_container .product-item .user.img,
#product-view #sb_list_container .product-item .user.img > a {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;

    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    display: block !important;
}


/* Image réelle */
#product-view #sb_list_container .product-item img.user-img {
    display: block !important;

    width: 100% !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    position: static !important;
    transform: none !important;
}


/* ZONE SOUS L'IMAGE */
#product-view #sb_list_container .product-item .tab-pd {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;

    width: 100% !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 6px 8px !important;
}


/* Bouton juste sous l'image */
#product-view #sb_list_container .product-item .btn-bar {
    position: static !important;

    margin: 0 !important;
    padding: 6px 8px 8px !important;

    height: auto !important;
    min-height: 0 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 767px) {

    #product-view #sb_list_container .product-item {
        height: auto !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    #product-view #sb_list_container .product-item .tab-pd {
        padding: 4px 6px !important;
    }

    #product-view #sb_list_container .product-item .btn-bar {
        padding: 4px 6px 6px !important;
    }

}/* =========================================================
   BOUTIQUE — IMAGE + BOUTON SANS CHEVAUCHEMENT
   ========================================================= */

#product-view #sb_list_container .product-item .tab,
#product-view #sb_list_container .product-item .excerpt-info {
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}


/* IMAGE */
#product-view #sb_list_container .product-item .preloader,
#product-view #sb_list_container .product-item .user.img,
#product-view #sb_list_container .product-item .user.img > a {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;

    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    display: block !important;
}


/* Image réelle */
#product-view #sb_list_container .product-item img.user-img {
    display: block !important;

    width: 100% !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    position: static !important;
    transform: none !important;
}


/* ZONE SOUS L'IMAGE */
#product-view #sb_list_container .product-item .tab-pd {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;

    width: 100% !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 6px 8px !important;
}


/* Bouton juste sous l'image */
#product-view #sb_list_container .product-item .btn-bar {
    position: static !important;

    margin: 0 !important;
    padding: 6px 8px 8px !important;

    height: auto !important;
    min-height: 0 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 767px) {

    #product-view #sb_list_container .product-item {
        height: auto !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    #product-view #sb_list_container .product-item .tab-pd {
        padding: 4px 6px !important;
    }

    #product-view #sb_list_container .product-item .btn-bar {
        padding: 4px 6px 6px !important;
    }

}
/* =========================================================
   DESKTOP — BOUTIQUE : SUPPRIMER LA GRANDE ZONE BLEUE
   ========================================================= */

@media screen and (min-width: 768px) {

    #product-view #sb_list_container .product-item,
    #product-view #sb_list_container .product-item .tab,
    #product-view #sb_list_container .product-item .tab-col,
    #product-view #sb_list_container .product-item .excerpt-info,
    #product-view #sb_list_container .product-item .tab-pd {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    #product-view #sb_list_container .product-item .tab-pd {
        padding: 0 !important;
        margin: 0 !important;
    }

    #product-view #sb_list_container .product-item .content {
        display: none !important;
        height: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #product-view #sb_list_container .product-item .btn-bar {
        height: 68px !important;
        min-height: 68px !important;

        margin: 0 !important;
        padding: 8px 10px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

}
/* =========================================================
   MOBILE — LOGO TEXTE LE VOYAGEUR MYSTIQUE
   ========================================================= */

@media screen and (max-width: 767px) {

    #header .logo,
    #header .logo a,
    #header [class*="logo"] a {
        font-family: "Cinzel", Georgia, serif !important;
        font-size: 10px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        letter-spacing: 0.8px !important;
        text-transform: uppercase !important;

        color: #f7d46f !important;
        text-align: center !important;
    }
}
/* =========================================================
   RÉSERVATIONS — DESKTOP — NETTOYAGE STRUCTURE
   ========================================================= */

@media screen and (min-width: 768px) {

    /* =====================================================
       1. SUPPRIMER LE BANDEAU DES ÉTAPES
       Catégorie / Service / Prestataire / Heure / Client
       ===================================================== */

    #steps-nav,
    nav#steps-nav,
    #sb-timeline #steps-nav {
        display: none !important;
    }


    /* =====================================================
       2. SUPPRIMER L'ESPACE LAISSÉ PAR LE BANDEAU
       ===================================================== */

    #sb-timeline,
    #steps,
    #steps-content {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }


    /* =====================================================
       3. BOUTON RETOUR — UN SEUL BOUTON
       ===================================================== */

    #sb_back_button {
        width: auto !important;
        height: auto !important;

        margin: 18px 0 20px 28px !important;
        padding: 0 !important;

        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    #sb_back_button::before,
    #sb_back_button::after {
        display: none !important;
        content: none !important;
    }

    #sb_back_button a {
        width: 150px !important;
        height: 44px !important;

        margin: 0 !important;
        padding: 0 20px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border: 1.5px solid #d7ad56 !important;
        border-radius: 28px !important;

        background:
            linear-gradient(
                180deg,
                #1768ef 0%,
                #0746bf 55%,
                #032d83 100%
            ) !important;

        box-shadow:
            0 0 10px rgba(215, 173, 86, 0.32) !important;

        font-family: "Cinzel", Georgia, serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        letter-spacing: 0.3px !important;

        color: #f7d46f !important;
    }


    /* =====================================================
       4. CARTES CATÉGORIES — ENLEVER LE DOUBLE CADRE
       ===================================================== */

    #sb_category_step_container .category-item {
        border: 1.5px solid #d7ad56 !important;
        border-radius: 18px !important;

        background: #061c4c !important;

        box-shadow:
            0 0 12px rgba(215, 173, 86, 0.18) !important;

        overflow: hidden !important;
    }

    #sb_category_step_container .category-item .tab,
    #sb_category_step_container .category-item .tab-col,
    #sb_category_step_container .category-item .excerpt-info,
    #sb_category_step_container .category-item .tab-pd {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }


    /* =====================================================
       5. CARTES SERVICES — ENLEVER LE DOUBLE CADRE
       ===================================================== */

    #sb_service_step_container .service-item {
        border: 1.5px solid #d7ad56 !important;
        border-radius: 18px !important;

        overflow: hidden !important;

        box-shadow:
            0 0 12px rgba(215, 173, 86, 0.18) !important;
    }

    #sb_service_step_container .service-item .tab,
    #sb_service_step_container .service-item .tab-col,
    #sb_service_step_container .service-item .excerpt-info,
    #sb_service_step_container .service-item .tab-pd {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }


    /* =====================================================
       6. ZONE DU BOUTON SÉLECTIONNER
       ===================================================== */

    #sb_category_step_container .btn-bar,
    #sb_service_step_container .btn-bar {
        margin: 0 !important;
        padding: 10px 12px !important;

        background: #061c4c !important;

        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }

    #sb_category_step_container .btn-bar::before,
    #sb_category_step_container .btn-bar::after,
    #sb_service_step_container .btn-bar::before,
    #sb_service_step_container .btn-bar::after {
        display: none !important;
        content: none !important;
    }


    /* =====================================================
       7. LE VRAI BOUTON SÉLECTIONNER
       ===================================================== */

    #sb_category_step_container .btn.select,
    #sb_service_step_container .btn.select,
    #sb_category_step_container .btn.select.custom,
    #sb_service_step_container .btn.select.custom {
        width: auto !important;
        height: auto !important;

        margin: 0 auto !important;
        padding: 0 !important;

        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    #sb_category_step_container .btn.select::before,
    #sb_category_step_container .btn.select::after,
    #sb_service_step_container .btn.select::before,
    #sb_service_step_container .btn.select::after {
        display: none !important;
        content: none !important;
    }

    #sb_category_step_container .btn.select a,
    #sb_service_step_container .btn.select a {
        width: 82% !important;
        max-width: 310px !important;
        height: 42px !important;

        margin: 0 auto !important;
        padding: 0 18px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border: 1.5px solid #d7ad56 !important;
        border-radius: 25px !important;

        background:
            linear-gradient(
                180deg,
                #1768ef 0%,
                #0746bf 55%,
                #032d83 100%
            ) !important;

        box-shadow:
            0 0 9px rgba(215, 173, 86, 0.28) !important;

        font-family: "Cinzel", Georgia, serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        letter-spacing: 0.4px !important;

        color: #fff4ca !important;
    }
}
/* =========================================================
   CORRECTIONS RÉSERVATION — ÉTAPE SUIVANTE
   ========================================================= */


/* =========================================================
   1. MOBILE — "LE VOYAGEUR MYSTIQUE" EN HAUT
   Le texte est généré par #header::before
   ========================================================= */

@media screen and (max-width: 767px) {

    #header::before {
        font-family: "Cinzel", Georgia, serif !important;
        font-size: 10px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        letter-spacing: 1px !important;
        text-transform: uppercase !important;

        color: #f7d46f !important;
        text-align: center !important;
    }

}


/* =========================================================
   2. SERVICES — SUPPRIMER LE GRAND VIDE NOIR
   SOUS LE BOUTON SÉLECTIONNER
   ========================================================= */

#sb_service_step_container .service-item,
#sb_service_step_container .service-item.item,
#sb_service_step_container .service-item.item.v1 {
    height: auto !important;
    min-height: 0 !important;
    padding-bottom: 0 !important;
}

#sb_service_step_container .service-item .tab,
#sb_service_step_container .service-item .tab-col,
#sb_service_step_container .service-item .excerpt-info,
#sb_service_step_container .service-item .tab-pd {
    height: auto !important;
    min-height: 0 !important;
}

#sb_service_step_container .service-item .btn-bar {
    margin-bottom: 0 !important;
}


/* =========================================================
   3. CALENDRIER — TITRE DES HORAIRES
   ========================================================= */

#sb_datetime_step_container .timeline-wrapper .title,
#sb_datetime_step_container [class*="time"] h3,
#sb_datetime_step_container [class*="time"] .title,
#sb_datetime_step_container .slots-title {
    font-family: "Cinzel", Georgia, serif !important;
    font-style: normal !important;

    font-size: 19px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.5px !important;

    color: #f7d46f !important;
}


/* =========================================================
   4. CALENDRIER — ENLEVER LA LÉGENDE "DISPONIBLE"
   ========================================================= */

#sb_datetime_step_container .legend,
#sb_datetime_step_container .availability-legend,
#sb_datetime_step_container [class*="legend"] {
    display: none !important;
}


/* =========================================================
   5. CALENDRIER — CHIFFRES PLUS PROPRES
   ========================================================= */

#sb_datetime_step_container .calendar,
#sb_datetime_step_container .calendar *,
#sb_datetime_step_container [class*="calendar"] {
    font-family: "Cinzel", Georgia, serif !important;
}

#sb_datetime_step_container [class*="calendar"] td,
#sb_datetime_step_container [class*="calendar"] a,
#sb_datetime_step_container [class*="calendar"] span {
    font-style: normal !important;
}


/* =========================================================
   6. PAGE CONNEXION — SUPPRIMER L'EFFET BLEU CLAIR DU TITRE
   ========================================================= */

#sb_sign_in_form .title,
#sb_sign_up_form .title,
#sb_login_form .title,
#sb_client_login .title,
[class*="login"] > .title,
[class*="sign"] > .title {
    background: linear-gradient(
        180deg,
        #071b42 0%,
        #041126 100%
    ) !important;

    color: #f7d46f !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    letter-spacing: 0.8px !important;

    border-bottom: 1px solid #d7ad56 !important;
}
/* =========================================================
   DESKTOP — HEADER : PANIER / CONNEXION / PAYER
   CORRECTION DU CHEVAUCHEMENT
   ========================================================= */

@media screen and (min-width: 768px) {

    /* Zone des contrôles du header */
    #header .header-controls {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;

        gap: 12px !important;

        width: auto !important;
        max-width: none !important;

        position: relative !important;
        right: auto !important;
        left: auto !important;
        top: auto !important;

        transform: none !important;
    }

    /* Panier */
    #header #sb_cart,
    #header .cart-container,
    #header [class*="cart"] {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;

        margin: 0 !important;
        transform: none !important;
    }

    /* Connexion / déconnexion */
    #header .login-container,
    #header .login,
    #header [class*="login"],
    #header [class*="logout"] {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;

        margin: 0 !important;
        transform: none !important;
    }

    /* Bouton Payer */
    #header .pay-btn,
    #header [class*="pay"],
    #header .btn-pay {
        position: relative !important;

        left: auto !important;
        right: auto !important;
        top: auto !important;

        margin: 0 0 0 8px !important;

        transform: none !important;
        z-index: auto !important;
    }

}
/* =========================================================
   DESKTOP — RÉSERVATIONS V2
   NETTOYAGE DES CARTES + CALENDRIER
   ========================================================= */

@media screen and (min-width: 768px) {


    /* =====================================================
       1. LE VOYAGEUR MYSTIQUE — HEADER
       CHANGEMENT VISIBLE DE TYPO
       ===================================================== */

    body header#header::before,
    body #header::before {
        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 19px !important;
        font-weight: 600 !important;
        font-style: normal !important;
        letter-spacing: 1.5px !important;
        line-height: 1.1 !important;
        text-transform: uppercase !important;
    }



    /* =====================================================
       2. CATÉGORIES
       ESPACER LES 3 BLOCS
       ===================================================== */

    #sb_category_step_container {
        column-gap: 18px !important;
        row-gap: 18px !important;
    }

    #sb_category_step_container > div {
        gap: 18px !important;
    }

    #sb_category_step_container .category-item.item {
        margin: 0 7px 18px !important;

        padding: 0 !important;

        background: transparent !important;

        border: 0 !important;
        box-shadow: none !important;
    }



    /* =====================================================
       3. CATÉGORIES
       UN SEUL CADRE DORÉ
       ===================================================== */

    #sb_category_step_container
    .tab.tab-col.tab-with-popup {

        margin: 0 !important;
        padding: 0 !important;

        border: 2px solid #d7ad56 !important;
        border-radius: 16px !important;

        background: transparent !important;

        box-shadow: none !important;

        overflow: hidden !important;
    }



    /* =====================================================
       4. ENLEVER LE PETIT ESPACE / CONTENU VIDE
       ENTRE IMAGE ET BOUTON
       ===================================================== */

    #sb_category_step_container .content {
        display: none !important;

        height: 0 !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;
    }



    /* =====================================================
       5. BAS DE LA CARTE
       TOUT LE BAS DOIT ÊTRE BLEU
       PLUS DE NOIR AUTOUR DU BOUTON
       ===================================================== */

    #sb_category_step_container .tab-pd {

        margin: 0 !important;
        padding: 0 !important;

        min-height: 0 !important;
        height: auto !important;

        background: #061c4c !important;

        border: 0 !important;
    }

    #sb_category_step_container .btn-bar {

        width: 100% !important;

        margin: 0 !important;
        padding: 10px 12px !important;

        min-height: 0 !important;
        height: auto !important;

        background: #061c4c !important;

        border: 0 !important;
        box-shadow: none !important;
    }



    /* =====================================================
       6. BOUTON SÉLECTIONNER — CATÉGORIES
       ===================================================== */

    #sb_category_step_container .btn.select,
    #sb_category_step_container .btn.select.custom {

        width: 82% !important;
        max-width: 290px !important;

        height: 40px !important;
        min-height: 40px !important;

        margin: 0 auto !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    #sb_category_step_container .btn.select a,
    #sb_category_step_container .btn.select.custom a {

        width: 100% !important;
        height: 40px !important;
        min-height: 40px !important;

        margin: 0 !important;
        padding: 0 12px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 12px !important;
        line-height: 1 !important;
    }



    /* =====================================================
       7. PRESTATIONS
       SUPPRIMER LE DOUBLE CADRE EXTÉRIEUR
       ===================================================== */

    #sb_service_step_container .service-item {

        padding: 0 !important;

        border: 0 !important;
        box-shadow: none !important;

        background: transparent !important;
    }

    #sb_service_step_container
    .tab.tab-col.tab-with-popup {

        border: 2px solid #d7ad56 !important;
        border-radius: 16px !important;

        overflow: hidden !important;

        box-shadow: none !important;
    }



    /* =====================================================
       8. PRESTATIONS
       DURÉE + PRIX COMPACTS
       ===================================================== */

    #sb_service_step_container .tab-pd {

        margin: 0 !important;
        padding: 0 !important;

        height: auto !important;
        min-height: 0 !important;

        background: #061c4c !important;
    }

    #sb_service_step_container .content {

        margin: 0 !important;
        padding: 0 !important;

        height: auto !important;
        min-height: 0 !important;

        background: #061c4c !important;
    }

    #sb_service_step_container .bar-service {

        margin: 0 !important;
        padding: 7px 12px !important;

        height: auto !important;
        min-height: 0 !important;

        background: #061c4c !important;

        font-size: 14px !important;
        line-height: 1.1 !important;

        border: 0 !important;
    }

    #sb_service_step_container
    .bar-service [class*="price"] {

        font-size: 18px !important;
        line-height: 1 !important;
    }



    /* =====================================================
       9. BOUTON PRESTATIONS
       PLUS DE RECTANGLE NOIR AUTOUR
       ===================================================== */

    #sb_service_step_container .btn-bar {

        width: 100% !important;

        margin: 0 !important;
        padding: 8px 12px 10px !important;

        height: auto !important;
        min-height: 0 !important;

        background: #061c4c !important;

        border: 0 !important;
        box-shadow: none !important;
    }

    #sb_service_step_container .btn.select,
    #sb_service_step_container .btn.select.custom {

        width: 82% !important;
        max-width: 290px !important;

        height: 40px !important;
        min-height: 40px !important;

        margin: 0 auto !important;
        padding: 0 !important;
    }

    #sb_service_step_container .btn.select a,
    #sb_service_step_container .btn.select.custom a {

        width: 100% !important;

        height: 40px !important;
        min-height: 40px !important;

        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 12px !important;
    }



    /* =====================================================
       10. PAGE CALENDRIER
       ENLEVER LES CADRES SUPERPOSÉS
       ===================================================== */

    #sb_datetime_step_container {

        border: 0 !important;
        box-shadow: none !important;

        background: transparent !important;
    }

    #sb_datetime_step_container > div,
    #sb_datetime_step_container .row {

        box-shadow: none !important;
    }



    /* =====================================================
       11. CALENDRIER
       UN SEUL VRAI CADRE
       ===================================================== */

    #sb_datetime_step_container
    #sb_dateview_container {

        border: 2px solid #d7ad56 !important;
        border-radius: 18px !important;

        padding: 12px 18px !important;

        background:
            linear-gradient(
                180deg,
                #071b42 0%,
                #03112c 100%
            ) !important;

        box-shadow: none !important;
    }



    /* =====================================================
       12. TYPO DU CALENDRIER
       MOIS + MOIS PRÉC. + MOIS SUIV.
       ===================================================== */

    #sb_datetime_step_container
    #sb_dateview_container,

    #sb_datetime_step_container
    #sb_dateview_container * {

        font-family: "Cinzel", Georgia, serif !important;
    }



    /* mois affiché au centre */
    #sb_datetime_step_container
    #sb_dateview_container [class*="month"] {

        font-family: "Cinzel", Georgia, serif !important;

        font-size: 16px !important;
        font-weight: 600 !important;

        font-style: normal !important;

        letter-spacing: .4px !important;
    }



    /* navigation mois précédent / suivant */
    #sb_datetime_step_container
    #sb_dateview_container [class*="prev"],

    #sb_datetime_step_container
    #sb_dateview_container [class*="next"] {

        font-family: "Cinzel", Georgia, serif !important;

        font-style: normal !important;

        font-size: 14px !important;
        font-weight: 600 !important;
    }



    /* =====================================================
       13. PARTIE HORAIRES
       RETIRER LE GROS CADRE NOIR
       ===================================================== */

    #sb_timeview_container {

        margin-top: 16px !important;

        padding: 0 !important;

        border: 0 !important;
        box-shadow: none !important;

        background: transparent !important;
    }



    /* =====================================================
       14. TITRE HORAIRES
       ===================================================== */

    #sb_timeview_container h3,
    #sb_timeview_container h4,
    #sb_timeview_container .title,
    #sb_timeview_container [class*="title"] {

        margin: 0 0 8px !important;
        padding: 0 4px !important;

        background: transparent !important;

        font-family: "Cinzel", Georgia, serif !important;

        font-size: 17px !important;
        font-weight: 600 !important;
        font-style: normal !important;

        line-height: 1.2 !important;

        color: #f2d88d !important;
    }



    /* =====================================================
       15. CONTENEUR DES HEURES
       MOINS HAUT + PLUS D'AIR AUTOUR
       ===================================================== */

    #sb_time_slots_container {

        margin: 0 !important;

        padding: 10px 12px !important;

        min-height: 0 !important;
        height: auto !important;

        border: 1px solid rgba(215,173,86,.8) !important;
        border-radius: 14px !important;

        background:
            linear-gradient(
                180deg,
                #071b42 0%,
                #03112c 100%
            ) !important;

        box-shadow: none !important;
    }



    /* =====================================================
       16. GRILLE DES HEURES
       ===================================================== */

    #sb_time_slots_container .slots {

        display: flex !important;
        flex-wrap: wrap !important;

        gap: 10px !important;

        margin: 0 !important;
        padding: 0 !important;
    }



    /* =====================================================
       17. BOUTONS HEURES
       BEAUCOUP MOINS HAUTS
       ===================================================== */

    #sb_time_slots_container a,
    #sb_time_slots_container button,
    #sb_time_slots_container .slot {

        height: 42px !important;
        min-height: 42px !important;

        margin: 0 !important;
        padding: 0 16px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        line-height: 1 !important;

        border-radius: 9px !important;
    }



    /* =====================================================
       18. CARTE PRESTATION À GAUCHE DU CALENDRIER
       UN SEUL CADRE
       ===================================================== */

    .service-item.item--v3 {

        margin-top: 16px !important;
        padding: 0 !important;

        border: 0 !important;
        background: transparent !important;

        box-shadow: none !important;
    }

    .service-item.item--v3
    .tab.tab-col.tab-with-popup {

        margin: 0 !important;

        border: 1px solid #d7ad56 !important;
        border-radius: 15px !important;

        overflow: hidden !important;

        background: #061c4c !important;

        box-shadow: none !important;
    }

}
/* =========================================================
   CORRECTIF DESKTOP FINAL — RÉSERVATIONS
   LE VOYAGEUR MYSTIQUE
   NE TOUCHE PAS AU MOBILE
   ========================================================= */

@media screen and (min-width: 768px) {

    /* =====================================================
       COULEUR OR PLUS CHAUDE / ORANGÉE
       ===================================================== */

    :root {
        --vm-gold: #e1ad46;
        --vm-gold-light: #f2c65d;
        --vm-gold-dark: #ba7d22;
        --vm-blue: #061c4c;
        --vm-blue-light: #082c73;
        --vm-night: #020b20;
    }

    body,
    #sb_main,
    #sb_content {
        color: #f8f3e8 !important;
    }

    #sb_main a,
    #sb_main .title,
    #sb_main h1,
    #sb_main h2,
    #sb_main h3,
    #sb_main h4,
    #sb_main .service-price,
    #sb_main [class*="price"] {
        color: var(--vm-gold-light) !important;
    }


    /* =====================================================
       1. LES 3 CATÉGORIES RESTENT SUR UNE SEULE LIGNE
       ===================================================== */

    #sb_category_step_container {
        width: 100% !important;
        max-width: 100% !important;
    }

    #sb_category_step_container > div {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        justify-content: center !important;

        gap: 14px !important;

        width: 100% !important;
    }

    #sb_category_step_container .category-item {
        flex: 1 1 0 !important;

        width: calc((100% - 28px) / 3) !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    #sb_category_step_container .tab.tab-col.tab-with-popup {
        width: 100% !important;
        height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;

        background: var(--vm-blue) !important;

        border: 2px solid var(--vm-gold) !important;
        border-radius: 17px !important;

        box-shadow:
            0 0 14px rgba(225,173,70,.12) !important;
    }


    /* =====================================================
       2. BAS DES CARTES CATÉGORIES
       AUCUN NOIR AUTOUR DU BLEU
       ===================================================== */

    #sb_category_step_container .tab-pd,
    #sb_category_step_container .btn-bar {
        width: 100% !important;

        margin: 0 !important;

        background: linear-gradient(
            180deg,
            #082c73 0%,
            #061c4c 100%
        ) !important;

        border: none !important;
        box-shadow: none !important;
    }

    #sb_category_step_container .content {
        display: none !important;
        height: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    #sb_category_step_container .btn-bar {
        min-height: 65px !important;
        height: 65px !important;

        padding: 10px 16px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }


    /* =====================================================
       3. SERVICES : LÉGER ESPACE ENTRE LES CARTES
       ===================================================== */

    #sb_service_step_container > div {
        column-gap: 12px !important;
        row-gap: 16px !important;
    }

    #sb_service_step_container .service-item {
        margin-bottom: 16px !important;

        padding: 0 !important;

        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    #sb_service_step_container .tab.tab-col.tab-with-popup {
        overflow: hidden !important;

        background: var(--vm-blue) !important;

        border: 2px solid var(--vm-gold) !important;
        border-radius: 17px !important;

        box-shadow: none !important;
    }

    #sb_service_step_container .tab-pd,
    #sb_service_step_container .content,
    #sb_service_step_container .bar-service {
        background: var(--vm-blue) !important;
        border: none !important;
        box-shadow: none !important;
    }

    #sb_service_step_container .btn-bar {
        margin: 0 !important;
        padding: 9px 12px !important;

        background: linear-gradient(
            180deg,
            #082c73,
            #061c4c
        ) !important;

        border: none !important;
        box-shadow: none !important;
    }


    /* =====================================================
       4. CALENDRIER — UN SEUL CADRE EXTÉRIEUR
       ===================================================== */

    .datetime-step,
    .datetime-step .section-wrapper,
    #sb_dateview_container,
    #sb_timeview_container,
    #sb_time_slots_container {
        box-shadow: none !important;
    }

    .datetime-step,
    .datetime-step .section-wrapper {
        border: none !important;
        background: transparent !important;
    }

    #sb_dateview_container {
        margin: 0 !important;
        padding: 14px 20px 16px !important;

        background: rgba(3, 18, 52, .96) !important;

        border: 2px solid var(--vm-gold) !important;
        border-radius: 18px !important;

        box-shadow:
            0 0 18px rgba(225,173,70,.10) !important;
    }


    /* =====================================================
       5. MOIS / ANNÉE PLUS GRANDS
       ===================================================== */

    #sb_dateview_container .month,
    #sb_dateview_container [class*="month"] {
        font-family: "Cinzel", Georgia, serif !important;

        font-size: 19px !important;
        font-weight: 600 !important;

        font-style: normal !important;
        letter-spacing: .8px !important;

        color: var(--vm-gold-light) !important;
    }


    /* =====================================================
       6. MOIS PRÉCÉDENT / SUIVANT
       + RESTAURATION DES FLÈCHES
       ===================================================== */

    #sb_dateview_container [class*="prev"],
    #sb_dateview_container [class*="next"] {
        position: relative !important;

        font-family: "Cinzel", Georgia, serif !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        font-style: normal !important;

        color: var(--vm-gold-light) !important;

        overflow: visible !important;
    }

    #sb_dateview_container [class*="prev"]::before {
        content: "‹" !important;

        display: inline-block !important;
        margin-right: 8px !important;

        font-family: Arial, sans-serif !important;
        font-size: 30px !important;
        line-height: 1 !important;

        color: var(--vm-gold-light) !important;
    }

    #sb_dateview_container [class*="next"]::after {
        content: "›" !important;

        display: inline-block !important;
        margin-left: 8px !important;

        font-family: Arial, sans-serif !important;
        font-size: 30px !important;
        line-height: 1 !important;

        color: var(--vm-gold-light) !important;
    }


    /* =====================================================
       7. PETITE CARTE DU SOIN RÉSERVÉ À GAUCHE
       SUPPRESSION DU DOUBLE CADRE
       ===================================================== */

    .service-item.item--v3,
    #sb_sidebar_container .service-item {
        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;

        border: none !important;
        box-shadow: none !important;
    }

    .service-item.item--v3 .tab,
    #sb_sidebar_container .service-item .tab {
        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;

        background: var(--vm-blue) !important;

        border: 2px solid var(--vm-gold) !important;
        border-radius: 16px !important;

        box-shadow: none !important;
    }

    .service-item.item--v3 .tab-pd,
    #sb_sidebar_container .tab-pd {
        margin: 0 !important;
        padding: 8px 12px !important;

        background: var(--vm-blue) !important;

        border: none !important;
        box-shadow: none !important;
    }


    /* =====================================================
       8. ZONE "HORAIRES DE DÉBUT DISPONIBLES"
       UN SEUL BLOC
       ===================================================== */

    #sb_timeview_container {
        margin: 14px 0 0 14px !important;
        padding: 0 !important;

        background: transparent !important;

        border: none !important;
    }

    #sb_time_slots_container {
        box-sizing: border-box !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 14px !important;

        background: rgba(3, 24, 64, .96) !important;

        border: 2px solid var(--vm-gold) !important;
        border-radius: 16px !important;

        box-shadow: none !important;
    }


    /* =====================================================
       9. TITRE DES HORAIRES
       ===================================================== */

    #sb_time_slots_container h1,
    #sb_time_slots_container h2,
    #sb_time_slots_container h3,
    #sb_time_slots_container h4,
    #sb_time_slots_container .title,
    #sb_time_slots_container [class*="title"] {
        margin: 0 0 14px 0 !important;
        padding: 0 !important;

        font-family: "Cinzel", Georgia, serif !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        font-style: normal !important;

        color: var(--vm-gold-light) !important;

        line-height: 1.2 !important;
        letter-spacing: .4px !important;
    }


    /* =====================================================
       10. CRÉNEAUX HORAIRES
       REMIS HORIZONTALEMENT
       ===================================================== */

    #sb_time_slots_container .slots,
    #sb_time_slots_container > div,
    #sb_timeview_container .slots {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;

        align-items: center !important;
        justify-content: flex-start !important;

        gap: 10px !important;
    }

    #sb_time_slots_container a,
    #sb_time_slots_container button,
    #sb_time_slots_container .slot {
        flex: 0 0 auto !important;

        width: 112px !important;
        min-width: 112px !important;
        max-width: 112px !important;

        height: 42px !important;
        min-height: 42px !important;

        margin: 0 !important;
        padding: 0 8px !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        background: linear-gradient(
            180deg,
            #0c3b96,
            #071b51
        ) !important;

        border: 1px solid var(--vm-gold) !important;
        border-radius: 10px !important;

        box-shadow: none !important;

        font-family: "Cinzel", Georgia, serif !important;
        font-size: 12px !important;
        font-weight: 600 !important;

        line-height: 1 !important;

        color: var(--vm-gold-light) !important;
    }


    /* =====================================================
       11. PAGE CONNEXION — RETIRER LE GROS NOIR
       ===================================================== */

    #sb_booking_content .login-container,
    #sb_booking_content .client-login,
    #sb_booking_content .registration-form,
    #sb_booking_content form {
        background: transparent !important;
        box-shadow: none !important;
    }

    #sb_booking_content {
        color: #f8f3e8 !important;
    }

    #sb_booking_content .section,
    #sb_booking_content .form-wrapper,
    #sb_booking_content .login-wrapper {
        background: rgba(3, 18, 52, .96) !important;

        border: 2px solid var(--vm-gold) !important;
        border-radius: 18px !important;

        box-shadow:
            0 0 18px rgba(225,173,70,.10) !important;
    }


    /* grand bandeau bleu clair supprimé */
    #sb_booking_content h1,
    #sb_booking_content .title-main {
        background: var(--vm-blue) !important;

        color: var(--vm-gold-light) !important;

        border: none !important;

        font-family: "Cinzel", Georgia, serif !important;
        font-size: 24px !important;
        font-weight: 600 !important;

        letter-spacing: 1px !important;
    }


    /* =====================================================
       12. CHAMPS CONNEXION
       ===================================================== */

    #sb_booking_content input,
    #sb_booking_content select,
    #sb_booking_content textarea {
        background: #07142d !important;

        color: #f8f3e8 !important;

        border: 1px solid rgba(225,173,70,.65) !important;
        border-radius: 9px !important;

        box-shadow: none !important;
    }

    #sb_booking_content input:focus,
    #sb_booking_content select:focus,
    #sb_booking_content textarea:focus {
        border-color: var(--vm-gold-light) !important;

        box-shadow:
            0 0 8px rgba(225,173,70,.25) !important;

        outline: none !important;
    }


    /* =====================================================
       13. CONNEXION GOOGLE / FACEBOOK
       PLUS PROPRES
       ===================================================== */

    #sb_booking_content .social-login a,
    #sb_booking_content [class*="social"] a {
        width: 48px !important;
        height: 48px !important;

        margin: 0 6px !important;
        padding: 0 !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        background: #071b4b !important;

        border: 2px solid var(--vm-gold) !important;
        border-radius: 50% !important;

        box-shadow:
            0 0 10px rgba(225,173,70,.22) !important;

        font-size: 0 !important;
    }

    #sb_booking_content .social-login img,
    #sb_booking_content [class*="social"] img {
        width: 26px !important;
        height: 26px !important;

        object-fit: contain !important;
    }


    /* =====================================================
       14. TOUS LES BOUTONS : OR PLUS CHAUD
       ===================================================== */

    #sb_main .btn,
    #sb_main button,
    #sb_main .btn a {
        border-color: var(--vm-gold) !important;

        color: var(--vm-gold-light) !important;
    }

}
/* =========================================================
   LE VOYAGEUR MYSTIQUE
   CORRECTIONS FINALES — VERSION WEB UNIQUEMENT
   ========================================================= */

@media (min-width: 769px) {

    /* =====================================================
       0. COULEURS / TYPOGRAPHIE GÉNÉRALE
       ===================================================== */

    :root {
        --vm-gold: #e3ae45;
        --vm-gold-light: #f0c568;
        --vm-blue: #071a4b;
        --vm-blue-2: #092969;
        --vm-blue-3: #0d3e9b;
        --vm-dark: #03102d;
    }

    #sb_main,
    #sb_booking_content,
    #steps-content {
        color: #f8f3e8;
    }

    /* Or plus chaud et plus orangé sur les textes décoratifs */
    #sb_main a,
    #sb_main .price,
    #sb_main .service-price,
    #sb_main .current-date,
    #sb_main .btn-txt,
    #sb_main .title-main {
        color: var(--vm-gold-light);
    }


    /* =====================================================
       1. LOGO "LE VOYAGEUR MYSTIQUE" DANS LE HEADER
       ===================================================== */

    #header::before {
        font-family: "Cinzel", Georgia, serif !important;
        font-weight: 600 !important;
        letter-spacing: 1.6px !important;
        line-height: 1.3 !important;
        color: var(--vm-gold-light) !important;
        text-shadow:
            0 0 7px rgba(227, 174, 69, .20),
            0 1px 1px rgba(0,0,0,.7) !important;
    }


    /* =====================================================
       2. PAGE DES 3 CATÉGORIES
       SOINS / ÉCOLE / PROTECTIONS
       ===================================================== */

    #sb_category_step_container {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: center !important;
        align-items: flex-start !important;
        gap: 28px !important;
        width: 100% !important;
    }

    #sb_category_step_container .category-item {
        flex: 1 1 0 !important;
        max-width: 390px !important;
        min-width: 0 !important;
        margin: 0 !important;

        /* un seul contour */
        border: 1px solid var(--vm-gold) !important;
        border-radius: 16px !important;

        background: var(--vm-blue) !important;
        box-shadow:
            0 8px 24px rgba(0,0,0,.30),
            0 0 12px rgba(227,174,69,.08) !important;

        overflow: hidden !important;
    }

    /* Supprime le deuxième cadre SimplyBook */
    #sb_category_step_container .tab.tab-col.tab-with-popup {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        margin: 0 !important;
        background: transparent !important;
    }

    #sb_category_step_container .category-item .excerpt-info {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    /* Images bien collées au bloc, sans deuxième contour */
    #sb_category_step_container .user-img,
    #sb_category_step_container img.user-img {
        width: 100% !important;
        display: block !important;
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        margin: 0 !important;
    }

    /* Fond bleu sur toute la partie du bouton :
       plus de rectangle noir autour */
    #sb_category_step_container .tab-pd,
    #sb_category_step_container .btn-bar,
    #sb_category_step_container .content {
        background: var(--vm-blue) !important;
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }

    #sb_category_step_container .btn-bar {
        padding: 18px 24px !important;
        margin: 0 !important;
    }

    #sb_category_step_container .btn.select.custom {
        width: 100% !important;
        max-width: none !important;
        height: 44px !important;
        margin: 0 !important;
        border: 1px solid var(--vm-gold) !important;
        border-radius: 999px !important;

        background:
            linear-gradient(
                180deg,
                #1264dc 0%,
                #0b46b3 52%,
                #072c7b 100%
            ) !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.18),
            0 4px 10px rgba(0,0,0,.25) !important;

        color: var(--vm-gold-light) !important;
        font-family: "Cinzel", Georgia, serif !important;
        font-weight: 600 !important;
        letter-spacing: .4px !important;
    }


    /* =====================================================
       3. PAGE LISTE DES PRESTATIONS
       ===================================================== */

    #sb_service_step_container {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 28px 20px !important;
        align-items: start !important;
    }

    #sb_service_step_container .service-item {
        margin: 0 !important;
        border: 1px solid var(--vm-gold) !important;
        border-radius: 15px !important;
        overflow: hidden !important;
        background: var(--vm-blue) !important;
        box-shadow:
            0 7px 20px rgba(0,0,0,.27),
            0 0 10px rgba(227,174,69,.06) !important;
    }

    /* enlève les cadres intérieurs inutiles */
    #sb_service_step_container .service-item .tab,
    #sb_service_step_container .service-item .tab-pd,
    #sb_service_step_container .service-item .content,
    #sb_service_step_container .service-item .btn-bar,
    #sb_service_step_container .service-item .bar-service {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }

    #sb_service_step_container .service-item .tab,
    #sb_service_step_container .service-item .tab-pd {
        background: transparent !important;
        margin: 0 !important;
    }

    #sb_service_step_container .service-item .bar-service {
        background: var(--vm-blue) !important;
        padding: 12px 14px !important;
    }

    #sb_service_step_container .service-item .btn-bar {
        background: var(--vm-blue) !important;
        padding: 10px 14px 14px !important;
    }

    #sb_service_step_container .service-item img.user-img {
        width: 100% !important;
        display: block !important;
        border: 0 !important;
        border-radius: 0 !important;
    }


    /* =====================================================
       4. CALENDRIER — NETTOYAGE DES 4 CADRES
       ===================================================== */

    /* Garde UN SEUL cadre extérieur */
    #sb_dateview_container {
        background: rgba(3,16,45,.94) !important;
        border: 1px solid var(--vm-gold) !important;
        border-radius: 18px !important;
        padding: 20px 22px !important;
        box-shadow:
            0 8px 26px rgba(0,0,0,.25) !important;
    }

    /* supprime les cadres supplémentaires */
    #sb_dateview_container > .section-pd,
    #sb_dateview_container .calendar,
    #sb_dateview_container .top-date-select,
    #sb_dateview_container .header {
        box-shadow: none !important;
        outline: none !important;
    }

    #sb_dateview_container > .section-pd {
        border: 0 !important;
        border-radius: 0 !important;
        padding: 0 !important;
        background: transparent !important;
    }

    #sb_dateview_container .calendar {
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
    }


    /* =====================================================
       5. CORRECTION DU BUG DES FLÈCHES DANS LES DATES
       ===================================================== */

    /*
       Très important :
       les dates des mois précédent/suivant ne doivent
       JAMAIS afficher un chevron à côté du chiffre.
    */

    #sb_dateview_container .calendar .date-prev-or-next-month::before,
    #sb_dateview_container .calendar .date-prev-or-next-month::after {
        content: none !important;
        display: none !important;
    }

    #sb_dateview_container .calendar .date-prev-or-next-month {
        padding-left: 0 !important;
        padding-right: 0 !important;
        color: rgba(248,243,232,.42) !important;
    }

    /* boutons mois précédent / suivant */
    #sb_prev_month,
    #sb_next_month {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        color: var(--vm-gold-light) !important;
        font-family: "Cinzel", Georgia, serif !important;
        font-size: 17px !important;
        font-weight: 600 !important;
    }

    /* On masque les anciennes icônes cassées */
    #sb_prev_month .fa,
    #sb_next_month .fa {
        display: none !important;
    }

    /* Puis on recrée proprement les flèches */
    #sb_prev_month::before {
        content: "‹" !important;
        display: inline-block !important;
        font-family: Georgia, serif !important;
        font-size: 36px !important;
        line-height: .7 !important;
        color: var(--vm-gold-light) !important;
    }

    #sb_next_month::after {
        content: "›" !important;
        display: inline-block !important;
        font-family: Georgia, serif !important;
        font-size: 36px !important;
        line-height: .7 !important;
        color: var(--vm-gold-light) !important;
    }


    /* =====================================================
       6. MOIS + ANNÉE PLUS GROS
       ===================================================== */

    #sb_dateview_container .top-date-select .txt-center,
    #sb_dateview_container .top-date-select .txt-center > div,
    #sb_dateview_container .current-date {
        font-family: "Cinzel", Georgia, serif !important;
        font-size: 26px !important;
        font-weight: 600 !important;
        letter-spacing: 1px !important;
        line-height: 1.2 !important;
        color: var(--vm-gold-light) !important;
        text-transform: capitalize !important;
    }

    #sb_dateview_container .top-date-select {
        margin-bottom: 12px !important;
    }


    /* =====================================================
       7. JOURS DU CALENDRIER
       ===================================================== */

    #sb_dateview_container .calendar {
        font-family: "Cinzel", Georgia, serif !important;
        color: #f4ead8 !important;
    }

    #sb_dateview_container .calendar .header {
        color: #f4ead8 !important;
        font-size: 16px !important;
        letter-spacing: .3px !important;
    }

    #sb_dateview_container .calendar .day-on,
    #sb_dateview_container .calendar .day-off,
    #sb_dateview_container .calendar .date {
        font-size: 16px !important;
    }


    /* =====================================================
       8. BLOC SOIN SÉLECTIONNÉ À GAUCHE
       SUPPRESSION DU DOUBLE CADRE
       ===================================================== */

    #sb_sidebar_container .service-item,
    #sb_sidebar_container .service-item.item-v3 {
        border: 1px solid var(--vm-gold) !important;
        border-radius: 14px !important;
        overflow: hidden !important;
        background: var(--vm-blue) !important;
        box-shadow: none !important;
    }

    #sb_sidebar_container .service-item .tab,
    #sb_sidebar_container .service-item .tab-pd,
    #sb_sidebar_container .service-item .excerpt-info,
    #sb_sidebar_container .service-item .content,
    #sb_sidebar_container .service-item .bar-service {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        margin: 0 !important;
    }

    #sb_sidebar_container img.user-img {
        width: 100% !important;
        display: block !important;
        border: 0 !important;
        box-shadow: none !important;
    }


    /* =====================================================
       9. BLOC "HORAIRES DE DÉBUT DISPONIBLES"
       ===================================================== */

    #sb_time_slots_container {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        margin-top: 0 !important;
        padding: 0 !important;
    }

    #sb_time_slots_container .slots {
        background: rgba(3,16,45,.86) !important;
        border: 1px solid var(--vm-gold) !important;
        border-radius: 15px !important;
        padding: 16px !important;
        box-shadow: none !important;
    }

    /* Le titre */
    #sb_time_slots_container .header,
    #sb_time_slots_container .title,
    #sb_time_slots_container h3 {
        font-family: "Cinzel", Georgia, serif !important;
        font-size: 21px !important;
        font-style: normal !important;
        font-weight: 600 !important;
        letter-spacing: .4px !important;
        color: var(--vm-gold-light) !important;
        margin: 0 0 13px 3px !important;
        line-height: 1.2 !important;
        background: transparent !important;
    }

    /* Si le texte est directement dans une classe time */
    #sb_time_slots_container .time {
        font-family: "Cinzel", Georgia, serif !important;
    }

    /* cases horaires */
    #sb_time_slots_container .slot,
    #sb_time_slots_container .time-slot,
    #sb_time_slots_container .btn {
        min-height: 46px !important;
        margin: 5px !important;
        border: 1px solid var(--vm-gold) !important;
        border-radius: 11px !important;

        background:
            linear-gradient(
                180deg,
                #0d3e91 0%,
                #08245f 100%
            ) !important;

        color: var(--vm-gold-light) !important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.12) !important;
    }

    #sb_time_slots_container .slot:hover,
    #sb_time_slots_container .time-slot:hover,
    #sb_time_slots_container .btn:hover {
        background:
            linear-gradient(
                180deg,
                #1263d7 0%,
                #0a368d 100%
            ) !important;
    }


    /* =====================================================
       10. PAGE CONNEXION / INSCRIPTION
       SUPPRESSION DU GROS CADRE NOIR
       ===================================================== */

    #client-login {
        background:
            linear-gradient(
                145deg,
                rgba(4,20,59,.97),
                rgba(3,12,39,.97)
            ) !important;

        border: 1px solid var(--vm-gold) !important;
        border-radius: 20px !important;
        box-shadow:
            0 12px 35px rgba(0,0,0,.30) !important;
        overflow: hidden !important;
    }

    #client-login.section {
        background:
            linear-gradient(
                145deg,
                rgba(4,20,59,.97),
                rgba(3,12,39,.97)
            ) !important;
    }

    #client-login .client-login-bar {
        margin: 0 !important;
        padding: 24px 50px 14px !important;
        background: transparent !important;
        border: 0 !important;
    }

    #client-login .social {
        background: transparent !important;
        border-bottom: 1px solid rgba(227,174,69,.50) !important;
        padding: 0 0 20px !important;
        margin: 0 !important;
    }


    /* =====================================================
       11. TITRE PAGE CONNEXION
       ===================================================== */

    #client-login .title-main {
        background:
            linear-gradient(
                90deg,
                #061c51,
                #0a327d,
                #061c51
            ) !important;

        color: var(--vm-gold-light) !important;
        font-family: "Cinzel", Georgia, serif !important;
        font-size: 28px !important;
        font-weight: 600 !important;
        letter-spacing: 1px !important;
        text-align: center !important;

        border: 0 !important;
        padding: 21px 25px !important;
        margin: 0 !important;
    }


    /* =====================================================
       12. LES DEUX COLONNES CONNEXION / INSCRIPTION
       ===================================================== */

    #sb_sign_in_form,
    #sb_sign_up_form {
        background: transparent !important;
        color: #f8f3e8 !important;
    }

    #sb_sign_in_form {
        padding: 0 60px 0 0 !important;
    }

    #sb_sign_up_form {
        padding: 0 0 0 60px !important;
    }

    #sb_sign_in_form .cap,
    #sb_sign_up_form .cap {
        font-family: "Cinzel", Georgia, serif !important;
        font-size: 20px !important;
        font-weight: 600 !important;
        color: var(--vm-gold-light) !important;
        padding: 20px 0 !important;
    }

    #sb_sign_in_form label,
    #sb_sign_up_form label {
        color: #f7ead2 !important;
        font-family: "Nunito", Arial, sans-serif !important;
    }


    /* =====================================================
       13. CHAMPS DU FORMULAIRE
       ===================================================== */

    #client-login input.form-control,
    #client-login .form-control {
        height: 50px !important;
        background: rgba(3,16,45,.95) !important;
        color: #fff !important;
        border: 1px solid rgba(227,174,69,.68) !important;
        border-radius: 10px !important;
        box-shadow: none !important;
    }

    #client-login input.form-control:focus,
    #client-login .form-control:focus {
        border-color: var(--vm-gold-light) !important;
        box-shadow:
            0 0 0 2px rgba(227,174,69,.12) !important;
    }


    /* =====================================================
       14. GOOGLE + FACEBOOK
       On enlève le vieux rendu bouton bleu/or
       ===================================================== */

    #client-login .links {
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        gap: 12px !important;
    }

    #client-login .btn-action.gl,
    #client-login .btn-action.fb {
        width: auto !important;
        min-width: 110px !important;
        height: 44px !important;
        padding: 0 14px !important;
        margin: 0 !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;

        border: 1px solid var(--vm-gold) !important;
        border-radius: 999px !important;

        background: var(--vm-blue) !important;
        box-shadow: none !important;
        text-decoration: none !important;
    }

    #client-login .btn-action.gl:hover,
    #client-login .btn-action.fb:hover {
        background: #0b2d70 !important;
    }

    #client-login .btn-action.gl .icon,
    #client-login .btn-action.fb .icon {
        background: transparent !important;
        width: 22px !important;
        height: 22px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    #client-login .btn-action.gl svg,
    #client-login .btn-action.fb svg {
        width: 20px !important;
        height: 20px !important;
    }

    #client-login .btn-action.gl .btn-txt,
    #client-login .btn-action.fb .btn-txt {
        font-family: "Cinzel", Georgia, serif !important;
        font-size: 13px !important;
        color: var(--vm-gold-light) !important;
        text-transform: none !important;
    }


    /* =====================================================
       15. TRADUCTION DE "PRIVACY POLICY"
       ===================================================== */

    /*
       SimplyBook injecte ce texte en anglais.
       On masque uniquement le texte visible du lien,
       puis on recrée la version française.
    */

    #sb_privacy_policy_link {
        font-size: 0 !important;
        color: var(--vm-gold-light) !important;
    }

    #sb_privacy_policy_link::after {
        content: "J’accepte la politique de confidentialité de Le Voyageur Mystique *" !important;
        font-size: 17px !important;
        font-family: "Nunito", Arial, sans-serif !important;
        line-height: 1.35 !important;
        color: var(--vm-gold-light) !important;
    }

    #sb_user_terms_link,
    #sb_cancellation_terms_link {
        color: var(--vm-gold-light) !important;
    }


    /* =====================================================
       16. BOUTONS CONNEXION / CONTINUER
       ===================================================== */

    #client-login .btn,
    #client-login button {
        border-color: var(--vm-gold) !important;
    }

    #client-login .btn.btn-default,
    #client-login .btn.btn-success,
    #client-login .btn.custom {
        background:
            linear-gradient(
                180deg,
                #1264dc,
                #0a3b99
            ) !important;

        color: var(--vm-gold-light) !important;
        border: 1px solid var(--vm-gold) !important;
        border-radius: 999px !important;
        font-family: "Cinzel", Georgia, serif !important;
        box-shadow: none !important;
    }


    /* =====================================================
       17. BOUTON RETOUR
       ===================================================== */

    #sb_back_button {
        margin-bottom: 28px !important;
    }

    #sb_back_button .btn {
        font-family: "Cinzel", Georgia, serif !important;
        color: var(--vm-gold-light) !important;
        border: 1px solid var(--vm-gold) !important;
        border-radius: 999px !important;

        background:
            linear-gradient(
                180deg,
                #1264dc,
                #0a3b99
            ) !important;

        box-shadow: none !important;
    }


    /* =====================================================
       18. BOUTON PAYER DANS HEADER
       évite qu'il vienne recouvrir panier / connexion
       ===================================================== */

    #header .items-wrapper {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 12px !important;
        margin-left: auto !important;
    }

    #header .items-wrapper > * {
        position: static !important;
        transform: none !important;
        margin: 0 !important;
    }

}
/* =========================================================
   PATCH CORRECTIF WEB — NE TOUCHE PAS AU MOBILE
   ========================================================= */

@media (min-width: 769px) {

    /* =====================================================
       1. CATÉGORIES — UN SEUL CONTOUR + UN SEUL BOUTON
       ===================================================== */

    #sb_category_step_container .category-item {
        border: 2px solid #d8a63d !important;
        border-radius: 15px !important;
        overflow: hidden !important;
        background: #061c4c !important;
        box-shadow: none !important;
    }

    #sb_category_step_container .category-item .tab,
    #sb_category_step_container .category-item .tab-pd,
    #sb_category_step_container .category-item .excerpt-info,
    #sb_category_step_container .category-item .content {
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    #sb_category_step_container .category-item .btn-bar {
        background: #082765 !important;
        padding: 18px 24px !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    #sb_category_step_container .category-item .btn.select.custom,
    #sb_category_step_container .category-item .btn.select.custom a,
    #sb_category_step_container .category-item .btn.select.custom span {
        background: linear-gradient(
            180deg,
            #176bdc 0%,
            #0c4ab8 50%,
            #073284 100%
        ) !important;

        border: 1px solid #e2ad42 !important;
        box-shadow: none !important;
    }

    #sb_category_step_container .category-item .btn.select.custom {
        padding: 0 !important;
        overflow: hidden !important;
    }

    #sb_category_step_container .category-item .btn.select.custom a {
        width: 100% !important;
        height: 100% !important;
        border: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: inherit !important;
    }


    /* =====================================================
       2. LISTE DES SOINS — REVENIR À LA BONNE LARGEUR
       ===================================================== */

    #sb_service_step_container {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 26px 18px !important;
        width: 100% !important;
        align-items: stretch !important;
    }

    #sb_service_step_container .service-item {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    #sb_service_step_container .service-item .tab,
    #sb_service_step_container .service-item .tab-pd {
        width: 100% !important;
        max-width: none !important;
    }

    #sb_service_step_container .service-item img.user-img {
        width: 100% !important;
        height: auto !important;
        object-fit: cover !important;
    }


    /* =====================================================
       3. CALENDRIER — SUPPRIMER LES CHEVRONS DEVANT LES JOURS
       ===================================================== */

    #sb_dateview_container .date-prev-or-next-month::before,
    #sb_dateview_container .date-prev-or-next-month::after,
    #sb_dateview_container .calendar .date-prev-or-next-month::before,
    #sb_dateview_container .calendar .date-prev-or-next-month::after,
    #sb_dateview_container .calendar td::before,
    #sb_dateview_container .calendar td::after {
        content: none !important;
        display: none !important;
    }

    #sb_dateview_container .date-prev-or-next-month {
        padding: 0 !important;
        margin: 0 !important;
        text-indent: 0 !important;
    }


    /* =====================================================
       4. VRAIES FLÈCHES MOIS PRÉC / SUIV
       ===================================================== */

    #sb_prev_month,
    #sb_next_month {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        color: #e5ad42 !important;
        font-family: Cinzel, Georgia, serif !important;
        font-size: 18px !important;
        font-weight: 600 !important;
    }

    #sb_prev_month::before {
        content: "‹" !important;
        display: inline-block !important;
        font-size: 34px !important;
        line-height: .5 !important;
        color: #e5ad42 !important;
    }

    #sb_next_month::after {
        content: "›" !important;
        display: inline-block !important;
        font-size: 34px !important;
        line-height: .5 !important;
        color: #e5ad42 !important;
    }

    #sb_prev_month span.fa,
    #sb_next_month span.fa {
        display: none !important;
    }


    /* =====================================================
       5. AOÛT 2026 PLUS GROS
       ===================================================== */

    #sb_dateview_container .top-date-select .txt-center,
    #sb_dateview_container .top-date-select .txt-center div {
        font-family: Cinzel, Georgia, serif !important;
        font-size: 28px !important;
        font-weight: 600 !important;
        color: #e6b04a !important;
        letter-spacing: 1px !important;
    }


    /* =====================================================
       6. CALENDRIER — UN SEUL CADRE
       ===================================================== */

    #sb_dateview_container {
        border: 1px solid #d7a33b !important;
        border-radius: 16px !important;
        background: rgba(3,16,45,.86) !important;
        box-shadow: none !important;
        padding: 18px 20px !important;
    }

    #sb_dateview_container .section-pd,
    #sb_dateview_container .calendar,
    #sb_dateview_container .top-date-select,
    #sb_dateview_container .header {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }


    /* =====================================================
       7. CARTE DU SOIN CHOISI — PLUS COMPACTE
       ===================================================== */

    #sb_sidebar_container {
        padding-right: 18px !important;
    }

    #sb_sidebar_container .service-item,
    #sb_sidebar_container .service-item.item-v3 {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        border: 1px solid #d8a63d !important;
        border-radius: 12px !important;
        overflow: hidden !important;
    }

    #sb_sidebar_container .service-item img.user-img {
        height: auto !important;
        max-height: 170px !important;
        object-fit: cover !important;
    }

    #sb_sidebar_container .service-item .tab-pd,
    #sb_sidebar_container .service-item .bar-service,
    #sb_sidebar_container .service-item .content {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }


    /* =====================================================
       8. HORAIRES — SUPPRIMER LE GROS RECTANGLE NOIR
       ===================================================== */

    #sb_time_slots_container,
    #sb_time_slots_container .slots,
    #sb_time_slots_container > div {
        background: transparent !important;
        box-shadow: none !important;
    }

    #sb_time_slots_container .slots {
        border: 1px solid #d8a63d !important;
        border-radius: 14px !important;
        padding: 14px !important;
    }

    #sb_time_slots_container .header,
    #sb_time_slots_container .title,
    #sb_time_slots_container h3 {
        background: transparent !important;
        color: #e6b04a !important;
        font-family: Cinzel, Georgia, serif !important;
        font-size: 21px !important;
        font-style: normal !important;
        font-weight: 600 !important;
        text-shadow: none !important;
        margin-bottom: 12px !important;
    }


    /* =====================================================
       9. PAGE CONNEXION — REFAIRE L'ENSEMBLE PLUS ÉLÉGANT
       ===================================================== */

    #client-login {
        width: calc(100% - 90px) !important;
        max-width: 1100px !important;
        margin: 0 auto 35px !important;

        background: rgba(3,16,45,.88) !important;
        border: 1px solid #d8a63d !important;
        border-radius: 16px !important;
        box-shadow: none !important;
        overflow: hidden !important;
    }

    #client-login.section {
        background: rgba(3,16,45,.88) !important;
    }

    #client-login .title-main {
        background: #082765 !important;
        color: #e6b04a !important;
        font-family: Cinzel, Georgia, serif !important;
        font-size: 26px !important;
        padding: 16px 20px !important;
        border-bottom: 1px solid rgba(216,166,61,.45) !important;
    }

    #client-login .client-login-bar {
        background: transparent !important;
        padding: 22px 40px 12px !important;
        margin: 0 !important;
    }

    #client-login .social {
        background: transparent !important;
        border-bottom: 1px solid rgba(216,166,61,.45) !important;
        padding: 0 0 16px !important;
        margin: 0 0 16px !important;
    }

    #client-login .social .txt,
    #client-login .social {
        color: #f2ead9 !important;
    }


    /* =====================================================
       10. GOOGLE / FACEBOOK — PLUS PROPRES
       ===================================================== */

    #client-login .links {
        display: flex !important;
        gap: 10px !important;
        justify-content: flex-end !important;
        align-items: center !important;
    }

    #client-login .btn-action.gl,
    #client-login .btn-action.fb {
        width: 48px !important;
        min-width: 48px !important;
        height: 48px !important;
        padding: 0 !important;
        border: 1px solid #d8a63d !important;
        border-radius: 50% !important;
        background: #082765 !important;
        box-shadow: none !important;
        overflow: hidden !important;
    }

    #client-login .btn-action.gl .btn-txt,
    #client-login .btn-action.fb .btn-txt {
        display: none !important;
    }

    #client-login .btn-action.gl .icon,
    #client-login .btn-action.fb .icon {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: transparent !important;
    }

    #client-login .btn-action.gl svg,
    #client-login .btn-action.fb svg {
        width: 24px !important;
        height: 24px !important;
    }


    /* =====================================================
       11. COLONNES LOGIN / INSCRIPTION — MOINS MASSIVES
       ===================================================== */

    #sb_sign_in_form,
    #sb_sign_up_form {
        background: transparent !important;
    }

    #sb_sign_in_form {
        padding-right: 35px !important;
    }

    #sb_sign_up_form {
        padding-left: 35px !important;
    }

    #sb_sign_in_form .cap,
    #sb_sign_up_form .cap {
        color: #e6b04a !important;
        font-family: Cinzel, Georgia, serif !important;
        font-size: 19px !important;
        padding: 12px 0 18px !important;
    }


    /* =====================================================
       12. CHAMPS PLUS FINS
       ===================================================== */

    #client-login input.form-control,
    #client-login .form-control {
        height: 46px !important;
        background: #06173e !important;
        border: 1px solid rgba(216,166,61,.65) !important;
        border-radius: 8px !important;
        box-shadow: none !important;
    }

}
/* ==========================================================
   CORRECTIF WEB 23H21
   ========================================================== */
@media (min-width: 769px) {

    /* ======================================================
       1 — CATÉGORIES : VRAI CONTOUR DORÉ UNIQUE
       ====================================================== */

    #sb_category_step_container .category-item.item {
        border: none !important;
        box-shadow: none !important;
        outline: none !important;
        background: transparent !important;
    }

    #sb_category_step_container
    .category-item.item
    > .tab.tab-col.tab-with-popup {

        border: 2px solid #D89C24 !important;
        border-radius: 16px !important;
        overflow: hidden !important;

        background: #061C4C !important;

        box-shadow: none !important;
        outline: none !important;
    }

    /* aucun deuxième cadre dans la carte */
    #sb_category_step_container .excerpt-info,
    #sb_category_step_container .preloader-image,
    #sb_category_step_container .tab-pd,
    #sb_category_step_container .content,
    #sb_category_step_container .btn-bar {

        border: none !important;
        outline: none !important;
        box-shadow: none !important;
    }


    /* ======================================================
       BOUTON SÉLECTIONNER : UN SEUL BOUTON
       ====================================================== */

    #sb_category_step_container .btn-bar {
        background: #08245F !important;
        padding: 17px 28px !important;
    }

    #sb_category_step_container .btn.select.custom {

        background:
            linear-gradient(
                180deg,
                #1674E8 0%,
                #0752C2 52%,
                #073685 100%
            ) !important;

        border: 1.5px solid #E0A632 !important;
        border-radius: 25px !important;

        box-shadow: none !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    #sb_category_step_container .btn.select.custom > a {

        background: transparent !important;
        border: none !important;
        outline: none !important;
        box-shadow: none !important;

        width: 100% !important;
        height: 100% !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border-radius: 0 !important;
    }


    /* ======================================================
       2 — CALENDRIER :
       LES FAUX CHEVRONS DEVANT LES NUMÉROS
       ====================================================== */

    #sb_dateview_container .date.prev-or-next-month::before,
    #sb_dateview_container .date.prev-or-next-month::after {

        content: none !important;
        display: none !important;
    }

    #sb_dateview_container .date.prev-or-next-month {

        padding-left: 0 !important;
        padding-right: 0 !important;

        background: transparent !important;
        box-shadow: none !important;

        text-indent: 0 !important;
    }


    /* on neutralise aussi les anciennes règles
       qui auraient ajouté des chevrons à TOUS les jours */

    #sb_dateview_container .calendar .date::before,
    #sb_dateview_container .calendar .date::after {

        content: none !important;
        display: none !important;
    }


    /* ======================================================
       FLÈCHES UNIQUEMENT À MOIS PRÉC. / MOIS SUIV.
       ====================================================== */

    #sb_prev_month::before {
        content: "‹" !important;
        display: inline-block !important;

        color: #E2A433 !important;
        font-size: 33px !important;
        line-height: 15px !important;

        margin-right: 8px !important;
    }

    #sb_next_month::after {
        content: "›" !important;
        display: inline-block !important;

        color: #E2A433 !important;
        font-size: 33px !important;
        line-height: 15px !important;

        margin-left: 8px !important;
    }

    #sb_prev_month,
    #sb_next_month {
        color: #E2A433 !important;
        font-family: Cinzel, Georgia, serif !important;
        font-size: 17px !important;
        font-weight: 700 !important;
    }


    /* ======================================================
       AOÛT 2026
       ====================================================== */

    #sb_dateview_container
    .top-date-select
    .txt-center,

    #sb_dateview_container
    .top-date-select
    .txt-center > div {

        font-family: Cinzel, Georgia, serif !important;

        font-size: 29px !important;
        line-height: 36px !important;

        font-weight: 700 !important;

        color: #E2A433 !important;
    }


    /* ======================================================
       CALENDRIER : ENLEVER LES CADRES SUPERFLUS
       ====================================================== */

    #sb_dateview_container {
        background: #061C4C !important;

        border: 2px solid #D89C24 !important;
        border-radius: 17px !important;

        box-shadow: none !important;
    }

    #sb_dateview_container .section-pd {
        border: none !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    #sb_dateview_container .calendar {
        background: transparent !important;
        box-shadow: none !important;
    }


    /* ======================================================
       3 — HORAIRES :
       LE RECTANGLE NOIR DISPARAÎT
       ====================================================== */

    #sb_time_slots_container {
        background: #061C4C !important;
        border: 1.5px solid #D89C24 !important;
        border-radius: 15px !important;

        box-shadow: none !important;

        padding: 15px 18px 18px !important;
    }

    #sb_time_slots_container > div,
    #sb_time_slots_container .slots {

        background: transparent !important;

        border: none !important;
        box-shadow: none !important;
    }

    #sb_time_slots_container .slots {
        padding: 4px 0 0 !important;
    }


    /* TITRE HORAIRES */
    #sb_time_slots_container .header,
    #sb_time_slots_container h3,
    #sb_time_slots_container .title {

        background: transparent !important;

        color: #E2A433 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-style: normal !important;
        font-weight: 700 !important;

        font-size: 20px !important;

        margin: 0 0 13px !important;
        padding: 0 !important;
    }


    /* ======================================================
       CARTE DU SOIN CHOISI : MOINS HAUTE
       ====================================================== */

    #sb_sidebar_container .service-item,
    #sb_sidebar_container .service-item.item-v3,
    #sb_sidebar_container .tab.tab-col.tab-with-popup {

        height: auto !important;
        min-height: 0 !important;

        margin-bottom: 0 !important;
    }

    #sb_sidebar_container .user-img {

        height: 160px !important;
        max-height: 160px !important;

        object-fit: cover !important;
    }

    #sb_sidebar_container .tab-pd {
        padding: 10px 12px !important;
    }


    /* ======================================================
       4 — PAGE CONNEXION :
       PLUS AUCUN GRAND CADRE NOIR
       ====================================================== */

    #client-login,
    #client-login.section {

        background: #061C4C !important;

        border: 2px solid #D89C24 !important;
        border-radius: 16px !important;

        box-shadow: none !important;
    }

    #client-login .client-login-bar {

        background: #061C4C !important;

        border: none !important;
        box-shadow: none !important;
    }

    #client-login .social {

        background: #061C4C !important;

        border-bottom: 1px solid
        rgba(216,156,36,.55) !important;
    }


    /* bande titre */
    #client-login .title-main {

        background: #082765 !important;

        color: #E2A433 !important;

        border: none !important;
        border-bottom: 1px solid #D89C24 !important;

        box-shadow: none !important;

        font-family: Cinzel, Georgia, serif !important;
        font-weight: 700 !important;
    }


    /* zone centrale */
    #client-login .custom-form,
    #client-login .section,
    #client-login .row {

        box-shadow: none !important;
    }


    /* titres connexion / inscription */
    #client-login .cap {

        color: #E2A433 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-weight: 700 !important;

        text-transform: uppercase !important;
    }

}
/* ==========================================================
   PATCH WEB — CORRECTIONS FINALES CIBLÉES
   ========================================================== */

@media (min-width: 769px) {

    /* ======================================================
       1 — CARTES CATÉGORIES
       SUPPRIME LE PETIT CADRE AUTOUR DE L'IMAGE
       ====================================================== */

    #sb_category_step_container .preloader-image,
    #sb_category_step_container .preloader-image a,
    #sb_category_step_container .preloader-image span,
    #sb_category_step_container img.user-img,
    #sb_category_step_container .user-img {

        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }

    #sb_category_step_container img.user-img {
        display: block !important;
        width: 100% !important;
    }

    /* le SEUL contour reste celui de la carte entière */
    #sb_category_step_container
    .category-item.item
    > .tab.tab-col.tab-with-popup {

        border: 2px solid #D79A22 !important;
        outline: none !important;
        box-shadow: none !important;
        overflow: hidden !important;
    }



    /* ======================================================
       2 — CALENDRIER
       FORCE EXACTEMENT 7 JOURS PAR LIGNE
       ====================================================== */

    #sb_dateview_container .calendar {

        display: flex !important;
        flex-wrap: wrap !important;

        width: 100% !important;

        padding: 0 !important;
        margin: 0 !important;

        background: #061C4C !important;
    }

    #sb_dateview_container .calendar .date {

        box-sizing: border-box !important;

        flex: 0 0 14.285714% !important;
        width: 14.285714% !important;
        max-width: 14.285714% !important;

        margin: 0 !important;

        min-height: 42px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        text-align: center !important;
    }

    /* empêche les anciennes règles de décaler certaines dates */
    #sb_dateview_container .calendar .date.prev-or-next-month,
    #sb_dateview_container .calendar .date.current-month {

        padding-left: 0 !important;
        padding-right: 0 !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    #sb_dateview_container .calendar .date::before,
    #sb_dateview_container .calendar .date::after {

        display: none !important;
        content: none !important;
    }



    /* ======================================================
       TITRE DU MOIS
       ====================================================== */

    #sb_dateview_container .top-date-select .txt-center,
    #sb_dateview_container .top-date-select .txt-center div {

        color: #E3A52B !important;

        font-family: Cinzel, Georgia, serif !important;

        font-size: 30px !important;
        line-height: 38px !important;

        font-weight: 700 !important;

        letter-spacing: .5px !important;
    }



    /* ======================================================
       MOIS PRÉCÉDENT / SUIVANT
       ====================================================== */

    #sb_prev_month,
    #sb_next_month {

        color: #E3A52B !important;

        font-family: Cinzel, Georgia, serif !important;

        font-size: 17px !important;
        font-weight: 700 !important;
    }

    #sb_prev_month::before {

        content: "‹" !important;
        display: inline-block !important;

        margin-right: 9px !important;

        font-size: 30px !important;
        line-height: 1 !important;

        color: #E3A52B !important;
    }

    #sb_next_month::after {

        content: "›" !important;
        display: inline-block !important;

        margin-left: 9px !important;

        font-size: 30px !important;
        line-height: 1 !important;

        color: #E3A52B !important;
    }



    /* ======================================================
       3 — ESPACE ENTRE CALENDRIER ET SOIN/HORAIRES
       ====================================================== */

    #sb_datetime_step_container
    > .col-sm-12
    + .col-sm-12 {

        margin-top: 20px !important;
    }

    #sb_sidebar_container,
    #sb_timeview_container {

        margin-top: 0 !important;
    }



    /* ======================================================
       HORAIRES
       PLUS AUCUN FOND NOIR / GRIS
       ====================================================== */

    #sb_timeview_container,
    #sb_timeview_container.section-wrapper,
    #sb_timeview_container .slots,
    #sb_timeview_container .time-container,
    #sb_time_slots_container,
    #sb_time_slots_container > div {

        background: #061C4C !important;

        box-shadow: none !important;
        outline: none !important;
    }

    #sb_time_slots_container {

        border: 1.5px solid #D79A22 !important;
        border-radius: 15px !important;

        padding: 18px 20px 20px !important;
    }



    /* ======================================================
       TITRE "HORAIRES DE DÉBUT DISPONIBLES"
       SUPPRESSION DE L'ÉCRITURE MANUSCRITE
       ====================================================== */

    #sb_timeview_container .header,
    #sb_timeview_container .title,
    #sb_timeview_container h3,
    #sb_time_slots_container .header,
    #sb_time_slots_container .title,
    #sb_time_slots_container h3 {

        font-family: Cinzel, Georgia, serif !important;

        font-size: 19px !important;
        line-height: 26px !important;

        font-weight: 700 !important;
        font-style: normal !important;

        letter-spacing: .6px !important;

        color: #E3A52B !important;

        background: transparent !important;

        margin: 0 0 14px 0 !important;
        padding: 0 !important;

        text-shadow: none !important;
    }



    /* ======================================================
       MINI BLOCS DES HEURES
       ====================================================== */

    #sb_timeview_container .time-slot,
    #sb_timeview_container .slot,
    #sb_time_slots_container .time-slot,
    #sb_time_slots_container .slot {

        background:
            linear-gradient(
                180deg,
                #123A82 0%,
                #092B6A 100%
            ) !important;

        border: 1.5px solid #D79A22 !important;

        border-radius: 11px !important;

        box-shadow: none !important;

        margin: 5px !important;
    }



    /* ======================================================
       4 — PAGE CONNEXION
       REMPLACE TOUT L'ANTHRACITE/NOIR PAR BLEU NUIT
       ====================================================== */

    #client-login,
    #client-login.section,
    #client-login .client-login-bar,
    #client-login .social,

    #sb_booking_content:has(#client-login),
    #sb_booking_content:has(#client-login) > div,
    #sb_booking_content:has(#client-login) .container-fluid,
    #sb_booking_content:has(#client-login) .container-fluid > .row {

        background: #061C4C !important;

        box-shadow: none !important;
    }

    #client-login.section {

        border: 2px solid #D79A22 !important;
        border-radius: 16px !important;

        overflow: hidden !important;
    }



    /* bandeau principal connexion */
    #client-login .title-main {

        background:
            linear-gradient(
                180deg,
                #103879 0%,
                #082860 100%
            ) !important;

        color: #E3A52B !important;

        border: none !important;
        border-bottom: 1px solid #D79A22 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-weight: 700 !important;
    }



    /* ======================================================
       GOOGLE / FACEBOOK
       NETTOYAGE DES BOUTONS
       ====================================================== */

    #client-login .social .buttons,
    #client-login .social .links {

        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;

        gap: 12px !important;
    }

    #client-login .social a.btn,
    #client-login .social a.btn-action {

        width: 48px !important;
        height: 48px !important;

        min-width: 48px !important;

        padding: 0 !important;
        margin: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border-radius: 50% !important;

        background: #FFFFFF !important;

        border: 2px solid #D79A22 !important;

        box-shadow: none !important;

        overflow: hidden !important;
    }

    #client-login .social .icon,
    #client-login .social .icon--google,
    #client-login .social .icon--facebook {

        width: 27px !important;
        height: 27px !important;

        margin: 0 !important;

        background: transparent !important;
    }

    #client-login .social svg {

        width: 27px !important;
        height: 27px !important;
    }

    /* retire les petits mots GOOGLE / FACEBOOK sous les icônes */
    #client-login .social .btn--txt {

        display: none !important;
    }



    /* ======================================================
       TEXTE DE LA ZONE RÉSEAUX SOCIAUX
       ====================================================== */

    #client-login .social .txt {

        color: #E3A52B !important;

        font-family: Cinzel, Georgia, serif !important;

        font-size: 16px !important;
    }



    /* ======================================================
       COULEUR OR GÉNÉRALE SUR LA PAGE CONNEXION
       ====================================================== */

    #client-login .cap,
    #client-login a,
    #client-login .title-main {

        color: #E3A52B !important;
    }

}
/* ==========================================================
   CORRECTIONS WEB FINALES — 20/08
   DESKTOP UNIQUEMENT
   ========================================================== */

@media screen and (min-width: 769px) {

    /* ======================================================
       1. CARTES CATÉGORIES
       UN SEUL CONTOUR : CELUI DE LA CARTE ENTIÈRE
       AUCUN TRAIT DORÉ AUTOUR / DANS L'IMAGE
       ====================================================== */

    #sb_category_step_container .category-item,
    #sb_category_step_container .category-item .tab,
    #sb_category_step_container .category-item a,
    #sb_category_step_container .category-item .excerpt-info,
    #sb_category_step_container .category-item .preloader-image,
    #sb_category_step_container .category-item .user,
    #sb_category_step_container .category-item .img,
    #sb_category_step_container .category-item .user-img {

        outline: none !important;
        box-shadow: none !important;
    }

    /* aucun contour sur toute la partie IMAGE */
    #sb_category_step_container .category-item .preloader-image,
    #sb_category_step_container .category-item .preloader-image *,
    #sb_category_step_container .category-item .user.img,
    #sb_category_step_container .category-item .user.img *,
    #sb_category_step_container img.user-img {

        border: none !important;
    }

    #sb_category_step_container img.user-img {

        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* UN SEUL cadre doré autour de la carte */
    #sb_category_step_container
    .category-item.item
    > .tab.tab-col.tab-with-popup {

        border: 2px solid #D79A22 !important;
        border-radius: 15px !important;

        overflow: hidden !important;

        outline: none !important;
        box-shadow: none !important;
    }



    /* ======================================================
       2. CALENDRIER
       ANNULE LE FLEX QUI AVAIT CASSÉ SIMPLYBOOK
       ====================================================== */

    #sb_dateview_container .calendar {

        display: block !important;

        width: 100% !important;

        background: transparent !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ======================
       LUN MAR MER JEU...
       ====================== */

    #sb_dateview_container .calendar .weeks {

        display: grid !important;

        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;

        width: 100% !important;

        margin: 0 0 10px 0 !important;
        padding: 0 !important;

        column-gap: 0 !important;
    }

    #sb_dateview_container .calendar .weeks > div {

        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;

        margin: 0 !important;

        padding: 7px 0 10px !important;

        text-align: center !important;

        display: block !important;

        float: none !important;

        color: #E7D6B5 !important;

        font-family: Cinzel, Georgia, serif !important;

        font-size: 16px !important;
        line-height: 22px !important;

        letter-spacing: .4px !important;
    }

    /* samedi / dimanche */
    #sb_dateview_container .calendar .weeks > div:nth-child(6),
    #sb_dateview_container .calendar .weeks > div:nth-child(7) {

        color: #C86C69 !important;
    }



    /* ======================================================
       LES DATES
       SimplyBook garde sa propre logique mais sur 7 colonnes
       ====================================================== */

    #sb_dateview_container .calendar .dates,
    #sb_dateview_container .calendar .days {

        display: grid !important;

        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #sb_dateview_container .calendar .dates > div,
    #sb_dateview_container .calendar .days > div {

        width: auto !important;
        max-width: none !important;

        margin: 0 !important;

        float: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 41px !important;

        box-sizing: border-box !important;
    }



    /* ======================================================
       ANNULATION DE NOTRE ANCIENNE RÈGLE SUR .date
       ====================================================== */

    #sb_dateview_container .calendar .date {

        flex: initial !important;

        width: auto !important;
        max-width: none !important;

        margin: 0 !important;
    }



    /* ======================================================
       AOÛT 2026
       ====================================================== */

    #sb_dateview_container .top-date-select .txt-center,
    #sb_dateview_container .top-date-select .txt-center > div {

        font-family: Cinzel, Georgia, serif !important;

        font-size: 30px !important;
        line-height: 38px !important;

        font-weight: 700 !important;

        color: #E3A52B !important;

        letter-spacing: .7px !important;

        text-transform: uppercase !important;
    }



    /* ======================================================
       3. ESPACEMENT SOUS LE CALENDRIER
       ====================================================== */

    #sb_datetime_step_container > .col-sm-12:nth-child(2) {

        margin-top: 22px !important;
    }

    #sb_datetime_step_container > .col-sm-12:nth-child(2) > .row {

        margin-top: 0 !important;
    }



    /* ======================================================
       4. BLOC HORAIRES
       SUPPRESSION DÉFINITIVE DU GROS FOND NOIR
       ====================================================== */

    #sb_timeview_container,
    #sb_timeview_container.section-wrapper,
    #sb_timeview_container > div,
    #sb_timeview_container .slots,
    #sb_timeview_container .slots-inner,
    #sb_timeview_container .tab-pd {

        background: transparent !important;

        box-shadow: none !important;
        outline: none !important;
    }


    /* le vrai bloc contenant les heures */
    #sb_timeview_container .tab-pd {

        background: rgba(6, 28, 76, 0.92) !important;

        border: 1.5px solid #D79A22 !important;

        border-radius: 15px !important;

        padding: 18px 20px 20px !important;
    }



    /* ======================================================
       "HORAIRES DE DÉBUT DISPONIBLES"
       ON SUPPRIME COMPLÈTEMENT LA POLICE MANUSCRITE
       ====================================================== */

    #sb_timeview_container .container-caption {

        font-family: Cinzel, Georgia, serif !important;

        font-size: 19px !important;
        line-height: 27px !important;

        font-style: normal !important;
        font-weight: 700 !important;

        text-transform: uppercase !important;

        letter-spacing: .8px !important;

        color: #E3A52B !important;

        background: transparent !important;

        margin: 0 0 12px 0 !important;
        padding: 0 !important;

        text-shadow: none !important;
    }



    /* ======================================================
       5. PAGE CONNEXION
       PLUS AUCUN BOUT NOIR / ANTHRACITE
       ====================================================== */

    div#client-login.section {

        width: 100% !important;

        box-sizing: border-box !important;

        background: #061C4C !important;

        border: 2px solid #D79A22 !important;

        border-radius: 16px !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        overflow: hidden !important;
    }


    /* bloc juste sous le grand titre */
    div#client-login .client-login-bar {

        width: 100% !important;

        box-sizing: border-box !important;

        margin: 0 !important;

        padding: 22px 40px 18px !important;

        background: #061C4C !important;
    }


    /* ligne réseaux sociaux */
    div#client-login .social {

        width: 100% !important;

        box-sizing: border-box !important;

        background: transparent !important;

        margin: 0 !important;
    }


    /* LA PHRASE avait elle-même un background #191D1F */
    div#client-login .social .txt {

        background: transparent !important;

        color: #E3A52B !important;

        font-family: Cinzel, Georgia, serif !important;

        font-size: 16px !important;

        margin: 0 !important;
    }



    /* ======================================================
       PARENTS DE LA PAGE CONNEXION :
       PAS DE BANDE NOIRE SUR LA DROITE
       ====================================================== */

    #sb_booking_content:has(#client-login),
    #sb_booking_content:has(#client-login) > div,
    #sb_booking_content:has(#client-login) .container-fluid,
    #sb_booking_content:has(#client-login) .container-fluid > .row,
    #sb_booking_content:has(#client-login) .col-sm-12 {

        background: transparent !important;
    }



    /* ======================================================
       6. HEADER DESKTOP
       HAMBURGER = INTERDIT SUR ORDINATEUR
       ====================================================== */

    header .hamburger,
    header .hamburger-menu,
    header .menu-toggle,
    header .navbar-toggle,
    header .nav-trigger,
    header .mobile-menu,
    header [class*="hamburger"] {

        display: none !important;
    }



    /* ======================================================
       ICÔNES PANIER / CONNEXION QUI PASSENT SOUS "PAYER"
       SUR DESKTOP
       ====================================================== */

    header .items-wrapper {

        margin-right: 0 !important;
    }

    /* masquer panier et connexion du header de réservation
       puisque PAYER est déjà présent à droite */
    body:not(.mobile)
    #sb_booking_content ~ header .items-wrapper {
        display: none !important;
    }


    /* sécurité pour les boutons/icônes qui se retrouvent
       exactement derrière le bouton PAYER */
    header .items-wrapper [class*="cart"],
    header .items-wrapper [class*="login"],
    header .items-wrapper [class*="account"],
    header .items-wrapper [class*="logout"] {

        display: none !important;
    }

}
/* ==========================================================
   DERNIÈRE CORRECTION — CARTES CATÉGORIES DESKTOP
   ========================================================== */

@media screen and (min-width: 769px) {

    /* 1 — SUPPRIME LE TRAIT DORÉ ENTRE IMAGE ET BAS DE CARTE */
    #sb_category_step_container .category-item .excerpt-info,
    #sb_category_step_container .category-item .excerpt-info *,
    #sb_category_step_container .category-item .preloader-image,
    #sb_category_step_container .category-item .preloader-image *,
    #sb_category_step_container .category-item .user.img,
    #sb_category_step_container .category-item .user.img *,
    #sb_category_step_container .category-item img.user-img {
        border-bottom: 0 !important;
        border-top: 0 !important;
        box-shadow: none !important;
        outline: none !important;
    }


    /* 2 — BOUTON SÉLECTIONNER : TEXTE PLUS GROS + DORÉ */
    #sb_category_step_container .category-item .btn,
    #sb_category_step_container .category-item .btn *,
    #sb_category_step_container .category-item [class*="btn"] {
        color: #E3A52B !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 16px !important;
        font-weight: 700 !important;

        letter-spacing: .6px !important;
        text-transform: uppercase !important;
    }

}
/* =========================================================
   PAGE COMMENTAIRES — VERSION WEB UNIQUEMENT
   ========================================================= */

@media (min-width: 900px) {

    /* ===== CONTENEUR GLOBAL ===== */
    #reviews .page-pd {
        background: transparent !important;
        padding: 24px 20px 40px !important;
    }

    #reviews .page-pd > .container,
    #reviews .page-pd > .container-fluid {
        max-width: 1280px !important;
        margin: 0 auto !important;
    }


    /* =====================================================
       COLONNE GAUCHE — LAISSER UN COMMENTAIRE
       ===================================================== */

    #reviews #sb_reviews_add_container {
        background:
            linear-gradient(
                145deg,
                rgba(5, 26, 68, 0.96),
                rgba(2, 10, 32, 0.97)
            ) !important;

        border: 1px solid #d9ad42 !important;
        border-radius: 20px !important;

        padding: 26px 28px !important;
        margin: 0 18px 0 0 !important;

        box-shadow:
            0 12px 28px rgba(0,0,0,.35),
            inset 0 0 25px rgba(16,77,166,.12) !important;
    }


    /* Titre "Laisser un commentaire" */
    #reviews #sb_reviews_add_container .title-main {
        color: #f2c65d !important;
        font-family: Cinzel, Georgia, serif !important;
        font-size: 25px !important;
        font-weight: 700 !important;
        font-style: normal !important;
        text-align: center !important;

        padding: 0 0 20px !important;
        margin: 0 0 22px !important;

        border-bottom: 1px solid rgba(217,173,66,.45) !important;
    }


    /* Avatar */
    #reviews #sb_reviews_add_container img {
        width: 76px !important;
        height: 76px !important;
        border-radius: 50% !important;

        border: 2px solid #d9ad42 !important;

        box-shadow:
            0 0 14px rgba(217,173,66,.25) !important;
    }


    /* Champs */
    #reviews #sb_reviews_add_container input,
    #reviews #sb_reviews_add_container textarea {
        background: rgba(3, 17, 46, .90) !important;
        color: #ffffff !important;

        border: 1px solid rgba(217,173,66,.65) !important;
        border-radius: 12px !important;

        font-family: Georgia, serif !important;
        font-size: 16px !important;

        box-shadow: none !important;
    }

    #reviews #sb_reviews_add_container input {
        min-height: 48px !important;
    }

    #reviews #sb_reviews_add_container textarea {
        min-height: 135px !important;
        resize: vertical !important;
    }

    #reviews #sb_reviews_add_container input:focus,
    #reviews #sb_reviews_add_container textarea:focus {
        border-color: #f2c65d !important;
        box-shadow:
            0 0 0 1px #f2c65d,
            0 0 14px rgba(242,198,93,.18) !important;
        outline: none !important;
    }


    /* Étoiles */
    #reviews #sb_reviews_add_container .stars-container,
    #reviews #sb_reviews_add_container .rating-container {
        text-align: center !important;
        margin-top: 20px !important;
    }


    /* Texte connexion */
    #reviews #sb_reviews_add_container .cap {
        color: #f4f1e8 !important;
        font-family: Georgia, serif !important;
        font-size: 16px !important;
        text-align: center !important;
    }


    /* Boutons Google / Facebook */
    #reviews #sb_reviews_add_container .btn-bar {
        justify-content: center !important;
        gap: 14px !important;
    }

    #reviews #sb_reviews_add_container .btn-action {
        border: 1px solid #d9ad42 !important;
        border-radius: 50% !important;
        background: #071b46 !important;

        width: 52px !important;
        height: 52px !important;

        box-shadow: none !important;
    }


    /* Bouton email */
    #reviews #sb_reviews_add_container .btn--txt {
        color: #f2c65d !important;
        font-family: Cinzel, Georgia, serif !important;
        font-size: 16px !important;
        font-weight: 700 !important;
    }


    /* =====================================================
       COLONNE DROITE — TITRE COMMENTAIRES
       ===================================================== */

    #reviews #sb_reviews_list_container > .title-main,
    #reviews #sb_reviews_list_container .title-main {
        color: #f2c65d !important;
        font-family: Cinzel, Georgia, serif !important;

        font-size: 27px !important;
        font-weight: 700 !important;
        font-style: normal !important;

        margin: 0 0 18px !important;
        padding: 0 0 12px !important;

        border-bottom: 1px solid rgba(217,173,66,.45) !important;
    }


    /* =====================================================
       GRILLE DES AVIS : 2 CARTES PAR LIGNE
       ===================================================== */

    #reviews #sb_reviews_list_container {
        padding-left: 18px !important;
    }

    #reviews #sb_reviews_list_container .reviews-list,
    #reviews #sb_reviews_list_container .items,
    #reviews #sb_reviews_list_container > div:not(.title-main) {
        box-sizing: border-box !important;
    }


    /*
       Chaque avis
    */
    #reviews #sb_reviews_list_container .review-item {
        width: calc(50% - 10px) !important;
        display: inline-block !important;
        vertical-align: top !important;

        margin: 0 6px 18px !important;
        padding: 18px !important;

        background:
            linear-gradient(
                145deg,
                rgba(9, 43, 105, .97),
                rgba(3, 21, 60, .98)
            ) !important;

        border: 1px solid #d9ad42 !important;
        border-radius: 18px !important;

        box-shadow:
            0 10px 24px rgba(0,0,0,.28),
            inset 0 0 18px rgba(37,102,206,.08) !important;
    }


    /* Enlève le vieux gros fond noir interne */
    #reviews #sb_reviews_list_container .review-tab,
    #reviews #sb_reviews_list_container .comment {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }


    /* Avatar de l'avis */
    #reviews #sb_reviews_list_container .review-item img {
        width: 58px !important;
        height: 58px !important;
        border-radius: 50% !important;

        border: 1px solid rgba(242,198,93,.85) !important;
    }


    /* Nom du client */
    #reviews #sb_reviews_list_container .review-item .name,
    #reviews #sb_reviews_list_container .review-item .author {
        color: #f2c65d !important;

        font-family: Georgia, serif !important;
        font-size: 14px !important;

        margin-top: 8px !important;
    }


    /* Titre de l'avis */
    #reviews #sb_reviews_list_container .review-item .title,
    #reviews #sb_reviews_list_container .review-item .review-title {
        color: #ffffff !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 16px !important;
        line-height: 1.25 !important;
        font-weight: 600 !important;

        margin: 12px 0 8px !important;
    }


    /* Texte de l'avis */
    #reviews #sb_reviews_list_container .review-item .comment,
    #reviews #sb_reviews_list_container .review-item .review-tab,
    #reviews #sb_reviews_list_container .review-item p {
        color: #f5f3eb !important;

        font-family: Georgia, serif !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
    }


    /* Étoiles dorées */
    #reviews #sb_reviews_list_container .fa-star,
    #reviews #sb_reviews_list_container .star,
    #reviews #sb_reviews_list_container [class*="star"] {
        color: #ffc83d !important;
    }


    /* Likes / dislikes plus discrets */
    #reviews #sb_reviews_list_container .likes,
    #reviews #sb_reviews_list_container .dislikes,
    #reviews #sb_reviews_list_container .vote {
        opacity: .72 !important;
        font-size: 13px !important;
    }


    /* Suppression de vieux aplats noirs */
    #reviews .review-tab,
    #reviews .comment {
        background-color: transparent !important;
    }

}
/* ==========================================================
   PAGE COMMENTAIRES — WEB
   CIBLAGE DIRECT SIMPLYBOOK
   ========================================================== */

@media (min-width: 900px) {

    /* ===== COLONNE GAUCHE ===== */

    #sb_reviews_add_container {
        background:
            linear-gradient(145deg, #071b46 0%, #020b21 100%) !important;
        border: 1.5px solid #e3b24f !important;
        border-radius: 18px !important;
        padding: 28px !important;
        margin-right: 18px !important;
        box-shadow: 0 12px 28px rgba(0,0,0,.30) !important;
    }

    #sb_reviews_add_container .title-main {
        color: #f2c65d !important;
        font-family: Cinzel, Georgia, serif !important;
        font-style: normal !important;
        font-size: 24px !important;
        font-weight: 700 !important;
        text-align: center !important;
        margin: 0 0 26px !important;
        padding: 0 0 16px !important;
        border-bottom: 1px solid rgba(226,177,70,.45) !important;
    }

    #sb_reviews_add_container input,
    #sb_reviews_add_container textarea {
        background: #06152f !important;
        color: #fff !important;
        border: 1px solid #a7833c !important;
        border-radius: 10px !important;
        box-shadow: none !important;
        font-size: 15px !important;
    }

    #sb_reviews_add_container textarea {
        min-height: 125px !important;
    }

    #sb_reviews_add_container img {
        width: 68px !important;
        height: 68px !important;
        border-radius: 50% !important;
        border: 2px solid #e3b24f !important;
    }


    /* ===== GOOGLE + FACEBOOK ===== */

    #sb_reviews_add_container .btn-bar {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 18px !important;
    }

    #sb_reviews_add_container a.btn.btn--action.gl.sb-targetblank,
    #sb_reviews_add_container a.btn.btn--action.fb.sb-targetblank {
        width: 54px !important;
        height: 54px !important;
        min-width: 54px !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border-radius: 50% !important;
        border: 2px solid #e3b24f !important;
        background: #071b46 !important;

        box-shadow:
            0 0 12px rgba(227,178,79,.20) !important;
    }

    #sb_reviews_add_container span.icon.icon--google,
    #sb_reviews_add_container span.icon.icon--facebook {
        width: 44px !important;
        height: 44px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border-radius: 50% !important;
        background: #fff !important;
    }

    #sb_reviews_add_container span.icon.icon--google svg,
    #sb_reviews_add_container span.icon.icon--facebook svg {
        width: 27px !important;
        height: 27px !important;
    }

    #sb_reviews_add_container .btn--txt {
        font-family: Cinzel, Georgia, serif !important;
        color: #f2c65d !important;
        font-size: 14px !important;
    }


    /* ======================================================
       COLONNE DROITE
       ====================================================== */

    #sb_reviews_list_container {
        padding-left: 18px !important;
    }

    #sb_reviews_list_container > .title-main,
    #sb_reviews_list_container .title-main {
        color: #f2c65d !important;
        font-family: Cinzel, Georgia, serif !important;
        font-style: normal !important;
        font-size: 25px !important;
        font-weight: 700 !important;
        padding: 0 0 14px !important;
        margin: 0 0 20px !important;
        border-bottom: 1px solid rgba(227,178,79,.45) !important;
    }


    /* ===== AVIS PLUS PETITS ===== */

    #sb_reviews_list_container .review-item {
        background:
            linear-gradient(
                145deg,
                rgba(10,48,113,.98),
                rgba(3,20,57,.98)
            ) !important;

        border: 1.5px solid #e3b24f !important;
        border-radius: 17px !important;

        padding: 16px !important;
        margin-bottom: 18px !important;

        box-shadow: 0 10px 24px rgba(0,0,0,.28) !important;
    }


    /* SUPPRIME LE GROS RECTANGLE NOIR */
    #sb_reviews_list_container .review-tab,
    #sb_reviews_list_container .comment {
        background: transparent !important;
        background-color: transparent !important;

        border: none !important;
        box-shadow: none !important;

        padding: 8px 0 !important;
    }


    /* avatar */
    #sb_reviews_list_container .review-item img {
        width: 55px !important;
        height: 55px !important;
        border-radius: 50% !important;
        border: 1px solid #e3b24f !important;
    }


    /* Texte avis */
    #sb_reviews_list_container .review-tab,
    #sb_reviews_list_container .comment,
    #sb_reviews_list_container .review-item p {
        color: #f6f1e7 !important;
        font-family: Georgia, serif !important;
        font-size: 13px !important;
        line-height: 1.45 !important;
    }


    /* Étoiles */
    #sb_reviews_list_container .fa-star,
    #sb_reviews_list_container [class*="star"] {
        color: #ffc63d !important;
    }


    /* ======================================================
       2 AVIS PAR LIGNE
       ====================================================== */

    #sb_reviews_list_container {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 16px !important;
        align-content: flex-start !important;
    }

    #sb_reviews_list_container > .title-main {
        flex: 0 0 100% !important;
        width: 100% !important;
    }

    #sb_reviews_list_container > .review-item {
        flex: 0 0 calc(50% - 8px) !important;
        width: calc(50% - 8px) !important;
        box-sizing: border-box !important;
        margin: 0 !important;
    }

}
/* ==========================================================
   PAGE COMMENTAIRES — VERSION WEB
   Formulaire pleine largeur + avis 3 par ligne
   ========================================================== */

@media (min-width: 769px) {

    /* ---------- STRUCTURE GÉNÉRALE ---------- */

    #reviews-view .page-pd {
        padding: 28px 45px 50px !important;
    }

    /* La rangée SimplyBook ne doit plus rester en 2 colonnes */
    #reviews-view .page-pd .row {
        display: flex !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        margin: 0 !important;
        gap: 26px !important;
    }

    /* Les deux anciennes colonnes deviennent pleine largeur */
    #reviews-view .page-pd .row > .col-sm-6 {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }


    /* ======================================================
       BLOC "LAISSER UN COMMENTAIRE"
       ====================================================== */

    #sb_reviews_add_container {
        width: 100% !important;
        max-width: none !important;

        background:
            linear-gradient(
                135deg,
                rgba(3, 20, 60, 0.96),
                rgba(4, 39, 105, 0.90)
            ) !important;

        border: 2px solid #d9a92e !important;
        border-radius: 22px !important;

        padding: 24px 32px !important;
        margin: 0 0 30px !important;

        box-shadow:
            0 10px 28px rgba(0,0,0,.35),
            inset 0 0 22px rgba(24,88,190,.16) !important;
    }

    /* titre */
    #sb_reviews_add_container .title-main {
        color: #f2c65d !important;
        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 27px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        text-align: center !important;

        padding: 0 0 15px !important;
        margin: 0 0 22px !important;

        border-bottom: 1px solid rgba(242,198,93,.55) !important;
    }

    /* contenu du formulaire */
    #sb_reviews_add_container > div:not(.title-main) {
        max-width: 900px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* champs */
    #sb_reviews_add_container input,
    #sb_reviews_add_container textarea {
        background: rgba(2,19,55,.88) !important;
        color: #fff !important;

        border: 1px solid #d9a92e !important;
        border-radius: 12px !important;

        box-shadow: none !important;
    }

    #sb_reviews_add_container textarea {
        min-height: 115px !important;
    }

    #sb_reviews_add_container input:focus,
    #sb_reviews_add_container textarea:focus {
        border-color: #ffd96b !important;
        box-shadow: 0 0 12px rgba(242,198,93,.25) !important;
        outline: none !important;
    }


    /* ======================================================
       TITRE COMMENTAIRES
       ====================================================== */

    #reviews-view .col-sm-6 > .title-main,
    #reviews-view [class*="reviews"] > .title-main {
        color: #f2c65d !important;
        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 30px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;

        margin: 5px 0 24px !important;
        padding: 0 0 12px !important;

        border-bottom: 1px solid rgba(242,198,93,.45) !important;
    }


    /* ======================================================
       LISTE DES AVIS
       ====================================================== */

    #sb_reviews_list_container {
        display: grid !important;

        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 22px !important;

        width: 100% !important;
        max-width: none !important;

        padding: 0 !important;
        margin: 0 !important;

        background: transparent !important;
    }


    /* Chaque carte d'avis */
    #sb_reviews_list_container > div {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 20px !important;

        background:
            linear-gradient(
                145deg,
                rgba(5,35,97,.96),
                rgba(6,66,155,.82)
            ) !important;

        border: 1.5px solid #d9a92e !important;
        border-radius: 18px !important;

        box-sizing: border-box !important;

        box-shadow:
            0 8px 22px rgba(0,0,0,.28),
            inset 0 0 22px rgba(27,92,202,.15) !important;

        overflow: hidden !important;
    }


    /* Petit bloc interne noir des anciens commentaires :
       on le transforme pour qu'il s'intègre à la carte */
    #sb_reviews_list_container .review-tab,
    #sb_reviews_list_container .comment {
        width: 100% !important;
        max-width: 100% !important;

        background: rgba(3,15,39,.58) !important;

        border: 0 !important;
        border-radius: 12px !important;

        padding: 16px !important;
        margin: 10px 0 !important;

        box-sizing: border-box !important;
    }


    /* Nom */
    #sb_reviews_list_container .name {
        color: #f2c65d !important;
        font-size: 16px !important;
        font-weight: 700 !important;
    }


    /* Titre de l'avis */
    #sb_reviews_list_container .review-tab .title,
    #sb_reviews_list_container .comment .title {
        color: #fff !important;
        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 18px !important;
        line-height: 1.25 !important;
    }


    /* Texte */
    #sb_reviews_list_container .comment {
        color: #f7f4eb !important;
        font-size: 15px !important;
        line-height: 1.5 !important;
    }


    /* Avatar */
    #sb_reviews_list_container img {
        width: 62px !important;
        height: 62px !important;

        object-fit: cover !important;
        border-radius: 50% !important;

        border: 1.5px solid #d9a92e !important;
    }


    /* Étoiles */
    #sb_reviews_list_container .star,
    #sb_reviews_list_container [class*="star"] {
        color: #ffc928 !important;
    }

}
/* ==========================================================
   RESTAURATION HEADER DESKTOP
   Panier + connexion/déconnexion + payer
   ========================================================== */

@media (min-width: 769px) {

    /* Conteneur général à droite */
    #header .header-controls {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Tous les boutons du header à droite */
    #header .items-wrapper {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 12px !important;

        width: auto !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
    }

    /* Réaffiche les éléments éventuellement masqués */
    #header .items-wrapper > * {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;

        transform: none !important;
    }

    /* Le hamburger reste INTERDIT sur ordinateur */
    #header .nav-trigger {
        display: none !important;
    }
}
/* ============================================================
   CORRECTION FINALE DESKTOP
   HEADER + PAGE COMMENTAIRES
   ============================================================ */

@media (min-width: 900px) {

    /* ========================================================
       1. HEADER : RÉAFFICHER PANIER + CONNEXION
       ======================================================== */

    #header .header-controls,
    #header .items-wrapper {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-direction: row !important;

        width: auto !important;
        max-width: none !important;
        height: auto !important;

        overflow: visible !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    #header .items-wrapper {
        gap: 12px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* PAYER */
    #header #book-btn {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        inset: auto !important;
        transform: none !important;
    }

    /* PANIER */
    #header #sb_cart {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        width: 50px !important;
        min-width: 50px !important;
        height: 50px !important;

        overflow: visible !important;
    }

    #header #sb_cart *,
    #header #sb_cart .item-container {
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* CONNECTER / DÉCONNECTER */
    #header #sb_client_info {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        width: 50px !important;
        min-width: 50px !important;
        height: 50px !important;

        overflow: visible !important;
    }

    #header #sb_client_info *,
    #header #sb_client_info .item-container {
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* PAS DE HAMBURGER SUR ORDINATEUR */
    #header .nav-trigger {
        display: none !important;
    }


    /* ========================================================
       2. PAGE COMMENTAIRES : SUPPRIMER LES 2 COLONNES
       ======================================================== */

    #reviews-view .page-pd > .container-fluid > .row {
        display: block !important;
        margin: 0 !important;
    }

    #reviews-view .page-pd > .container-fluid > .row > .col-sm-6 {
        display: block !important;
        float: none !important;

        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;

        padding: 0 !important;
        margin: 0 !important;
    }

    /* ENLÈVE LE TRAIT BLANC VERTICAL */
    #reviews-view .section-divider {
        display: none !important;
    }


    /* ========================================================
       3. BLOC "LAISSER UN COMMENTAIRE"
       PLUS FIN + PLUS ÉLÉGANT
       ======================================================== */

    #reviews-view #sb_reviews_add_container {
        box-sizing: border-box !important;

        width: calc(100% - 80px) !important;
        max-width: 1100px !important;

        margin: 25px auto 42px !important;
        padding: 20px 45px 22px !important;

        min-height: 0 !important;
        height: auto !important;

        background:
            linear-gradient(
                145deg,
                rgba(3, 13, 35, 0.94),
                rgba(4, 28, 72, 0.90)
            ) !important;

        border: 1.5px solid #d7a928 !important;
        border-radius: 20px !important;

        box-shadow:
            0 12px 35px rgba(0,0,0,.30),
            inset 0 0 35px rgba(20,80,170,.10) !important;
    }

    /* TITRE */
    #reviews-view #sb_reviews_add_container .title-main {
        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 28px !important;
        line-height: 1.05 !important;
        font-weight: 600 !important;
        letter-spacing: .5px !important;

        color: #f2c65d !important;

        text-align: center !important;
        text-transform: uppercase !important;

        margin: 0 0 18px !important;
        padding: 0 0 12px !important;

        border-bottom: 1px solid rgba(218,174,66,.55) !important;
    }

    /* CONTENU DU FORMULAIRE */
    #reviews-view #sb_reviews_add_container .add-review {
        max-width: 850px !important;
        margin: 0 auto !important;
    }

    /* AVATAR */
    #reviews-view #sb_reviews_add_container .add-review img {
        width: 58px !important;
        height: 58px !important;
        min-width: 58px !important;

        object-fit: cover !important;
        border-radius: 50% !important;

        border: 2px solid #e0b13c !important;
        box-shadow: 0 0 14px rgba(224,177,60,.25) !important;
    }

    /* CHAMPS */
    #reviews-view #sb_reviews_add_container input,
    #reviews-view #sb_reviews_add_container textarea {
        background: rgba(3, 20, 55, .88) !important;

        border: 1px solid #b98b27 !important;
        border-radius: 10px !important;

        color: #fff !important;

        font-family: Arial, sans-serif !important;
        font-size: 15px !important;
    }

    #reviews-view #sb_reviews_add_container textarea {
        min-height: 85px !important;
        height: 85px !important;
    }

    /* ÉTOILES */
    #reviews-view #sb_reviews_add_container .rating,
    #reviews-view #sb_reviews_add_container .stars {
        margin-top: 12px !important;
        margin-bottom: 6px !important;
    }

    /* TEXTE CONNEXION */
    #reviews-view #sb_reviews_add_container .cap {
        font-family: Arial, sans-serif !important;
        font-size: 16px !important;
        color: #f3eee2 !important;
    }

    /* BOUTONS GOOGLE / FACEBOOK */
    #reviews-view #sb_reviews_add_container .btn-bar {
        gap: 16px !important;
        justify-content: center !important;
    }

    #reviews-view #sb_reviews_add_container .btn-action {
        transform: scale(.88) !important;
        transform-origin: center !important;
    }


    /* ========================================================
       4. ZONE COMMENTAIRES EN PLEINE LARGEUR
       ======================================================== */

    #reviews-view #sb_reviews_list_container {
        box-sizing: border-box !important;

        width: calc(100% - 80px) !important;
        max-width: 1280px !important;

        margin: 0 auto 50px !important;
        padding: 0 !important;

        background: transparent !important;
        border: none !important;
    }

    /* TITRE COMMENTAIRES */
    #reviews-view #sb_reviews_list_container > .title-main {
        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 30px !important;
        font-weight: 600 !important;

        color: #f2c65d !important;

        text-transform: uppercase !important;
        letter-spacing: .5px !important;

        margin: 0 0 22px !important;
        padding: 0 0 10px !important;

        border-bottom: 1px solid rgba(218,174,66,.45) !important;
    }


    /* ========================================================
       5. EXACTEMENT 3 COMMENTAIRES PAR LIGNE
       ======================================================== */

    #reviews-view #sb_reviews_list_items_container {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

        column-gap: 22px !important;
        row-gap: 22px !important;

        width: 100% !important;
        max-width: 100% !important;

        padding: 0 !important;
        margin: 0 !important;

        align-items: start !important;
    }

    /* CARTE INDIVIDUELLE */
    #reviews-view #sb_reviews_list_items_container .review-item {
        box-sizing: border-box !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        height: auto !important;
        min-height: 320px !important;

        margin: 0 !important;
        padding: 18px !important;

        background:
            linear-gradient(
                145deg,
                rgba(8,45,115,.95),
                rgba(3,20,58,.96)
            ) !important;

        border: 1.5px solid #d7a928 !important;
        border-radius: 17px !important;

        box-shadow: 0 10px 25px rgba(0,0,0,.22) !important;

        overflow: hidden !important;
    }

    /* CONTENU NOIR DANS LES COMMENTAIRES */
    #reviews-view .review-tab {
        box-sizing: border-box !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 12px 0 0 !important;
        padding: 15px !important;

        background: rgba(4, 12, 28, .76) !important;

        border: none !important;
        border-radius: 11px !important;

        overflow: hidden !important;
    }

    /* TEXTE DES COMMENTAIRES */
    #reviews-view .review-tab,
    #reviews-view .review-tab .comment {
        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 15px !important;
        line-height: 1.42 !important;

        color: #f7f2e8 !important;

        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    /* TITRE DU COMMENTAIRE */
    #reviews-view .review-tab .title {
        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 20px !important;
        line-height: 1.05 !important;

        color: #f4e7c4 !important;
    }

    /* AVATAR COMMENTAIRE */
    #reviews-view #sb_reviews_list_items_container img {
        width: 55px !important;
        height: 55px !important;
        object-fit: cover !important;

        border-radius: 50% !important;
        border: 1.5px solid #e0b13c !important;
    }
}
@media (min-width: 900px) {

    /* =====================================================
       PAGE COMMENTAIRES - RESET DE STRUCTURE
       ===================================================== */

    #reviews-view .page-pd,
    #reviews-view .page-pd > .container-fluid,
    #reviews-view .page-pd > .container-fluid > .row {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #reviews-view .page-pd > .container-fluid > .row {
        display: block !important;
    }

    #reviews-view .page-pd > .container-fluid > .row > div[class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        float: none !important;
        display: block !important;
    }

    #reviews-view .section-divider {
        display: none !important;
    }


    /* =====================================================
       FORMULAIRE DU HAUT : BEAUCOUP PLUS FIN
       ===================================================== */

    #reviews-view #sb_reviews_add_container {
        width: calc(100% - 120px) !important;
        max-width: 1150px !important;

        margin: 28px auto 36px !important;
        padding: 18px 36px 20px !important;

        min-height: 0 !important;
        height: auto !important;

        background: linear-gradient(
            145deg,
            rgba(4, 17, 45, .96),
            rgba(4, 37, 88, .92)
        ) !important;

        border: 1.5px solid #d7a928 !important;
        border-radius: 18px !important;
    }

    #reviews-view #sb_reviews_add_container .title-main {
        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 27px !important;
        font-weight: 600 !important;
        line-height: 1 !important;

        color: #f0c35a !important;

        margin: 0 0 14px !important;
        padding: 0 0 10px !important;

        text-align: center !important;
        text-transform: uppercase !important;

        border-bottom: 1px solid rgba(215,169,40,.45) !important;
    }

    #reviews-view #sb_reviews_add_container .add-review {
        max-width: 700px !important;
        margin: auto !important;
    }

    #reviews-view #sb_reviews_add_container textarea {
        min-height: 72px !important;
        height: 72px !important;
    }

    #reviews-view #sb_reviews_add_container input {
        height: 42px !important;
    }

    #reviews-view #sb_reviews_add_container img {
        width: 54px !important;
        height: 54px !important;
    }


    /* =====================================================
       CONTENEUR DES COMMENTAIRES
       ===================================================== */

    #reviews-view #sb_reviews_list_container {
        display: block !important;

        width: calc(100% - 120px) !important;
        max-width: 1250px !important;

        margin: 0 auto 50px !important;
        padding: 0 !important;

        background: transparent !important;
        border: none !important;
    }

    #reviews-view #sb_reviews_list_container .title-main {
        width: 100% !important;

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 29px !important;
        color: #f0c35a !important;

        margin: 0 0 20px !important;
        padding: 0 0 10px !important;

        border-bottom: 1px solid rgba(215,169,40,.45) !important;
    }


    /* =====================================================
       VRAIE GRILLE 3 PAR 3
       ===================================================== */

    #reviews-view #sb_reviews_list_items_container {
        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr)
            minmax(0, 1fr) !important;

        gap: 22px !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* IMPORTANT :
       SimplyBook peut mettre les cartes directement ou dans un wrapper */
    #reviews-view #sb_reviews_list_items_container > * {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        float: none !important;
    }


    /* =====================================================
       CARTES COMMENTAIRES
       ===================================================== */

    #reviews-view .review-item {
        box-sizing: border-box !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        padding: 18px !important;
        margin: 0 !important;

        background: linear-gradient(
            145deg,
            rgba(12, 58, 137, .95),
            rgba(4, 28, 72, .97)
        ) !important;

        border: 1.5px solid #d7a928 !important;
        border-radius: 16px !important;

        overflow: visible !important;
    }

    #reviews-view .review-tab {
        box-sizing: border-box !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        padding: 14px !important;
        margin-top: 12px !important;

        background: rgba(3,12,28,.78) !important;

        border: none !important;
        border-radius: 10px !important;

        overflow: visible !important;
    }

    #reviews-view .review-tab .comment,
    #reviews-view .review-tab .title,
    #reviews-view .review-tab,
    #reviews-view .review-item {
        word-break: normal !important;
        overflow-wrap: normal !important;
        white-space: normal !important;
    }

    #reviews-view .review-tab .comment {
        font-size: 14px !important;
        line-height: 1.38 !important;
    }

    #reviews-view .review-tab .title {
        font-size: 18px !important;
        line-height: 1.12 !important;
    }


    /* =====================================================
       SUPPRIMER LES LARGEURS BOOTSTRAP INTERNES
       ===================================================== */

    #reviews-view #sb_reviews_list_container [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        float: none !important;
    }
}
/* =========================================================
   PAGE COMMENTAIRES — LE VOYAGEUR MYSTIQUE
   VERSION DESKTOP — DESIGN 2 COMMENTAIRES PAR LIGNE
   ========================================================= */

@media (min-width: 992px) {

    /* -----------------------------------------------------
       1. RÉTABLIR L'ENTÊTE : PANIER + CONNEXION
       ----------------------------------------------------- */

    #header .header-controls,
    #header .items-wrapper,
    #header #sb_cart,
    #header #sb_client_info {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    #header .header-controls {
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 14px !important;
    }

    /* pas de hamburger sur ordinateur */
    #header .nav-trigger {
        display: none !important;
    }


    /* =====================================================
       2. PAGE COMMENTAIRES
       ===================================================== */

    #reviews-view .page-pd {
        padding: 28px 34px 45px !important;
        background: transparent !important;
    }

    #reviews-view .container-fluid {
        width: 100% !important;
        max-width: 1320px !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    /* Neutralise les anciennes colonnes Bootstrap */
    #reviews-view .row {
        display: block !important;
        margin: 0 !important;
    }

    #reviews-view .row > .col-sm-6,
    #reviews-view .row > .col-md-6,
    #reviews-view .row > [class*="col-"] {
        float: none !important;
        width: 100% !important;
        max-width: none !important;
        padding: 0 !important;
    }

    #reviews-view .section-divider {
        display: none !important;
    }


    /* =====================================================
       3. BLOC "LAISSER UN COMMENTAIRE"
       ===================================================== */

    #sb_reviews_add_container {
        width: 100% !important;
        max-width: none !important;

        margin: 0 auto 28px !important;
        padding: 18px 38px 20px !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                145deg,
                rgba(2, 16, 49, 0.97),
                rgba(4, 34, 78, 0.96)
            ) !important;

        border: 1.5px solid #e4b83e !important;
        border-radius: 18px !important;

        box-shadow:
            inset 0 0 30px rgba(17, 68, 137, 0.18),
            0 8px 25px rgba(0, 0, 0, 0.16) !important;
    }


    /* TITRE */
    #sb_reviews_add_container > div > .title-main,
    #sb_reviews_add_container .title-main {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 18px !important;

        width: 100% !important;

        margin: 0 0 18px !important;
        padding: 0 !important;

        color: #f3c75d !important;

        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 29px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;

        text-align: center !important;
        text-transform: uppercase !important;
        letter-spacing: .5px !important;

        background: transparent !important;
    }

    #sb_reviews_add_container .title-main::before,
    #sb_reviews_add_container .title-main::after {
        content: "" !important;
        flex: 1 1 auto !important;
        height: 1px !important;
        max-width: 250px !important;
        background: linear-gradient(
            90deg,
            transparent,
            rgba(229, 184, 65, .8)
        ) !important;
    }

    #sb_reviews_add_container .title-main::after {
        background: linear-gradient(
            90deg,
            rgba(229, 184, 65, .8),
            transparent
        ) !important;
    }


    /* -----------------------------------------------------
       CONTENU DU FORMULAIRE
       ----------------------------------------------------- */

    #sb_reviews_add_container .add-review {
        display: grid !important;
        grid-template-columns: 82px minmax(400px, 1fr) minmax(310px, .8fr) !important;
        grid-template-rows: auto !important;
        column-gap: 24px !important;
        align-items: center !important;

        max-width: 1040px !important;
        margin: 0 auto !important;
    }


    /* PHOTO PROFIL */
    #sb_reviews_add_container .avatar {
        grid-column: 1 !important;

        width: 68px !important;
        height: 68px !important;
        margin: 0 auto !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        background: transparent !important;
    }

    #sb_reviews_add_container .avatar .photo {
        width: 64px !important;
        height: 64px !important;

        margin: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border: 2px solid #e5b841 !important;
        border-radius: 50% !important;

        background: rgba(255,255,255,.04) !important;

        overflow: hidden !important;

        box-shadow:
            0 0 0 3px rgba(255,255,255,.08),
            0 0 14px rgba(232,185,65,.22) !important;
    }

    #sb_reviews_add_container .avatar img,
    #sb_reviews_add_container .photo img {
        width: 58px !important;
        height: 58px !important;

        object-fit: cover !important;
        border-radius: 50% !important;

        border: 0 !important;
        margin: 0 !important;

        box-shadow: none !important;
    }


    /* -----------------------------------------------------
       CHAMPS TITRE + MESSAGE
       ----------------------------------------------------- */

    #sb_reviews_add_container .form {
        grid-column: 2 !important;

        width: 100% !important;
        margin: 0 !important;

        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    #sb_reviews_add_container .form-group {
        margin: 0 !important;
        padding: 0 !important;
    }

    #sb_reviews_add_container input,
    #sb_reviews_add_container textarea {
        width: 100% !important;
        box-sizing: border-box !important;

        color: #f7f2e7 !important;

        background:
            linear-gradient(
                145deg,
                #06173c,
                #071e49
            ) !important;

        border: 1px solid rgba(229,184,65,.85) !important;
        border-radius: 10px !important;

        font-family: Arial, sans-serif !important;
        font-size: 15px !important;

        box-shadow:
            inset 0 2px 8px rgba(0,0,0,.18) !important;

        outline: none !important;
    }

    #sb_reviews_add_container input {
        height: 43px !important;
        padding: 0 14px !important;
    }

    #sb_reviews_add_container textarea {
        height: 88px !important;
        min-height: 88px !important;
        padding: 12px 14px !important;

        resize: vertical !important;
    }

    #sb_reviews_add_container input::placeholder,
    #sb_reviews_add_container textarea::placeholder {
        color: rgba(255,255,255,.67) !important;
    }

    #sb_reviews_add_container input:focus,
    #sb_reviews_add_container textarea:focus {
        border-color: #ffd66a !important;

        box-shadow:
            0 0 0 2px rgba(229,184,65,.10),
            0 0 15px rgba(39,100,193,.24) !important;
    }


    /* =====================================================
       4. ÉTOILES + CONNEXION
       ===================================================== */

    #sb_reviews_add_container .social-container {
        grid-column: 3 !important;

        width: 100% !important;
        margin: 0 !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
    }

    #sb_reviews_add_container .stars-container {
        margin: 0 0 7px !important;
        text-align: center !important;
    }

    #sb_reviews_add_container .stars-container .star,
    #sb_reviews_add_container .stars-container [class*="star"] {
        color: #f5bd26 !important;
    }

    #sb_reviews_add_container .social-container .cap {
        margin: 0 0 10px !important;

        color: #f6efe1 !important;

        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 15px !important;
        line-height: 1.3 !important;

        text-align: center !important;
    }


    /* RÉSEAUX SOCIAUX */
    #sb_reviews_add_container .buttons.brand.v3,
    #sb_reviews_add_container .btn-bar__social-links {
        width: auto !important;

        margin: 0 auto !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        gap: 18px !important;

        background: transparent !important;
    }


    #sb_reviews_add_container .btn-bar__social-links > a {
        width: 46px !important;
        height: 46px !important;

        padding: 0 !important;
        margin: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border: 1.5px solid #e5b841 !important;
        border-radius: 50% !important;

        background:
            linear-gradient(
                145deg,
                #071d4a,
                #0b347a
            ) !important;

        box-shadow:
            0 4px 12px rgba(0,0,0,.22) !important;
    }

    #sb_reviews_add_container .btn-bar__social-links > a:hover {
        transform: translateY(-2px) !important;

        box-shadow:
            0 5px 15px rgba(229,184,65,.20) !important;
    }

    #sb_reviews_add_container .btn-bar__social-links svg {
        width: 24px !important;
        height: 24px !important;
    }

    /* masque le texte Google / Facebook sous les logos */
    #sb_reviews_add_container .btn-bar__social-links .btn--txt {
        display: none !important;
    }


    /* -----------------------------------------------------
       "OU"
       ----------------------------------------------------- */

    #sb_reviews_add_container .social-container > .txt {
        width: 245px !important;

        margin: 9px auto 7px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        gap: 10px !important;

        color: #f2ead9 !important;

        font-family: Georgia, serif !important;
        font-size: 13px !important;

        text-align: center !important;
    }

    #sb_reviews_add_container .social-container > .txt::before,
    #sb_reviews_add_container .social-container > .txt::after {
        content: "" !important;
        display: block !important;
        flex: 1 !important;

        height: 1px !important;

        background: rgba(229,184,65,.42) !important;
    }


    /* -----------------------------------------------------
       BOUTON CONNEXION EMAIL
       ----------------------------------------------------- */

    #sb_reviews_add_container .client-login {
        position: relative !important;

        min-width: 215px !important;
        height: 38px !important;

        margin: 0 auto !important;
        padding: 0 20px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border: 1.5px solid #e5b841 !important;
        border-radius: 22px !important;

        background:
            linear-gradient(
                180deg,
                #1269db,
                #083994
            ) !important;

        color: transparent !important;

        font-size: 0 !important;

        box-shadow:
            0 4px 13px rgba(0,0,0,.22) !important;

        overflow: hidden !important;
    }

    #sb_reviews_add_container .client-login::after {
        content: "CONNEXION PAR EMAIL" !important;

        color: #f6cd68 !important;

        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        letter-spacing: .3px !important;

        white-space: nowrap !important;
    }


    /* =====================================================
       5. LISTE DES COMMENTAIRES
       ===================================================== */

    #sb_reviews_list_container {
        width: 100% !important;

        margin: 0 !important;
        padding: 22px 18px 28px !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                145deg,
                rgba(3,22,59,.96),
                rgba(5,42,91,.90)
            ) !important;

        border: 1.5px solid #e5b841 !important;
        border-radius: 18px !important;
    }


    /* GRAND TITRE COMMENTAIRES */
    #sb_reviews_list_container > .title-main,
    #sb_reviews_list_container .title-main {
        margin: 0 0 22px !important;
        padding: 0 0 11px !important;

        color: #f1c65e !important;

        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 34px !important;
        font-weight: 600 !important;
        line-height: 1.1 !important;

        text-align: center !important;

        border-bottom: 1px solid rgba(229,184,65,.38) !important;

        background: transparent !important;
    }


    /* =====================================================
       6. GRILLE : 2 COMMENTAIRES PAR LIGNE
       ===================================================== */

    #sb_reviews_list_items_container {
        width: 100% !important;

        display: grid !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 20px !important;

        align-items: stretch !important;
    }


    /* -----------------------------------------------------
       CARTE INDIVIDUELLE
       ----------------------------------------------------- */

    #sb_reviews_list_items_container .review-item {
        position: relative !important;

        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 310px !important;

        margin: 0 !important;
        padding: 20px 22px !important;

        box-sizing: border-box !important;

        float: none !important;

        display: grid !important;

        grid-template-columns: 78px 1fr !important;

        grid-template-areas:
            "avatar author"
            "avatar title"
            "avatar stars"
            "comment comment"
            "likes likes" !important;

        column-gap: 16px !important;

        align-content: start !important;

        background:
            linear-gradient(
                145deg,
                #061b48 0%,
                #0a3d8a 100%
            ) !important;

        border: 1.5px solid #e5b841 !important;
        border-radius: 16px !important;

        box-shadow:
            inset 0 0 28px rgba(44,99,184,.10),
            0 7px 18px rgba(0,0,0,.17) !important;

        overflow: hidden !important;
    }


    /* enlève le triangle blanc SimplyBook */
    #sb_reviews_list_items_container .review-item::before,
    #sb_reviews_list_items_container .review-tab::before {
        display: none !important;
        content: none !important;
    }


    /* PHOTO */
    #sb_reviews_list_items_container .avatar {
        grid-area: avatar !important;

        width: 72px !important;
        height: 72px !important;

        margin: 0 !important;

        display: flex !important;
        align-items: flex-start !important;
        justify-content: center !important;
    }

    #sb_reviews_list_items_container .avatar-content {
        width: 66px !important;
        height: 66px !important;

        margin: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border: 2px solid #e5b841 !important;
        border-radius: 50% !important;

        overflow: hidden !important;

        background: #0c326c !important;
    }

    #sb_reviews_list_items_container .avatar img {
        width: 62px !important;
        height: 62px !important;

        object-fit: cover !important;
        border-radius: 50% !important;

        border: 0 !important;
    }


    /* CONTENU */
    #sb_reviews_list_items_container .content {
        display: contents !important;
    }


    /* NOM */
    #sb_reviews_list_items_container .author {
        grid-area: author !important;

        align-self: end !important;

        margin: 2px 0 5px !important;

        color: #f7f1e6 !important;

        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
    }

    #sb_reviews_list_items_container .author p {
        margin: 0 !important;

        color: inherit !important;
        font: inherit !important;
    }


    /* Le review-tab devient transparent */
    #sb_reviews_list_items_container .review-tab {
        display: contents !important;

        padding: 0 !important;
        margin: 0 !important;

        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }


    /* TITRE COMMENTAIRE */
    #sb_reviews_list_items_container .cap {
        grid-area: title !important;

        margin: 0 0 4px !important;
        padding: 0 !important;

        color: #f1c358 !important;

        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 20px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;

        background: transparent !important;
    }


    /* ÉTOILES */
    #sb_reviews_list_items_container .stars {
        grid-area: stars !important;

        margin: 1px 0 9px !important;
        padding: 0 !important;

        display: flex !important;
        justify-content: flex-start !important;
        gap: 1px !important;

        background: transparent !important;
    }

    #sb_reviews_list_items_container .stars .star {
        width: 20px !important;
        height: 20px !important;

        color: #ffc42b !important;
    }


    /* TEXTE DU COMMENTAIRE */
    #sb_reviews_list_items_container .comment {
        grid-area: comment !important;

        width: 100% !important;

        margin: 10px 0 0 !important;
        padding: 14px 16px !important;

        box-sizing: border-box !important;

        color: #f8f3e8 !important;

        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 15px !important;
        line-height: 1.48 !important;

        background:
            linear-gradient(
                145deg,
                rgba(3,17,43,.93),
                rgba(5,25,57,.93)
            ) !important;

        border: 1px solid rgba(229,184,65,.22) !important;
        border-radius: 12px !important;

        box-shadow:
            inset 0 2px 8px rgba(0,0,0,.16) !important;
    }


    /* LIKE / DISLIKE */
    #sb_reviews_list_items_container .review-likes {
        grid-area: likes !important;

        margin-top: 12px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;

        color: rgba(255,255,255,.78) !important;
    }


    /* -----------------------------------------------------
       LIENS / BOUTONS / ÉLÉMENTS INTERNES
       ----------------------------------------------------- */

    #sb_reviews_list_items_container .review-item,
    #sb_reviews_list_items_container .review-item div {
        max-width: 100% !important;
    }


    /* pagination */
    #sb_reviews_page_pagination {
        width: 100% !important;
        margin-top: 24px !important;
        text-align: center !important;
    }

}


/* =========================================================
   MOBILE / TABLETTE
   On ne force PAS la grille desktop
   ========================================================= */

@media (max-width: 991px) {

    #reviews-view #sb_reviews_list_items_container {
        display: block !important;
    }

    #reviews-view #sb_reviews_list_items_container .review-item {
        width: 100% !important;
        margin-bottom: 18px !important;
    }

}
/* ==========================================================
   CORRECTIF FINAL PAGE COMMENTAIRES — DESKTOP
   À COLLER TOUT À LA FIN DU CSS
   ========================================================== */

@media screen and (min-width: 992px) {


/* ==========================================================
   1 — EN-TÊTE : PANIER + CONNEXION / DÉCONNEXION
   ========================================================== */

#header .header-controls,
#header .nav-wrapper,
#header .items-wrapper {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

#header .header-controls {
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
}

/* zone à droite contenant panier + compte */
#header .items-wrapper {
    width: auto !important;
    min-width: 240px !important;
    height: 54px !important;

    margin-left: 25px !important;

    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;

    overflow: visible !important;
}


/* PANIER */
#header #sb_cart {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;

    position: relative !important;

    width: 48px !important;
    height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;

    align-items: center !important;
    justify-content: center !important;

    background: transparent !important;
}


/* COMPTE CLIENT */
#header #sb_client_info {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;

    position: relative !important;

    width: auto !important;
    min-width: 48px !important;
    height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;

    align-items: center !important;
    justify-content: center !important;

    overflow: visible !important;
}





/* hamburger INTERDIT sur ordinateur */
#header .nav-trigger {
    display: none !important;
}


/* ==========================================================
   2 — FORMULAIRE "LAISSER UN COMMENTAIRE"
   ========================================================== */

#reviews-view #sb_reviews_add_container {
    width: calc(100% - 80px) !important;
    max-width: 1180px !important;

    margin: 30px auto 36px !important;
    padding: 20px 40px 24px !important;

    background:
        linear-gradient(
            145deg,
            rgba(3, 20, 55, .96),
            rgba(4, 36, 82, .96)
        ) !important;

    border: 1.5px solid #e6b93f !important;
    border-radius: 18px !important;

    box-sizing: border-box !important;
}


/* TITRE */
#reviews-view #sb_reviews_add_container .title-main {
    width: 100% !important;

    margin: 0 0 18px !important;
    padding: 0 0 12px !important;

    text-align: center !important;

    color: #f0c35a !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 29px !important;
    font-weight: 500 !important;
    line-height: 1.1 !important;
    letter-spacing: .5px !important;

    background: transparent !important;

    border-bottom: 1px solid rgba(229,184,65,.42) !important;
}


/* on annule les pseudo traits du précédent code */
#reviews-view #sb_reviews_add_container .title-main::before,
#reviews-view #sb_reviews_add_container .title-main::after {
    display: none !important;
    content: none !important;
}


/* TOUT LE FORMULAIRE CENTRÉ */
#reviews-view #sb_reviews_add_container .add-review {
    width: 100% !important;
    max-width: 700px !important;

    margin: 0 auto !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 12px !important;
}


/* ==========================================================
   3 — PHOTO PROFIL FORMULAIRE
   ========================================================== */

#reviews-view #sb_reviews_add_container .avatar {
    width: 70px !important;
    height: 70px !important;

    margin: 0 auto 5px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


#reviews-view #sb_reviews_add_container .photo {
    width: 64px !important;
    height: 64px !important;

    margin: 0 auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: 2px solid #e5b841 !important;
    border-radius: 50% !important;

    background: rgba(255,255,255,.05) !important;

    overflow: hidden !important;

    box-shadow: 0 0 12px rgba(229,184,65,.22) !important;
}


#reviews-view #sb_reviews_add_container .photo img {
    display: block !important;

    width: 58px !important;
    height: 58px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    object-fit: cover !important;
}


/* ==========================================================
   4 — CHAMPS
   ========================================================== */

#reviews-view #sb_reviews_add_container .form {
    width: 100% !important;
    max-width: 560px !important;

    margin: 0 auto !important;
}


#reviews-view #sb_reviews_add_container .form-group {
    width: 100% !important;
    margin: 0 0 10px !important;
}


#reviews-view #sb_reviews_add_container input,
#reviews-view #sb_reviews_add_container textarea {
    display: block !important;

    width: 100% !important;
    box-sizing: border-box !important;

    margin: 0 auto !important;

    background: #06183f !important;

    border: 1px solid #dbaa32 !important;
    border-radius: 10px !important;

    color: #fff !important;

    font-family: Arial, sans-serif !important;
    font-size: 15px !important;
}


#reviews-view #sb_reviews_add_container input {
    height: 46px !important;
    padding: 0 15px !important;
}


#reviews-view #sb_reviews_add_container textarea {
    height: 88px !important;
    min-height: 88px !important;

    padding: 12px 15px !important;
}


/* ==========================================================
   5 — ÉTOILES + CONNEXION CENTRÉES
   ========================================================== */

#reviews-view #sb_reviews_add_container .stars-container {
    width: 100% !important;

    margin: 7px auto 0 !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}


#reviews-view #sb_reviews_add_container .social-container {
    width: 100% !important;
    max-width: 560px !important;

    margin: 0 auto !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    text-align: center !important;
}


#reviews-view #sb_reviews_add_container .social-container .cap {
    width: 100% !important;

    margin: 4px auto 12px !important;

    text-align: center !important;

    color: #f5efe5 !important;

    font-family: Arial, sans-serif !important;
    font-size: 15px !important;
}


/* ==========================================================
   6 — GOOGLE + FACEBOOK PARFAITEMENT CENTRÉS
   ========================================================== */

#reviews-view #sb_reviews_add_container .buttons.brand.v3,
#reviews-view #sb_reviews_add_container .btn-bar__social-links {
    width: 100% !important;

    margin: 0 auto !important;

    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;

    gap: 18px !important;

    background: transparent !important;
}


#reviews-view #sb_reviews_add_container .btn-bar__social-links a {
    flex: 0 0 48px !important;

    width: 48px !important;
    height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: 1.5px solid #e5b841 !important;
    border-radius: 50% !important;

    background: #08245a !important;

    overflow: hidden !important;
}


/* SUPPRESSION GOOGLE / FACEBOOK ÉCRITS SOUS LES LOGOS */
#reviews-view #sb_reviews_add_container
.btn-bar__social-links a .btn--txt {
    display: none !important;
}


/* taille icônes */
#reviews-view #sb_reviews_add_container
.btn-bar__social-links svg {
    width: 25px !important;
    height: 25px !important;
}


/* ==========================================================
   7 — "OU"
   ========================================================== */

#reviews-view #sb_reviews_add_container
.social-container > .txt {
    width: 245px !important;

    margin: 10px auto 8px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 10px !important;

    text-align: center !important;

    color: #f4eee0 !important;

    font-family: Georgia, serif !important;
    font-size: 14px !important;
}


#reviews-view #sb_reviews_add_container
.social-container > .txt::before,
#reviews-view #sb_reviews_add_container
.social-container > .txt::after {
    content: "" !important;

    flex: 1 !important;

    height: 1px !important;

    background: rgba(229,184,65,.40) !important;
}


/* ==========================================================
   8 — CONNEXION PAR EMAIL
   SUPPRIME DÉFINITIVEMENT LE TEXTE ANGLAIS
   ========================================================== */

#reviews-view #sb_reviews_add_container a.client-login {
    position: relative !important;

    width: 220px !important;
    height: 38px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: 1.5px solid #e5b841 !important;
    border-radius: 25px !important;

    background:
        linear-gradient(
            180deg,
            #1265d1,
            #07358d
        ) !important;

    color: transparent !important;

    font-size: 0 !important;

    overflow: hidden !important;
}


/* L'ancien texte disparaît vraiment */
#reviews-view #sb_reviews_add_container
a.client-login > .btn--txt {
    display: none !important;
}


/* et on écrit uniquement le français */
#reviews-view #sb_reviews_add_container
a.client-login::after {
    content: "CONNEXION PAR EMAIL" !important;

    display: block !important;

    color: #f2c75d !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 14px !important;
    font-weight: bold !important;
    line-height: 38px !important;

    white-space: nowrap !important;
}


/* ==========================================================
   9 — BLOC COMMENTAIRES
   ========================================================== */

#reviews-view #sb_reviews_list_container {
    width: calc(100% - 80px) !important;
    max-width: 1300px !important;

    margin: 0 auto !important;
    padding: 20px 22px 30px !important;

    box-sizing: border-box !important;

    background:
        linear-gradient(
            145deg,
            rgba(4,23,62,.97),
            rgba(6,49,106,.93)
        ) !important;

    border: 1.5px solid #e5b841 !important;
    border-radius: 18px !important;
}


/* TITRE COMMENTAIRES */
#reviews-view #sb_reviews_list_container > .title-main {
    width: 100% !important;

    margin: 0 0 22px !important;
    padding: 0 0 12px !important;

    color: #f1c458 !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 36px !important;
    font-weight: 500 !important;

    text-align: center !important;

    border-bottom: 1px solid rgba(229,184,65,.4) !important;

    background: transparent !important;
}


/* ==========================================================
   10 — FORCE 2 COMMENTAIRES PAR LIGNE
   ========================================================== */

/*
   SimplyBook a un DIV supplémentaire dans
   #sb_reviews_list_items_container.
   On force donc AUSSI les enfants intermédiaires.
*/

#reviews-view #sb_reviews_list_items_container {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;

    gap: 22px !important;

    width: 100% !important;

    align-items: start !important;
}


/* Si SimplyBook ajoute un wrapper intermédiaire */
#reviews-view #sb_reviews_list_items_container > div:not(.review-item) {
    display: contents !important;
}


/* CHAQUE COMMENTAIRE = 50 % */
#reviews-view #sb_reviews_list_items_container .review-item {
    float: none !important;

    display: block !important;

    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;

    margin: 0 !important;

    box-sizing: border-box !important;
}


/* annule les tailles Bootstrap / SimplyBook */
#reviews-view #sb_reviews_list_items_container
.review-item[class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
}


/* ==========================================================
   11 — DESIGN DES CARTES
   ========================================================== */

#reviews-view .review-item {
    padding: 20px !important;

    background:
        linear-gradient(
            145deg,
            #061b48,
            #0a3d8a
        ) !important;

    border: 1.5px solid #e5b841 !important;
    border-radius: 16px !important;

    overflow: hidden !important;
}


/* PHOTO À GAUCHE */
#reviews-view .review-item .avatar {
    width: 72px !important;
    height: 72px !important;

    float: left !important;

    margin: 0 18px 10px 0 !important;
}


#reviews-view .review-item .avatar-content {
    width: 64px !important;
    height: 64px !important;

    border: 2px solid #e5b841 !important;
    border-radius: 50% !important;

    overflow: hidden !important;
}


#reviews-view .review-item .avatar img {
    width: 60px !important;
    height: 60px !important;

    object-fit: cover !important;

    border-radius: 50% !important;
}


/* NOM */
#reviews-view .review-item .author {
    margin: 3px 0 5px !important;

    color: #f8f1df !important;

    font-family: Georgia, serif !important;
    font-size: 15px !important;
}


/* FOND NOIR SUPPRIMÉ */
#reviews-view .review-item .review-tab {
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;
    box-shadow: none !important;
}


/* triangle blanc supprimé */
#reviews-view .review-item .review-tab::before,
#reviews-view .review-item::before {
    display: none !important;
    content: none !important;
}


/* TITRE */
#reviews-view .review-item .cap {
    margin: 4px 0 6px !important;

    color: #f1c458 !important;

    font-family: Georgia, serif !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;

    background: transparent !important;
}


/* ÉTOILES */
#reviews-view .review-item .stars {
    margin: 3px 0 12px !important;

    display: flex !important;
    justify-content: flex-start !important;

    background: transparent !important;
}


/* TEXTE */
#reviews-view .review-item .comment {
    clear: both !important;

    width: 100% !important;

    margin: 12px 0 0 !important;
    padding: 15px 17px !important;

    box-sizing: border-box !important;

    background: rgba(2,17,44,.82) !important;

    border: 1px solid rgba(229,184,65,.20) !important;
    border-radius: 12px !important;

    color: #f7f1e7 !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 15px !important;
    line-height: 1.48 !important;
}


/* ==========================================================
   FIN DESKTOP
   ========================================================== */

}
/* =========================================================
   CORRECTIF HEADER + COMMENTAIRES
   DESKTOP UNIQUEMENT
   ========================================================= */

@media screen and (min-width: 992px) {

  /* =======================================================
     1. REMETTRE PANIER + CONNEXION / DÉCONNEXION
     ======================================================= */

  #header .header-controls,
  #header .items-wrapper,
  #header #sb_cart,
  #header #sb_client_info {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  #header .header-controls {
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    overflow: visible !important;
  }

  #header .items-wrapper {
    width: auto !important;
    min-width: 250px !important;
    height: 52px !important;

    margin: 0 !important;
    padding: 0 !important;

    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;

    overflow: visible !important;
  }

  /* PANIER */
  #header #sb_cart {
    position: relative !important;

    width: 50px !important;
    height: 50px !important;

    margin: 0 !important;
    padding: 0 !important;

    align-items: center !important;
    justify-content: center !important;

    background: transparent !important;
    overflow: visible !important;
  }

  /* COMPTE CLIENT */
  #header #sb_client_info {
    position: relative !important;

    width: auto !important;
    min-width: 100px !important;
    height: 50px !important;

    margin: 0 !important;
    padding: 0 !important;

    align-items: center !important;
    justify-content: center !important;

    background: transparent !important;

    overflow: visible !important;
  }

  

  /* garde uniquement le hamburger pour mobile */
  #header .nav-trigger {
    display: none !important;
  }


  /* =======================================================
     2. ÉTOILES DU FORMULAIRE
     Elles sont actuellement EN COLONNE
     ======================================================= */

  #reviews-view #sb_reviews_add_container .stars-container,
  #reviews-view #sb_reviews_add_container [class*="stars"] {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    height: auto !important;

    margin-left: auto !important;
    margin-right: auto !important;

    gap: 4px !important;
  }

  #reviews-view #sb_reviews_add_container
  .stars-container > *,
  #reviews-view #sb_reviews_add_container
  [class*="stars"] > * {
    display: block !important;
    float: none !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;
  }


  /* =======================================================
     3. CENTRER PARFAITEMENT LE "OU"
     ======================================================= */

  #reviews-view #sb_reviews_add_container
  .social-container > .txt {
    width: 260px !important;

    margin: 12px auto 10px !important;

    display: grid !important;
    grid-template-columns: 1fr auto 1fr !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 10px !important;

    text-align: center !important;

    color: #f5efe5 !important;
  }

  #reviews-view #sb_reviews_add_container
  .social-container > .txt::before,
  #reviews-view #sb_reviews_add_container
  .social-container > .txt::after {
    content: "" !important;

    display: block !important;

    height: 1px !important;
    width: 100% !important;

    background: rgba(230,185,63,.45) !important;
  }


  /* =======================================================
     4. 2 COMMENTAIRES PAR LIGNE
     ======================================================= */

  #reviews-view #sb_reviews_list_items_container {
    display: grid !important;

    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;

    gap: 22px !important;

    width: 100% !important;
  }

  #reviews-view #sb_reviews_list_items_container
  > div:not(.review-item) {
    display: contents !important;
  }

  #reviews-view
  #sb_reviews_list_items_container
  .review-item {
    float: none !important;

    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 20px !important;

    box-sizing: border-box !important;

    background:
      linear-gradient(
        145deg,
        #061b48 0%,
        #0b3d88 100%
      ) !important;

    border: 1.5px solid #e5b841 !important;
    border-radius: 16px !important;

    overflow: hidden !important;
  }


  /* =======================================================
     5. EN-TÊTE DE CHAQUE COMMENTAIRE
     PHOTO À GAUCHE + PSEUDO À DROITE
     ======================================================= */

  #reviews-view .review-item .avatar {
    float: none !important;

    display: grid !important;

    grid-template-columns: 64px 1fr !important;
    grid-template-rows: auto !important;

    column-gap: 14px !important;

    align-items: center !important;

    width: 100% !important;
    height: auto !important;

    margin: 0 0 12px !important;
  }

  #reviews-view .review-item .avatar-content {
    grid-column: 1 !important;

    width: 60px !important;
    height: 60px !important;

    margin: 0 !important;

    border: 1.5px solid #e5b841 !important;
    border-radius: 50% !important;

    overflow: hidden !important;
  }

  #reviews-view .review-item .avatar img {
    display: block !important;

    width: 58px !important;
    height: 58px !important;

    margin: 0 !important;

    object-fit: cover !important;

    border-radius: 50% !important;
  }

  /* PSEUDO À DROITE DE LA PHOTO */
  #reviews-view .review-item .author {
    grid-column: 2 !important;

    display: flex !important;
    align-items: center !important;

    width: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #f8f1df !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;

    text-align: left !important;
  }


  /* =======================================================
     6. STRUCTURE DU CONTENU
     TITRE
     ÉTOILES
     COMMENTAIRE
     ======================================================= */

  #reviews-view .review-item .review-tab {
    clear: both !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;
    box-shadow: none !important;
  }

  /* supprime les petites flèches */
  #reviews-view .review-item::before,
  #reviews-view .review-item .review-tab::before,
  #reviews-view .review-item .review-tab::after {
    display: none !important;
    content: none !important;
  }


  /* TITRE DU COMMENTAIRE */
  #reviews-view .review-item .cap {
    display: block !important;

    width: 100% !important;

    margin: 0 0 8px !important;
    padding: 0 !important;

    color: #f0c45a !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;

    text-align: left !important;

    background: transparent !important;
  }


  /* ÉTOILES SOUS LE TITRE */
  #reviews-view .review-item .stars {
    display: flex !important;

    flex-direction: row !important;
    flex-wrap: nowrap !important;

    justify-content: flex-start !important;
    align-items: center !important;

    gap: 2px !important;

    width: 100% !important;
    height: auto !important;

    margin: 0 0 12px !important;
    padding: 0 !important;

    background: transparent !important;
  }

  #reviews-view .review-item .stars > div {
    float: none !important;

    width: 24px !important;
    height: 24px !important;

    margin: 0 !important;
    padding: 0 !important;
  }


  /* TEXTE DU COMMENTAIRE */
  #reviews-view .review-item .comment {
    clear: both !important;

    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 16px 18px !important;

    box-sizing: border-box !important;

    background: #061535 !important;

    border: 1px solid rgba(230,185,63,.25) !important;
    border-radius: 12px !important;

    color: #f8f3e9 !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;

    text-align: left !important;
  }


  /* =======================================================
     7. ESPACEMENT BAS DE CARTE
     ======================================================= */

  #reviews-view .review-item .review-likes {
    width: 100% !important;

    margin-top: 12px !important;

    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
  }

}
/* TEST - à supprimer après */
#reviews-view .title-main {
    color: red !important;
    font-size: 45px !important;
}
/* =========================================================
   DESKTOP — PANIER + CONNEXION À GAUCHE DU BOUTON PAYER
   ========================================================= */

@media (min-width: 769px) {

    /* zone droite du header */
    #header .header-controls {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        overflow: visible !important;
        position: relative !important;
        z-index: 9999 !important;
    }

    /* conteneur panier + connexion */
    #header .items-wrapper {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 14px !important;

        width: auto !important;
        min-width: 130px !important;

        /* IMPORTANT :
           on laisse la place au bouton PAYER à droite */
        margin-right: 145px !important;

        position: relative !important;
        z-index: 10002 !important;

        overflow: visible !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* panier */
    #header #sb_cart {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        width: 52px !important;
        height: 52px !important;
        flex: 0 0 52px !important;

        z-index: 10003 !important;
    }

    /* connexion / déconnexion */
    #header #sb_client_info {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        width: 52px !important;
        height: 52px !important;
        flex: 0 0 52px !important;

        z-index: 10003 !important;
    }

    /* leurs boutons internes */
    #header #sb_cart > *,
    #header #sb_client_info > * {
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* le bouton Payer reste tout à droite */
    #header .pay-btn,
    #header [class*="pay-btn"],
    #header [class*="payment"],
    #header a[href*="payment"] {
        z-index: 10001 !important;
    }
}
/* =========================================================
   FIX HEADER DESKTOP : PANIER + CONNEXION + PAYER
   ========================================================= */

@media (min-width: 769px) {

    #header {
        position: relative !important;
        overflow: visible !important;
    }

    #header .header-controls,
    #header .items-wrapper {
        position: static !important;
        overflow: visible !important;
    }

    /* PANIER */
    #header #sb_cart {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: absolute !important;
        top: 50% !important;
        right: 165px !important;
        transform: translateY(-50%) !important;

        width: 52px !important;
        height: 52px !important;

        z-index: 99999 !important;
    }

    /* CONNEXION / DÉCONNEXION */
    #header #sb_client_info {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: absolute !important;
        top: 50% !important;
        right: 100px !important;
        transform: translateY(-50%) !important;

        width: 52px !important;
        height: 52px !important;

        z-index: 99999 !important;
    }

    

    /* PAYER */
    #header .pay-btn,
    #header [class*="pay-btn"],
    #header [class*="payment"],
    #header a[href*="payment"],
    #header a[href*="pay"] {
        position: absolute !important;
        top: 50% !important;
        right: 18px !important;
        transform: translateY(-50%) !important;
        z-index: 99998 !important;
    }
}
/* =========================================================
   CORRECTION HEADER + ETOILES + PSEUDOS
   ========================================================= */


/* =========================================================
   1 — HEADER
   Panier + connexion juste AVANT Payer
   ========================================================= */

#header .header-controls {
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
}


/* menu principal */
#header .nav-wrapper {
    flex: 1 1 auto !important;
    width: auto !important;
}


/* panier + connexion */
#header .items-wrapper {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 12px !important;

    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;

    width: 116px !important;
    min-width: 116px !important;
    height: 54px !important;

    margin-left: 18px !important;
    margin-right: 165px !important;

    padding: 0 !important;

    z-index: 9999 !important;
    overflow: visible !important;
}


/* PANIER */
#header #sb_cart {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;

    position: relative !important;
    inset: auto !important;
    transform: none !important;

    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;

    margin: 0 !important;
    padding: 0 !important;

    flex: 0 0 50px !important;
}


/* CONNEXION / DÉCONNEXION */
#header #sb_client_info {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;

    position: relative !important;
    inset: auto !important;
    transform: none !important;

    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;

    margin: 0 !important;
    padding: 0 !important;

    flex: 0 0 50px !important;
}


/* éléments internes */
#header #sb_cart > *,
#header #sb_client_info > * {
    visibility: visible !important;
    opacity: 1 !important;
}


/* ancien rond bleu */
#header #book-btn {
    display: none !important;
}



/* =========================================================
   2 — ÉTOILES DU FORMULAIRE
   Cacher les ronds radio + étoiles sur UNE ligne
   ========================================================= */

#reviews-view
#sb_reviews_add_container
.stars-container {

    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    height: 45px !important;

    margin: 26px auto 16px !important;
    padding: 0 !important;

    gap: 5px !important;

    position: relative !important;
}


/* CACHE LES RONDS BLANCS */
#reviews-view
#sb_reviews_add_container
.stars-container input[type="radio"] {

    position: absolute !important;

    opacity: 0 !important;
    visibility: hidden !important;

    width: 1px !important;
    height: 1px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* vraies étoiles */
#reviews-view
#sb_reviews_add_container
.stars-container label,
#reviews-view
#sb_reviews_add_container
.stars-container .star {

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: relative !important;

    width: 31px !important;
    height: 31px !important;

    margin: 0 2px !important;
    padding: 0 !important;

    transform: none !important;
}



/* =========================================================
   3 — ZONE CONNEXION DU FORMULAIRE
   on conserve ton "ou" qui est maintenant bon
   ========================================================= */

#reviews-view
#sb_reviews_add_container
.social-container {

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    width: 100% !important;

    text-align: center !important;
}


#reviews-view
#sb_reviews_add_container
.btn-bar__social-links {

    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;

    gap: 18px !important;

    width: 100% !important;

    margin-left: auto !important;
    margin-right: auto !important;
}



/* =========================================================
   4 — COMMENTAIRES
   PHOTO À GAUCHE + PSEUDO À DROITE
   ========================================================= */


/*
   IMPORTANT :
   le pseudo est DANS .avatar--content
   donc c'est CET élément qui doit devenir flex
*/

#reviews-view
#sb_reviews_list_items_container
.review-item
.avatar {

    display: block !important;

    width: 100% !important;
    height: auto !important;

    margin: 0 0 14px 0 !important;
    padding: 0 !important;
}


#reviews-view
#sb_reviews_list_items_container
.review-item
.avatar .avatar--content {

    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;

    width: 100% !important;
    height: 62px !important;

    gap: 14px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* photo */
#reviews-view
#sb_reviews_list_items_container
.review-item
.avatar .avatar--content img {

    display: block !important;

    width: 58px !important;
    min-width: 58px !important;
    height: 58px !important;

    flex: 0 0 58px !important;

    object-fit: cover !important;
    border-radius: 50% !important;

    margin: 0 !important;
}


/* bloc pseudo */
#reviews-view
#sb_reviews_list_items_container
.review-item
.avatar .avatar--content .author {

    display: flex !important;
    align-items: center !important;

    position: relative !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    inset: auto !important;
    transform: none !important;
}


/* pseudo */
#reviews-view
#sb_reviews_list_items_container
.review-item
.avatar .avatar--content .author p {

    display: block !important;

    position: relative !important;

    width: auto !important;
    max-width: 360px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #F0C568 !important;

    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;

    text-align: left !important;

    white-space: normal !important;

    inset: auto !important;
    transform: none !important;
}



/* =========================================================
   5 — ÉTOILES DES COMMENTAIRES
   Elles commencent SOUS photo + pseudo
   ========================================================= */

#reviews-view
#sb_reviews_list_items_container
.review-item
.review-tab {

    display: block !important;

    clear: both !important;

    position: relative !important;

    width: 100% !important;

    margin: 8px 0 0 0 !important;
    padding: 0 !important;

    transform: none !important;
}


#reviews-view
#sb_reviews_list_items_container
.review-item
.review-tab .stars {

    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;

    position: relative !important;

    width: auto !important;

    margin: 0 0 8px 0 !important;
    padding: 0 !important;

    transform: none !important;
}



/* =========================================================
   6 — TITRE SOUS LES ÉTOILES
   ========================================================= */

#reviews-view
#sb_reviews_list_items_container
.review-item
.review-tab .cap {

    display: block !important;

    clear: both !important;

    position: relative !important;

    width: 100% !important;

    margin: 4px 0 10px 0 !important;
    padding: 0 !important;

    transform: none !important;
}



/* =========================================================
   7 — ON GARDE ABSOLUMENT 2 COMMENTAIRES PAR LIGNE
   ========================================================= */

#reviews-view #sb_reviews_list_items_container {

    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;

    column-gap: 24px !important;
    row-gap: 24px !important;

    width: 100% !important;
}


#reviews-view
#sb_reviews_list_items_container
.review-item {

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
}



/* MOBILE */
@media (max-width: 900px) {

    #reviews-view #sb_reviews_list_items_container {
        grid-template-columns: 1fr !important;
    }

}
/* =========================================================
   CORRECTIONS 11H52
   HEADER + ETOILES + OU + AVIS
   ========================================================= */


/* =========================================================


/* ==========================================================
   CORRECTION FINALE UNIQUE — 21/08/2026
   HEADER + PANIER + CONNEXION + PAYER + PAGE COMMENTAIRES
   IMPORTANT : ce bloc remplace les anciennes corrections
   contradictoires qui étaient empilées en fin de fichier.
========================================================== */


/* ==========================================================
   A — HEADER : STRUCTURE GÉNÉRALE
========================================================== */

#header {
    position: relative !important;
    overflow: visible !important;
}

@media (min-width: 992px) {

    #header .header-controls {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;

        position: relative !important;
        inset: auto !important;

        width: 100% !important;
        max-width: none !important;
        min-height: 92px !important;

        margin: 0 !important;
        padding: 0 18px 0 0 !important;

        transform: none !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    /* MENU CENTRAL */
    #header .header-controls > .nav-wrapper {
        grid-column: 1 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        display: block !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 18px !important;

        box-sizing: border-box !important;
        z-index: 20 !important;
    }

    #header #sb_menu,
    #header #sb_menu_list_items_container {
        width: 100% !important;
    }

    #header #sb_menu_list_items_container {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 70px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    /* BLOC DE DROITE : panier / connexion / payer */
    #header .header-controls > .items-wrapper {
        grid-column: 2 !important;

        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 12px !important;

        position: relative !important;
        inset: auto !important;

        width: max-content !important;
        min-width: max-content !important;
        height: 54px !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;
        overflow: visible !important;
        z-index: 50 !important;
    }

    #header .items-wrapper > * {
        float: none !important;
    }


    /* ======================================================
       B — PANIER
       Le dessin du caddie est fait en CSS :
       aucun carré / caractère manquant / police d'icône.
    ====================================================== */

    #header #sb_cart {
        order: 1 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;

        flex: 0 0 52px !important;
        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        border: 1.5px solid #f0c35a !important;
        border-radius: 50% !important;

        background: rgba(4, 22, 65, .92) !important;

        box-sizing: border-box !important;
        overflow: visible !important;

        visibility: visible !important;
        opacity: 1 !important;

        z-index: 70 !important;
    }

    #header #sb_cart .cart-container,
    #header #sb_cart .item-container,
    #header #sb_cart .sb-cart-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;

        width: 100% !important;
        height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        border: 0 !important;
        border-radius: 50% !important;
        background: transparent !important;
        box-shadow: none !important;

        overflow: visible !important;
    }

    /* On masque uniquement l'ancien glyphe défectueux */
    #header #sb_cart i,
    #header #sb_cart svg {
        visibility: hidden !important;
        opacity: 0 !important;
    }

    /* Corps du vrai petit caddie */
    #header #sb_cart .cart-container::before,
    #header #sb_cart .item-container::before,
    #header #sb_cart .sb-cart-btn::before {
        content: "" !important;

        display: block !important;
        position: absolute !important;

        left: 14px !important;
        top: 16px !important;

        width: 21px !important;
        height: 13px !important;

        border: 2px solid #f0c35a !important;
        border-top: 0 !important;
        border-radius: 2px 2px 5px 5px !important;

        box-sizing: border-box !important;

        transform: skewX(-7deg) !important;

        background: transparent !important;
        box-shadow: none !important;
    }

    /* Poignée + roues du caddie */
    #header #sb_cart .cart-container::after,
    #header #sb_cart .item-container::after,
    #header #sb_cart .sb-cart-btn::after {
        content: "" !important;

        display: block !important;
        position: absolute !important;

        left: 11px !important;
        top: 12px !important;

        width: 27px !important;
        height: 24px !important;

        border-top: 2px solid #f0c35a !important;

        background:
            radial-gradient(circle at 9px 21px,
                #f0c35a 0 2px,
                transparent 2.5px),
            radial-gradient(circle at 23px 21px,
                #f0c35a 0 2px,
                transparent 2.5px) !important;

        box-sizing: border-box !important;

        transform: rotate(10deg) !important;
        transform-origin: left top !important;

        pointer-events: none !important;
    }

    /* Compteur du panier */
    #header #sb_cart .counter,
    #header #sb_cart .sb-qty,
    #header #sb_cart .counter.sb-qty {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: absolute !important;

        top: -7px !important;
        right: -5px !important;

        min-width: 19px !important;
        width: auto !important;
        height: 19px !important;

        margin: 0 !important;
        padding: 0 5px !important;

        border: 0 !important;
        border-radius: 20px !important;

        background: #f0c35a !important;
        color: #06183d !important;

        font-family: Arial, sans-serif !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        line-height: 19px !important;

        visibility: visible !important;
        opacity: 1 !important;

        z-index: 100 !important;
        box-sizing: border-box !important;
    }


    /* ======================================================
       C — CONNEXION / DÉCONNEXION
    ====================================================== */

    #header #sb_client_info {
        order: 2 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;

        flex: 0 0 52px !important;
        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;
        z-index: 70 !important;
    }

    #header #sb_client_info .login-container,
    #header #sb_client_info .avatar.item-container,
    #header #sb_client_info > .item-container {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;

        width: 52px !important;
        min-width: 52px !important;
        height: 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        border: 1.5px solid #f0c35a !important;
        border-radius: 50% !important;

        background: rgba(4, 22, 65, .92) !important;

        box-sizing: border-box !important;
        overflow: visible !important;
    }

    #header #sb_client_info svg {
        display: block !important;

        width: 23px !important;
        height: 23px !important;

        margin: auto !important;

        color: #ffffff !important;

        visibility: visible !important;
        opacity: 1 !important;

        transform: none !important;
    }

    /* Ne pas laisser le panneau de connexion ouvert */
    #header #sb_client_info .full-info {
        display: none !important;

        position: absolute !important;
        top: calc(100% + 10px) !important;
        right: 0 !important;

        z-index: 99999 !important;
    }

    #header #sb_client_info:hover .full-info,
    #header #sb_client_info.open .full-info,
    #header #sb_client_info.active .full-info {
        display: block !important;
    }


    /* ======================================================
       D — BOUTON PAYER
       IMPORTANT : le vrai bouton SimplyBook est #book-btn
    ====================================================== */

    #header #book-btn {
        order: 3 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;

        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 132px !important;
        height: 52px !important;

        margin: 0 0 0 2px !important;
        padding: 0 !important;

        transform: none !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;
        z-index: 70 !important;
    }

    #header #book-btn > *,
    #header #book-btn a,
    #header #book-btn .btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;

        min-width: 132px !important;
        height: 52px !important;

        margin: 0 !important;
        padding: 0 22px !important;

        transform: none !important;

        border: 2px solid #f0c35a !important;
        border-radius: 28px !important;

        background:
            linear-gradient(
                180deg,
                #0d4ca7 0%,
                #073a89 100%
            ) !important;

        color: #f0c35a !important;

        box-shadow:
            0 0 12px rgba(240, 195, 90, .55) !important;

        box-sizing: border-box !important;
    }

    /* Aucun pseudo-élément parasite autour de Payer */
    #header #book-btn::before,
    #header #book-btn::after {
        content: none !important;
        display: none !important;
    }

    /* Pas de hamburger sur ordinateur */
    #header .nav-trigger {
        display: none !important;
    }
}


/* ==========================================================
   E — PAGE COMMENTAIRES :
   ÉTOILES + GOOGLE/FACEBOOK + OU + CONNEXION PAR EMAIL
========================================================== */

#reviews-view #sb_reviews_add_container .add-review,
#reviews-view #sb_reviews_add_container .form {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    width: 100% !important;

    margin-left: auto !important;
    margin-right: auto !important;
}

#reviews-view #sb_reviews_add_container .form-group {
    width: 580px !important;
    max-width: 75% !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


/* ÉTOILES */
#reviews-view #sb_reviews_add_container .stars-container {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;

    position: relative !important;
    inset: auto !important;

    width: 100% !important;
    height: auto !important;

    margin: 42px auto 28px !important;
    padding: 0 !important;

    transform: none !important;
}

#reviews-view #sb_reviews_add_container .stars-container > * {
    position: relative !important;
    inset: auto !important;

    margin: 0 !important;
    transform: none !important;
}


/* ZONE DE CONNEXION */
#reviews-view #sb_reviews_add_container .social-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    margin: 0 auto !important;
    text-align: center !important;
}

#reviews-view #sb_reviews_add_container .social-container .cap {
    display: block !important;

    width: 100% !important;

    margin: 0 auto 20px !important;

    text-align: center !important;
}


/* Le conteneur complet est VERTICAL :
   1. Google/Facebook
   2. OU
   3. Connexion par email
*/
#reviews-view #sb_reviews_add_container .buttons.brand.v3 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;

    width: 100% !important;

    margin: 0 auto !important;
    padding: 0 !important;
}


/* GOOGLE + FACEBOOK */
#reviews-view #sb_reviews_add_container .btn-bar__social-links {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 18px !important;

    width: 100% !important;

    margin: 0 auto 22px !important;
    padding: 0 !important;
}

#reviews-view #sb_reviews_add_container .btn-bar__social-links a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: relative !important;
    inset: auto !important;

    width: 54px !important;
    min-width: 54px !important;
    height: 54px !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;

    border: 1.5px solid #f0c35a !important;
    border-radius: 50% !important;

    background: #071b46 !important;
}

#reviews-view #sb_reviews_add_container .btn-bar__social-links .btn--txt {
    display: none !important;
}

#reviews-view #sb_reviews_add_container .btn-bar__social-links svg {
    width: 25px !important;
    height: 25px !important;

    margin: 0 !important;
    transform: none !important;
}


/* OU — SA PROPRE LIGNE */
#reviews-view #sb_reviews_add_container .buttons.brand.v3 > .txt {
    order: 2 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: relative !important;
    inset: auto !important;

    width: 320px !important;
    max-width: 80% !important;

    margin: 0 auto 20px !important;
    padding: 0 !important;

    transform: none !important;

    text-align: center !important;
    clear: both !important;
}

#reviews-view #sb_reviews_add_container .buttons.brand.v3 > .txt::before,
#reviews-view #sb_reviews_add_container .buttons.brand.v3 > .txt::after {
    content: "" !important;

    display: block !important;
    flex: 1 1 auto !important;

    height: 1px !important;

    background: rgba(240, 195, 90, .45) !important;
}

#reviews-view #sb_reviews_add_container .buttons.brand.v3 > .txt::before {
    margin-right: 14px !important;
}

#reviews-view #sb_reviews_add_container .buttons.brand.v3 > .txt::after {
    margin-left: 14px !important;
}


/* CONNEXION PAR EMAIL — LIGNE DU DESSOUS */
#reviews-view #sb_reviews_add_container .client-login {
    order: 3 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: relative !important;
    inset: auto !important;

    float: none !important;
    clear: both !important;

    width: auto !important;
    min-width: 220px !important;
    height: 42px !important;

    margin: 0 auto !important;
    padding: 8px 22px !important;

    transform: none !important;

    border: 1.5px solid #f0c35a !important;
    border-radius: 25px !important;

    background: #0753af !important;

    color: #f0c35a !important;

    font-weight: 700 !important;
    text-align: center !important;

    box-sizing: border-box !important;
}


/* ==========================================================
   F — COMMENTAIRES : 2 PAR LIGNE SUR ORDINATEUR
========================================================== */

#reviews-view #sb_reviews_list_items_container {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 24px !important;
    row-gap: 24px !important;

    width: 100% !important;
}

#reviews-view #sb_reviews_list_items_container .review-item {
    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
}

#reviews-view #sb_reviews_list_items_container .review-item .review-tab {
    width: 100% !important;

    padding: 0 !important;

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;
    overflow: visible !important;
}

#reviews-view #sb_reviews_list_items_container .review-item .review-tab .cap {
    display: block !important;

    width: 100% !important;

    margin: 0 0 12px 0 !important;
    padding: 0 !important;

    background: transparent !important;
    background-color: transparent !important;

    border: 0 !important;
    box-shadow: none !important;

    color: #f0c568 !important;
}

#reviews-view #sb_reviews_list_items_container .review-item .review-tab .stars {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 3px !important;

    width: auto !important;

    margin: 4px 0 10px 0 !important;
    padding: 0 !important;

    background: transparent !important;
}

#reviews-view #sb_reviews_list_items_container .review-item .review-tab .star {
    margin: 0 !important;
    padding: 0 !important;

    color: #f0c568 !important;
    fill: #f0c568 !important;
}

#reviews-view #sb_reviews_list_items_container .review-item .comment {
    padding: 18px !important;

    color: #ffffff !important;

    background: rgba(2, 15, 48, .88) !important;

    border: 1px solid rgba(240, 197, 104, .28) !important;
    border-radius: 12px !important;
}


/* ==========================================================
   G — MOBILE
========================================================== */

@media (max-width: 991px) {

    #reviews-view #sb_reviews_list_items_container {
        grid-template-columns: 1fr !important;
    }

    #reviews-view #sb_reviews_add_container .form-group {
        width: 100% !important;
        max-width: 92% !important;
    }

    #reviews-view #sb_reviews_add_container .buttons.brand.v3 > .txt {
        width: 280px !important;
        max-width: 88% !important;
    }
}


/* ==========================================================
   FIX HEADER DÉFINITIF — PANIER / CONNEXION / PAYER
   À LAISSER TOUT EN BAS DU CSS
========================================================== */

@media (min-width: 992px) {

    #header {
        overflow: visible !important;
    }

    /* Structure de la zone droite */
    #header .header-controls {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;

        width: 100% !important;
        min-height: 92px !important;

        margin: 0 !important;
        padding: 0 18px 0 0 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #header .header-controls > .nav-wrapper {
        grid-column: 1 !important;

        width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 12px !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        box-sizing: border-box !important;
    }

    #header #sb_menu_list_items_container {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        gap: clamp(28px, 4vw, 68px) !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #header .header-controls > .items-wrapper {
        grid-column: 2 !important;

        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;

        gap: 11px !important;

        width: auto !important;
        min-width: max-content !important;
        height: 54px !important;

        margin: 0 !important;
        padding: 0 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        overflow: visible !important;
        z-index: 9999 !important;
    }


    /* ======================================================
       PANIER
    ====================================================== */

    #header #sb_cart {
        order: 1 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        flex: 0 0 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        background: rgba(4, 22, 65, .92) !important;

        border: 1.5px solid #f0c35a !important;
        border-radius: 50% !important;

        box-shadow: none !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #header #sb_cart .cart-container,
    #header #sb_cart .item-container,
    #header #sb_cart .sb-cart-btn {
        position: relative !important;
        inset: auto !important;
        transform: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;
        border: 0 !important;
        border-radius: 50% !important;
        box-shadow: none !important;

        overflow: visible !important;
    }

    /* On utilise le vrai FontAwesome de SimplyBook */
    #header #sb_cart i.fa-shopping-cart,
    #header #sb_cart i[aria-label*="shopping cart"] {
        display: inline-block !important;

        visibility: visible !important;
        opacity: 1 !important;

        width: auto !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #f0c35a !important;

        font-size: 22px !important;
        line-height: 1 !important;

        transform: none !important;
    }

    /* On neutralise le faux caddie CSS précédent */
    #header #sb_cart .cart-container::before,
    #header #sb_cart .cart-container::after,
    #header #sb_cart .item-container::before,
    #header #sb_cart .item-container::after,
    #header #sb_cart .sb-cart-btn::before,
    #header #sb_cart .sb-cart-btn::after {
        content: none !important;
        display: none !important;
    }

    /* compteur */
    #header #sb_cart .counter,
    #header #sb_cart .sb-qty,
    #header #sb_cart .counter.sb-qty {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: absolute !important;
        top: -7px !important;
        right: -5px !important;

        min-width: 19px !important;
        width: auto !important;
        height: 19px !important;

        margin: 0 !important;
        padding: 0 5px !important;

        background: #f0c35a !important;
        color: #06183d !important;

        border: 0 !important;
        border-radius: 20px !important;

        font-family: Arial, sans-serif !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        line-height: 19px !important;

        visibility: visible !important;
        opacity: 1 !important;

        z-index: 100 !important;
        box-sizing: border-box !important;
    }


    /* ======================================================
       CONNEXION / DÉCONNEXION
    ====================================================== */

    #header #sb_client_info {
        order: 2 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        flex: 0 0 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;
    }

    #header #sb_client_info .login-container,
    #header #sb_client_info .avatar.item-container,
    #header #sb_client_info > .item-container {
        position: relative !important;
        inset: auto !important;
        transform: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        background: rgba(4, 22, 65, .92) !important;

        border: 1.5px solid #f0c35a !important;
        border-radius: 50% !important;

        box-shadow: none !important;

        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #header #sb_client_info svg {
        display: block !important;

        width: 23px !important;
        height: 23px !important;

        margin: auto !important;

        color: #ffffff !important;

        visibility: visible !important;
        opacity: 1 !important;

        transform: none !important;
    }


    /* ======================================================
       PAYER
       Le problème du grand bouton vide venait de #book-btn :
       son conteneur ET son lien étaient tous les deux stylés.
       Ici le conteneur devient totalement transparent.
    ====================================================== */

    #header #book-btn {
        order: 3 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 132px !important;
        min-width: 132px !important;
        max-width: 132px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        flex: 0 0 132px !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;
        background-image: none !important;

        border: 0 !important;
        border-radius: 0 !important;

        box-shadow: none !important;

        overflow: visible !important;

        visibility: visible !important;
        opacity: 1 !important;
    }

    #header #book-btn .book-btn-container,
    #header #book-btn .item-container {
        position: static !important;
        inset: auto !important;
        transform: none !important;

        display: contents !important;

        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;
        background-image: none !important;

        border: 0 !important;
        border-radius: 0 !important;

        box-shadow: none !important;
    }

    /* LE SEUL VRAI BOUTON BLEU */
    #header #book-btn a.popup-hide,
    #header #book-btn a[href*="#book"],
    #header #book-btn a {
        position: relative !important;
        inset: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;

        transform: none !important;
        float: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 132px !important;
        min-width: 132px !important;
        max-width: 132px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        margin: 0 !important;
        padding: 0 22px !important;

        background:
            linear-gradient(
                180deg,
                #0d4ca7 0%,
                #073a89 100%
            ) !important;

        border: 2px solid #f0c35a !important;
        border-radius: 28px !important;

        box-shadow:
            0 0 12px rgba(240, 195, 90, .55) !important;

        color: #f0c35a !important;

        box-sizing: border-box !important;

        z-index: 10 !important;
    }

    #header #book-btn::before,
    #header #book-btn::after,
    #header #book-btn .book-btn-container::before,
    #header #book-btn .book-btn-container::after,
    #header #book-btn .item-container::before,
    #header #book-btn .item-container::after {
        content: none !important;
        display: none !important;
    }


    /* ======================================================
       SÉCURITÉ : annule les anciens positionnements absolus
       des boutons "pay/payment" qui créaient le doublon.
    ====================================================== */

    #header #book-btn [class*="pay"],
    #header #book-btn [class*="payment"],
    #header #book-btn a[href*="pay"],
    #header #book-btn a[href*="payment"] {
        position: relative !important;

        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;

        transform: none !important;

        margin: 0 !important;
    }


    /* aucun hamburger sur ordinateur */
    #header .nav-trigger {
        display: none !important;
    }
}


/* ==========================================================
   LARGEURS INTERMÉDIAIRES :
   évite que RÉSERVER / BOUTIQUE / COMMENTAIRES se chevauchent
   quand DevTools réduit la largeur visible.
========================================================== */

@media (min-width: 992px) and (max-width: 1250px) {

    #header #sb_menu_list_items_container {
        gap: 22px !important;
    }

    #header #sb_menu_list_items_container a {
        font-size: 13px !important;
        letter-spacing: .35px !important;
    }

    #header::before {
        width: 190px !important;
        left: 18px !important;
    }

    #header .column,
    #header .container,
    #header .container-fluid {
        padding-left: 220px !important;
    }
}
/* =========================================================
   CORRECTION FINALE HEADER
   - supprime le bouton bleu vide
   - garde panier + connexion
   - empêche la fenêtre connexion de s'ouvrir au survol
========================================================= */

@media (min-width: 992px) {

    /* -----------------------------------------
       1. LE FAUX / BOUTON VIDE : ON LE CACHE
    ----------------------------------------- */

    #header #book-btn {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;

        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;

        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;

        flex: 0 0 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;
        box-shadow: none !important;

        overflow: hidden !important;
    }


    /* -----------------------------------------
       2. PANIER + CONNEXION ALIGNÉS
    ----------------------------------------- */

    #header .items-wrapper {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;

        gap: 12px !important;

        width: auto !important;
        min-width: auto !important;
        max-width: none !important;

        height: 54px !important;

        margin: 0 !important;
        padding: 0 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        overflow: visible !important;
    }


    /* PANIER */

    #header #sb_cart {
        order: 1 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        flex: 0 0 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        visibility: visible !important;
        opacity: 1 !important;
    }


    /* CONNEXION / DÉCONNEXION */

    #header #sb_client_info {
        order: 2 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        flex: 0 0 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;
    }


    /* -----------------------------------------
       3. NE PLUS OUVRIR LA CONNEXION AU SURVOL
    ----------------------------------------- */

    #header #sb_client_info .full-info,
    #header #sb_client_info:hover .full-info {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    /*
       Si SimplyBook ajoute .open ou .active après un CLIC,
       le panneau peut alors apparaître.
    */

    #header #sb_client_info.open .full-info,
    #header #sb_client_info.active .full-info {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;

        position: absolute !important;
        top: calc(100% + 12px) !important;
        right: 0 !important;

        z-index: 999999 !important;
    }


    /* -----------------------------------------
       4. LES DEUX ICÔNES RESTENT BIEN RONDES
    ----------------------------------------- */

    #header #sb_cart .cart-container,
    #header #sb_cart .item-container,
    #header #sb_cart .sb-cart-btn,
    #header #sb_client_info .login-container,
    #header #sb_client_info .avatar.item-container,
    #header #sb_client_info > .item-container {

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;

        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        background: rgba(4, 22, 65, .96) !important;

        border: 1.5px solid #f0c35a !important;
        border-radius: 50% !important;

        box-shadow: none !important;

        box-sizing: border-box !important;
    }


    /* -----------------------------------------
       5. ICÔNE PANIER
    ----------------------------------------- */

    #header #sb_cart .fa-shopping-cart {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;

        color: #f0c35a !important;

        font-size: 22px !important;
        line-height: 1 !important;

        width: auto !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;
    }


    /* -----------------------------------------
       6. ICÔNE CONNEXION
    ----------------------------------------- */

    #header #sb_client_info svg {
        display: block !important;

        visibility: visible !important;
        opacity: 1 !important;

        width: 23px !important;
        height: 23px !important;

        margin: auto !important;

        color: #ffffff !important;

        transform: none !important;
    }
}
/* =========================================================
   ALIGNEMENT FINAL DU HEADER
   Menu + panier + connexion + payer sur le même axe
========================================================= */

@media (min-width: 992px) {

    /* Toute la zone du header utilise exactement le même axe */
    #header .header-controls {
        min-height: 92px !important;
        height: 92px !important;
        align-items: center !important;
    }

    /* MENU : Réserver / Boutique / Commentaires */
    #header .header-controls > .nav-wrapper {
        height: 92px !important;

        display: flex !important;
        align-items: center !important;
    }

    #header #sb_menu_list_items_container {
        height: 92px !important;

        display: flex !important;
        align-items: center !important;
    }

    #header #sb_menu_list_items_container .nav-item,
    #header #sb_menu_list_items_container li,
    #header #sb_menu_list_items_container a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        height: 52px !important;

        margin-top: 0 !important;
        margin-bottom: 0 !important;

        padding-top: 0 !important;
        padding-bottom: 0 !important;

        line-height: 1 !important;
    }


    /* PANIER + CONNEXION + PAYER */
    #header .header-controls > .items-wrapper {
        height: 92px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;

        margin-top: 0 !important;
        margin-bottom: 0 !important;

        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    #header #sb_cart,
    #header #sb_client_info {
        align-self: center !important;

        margin-top: 0 !important;
        margin-bottom: 0 !important;

        transform: none !important;
    }
}
/* =========================================================
   CORRECTIONS MOBILE — LE VOYAGEUR MYSTIQUE
   UNIQUEMENT TELEPHONE
   ========================================================= */

@media screen and (max-width: 767px) {

    /* =====================================================
       1. EN-TETE MOBILE
       ===================================================== */

    #header {
        position: relative !important;
        z-index: 1000 !important;
    }

    #header .header-controls {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-height: 82px !important;
        padding: 10px 14px !important;
        box-sizing: border-box !important;
    }

    /* Hamburger à gauche */
    #header .nav-trigger {
        position: absolute !important;
        left: 18px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
        z-index: 1004 !important;
    }

    /* Bloc panier + connexion centré */
    #header .items-wrapper {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
        margin: 0 auto !important;
        width: auto !important;
        position: relative !important;
        z-index: 1003 !important;
    }

    #header #sb_cart,
    #header #sb_client_info {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        left: auto !important;
        bottom: auto !important;
        margin: 0 !important;
        transform: none !important;
        flex: 0 0 auto !important;
    }

    #header #sb_cart .cart-container,
    #header #sb_client_info .avatar {
        width: 54px !important;
        height: 54px !important;
        min-width: 54px !important;
        min-height: 54px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    /* Le bouton Payer reste à droite */
    #header .popup-hide {
        position: absolute !important;
        right: 16px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
        z-index: 1004 !important;
    }


    /* =====================================================
       2. MENU HAMBURGER OUVERT
       Passe DEVANT panier / connexion / payer
       ===================================================== */

    #header .nav-wrapper {
        z-index: 9999 !important;
    }

    #header .nav-wrapper,
    #header .nav-wrapper.open,
    #header .nav-wrapper.active {
        position: absolute !important;
    }

    #header #sb_menu {
        position: relative !important;
        z-index: 9999 !important;
    }

    #header #sb_menu .nav {
        position: relative !important;
        z-index: 9999 !important;
    }

    /* Quand menu ouvert, il doit masquer ce qui est derrière */
    #header .nav-wrapper .nav {
        background: rgba(1, 7, 20, 0.97) !important;
    }


    /* =====================================================
       3. RESERVATION
       ENLEVER LES BANDEAUX CATÉGORIE / SERVICE / HEURE / CLIENT
       ===================================================== */

    #sb_booking_content .booking-info {
        display: none !important;
    }

    #sb_booking_content .steps-nav,
    #sb_booking_content #steps-nav,
    #sb_booking_content .steps {
        max-width: 100% !important;
    }


    /* =====================================================
       4. CONTENEUR GENERAL RESERVATION
       ===================================================== */

    #sb_booking_content {
        width: 100% !important;
        max-width: 100% !important;
        padding: 18px 12px 30px !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    #sb_booking_content > div,
    #sb_booking_content .container,
    #sb_booking_content .container-fluid,
    #sb_booking_content .row {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #sb_booking_content .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    /* =====================================================
       5. BOUTON RETOUR
       Supprime l'effet double bouton / double cadre
       ===================================================== */

    #sb_back_button {
        width: 100% !important;
        max-width: 100% !important;
        margin: 22px auto 28px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        text-align: center !important;
    }

    #sb_back_button a,
    #sb_back_button .btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        min-width: 180px !important;
        max-width: 240px !important;
        min-height: 52px !important;
        margin: 0 auto !important;
        padding: 10px 28px !important;
        box-sizing: border-box !important;
    }

    #sb_back_button::before,
    #sb_back_button::after {
        display: none !important;
        content: none !important;
    }


    /* =====================================================
       6. CARTES CATEGORIES
       ENLEVER DOUBLE CADRE
       ===================================================== */

    #sb_category_step_container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
    }

    #sb_category_step_container .category-item {
        width: 100% !important;
        max-width: 580px !important;
        margin: 0 auto 26px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    #sb_category_step_container .tab-with-popup {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        border: 0 !important;
    }

    #sb_category_step_container .tab-pd {
        width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }


    /* =====================================================
       7. CATEGORIES : UN SEUL BOUTON SELECTIONNER
       ===================================================== */

    #sb_category_step_container .btn-bar {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        padding: 10px !important;
        margin: 0 !important;
    }

    #sb_category_step_container .btn.select.custom {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    #sb_category_step_container .btn.select.custom::before,
    #sb_category_step_container .btn.select.custom::after,
    #sb_category_step_container .btn-bar::before,
    #sb_category_step_container .btn-bar::after {
        display: none !important;
        content: none !important;
    }


    /* =====================================================
       8. CARTES SERVICES
       ENLEVER DOUBLE CADRE
       ===================================================== */

    #sb_service_step_container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
    }

    #sb_service_step_container .service-item {
        width: 100% !important;
        max-width: 580px !important;
        margin: 0 auto 26px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    #sb_service_step_container .tab-with-popup {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    #sb_service_step_container .tab-pd {
        width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    #sb_service_step_container .btn-bar {
        width: 100% !important;
        margin: 0 !important;
        padding: 10px !important;
        box-sizing: border-box !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    #sb_service_step_container .btn.select.custom {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    #sb_service_step_container .btn-bar::before,
    #sb_service_step_container .btn-bar::after,
    #sb_service_step_container .btn.select.custom::before,
    #sb_service_step_container .btn.select.custom::after {
        display: none !important;
        content: none !important;
    }


    /* Images catégories / services */
    #sb_booking_content img.user-img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        object-fit: cover !important;
    }


    /* =====================================================
       9. CALENDRIER MOBILE
       ===================================================== */

    #sb_datetime_step_container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
    }

    #sb_datetime_step_container .section {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    #sb_datetime_step_container .section-pd {
        width: 100% !important;
        max-width: 100% !important;
        padding: 12px !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    #sb_datetime_step_container .calendar {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }


    /* =====================================================
       10. ALIGNEMENT DES JOURS DU CALENDRIER
       ===================================================== */

    #sb_datetime_step_container .calendar .weeks {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
        box-sizing: border-box !important;
    }

    #sb_datetime_step_container .calendar .weeks > div,
    #sb_datetime_step_container .calendar .week-day {
        width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }


    /* =====================================================
       11. ALIGNEMENT DES CHIFFRES DU CALENDRIER
       ===================================================== */

    #sb_datetime_step_container .calendar .inner {
        width: 100% !important;
        max-width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    #sb_datetime_step_container .calendar .inner > div {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    #sb_datetime_step_container .calendar .inner a,
    #sb_datetime_step_container .calendar .inner span {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }


    /* =====================================================
       12. HORAIRES
       ===================================================== */

    #sb_time_slots_container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 12px auto 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    #sb_time_slots_container .slots {
        width: 100% !important;
        max-width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        box-sizing: border-box !important;
    }

    #sb_time_slots_container .slot {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    #sb_time_slots_container .sb-cell.free {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 12px 6px !important;
        box-sizing: border-box !important;
    }


    /* =====================================================
       13. ECRAN CONNEXION APRES CHOIX HORAIRE
       LARGEUR COMME VERSION WEB
       ===================================================== */

    #sb_booking_content .client-login-bar {
        width: 100% !important;
        max-width: 680px !important;
        margin: 28px auto !important;
        padding: 28px 22px !important;
        box-sizing: border-box !important;
    }

    #sb_booking_content .client-login-bar .row {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
    }

    #sb_booking_content .client-login-bar .col-sm-6,
    #sb_booking_content .client-login-bar [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }


    /* Titre connexion */
    #sb_booking_content .client-login-bar .title-section {
        width: 100% !important;
        max-width: 100% !important;
        text-align: center !important;
        margin: 0 auto 22px !important;
    }


    /* Réseaux sociaux */
    #sb_booking_content .btn-bar__social-links {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 18px !important;
        margin: 18px auto !important;
        box-sizing: border-box !important;
    }


    /* Champs connexion / inscription */
    #sb_booking_content .client-login-bar input,
    #sb_booking_content .client-login-bar select,
    #sb_booking_content .client-login-bar textarea {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #sb_booking_content .client-login-bar label {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }


    /* =====================================================
       14. PAGE COMMENTAIRES MOBILE
       On remet l'aspect desktop au lieu du gros style téléphone
       ===================================================== */

    .page--reviews #reviews-view,
    #reviews-view {
        width: 100% !important;
        max-width: 100% !important;
        padding: 20px 12px !important;
        box-sizing: border-box !important;
    }

    #reviews-view .page-pd {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    #reviews-view .add-review {
        width: 100% !important;
        max-width: 760px !important;
        margin: 0 auto 30px !important;
        padding: 25px 18px !important;
        box-sizing: border-box !important;
    }

    /* Le titre ne doit plus être énorme / rouge */
    #reviews-view .title-main,
    #reviews-view h1,
    #reviews-view h2 {
        color: #f2d88d !important;
        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-style: normal !important;
        text-transform: uppercase !important;
        text-align: center !important;
        line-height: 1.1 !important;
    }

    #reviews-view .add-review input,
    #reviews-view .add-review textarea {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #reviews-view .social-container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 20px auto !important;
        text-align: center !important;
    }

    #reviews-view .social-container .buttons {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
    }

    #reviews-view .social-container .btn-bar__social-links {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        gap: 18px !important;
    }

    #reviews-view .client-login {
        width: auto !important;
        max-width: 100% !important;
        margin: 18px auto 0 !important;
    }


    /* =====================================================
       15. EVITER LES DEBORDEMENTS GENERAUX
       ===================================================== */

    #sb_booking_content *,
    #reviews-view * {
        box-sizing: border-box !important;
    }

    #sb_booking_content img,
    #reviews-view img {
        max-width: 100% !important;
    }

}


/* =========================================================
   PETITS TELEPHONES
   ========================================================= */

@media screen and (max-width: 430px) {

    #sb_booking_content {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    #sb_datetime_step_container .section-pd {
        padding: 8px !important;
    }

    #sb_datetime_step_container .calendar {
        font-size: 15px !important;
    }

    #sb_time_slots_container .slots {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    #sb_booking_content .client-login-bar {
        padding: 24px 16px !important;
    }

    #reviews-view .add-review {
        padding: 22px 14px !important;
    }
}
/* =========================================================
   CORRECTION MENU HAMBURGER MOBILE
   ========================================================= */

@media screen and (max-width: 767px) {

    /* Le menu ouvert passe au-dessus de TOUT */
    #header .nav-wrapper {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: auto !important;
        z-index: 99999 !important;

        background: rgba(1, 7, 20, 0.98) !important;

        padding: 22px 20px 26px !important;
        margin: 0 !important;

        box-sizing: border-box !important;
    }


    /* Le contenu du menu */
    #header .nav-wrapper .nav,
    #header .nav-wrapper ul {
        position: relative !important;

        display: flex !important;
        flex-direction: column !important;

        align-items: center !important;
        justify-content: flex-start !important;

        width: 100% !important;
        height: auto !important;

        gap: 14px !important;

        margin: 0 !important;
        padding: 0 !important;

        list-style: none !important;

        z-index: 100000 !important;
    }


    /* Chaque ligne du menu */
    #header .nav-wrapper li,
    #header .nav-wrapper .nav-item {
        position: relative !important;

        display: block !important;

        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;

        float: none !important;

        transform: none !important;

        width: 100% !important;
        max-width: 340px !important;

        height: auto !important;

        margin: 0 auto !important;
        padding: 0 !important;

        z-index: 100001 !important;
    }


    /* Les vrais liens : Réserver / Boutique / Commentaires */
    #header .nav-wrapper li > a,
    #header .nav-wrapper .nav-item > a {
        position: relative !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-height: 52px !important;
        height: auto !important;

        margin: 0 !important;
        padding: 12px 18px !important;

        top: auto !important;
        left: auto !important;
        right: auto !important;

        transform: none !important;

        text-align: center !important;
        line-height: 1.2 !important;

        z-index: 100002 !important;

        pointer-events: auto !important;
        cursor: pointer !important;

        box-sizing: border-box !important;
    }


    /* Empêche les anciens pseudo-éléments de recouvrir les liens */
    #header .nav-wrapper li::before,
    #header .nav-wrapper li::after,
    #header .nav-wrapper .nav-item::before,
    #header .nav-wrapper .nav-item::after {
        pointer-events: none !important;
    }


    /* IMPORTANT :
       panier / connexion / payer restent derrière le menu ouvert */
    #header .items-wrapper,
    #header #sb_cart,
    #header #sb_client_info,
    #header .popup-hide {
        z-index: 1000 !important;
    }


    /* Hamburger reste cliquable */
    #header .nav-trigger {
        z-index: 100003 !important;
        pointer-events: auto !important;
    }

}
/* =========================================================
   MOBILE — HEADER UNIQUEMENT
   Panier + connexion à gauche / hamburger centré / Payer à droite
   ========================================================= */

@media screen and (max-width: 767px) {

    /* Header */
    #header {
        position: relative !important;
        min-height: 82px !important;
        overflow: visible !important;
        z-index: 5000 !important;
    }

    #header .header-controls {
        position: relative !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-height: 82px !important;

        margin: 0 !important;
        padding: 0 10px !important;

        box-sizing: border-box !important;

        overflow: visible !important;
    }


    /* =====================================================
       PANIER + CONNEXION À GAUCHE
       ===================================================== */

    #header .items-wrapper {
        position: absolute !important;

        left: 10px !important;
        top: 50% !important;

        transform: translateY(-50%) !important;

        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;

        gap: 6px !important;

        width: auto !important;
        height: 44px !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;

        z-index: 5002 !important;
    }

    #header #sb_cart,
    #header #sb_client_info {
        position: relative !important;

        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;

        transform: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;

        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;

        flex: 0 0 42px !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
    }


    /* =====================================================
       HAMBURGER EXACTEMENT AU MILIEU
       ===================================================== */

    #header .nav-trigger {
        position: absolute !important;

        left: 50% !important;
        top: 50% !important;

        transform: translate(-50%, -50%) !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 46px !important;
        height: 46px !important;

        margin: 0 !important;
        padding: 0 !important;

        z-index: 5004 !important;

        pointer-events: auto !important;
    }


    /* =====================================================
       PAYER À DROITE
       ===================================================== */

    #header #book-btn {
        position: absolute !important;

        right: 10px !important;
        top: 50% !important;

        transform: translateY(-50%) !important;

        width: auto !important;
        min-width: 82px !important;
        max-width: 96px !important;

        height: 42px !important;
        min-height: 42px !important;

        margin: 0 !important;
        padding: 0 !important;

        z-index: 5002 !important;
    }

    #header #book-btn a,
    #header #book-btn .btn {
        min-width: 82px !important;
        max-width: 96px !important;
        height: 42px !important;

        padding: 0 14px !important;

        font-size: 13px !important;
    }


    /* =====================================================
       MENU OUVERT
       ===================================================== */

    #header .nav-wrapper {
        position: absolute !important;

        left: 0 !important;
        right: 0 !important;
        top: 100% !important;

        width: 100% !important;
        height: auto !important;

        margin: 0 !important;
        padding: 12px 14px 16px !important;

        background:
            linear-gradient(
                180deg,
                rgba(2, 8, 24, .99),
                rgba(4, 22, 58, .99)
            ) !important;

        border-top: 1px solid rgba(215,173,86,.35) !important;
        border-bottom: 1px solid #d7ad56 !important;

        box-sizing: border-box !important;

        z-index: 10000 !important;

        overflow: visible !important;
    }


    /* la liste doit être VERTICALE */
    #header .nav-wrapper #sb_menu_list_items_container,
    #header .nav-wrapper ul {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;

        width: 100% !important;
        height: auto !important;

        gap: 8px !important;

        margin: 0 !important;
        padding: 0 !important;

        list-style: none !important;
    }


    /* chaque entrée séparée */
    #header .nav-wrapper li,
    #header .nav-wrapper .nav-item {
        position: relative !important;

        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;

        transform: none !important;

        float: none !important;

        display: block !important;

        width: 100% !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* les vrais liens */
    #header .nav-wrapper li > a,
    #header .nav-wrapper .nav-item > a {
        position: relative !important;

        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;

        transform: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-height: 46px !important;

        margin: 0 !important;
        padding: 9px 14px !important;

        box-sizing: border-box !important;

        text-align: center !important;
        line-height: 1.2 !important;

        pointer-events: auto !important;
    }


    /* Le menu ouvert passe devant panier / connexion / payer */
    #header .nav-wrapper,
    #header .nav-wrapper * {
        z-index: 10000 !important;
    }

}


/* Très petit écran */
@media screen and (max-width: 430px) {

    #header .items-wrapper {
        left: 6px !important;
        gap: 4px !important;
    }

    #header #sb_cart,
    #header #sb_client_info {
        width: 39px !important;
        min-width: 39px !important;
        max-width: 39px !important;

        height: 39px !important;
        min-height: 39px !important;
        max-height: 39px !important;

        flex-basis: 39px !important;
    }

    #header #book-btn {
        right: 6px !important;
        min-width: 76px !important;
        max-width: 86px !important;
    }

    #header #book-btn a,
    #header #book-btn .btn {
        min-width: 76px !important;
        max-width: 86px !important;

        padding: 0 10px !important;

        font-size: 12px !important;
    }
}
/* =========================================================
   FIX HEADER MOBILE — POSITION + PANIER + MENU
   ========================================================= */

@media screen and (max-width: 767px) {

    /* =====================================================
       1. HAMBURGER VRAIMENT AU CENTRE
       ===================================================== */

    #header .nav-trigger {
        position: absolute !important;

        left: 50% !important;
        top: 41px !important;

        transform: translate(-50%, -50%) !important;

        width: 44px !important;
        height: 44px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        z-index: 10005 !important;
    }


    /* =====================================================
       2. PANIER : PLUS DE RECTANGLE QUI COUPE LE ROND
       ===================================================== */

    #header #sb_cart {
        overflow: visible !important;
        border-radius: 50% !important;
    }

    #header #sb_cart .cart-container,
    #header #sb_cart .item-container,
    #header #sb_cart .sb-cart-btn {
        width: 42px !important;
        height: 42px !important;

        min-width: 42px !important;
        min-height: 42px !important;

        max-width: 42px !important;
        max-height: 42px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        border-radius: 50% !important;

        overflow: hidden !important;

        box-sizing: border-box !important;
    }

    #header #sb_cart i,
    #header #sb_cart svg {
        max-width: 22px !important;
        max-height: 22px !important;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: contain !important;
    }


    /* =====================================================
       3. MENU OUVERT : PREND TOUTE LA LARGEUR
       ===================================================== */

    #header .nav-wrapper {
        position: absolute !important;

        top: 82px !important;
        left: 0 !important;
        right: 0 !important;

        width: 100vw !important;
        max-width: 100vw !important;
        min-width: 100vw !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 14px 16px 18px !important;

        transform: none !important;

        background:
            linear-gradient(
                180deg,
                rgba(2, 8, 24, .99),
                rgba(4, 22, 58, .99)
            ) !important;

        border-top: 1px solid rgba(215,173,86,.35) !important;
        border-bottom: 1px solid #d7ad56 !important;

        box-sizing: border-box !important;

        overflow: visible !important;

        z-index: 10000 !important;
    }


    /* Le conteneur interne du menu doit aussi prendre toute la largeur */
    #header .nav-wrapper #sb_menu,
    #header .nav-wrapper #sb_menu_list_items_container,
    #header .nav-wrapper ul {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        height: auto !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 8px !important;

        overflow: visible !important;
    }


    /* Une vraie ligne par lien */
    #header .nav-wrapper li,
    #header .nav-wrapper .nav-item {
        width: 100% !important;
        max-width: 100% !important;

        height: auto !important;
        min-height: 46px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: block !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        overflow: visible !important;
    }


    #header .nav-wrapper li > a,
    #header .nav-wrapper .nav-item > a {
        width: 100% !important;
        max-width: 100% !important;

        min-height: 46px !important;
        height: auto !important;

        margin: 0 !important;
        padding: 10px 14px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;
        transform: none !important;

        text-align: center !important;
        line-height: 1.2 !important;

        box-sizing: border-box !important;

        overflow: visible !important;
        white-space: normal !important;
    }
}
/* =========================================================
   RESPONSIVE HEADER
   1. MOBILE : corrige uniquement le hamburger
   2. TABLETTE / PETITE FENÊTRE : garde tout le header visible
========================================================= */


/* =========================================================
   MOBILE — HAMBURGER
========================================================= */

@media screen and (max-width: 767px) {

    /* On ne touche plus au panier ni à la connexion */

    #header .nav-trigger {
        position: absolute !important;

        left: 50% !important;
        top: 18px !important;

        transform: translateX(-50%) !important;

        width: 46px !important;
        height: 46px !important;

        margin: 0 !important;
        padding: 0 !important;

        z-index: 10005 !important;
    }
}


/* =========================================================
   TABLETTE / IPAD / PETITE FENÊTRE D'ORDINATEUR
========================================================= */

@media screen and (min-width: 768px) and (max-width: 1200px) {

    #header {
        position: relative !important;
        overflow: visible !important;
        min-height: 92px !important;
    }


    /* CONTENEUR GLOBAL */

    #header .header-controls {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;

        width: 100% !important;
        min-height: 92px !important;

        margin: 0 !important;
        padding: 0 18px !important;

        box-sizing: border-box !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;
    }


    /* =====================================================
       MENU : RÉSERVER / BOUTIQUE / COMMENTAIRES
    ===================================================== */

    #header .nav-wrapper {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;
        inset: auto !important;

        flex: 1 1 auto !important;

        width: auto !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 12px !important;

        transform: none !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;
    }


    #header #sb_menu {
        display: block !important;

        width: 100% !important;

        visibility: visible !important;
        opacity: 1 !important;
    }


    #header #sb_menu_list_items_container {
        display: flex !important;
        flex-direction: row !important;

        align-items: center !important;
        justify-content: center !important;

        gap: 24px !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        visibility: visible !important;
        opacity: 1 !important;
    }


    #header #sb_menu_list_items_container li,
    #header #sb_menu_list_items_container .nav-item {
        display: block !important;

        position: relative !important;
        inset: auto !important;

        width: auto !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        visibility: visible !important;
        opacity: 1 !important;
    }


    #header #sb_menu_list_items_container a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: auto !important;
        min-height: 46px !important;

        padding: 0 8px !important;

        font-size: 13px !important;
        letter-spacing: .3px !important;

        white-space: nowrap !important;

        visibility: visible !important;
        opacity: 1 !important;
    }


    /* =====================================================
       PANIER + CONNEXION + PAYER
    ===================================================== */

    #header .items-wrapper {
        display: flex !important;
        flex-direction: row !important;

        align-items: center !important;
        justify-content: flex-end !important;

        gap: 8px !important;

        position: relative !important;
        inset: auto !important;

        flex: 0 0 auto !important;

        width: auto !important;
        min-width: max-content !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;
    }


    #header #sb_cart,
    #header #sb_client_info {
        display: flex !important;

        position: relative !important;
        inset: auto !important;

        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;

        height: 46px !important;
        min-height: 46px !important;
        max-height: 46px !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        visibility: visible !important;
        opacity: 1 !important;
    }


    /* bouton Payer plus compact sur tablette */

    #header #book-btn {
        display: flex !important;

        position: relative !important;
        inset: auto !important;

        width: auto !important;
        min-width: 105px !important;
        max-width: 120px !important;

        height: 46px !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        visibility: visible !important;
        opacity: 1 !important;
    }


    #header #book-btn a,
    #header #book-btn .btn {
        min-width: 105px !important;
        max-width: 120px !important;

        height: 46px !important;

        padding: 0 16px !important;

        font-size: 14px !important;
    }


    /* PAS DE HAMBURGER sur tablette / petite fenêtre */
    #header .nav-trigger {
        display: none !important;
    }
}


/* =========================================================
   IPAD PLUS ÉTROIT
========================================================= */

@media screen and (min-width: 768px) and (max-width: 1024px) {

    #header #sb_menu_list_items_container {
        gap: 12px !important;
    }

    #header #sb_menu_list_items_container a {
        font-size: 12px !important;
        padding: 0 4px !important;
    }

    #header #sb_cart,
    #header #sb_client_info {
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;

        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
    }

    #header #book-btn {
        min-width: 92px !important;
        max-width: 105px !important;
        height: 42px !important;
    }

    #header #book-btn a,
    #header #book-btn .btn {
        min-width: 92px !important;
        max-width: 105px !important;
        height: 42px !important;

        padding: 0 12px !important;

        font-size: 13px !important;
    }
}
/* =========================================================
   AJUSTEMENTS RESPONSIVE
   - tablette : menu plus compact + suppression "PRODUCT"
   - téléphone : hamburger recentré vers la gauche
========================================================= */


/* =========================================================
   TABLETTE / IPAD / PETITE FENÊTRE
========================================================= */

@media screen and (min-width: 768px) and (max-width: 1200px) {

    /* Réduire fortement l'espace entre les liens */
    #header #sb_menu_list_items_container {
        gap: 8px !important;
        justify-content: center !important;
        flex-wrap: nowrap !important;

        width: auto !important;
        max-width: 100% !important;

        overflow: visible !important;
    }

    #header #sb_menu_list_items_container li,
    #header #sb_menu_list_items_container .nav-item {
        flex: 0 0 auto !important;
        width: auto !important;
    }

    #header #sb_menu_list_items_container a {
        padding-left: 4px !important;
        padding-right: 4px !important;

        font-size: 12px !important;
        letter-spacing: 0.15px !important;

        white-space: nowrap !important;
    }


    /* =====================================================
       SUPPRIMER "PRODUCT" SUR IPAD / TABLETTE
       ===================================================== */

    #header #sb_menu_list_items_container
    a[href*="product"]:not([href*="products"]),

    #header #sb_menu_list_items_container
    li:has(a[href*="/product/"]),

    #header #sb_menu_list_items_container
    .nav-item:has(a[href*="/product/"]) {
        display: none !important;
    }
}


/* =========================================================
   IPAD 768 - 1024 : encore un peu plus compact
========================================================= */

@media screen and (min-width: 768px) and (max-width: 1024px) {

    #header #sb_menu_list_items_container {
        gap: 5px !important;
    }

    #header #sb_menu_list_items_container a {
        padding-left: 2px !important;
        padding-right: 2px !important;

        font-size: 11px !important;
    }
}


/* =========================================================
   TELEPHONE : HAMBURGER
   La hauteur reste EXACTEMENT celle que tu viens de valider.
   On corrige uniquement l'horizontal.
========================================================= */

@media screen and (max-width: 767px) {

    #header .nav-trigger {
        left: 43% !important;

        /* surtout on garde la bonne hauteur */
        top: 18px !important;

        transform: translateX(-50%) !important;
    }
}
/* =========================================================
   AJUSTEMENT RESPONSIVE FINAL
   - hamburger plus à gauche
   - suppression PRODUCT
   - menu tablette beaucoup plus compact
========================================================= */


/* =========================================================
   TELEPHONE — HAMBURGER PLUS A GAUCHE
========================================================= */

@media screen and (max-width: 767px) {

    #header .nav-trigger {
        left: 36% !important;
        top: 18px !important;
        transform: translateX(-50%) !important;
    }
}


/* =========================================================
   TABLETTE / PETITE FENETRE
========================================================= */

@media screen and (min-width: 768px) and (max-width: 1200px) {

    /* menu ultra compact */
    #header #sb_menu_list_items_container {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;

        gap: 2px !important;

        width: auto !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
        flex-wrap: nowrap !important;
    }

    #header #sb_menu_list_items_container li,
    #header #sb_menu_list_items_container .nav-item {
        flex: 0 0 auto !important;

        width: auto !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #header #sb_menu_list_items_container a {
        padding: 0 3px !important;
        margin: 0 !important;

        font-size: 11px !important;
        letter-spacing: 0 !important;

        white-space: nowrap !important;
    }


    /* =====================================================
       SUPPRIMER PRODUCT
       plusieurs variantes possibles SimplyBook
    ===================================================== */

    #header #sb_menu_list_items_container
    a[href*="#products"]:not([href*="products"]),

    #header #sb_menu_list_items_container
    a[href*="/product"],

    #header #sb_menu_list_items_container
    a[href*="product/"],

    #header #sb_menu_list_items_container
    li.product,

    #header #sb_menu_list_items_container
    li.products,

    #header #sb_menu_list_items_container
    .product,

    #header #sb_menu_list_items_container
    .products {
        display: none !important;
    }
}


/* =========================================================
   IPAD / PETITE LARGEUR
========================================================= */

@media screen and (min-width: 768px) and (max-width: 1024px) {

    #header #sb_menu_list_items_container {
        gap: 0 !important;
    }

    #header #sb_menu_list_items_container a {
        padding: 0 2px !important;
        font-size: 10px !important;
    }
}
/* =========================================================
   SUPPRESSION DEFINITIVE DU MENU PRODUCTS
   + MENU TABLETTE / PETITE FENETRE PLUS SERRE
========================================================= */

@media screen and (min-width: 768px) and (max-width: 1200px) {

    /* Cache complètement l'entrée PRODUCTS */
    #sb_menu_list_items_container li:has(a[href="#products"]) {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Sécurité : cache aussi le lien lui-même */
    #sb_menu_list_items_container a[href="#products"] {
        display: none !important;
    }

    /* Menu plus compact */
    #sb_menu_list_items_container {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 18px !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    #sb_menu_list_items_container > li {
        width: auto !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #sb_menu_list_items_container > li > a {
        width: auto !important;
        padding: 0 4px !important;
        margin: 0 !important;
        white-space: nowrap !important;
    }
}
/* ==========================================================
   RESPONSIVE HEADER PROPRE
   DESKTOP NORMAL = MENU HORIZONTAL
   PETITE FENÊTRE / TABLETTE = HAMBURGER
   ========================================================== */


/* ==========================================================
   1 — DESKTOP NORMAL : À PARTIR DE 1101 PX
   ========================================================== */

@media screen and (min-width: 1101px) {

    #header .nav-trigger {
        display: none !important;
    }

    #header .nav-wrapper,
    #header #sb_menu {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
    }

    #header #sb_menu_list_items_container {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;

        align-items: center !important;
        justify-content: center !important;

        gap: 32px !important;

        width: auto !important;
        max-width: none !important;

        margin: 0 auto !important;
        padding: 0 !important;

        overflow: visible !important;
    }

    #header #sb_menu_list_items_container > li {
        display: flex !important;

        width: auto !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        flex: 0 0 auto !important;
    }

    #header #sb_menu_list_items_container > li > a {
        display: inline-flex !important;

        width: auto !important;

        padding: 0 5px !important;
        margin: 0 !important;

        white-space: nowrap !important;
    }
}


/* ==========================================================
   2 — BOUTIQUE :
   garder le vrai lien mais remplacer PRODUCTS
   ========================================================== */

#header #sb_menu_list_items_container
> li:has(> a[href="#products"]) {

    display: flex !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    visibility: visible !important;
    opacity: 1 !important;
}


#header #sb_menu_list_items_container
> li > a[href="#products"] {

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: auto !important;

    font-size: 0 !important;

    visibility: visible !important;
    opacity: 1 !important;
}


#header #sb_menu_list_items_container
> li > a[href="#products"] * {

    font-size: 0 !important;
}


#header #sb_menu_list_items_container
> li > a[href="#products"]::after {

    content: "BOUTIQUE MYSTIQUE" !important;

    display: inline-block !important;

    font-family: "Cinzel", Georgia, serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;

    letter-spacing: .4px !important;
    line-height: 1.2 !important;

    color: var(--vm-gold-light) !important;

    white-space: nowrap !important;
}


/* ==========================================================
   3 — ANNULER LES ANCIENS FAUX BOUTIQUE MYSTIQUE
   ========================================================== */

#header nav li:nth-child(2) > a::after,
#header .nav li:nth-child(2) > a::after,
#header .navbar-nav li:nth-child(2) > a::after,
header nav li:nth-child(2) > a::after,
header .nav li:nth-child(2) > a::after,
header .navbar-nav li:nth-child(2) > a::after {

    content: none !important;
    display: none !important;
}


/* Puis remettre uniquement le vrai lien boutique */

#header #sb_menu_list_items_container
> li > a[href="#products"]::after {

    content: "BOUTIQUE MYSTIQUE" !important;
    display: inline-block !important;
}


/* ==========================================================
   4 — PETITE FENÊTRE + TABLETTE
   768 PX → 1100 PX
   ON PASSE AU HAMBURGER
   ========================================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    #header {
        position: relative !important;
        min-height: 92px !important;
        overflow: visible !important;
    }


    /* ---------------------------------------------
       On supprime le rectangle noir du menu
       --------------------------------------------- */

    #header .nav-wrapper {
        position: static !important;

        width: auto !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;

        box-shadow: none !important;

        overflow: visible !important;
    }


    /* Le menu est fermé par défaut */

    #header #sb_menu {
        position: absolute !important;

        top: 92px !important;
        left: 50% !important;

        transform: translateX(-50%) !important;

        width: min(520px, calc(100vw - 40px)) !important;
        max-width: calc(100vw - 40px) !important;

        height: auto !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 14px !important;

        background:
            linear-gradient(
                180deg,
                rgba(3, 14, 42, .99),
                rgba(2, 9, 28, .99)
            ) !important;

        border: 1px solid var(--vm-gold) !important;
        border-radius: 18px !important;

        box-shadow:
            0 15px 35px rgba(0,0,0,.55),
            0 0 18px rgba(215,173,86,.15) !important;

        overflow: visible !important;

        z-index: 99999 !important;
    }


    /*
       SimplyBook gère lui-même l'ouverture/fermeture.
       On ne force surtout plus le menu horizontal.
    */

    #header #sb_menu_list_items_container {
        flex-direction: column !important;

        align-items: stretch !important;
        justify-content: center !important;

        gap: 0 !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
    }


    #header #sb_menu_list_items_container > li {

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    #header #sb_menu_list_items_container > li > a {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-height: 48px !important;

        margin: 0 !important;
        padding: 8px 12px !important;

        font-size: 13px !important;
        letter-spacing: .3px !important;

        white-space: nowrap !important;
    }


    #header #sb_menu_list_items_container
    > li > a[href="#products"]::after {

        font-size: 13px !important;
    }


    /* ---------------------------------------------
       Hamburger visible
       --------------------------------------------- */

    #header .nav-trigger {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        position: absolute !important;

        left: 50% !important;
        top: 50% !important;

        transform: translate(-50%, -50%) !important;

        width: 48px !important;
        height: 48px !important;

        margin: 0 !important;
        padding: 0 !important;

        background:
            linear-gradient(
                180deg,
                #1459d7,
                #0a3188
            ) !important;

        border: 2px solid var(--vm-gold) !important;
        border-radius: 50% !important;

        box-shadow:
            0 7px 18px rgba(0,0,0,.42),
            0 0 13px rgba(215,173,86,.28) !important;

        color: var(--vm-gold-light) !important;

        visibility: visible !important;
        opacity: 1 !important;

        z-index: 100001 !important;
    }


    /* Les 3 traits du hamburger */

    #header .nav-trigger i,
    #header .nav-trigger i::before,
    #header .nav-trigger i::after,
    #header .nav-trigger span,
    #header .nav-trigger span::before,
    #header .nav-trigger span::after {

        color: var(--vm-gold-light) !important;
        border-color: var(--vm-gold-light) !important;
    }


    /* ---------------------------------------------
       Panier + connexion à droite,
       Payer encore plus à droite
       --------------------------------------------- */

    #header .items-wrapper {

        display: flex !important;

        align-items: center !important;
        justify-content: flex-end !important;

        gap: 7px !important;

        position: absolute !important;

        right: 18px !important;
        top: 50% !important;

        transform: translateY(-50%) !important;

        width: auto !important;
        min-width: max-content !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
    }


    #header #sb_cart,
    #header #sb_client_info {

        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;

        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
    }


    #header #book-btn {

        width: auto !important;
        min-width: 100px !important;
        max-width: 112px !important;

        height: 42px !important;
    }


    #header #book-btn a,
    #header #book-btn .btn {

        min-width: 100px !important;
        max-width: 112px !important;

        height: 42px !important;

        padding: 0 12px !important;

        font-size: 13px !important;
    }
}
/* ==========================================================
   CORRECTION TABLETTE / PETITE FENETRE
   NE TOUCHE PAS AU GRAND DESKTOP
   ========================================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {


    /* ======================================================
       1 — MENU FERMÉ PAR DÉFAUT
       ====================================================== */

    #header #sb_menu {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }


    /* ======================================================
       2 — MENU VISIBLE UNIQUEMENT QUAND SIMPLYBOOK L'OUVRE
       ====================================================== */

    #header .nav-wrapper.open #sb_menu,
    #header .nav-wrapper.active #sb_menu,
    #header .nav-wrapper.show #sb_menu,

    #header #sb_menu.open,
    #header #sb_menu.active,
    #header #sb_menu.show,

    #header .nav-trigger.active + .nav-wrapper #sb_menu {

        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }


    /* ======================================================
       3 — MENU DÉROULANT PROPRE
       ====================================================== */

    #header #sb_menu {

        position: absolute !important;

        top: 92px !important;
        left: 50% !important;

        transform: translateX(-50%) !important;

        width: min(520px, calc(100vw - 40px)) !important;
        max-width: calc(100vw - 40px) !important;

        height: auto !important;
        max-height: none !important;

        padding: 16px 20px !important;
        margin: 0 !important;

        background: #020b22 !important;

        border: 1px solid #d8b45b !important;
        border-radius: 18px !important;

        box-shadow: 0 15px 35px rgba(0,0,0,.50) !important;

        overflow: visible !important;

        z-index: 99999 !important;
    }


    #header #sb_menu_list_items_container {

        display: flex !important;

        flex-direction: column !important;

        align-items: center !important;
        justify-content: center !important;

        gap: 0 !important;

        width: 100% !important;

        padding: 0 !important;
        margin: 0 !important;
    }


    #header #sb_menu_list_items_container > li {

        display: block !important;

        width: 100% !important;

        padding: 0 !important;
        margin: 0 !important;
    }


    #header #sb_menu_list_items_container > li > a {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-height: 50px !important;

        padding: 8px 10px !important;
        margin: 0 !important;

        white-space: nowrap !important;
    }


    /* ======================================================
       4 — HAMBURGER
       ====================================================== */

    #header .nav-trigger {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        position: absolute !important;

        left: 50% !important;
        top: 50% !important;

        transform: translate(-50%, -50%) !important;

        width: 48px !important;
        height: 48px !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 2px solid #d8b45b !important;
        border-radius: 50% !important;

        background:
            linear-gradient(
                180deg,
                #1459d7 0%,
                #0a3188 100%
            ) !important;

        color: #f8e3a8 !important;

        visibility: visible !important;
        opacity: 1 !important;

        z-index: 100000 !important;
    }


    /* ======================================================
       5 — ZONE PANIER / CONNEXION / PAYER
       ====================================================== */

    #header .items-wrapper {

        display: flex !important;

        flex-direction: row !important;

        align-items: center !important;
        justify-content: flex-end !important;

        gap: 7px !important;

        position: absolute !important;

        right: 18px !important;
        top: 50% !important;

        transform: translateY(-50%) !important;

        width: auto !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;

        z-index: 10001 !important;
    }


    /* ======================================================
       6 — PANIER ET CONNEXION : RONDS
       ====================================================== */

    #header #sb_cart,
    #header #sb_client_info {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        position: relative !important;

        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;

        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;

        padding: 0 !important;
        margin: 0 !important;

        background: transparent !important;

        border: 2px solid #d8b45b !important;
        border-radius: 50% !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;

        flex: 0 0 44px !important;
    }


    /* ======================================================
       7 — LE CONTENU DES RONDS DOIT RESTER VISIBLE
       ====================================================== */

    #header #sb_cart .cart-container,
    #header #sb_cart .item-container,

    #header #sb_client_info .login-container,
    #header #sb_client_info .item-container {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        height: 100% !important;

        padding: 0 !important;
        margin: 0 !important;

        background: transparent !important;

        visibility: visible !important;
        opacity: 1 !important;
    }


    /* SVG PANIER + CONNEXION */

    #header #sb_cart svg,
    #header #sb_client_info svg {

        display: block !important;

        width: 21px !important;
        height: 21px !important;

        max-width: 21px !important;
        max-height: 21px !important;

        color: #fff8df !important;

        visibility: visible !important;
        opacity: 1 !important;
    }


    #header #sb_cart svg path,
    #header #sb_client_info svg path {

        fill: currentColor !important;
        stroke: currentColor !important;
    }


    /* ======================================================
       8 — COMPTEUR DU PANIER
       ====================================================== */

    #header #sb_cart .counter,
    #header #sb_cart [class*="counter"] {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        position: absolute !important;

        top: -8px !important;
        right: -5px !important;

        min-width: 20px !important;
        height: 20px !important;

        padding: 0 4px !important;

        border-radius: 999px !important;

        background: #f2d88d !important;
        color: #071639 !important;

        font-size: 11px !important;
        font-weight: 700 !important;

        visibility: visible !important;
        opacity: 1 !important;

        z-index: 5 !important;
    }


    /* ======================================================
       9 — PAYER
       ====================================================== */

    #header #book-btn {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        position: relative !important;

        width: auto !important;
        min-width: 112px !important;

        height: 44px !important;

        padding: 0 !important;
        margin: 0 !important;

        visibility: visible !important;
        opacity: 1 !important;

        flex: 0 0 auto !important;
    }


    #header #book-btn a,
    #header #book-btn .btn {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        min-width: 112px !important;
        height: 44px !important;

        padding: 0 14px !important;

        white-space: nowrap !important;
    }
}
@media screen and (max-width: 767px) {

    /* HAMBURGER AU MILIEU */
    #header .nav-trigger {
        position: absolute !important;
        left: 50% !important;
        right: auto !important;
        top: auto !important;
        transform: translateX(-50%) !important;
        margin: 0 !important;
        z-index: 9999 !important;
    }

}
/* =========================================================
   MOBILE — HAMBURGER VRAIMENT CENTRÉ
   ========================================================= */

@media screen and (max-width: 767px) {

    /* Le header devient la référence de position */
    #header {
        position: relative !important;
    }

    /* On empêche le conteneur SimplyBook de servir
       de référence au hamburger */
    #header .header-controls {
        position: static !important;
    }

    /* Hamburger pile au centre du header / écran */
    #header .nav-trigger {
        position: absolute !important;

        left: 50% !important;
        right: auto !important;

        top: auto !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        transform: translateX(-50%) !important;

        z-index: 50 !important;
    }
}
/* =========================================================
   MOBILE — CORRECTIONS PAGE D'ACCUEIL
   1. Hamburger recentré
   2. Voyageur Mystique AVANT Horaires d'ouverture
   ========================================================= */

@media screen and (max-width: 767px) {

    /* -----------------------------------------------------
       HAMBURGER
       ----------------------------------------------------- */

    #header {
        position: relative !important;
    }

    #header .header-controls {
        position: static !important;
    }

    #header .nav-trigger {
        position: absolute !important;

        /* centre puis décalage légèrement vers la gauche */
       left: calc(50% + -40px) !important;
        right: auto !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        transform: translateX(-50%) !important;

        z-index: 50 !important;
    }


    /* -----------------------------------------------------
       BLOCS PAGE D'ACCUEIL
       Ordre téléphone :
       1 = LE VOYAGEUR MYSTIQUE
       2 = HORAIRES D'OUVERTURE
       3 = NOUS CONTACTER
       ----------------------------------------------------- */

    #main .row.row-eq-height-xs {
        display: flex !important;
        flex-direction: column !important;
    }

    /* HORAIRES : passe en deuxième */
    #main .row.row-eq-height-xs > div:nth-child(1) {
        order: 2 !important;
    }

    /* LE VOYAGEUR MYSTIQUE : passe en premier */
    #main .row.row-eq-height-xs > div:nth-child(2) {
        order: 1 !important;
    }

    /* NOUS CONTACTER : reste en troisième */
    #main .row.row-eq-height-xs > div:nth-child(3) {
        order: 3 !important;
    }
}

/* =========================================================
   CORRECTION : JAMAIS DE HAMBURGER SUR ORDINATEUR / TABLETTE
   Le hamburger reste réservé au vrai téléphone
   ========================================================= */

@media (min-width: 601px) {

    #header .nav-trigger,
    .nav-trigger {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    /* Le menu normal reste visible */
    #header .nav-wrapper,
    #header .nav-wrapper .nav,
    #header .nav-wrapper ul {
        visibility: visible !important;
        opacity: 1 !important;
    }
}


/* =========================================================
   TÉLÉPHONE UNIQUEMENT
   ========================================================= */

@media (max-width: 600px) {

    #header .nav-trigger,
    .nav-trigger {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
}
/* =========================================================
   TÉLÉPHONE — NETTOYAGE PAGE DE RÉSERVATION
   ========================================================= */

@media (max-width: 600px) {

    /* 1 — SUPPRIME COMPLÈTEMENT LE BANDEAU CATÉGORIE */
    #sb_booking_content .booking-info,
    #sb_booking_content div.booking-info {
        display: none !important;
        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        overflow: hidden !important;
    }


    /* 2 — ENLÈVE LES RECTANGLES INTERMÉDIAIRES
       AUTOUR DE SÉLECTIONNER */
    #sb_booking_content .tab-pd,
    #sb_booking_content .btn-bar,
    #sb_booking_content .btn.select.custom {
        background: transparent !important;
        background-image: none !important;

        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;

        border-radius: 0 !important;
    }


    /* Le conteneur du bouton */
    #sb_booking_content .btn-bar {
        padding: 10px 0 !important;
        margin: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }


    /* Le faux bouton SimplyBook ne dessine PLUS rien */
    #sb_booking_content .btn.select.custom {
        padding: 0 !important;
        margin: 0 !important;

        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
    }


    /* 3 — SEUL LE <a> DEVIENT LE VRAI BOUTON */
    #sb_booking_content .btn.select.custom a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 200px !important;
        height: 44px !important;

        padding: 0 18px !important;
        margin: 0 auto !important;

        box-sizing: border-box !important;

        background: linear-gradient(
            180deg,
            #1765df 0%,
            #0844b5 50%,
            #05246f 100%
        ) !important;

        border: 1.5px solid #e8b73f !important;
        border-radius: 24px !important;

        outline: 0 !important;

        box-shadow:
            inset 0 1px 4px rgba(255,255,255,.20),
            0 0 8px rgba(232,183,63,.25) !important;

        color: #fff !important;
        text-decoration: none !important;
    }


    /* 4 — TUE LES PSEUDO-ÉLÉMENTS QUI PEUVENT
       FABRIQUER LES RECTANGLES SUPPLÉMENTAIRES */
    #sb_booking_content .tab-pd::before,
    #sb_booking_content .tab-pd::after,
    #sb_booking_content .btn-bar::before,
    #sb_booking_content .btn-bar::after,
    #sb_booking_content .btn.select.custom::before,
    #sb_booking_content .btn.select.custom::after,
    #sb_booking_content .btn.select.custom a::before,
    #sb_booking_content .btn.select.custom a::after {
        content: none !important;
        display: none !important;
    }

}
/* ==========================================================
   MOBILE — RÉSERVATION : BANDEAU + DOUBLE BOUTONS
   ========================================================== */

@media screen and (max-width: 600px) {

    /* ==========================================
       1. SUPPRIMER LE BANDEAU
       CATÉGORIE / SERVICE / HEURE
       ========================================== */

    #sb_content #steps-nav,
    #sb_booking_content #steps-nav,
    nav#steps-nav {
        display: none !important;
        visibility: hidden !important;

        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;
        box-shadow: none !important;

        overflow: hidden !important;
    }


    /* ==========================================
       2. SUPPRIMER LES CADRES AUTOUR
       DU BOUTON SÉLECTIONNER
       ========================================== */

    #sb_booking_content .category-item .tab-pd,
    #sb_booking_content .service-item .tab-pd,
    #sb_booking_content .tab-col .tab-pd {

        background: transparent !important;
        background-image: none !important;

        border: none !important;
        outline: none !important;
        box-shadow: none !important;

        border-radius: 0 !important;

        padding: 8px 8px !important;
    }


    /* BARRE QUI ENTOURE LE BOUTON */

    #sb_booking_content .category-item .btn-bar,
    #sb_booking_content .service-item .btn-bar,
    #sb_booking_content .tab-col .btn-bar {

        background: transparent !important;
        background-image: none !important;

        border: none !important;
        outline: none !important;
        box-shadow: none !important;

        border-radius: 0 !important;

        padding: 0 !important;
        margin: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }


    /* ==========================================
       3. ENLEVER LE FAUX BOUTON EXTÉRIEUR
       ========================================== */

    #sb_booking_content .btn.select,
    #sb_booking_content .btn.select.custom {

        background: transparent !important;
        background-image: none !important;

        border: none !important;
        outline: none !important;
        box-shadow: none !important;

        padding: 0 !important;
        margin: 0 auto !important;

        width: auto !important;
        height: auto !important;

        min-width: 0 !important;
        min-height: 0 !important;
    }


    /* ==========================================
       4. UN SEUL VRAI BOUTON BLEU
       ========================================== */

    #sb_booking_content .btn.select > a,
    #sb_booking_content .btn.select.custom > a,
    #sb_booking_content .btn-bar > a {

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        width: 200px !important;
        max-width: 90% !important;
        height: 44px !important;

        padding: 0 18px !important;
        margin: 0 auto !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                180deg,
                #1766df 0%,
                #0b4dbf 50%,
                #062871 100%
            ) !important;

        border: 1.5px solid #e7b842 !important;
        border-radius: 25px !important;

        outline: none !important;

        box-shadow:
            inset 0 1px 3px rgba(255,255,255,.20),
            0 0 7px rgba(231,184,66,.22) !important;

        color: #fff8e8 !important;
        text-decoration: none !important;
    }


    /* ==========================================
       5. SUPPRIMER LES FAUX CADRES
       BEFORE / AFTER
       ========================================== */

    #sb_booking_content .tab-pd::before,
    #sb_booking_content .tab-pd::after,

    #sb_booking_content .btn-bar::before,
    #sb_booking_content .btn-bar::after,

    #sb_booking_content .btn.select::before,
    #sb_booking_content .btn.select::after,

    #sb_booking_content .btn.select.custom::before,
    #sb_booking_content .btn.select.custom::after {

        content: none !important;
        display: none !important;
        border: none !important;
        box-shadow: none !important;
    }

}
/* ==========================================================
   MOBILE — SERVICES
   1 seul cadre + bouton centré
   ========================================================== */

@media screen and (max-width: 600px) {

    /* =========================================
       CARTE SERVICE — UN SEUL CADRE EXTÉRIEUR
       ========================================= */

    #sb_booking_content .service-item.item-v1 {
        background: transparent !important;
        border: 1px solid #d9aa3c !important;
        border-radius: 18px !important;
        box-shadow: none !important;
        overflow: hidden !important;
    }


    /* Supprimer les cadres intérieurs SimplyBook */
    #sb_booking_content .service-item .tab,
    #sb_booking_content .service-item .tab-col,
    #sb_booking_content .service-item .tab-with-popup {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }


    /* =========================================
       BAS DE LA CARTE
       ========================================= */

    #sb_booking_content .service-item .tab-pd {
        position: relative !important;

        width: 100% !important;
        box-sizing: border-box !important;

        padding: 8px 10px 12px !important;
        margin: 0 !important;

        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }


    /* =========================================
       ZONE DU BOUTON
       ========================================= */

    #sb_booking_content .service-item .btn-bar {
        position: relative !important;

        width: 100% !important;
        max-width: none !important;
        height: 46px !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }


    /* Wrapper du bouton */
    #sb_booking_content .service-item .btn.select.custom {
        position: absolute !important;

        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;

        width: 180px !important;
        height: 40px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: block !important;

        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }


    /* =========================================
       BOUTON SÉLECTIONNER
       ========================================= */

    #sb_booking_content .service-item .btn.select.custom > a {
        position: absolute !important;

        left: 0 !important;
        top: 0 !important;

        width: 180px !important;
        height: 40px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        box-sizing: border-box !important;

        color: #fff4d6 !important;
        font-family: Cinzel, Georgia, serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        letter-spacing: .5px !important;
        line-height: 1 !important;
        text-transform: uppercase !important;
        text-align: center !important;
        text-decoration: none !important;
        white-space: nowrap !important;

        background:
            linear-gradient(
                180deg,
                #1766df 0%,
                #0d52c3 38%,
                #07398f 70%,
                #041d52 100%
            ) !important;

        border: 1.5px solid #e6b847 !important;
        border-radius: 22px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.35),
            inset 0 -2px 4px rgba(0,0,0,.22),
            0 0 8px rgba(231,183,66,.35) !important;
    }


    /* =========================================
       SUPPRIMER TOUS LES CADRES PARASITES
       ========================================= */

    #sb_booking_content .service-item::before,
    #sb_booking_content .service-item::after,

    #sb_booking_content .service-item .tab::before,
    #sb_booking_content .service-item .tab::after,

    #sb_booking_content .service-item .tab-pd::before,
    #sb_booking_content .service-item .tab-pd::after,

    #sb_booking_content .service-item .btn-bar::before,
    #sb_booking_content .service-item .btn-bar::after,

    #sb_booking_content .service-item .btn.select.custom::before,
    #sb_booking_content .service-item .btn.select.custom::after,

    #sb_booking_content .service-item .btn.select.custom > a::before,
    #sb_booking_content .service-item .btn.select.custom > a::after {
        content: none !important;
        display: none !important;
    }

}
/* ==========================================================
   MOBILE — CALENDRIER + HORAIRES
   Nettoyage complet + rendu bleu / or
   ========================================================== */

@media screen and (max-width: 600px) {


    /* ======================================================
       1. CONTENEURS GÉNÉRAUX
       SUPPRIMER LES CADRES PARASITES
       ====================================================== */

    #sb_booking_content .datetime-step,
    #sb_booking_content #sb_datetime_step_container,
    #sb_booking_content #sb_dateview_container,
    #sb_booking_content #sb_timeview_container,
    #sb_booking_content .section-wrapper,
    #sb_booking_content .slots-view,
    #sb_booking_content .timeline-wrapper,
    #sb_booking_content .tab-pd {
        background: transparent !important;
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }


    /* ======================================================
       2. BLOC DU CALENDRIER
       UN SEUL CADRE BLEU / OR
       ====================================================== */

    #sb_booking_content #sb_dateview_container .section-pd {
        width: 100% !important;
        max-width: 230px !important;

        margin: 0 auto 12px !important;
        padding: 10px 8px 12px !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                145deg,
                #0d3f94 0%,
                #0750ba 48%,
                #062c70 100%
            ) !important;

        border: 1.5px solid #e5b33c !important;
        border-radius: 18px !important;

        box-shadow:
            inset 0 1px 1px rgba(255,255,255,.15),
            0 0 8px rgba(229,179,60,.18) !important;
    }


    /* Enlever tous les cadres intérieurs */
    #sb_booking_content #sb_dateview_container .top-date-select,
    #sb_booking_content #sb_dateview_container .header,
    #sb_booking_content #sb_dateview_container .calendar,
    #sb_booking_content #sb_dateview_container .weeks-name,
    #sb_booking_content #sb_dateview_container .weeks-date,
    #sb_booking_content #sb_dateview_container .inner,
    #sb_booking_content #sb_dateview_container .row,
    #sb_booking_content #sb_dateview_container [class*="col-"] {
        background: transparent !important;
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }


    /* ======================================================
       3. MOIS — AOÛT 2026
       ====================================================== */

    #sb_booking_content #sb_dateview_container .top-date-select .txt-center,
    #sb_booking_content #sb_dateview_container .top-date-select .txt-center div {

        font-family: Cinzel, Georgia, serif !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        letter-spacing: .6px !important;

        color: #f4c85d !important;

        text-align: center !important;
        text-shadow: 0 1px 4px rgba(0,0,0,.45) !important;
    }


    /* Flèches gauche / droite du mois */
    #sb_booking_content #sb_dateview_container .top-date-select a,
    #sb_booking_content #sb_dateview_container .top-date-select i {

        color: #fff8e8 !important;
        font-size: 20px !important;

        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }


    /* ======================================================
       4. JOURS : LUN MAR MER JEU VEN SAM DIM
       CORRECTION DE L'ÉCRASEMENT
       ====================================================== */

    #sb_booking_content #sb_dateview_container .weeks-name .inner {

        display: grid !important;
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;

        width: 100% !important;

        margin: 8px 0 5px !important;
        padding: 0 !important;
    }


    #sb_booking_content #sb_dateview_container .weeks-name .name {

        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 10px !important;
        font-weight: 500 !important;
        letter-spacing: 0 !important;

        color: #fff8e8 !important;

        text-align: center !important;
        white-space: nowrap !important;

        float: none !important;
        flex: none !important;
    }


    /* Week-end légèrement doré */
    #sb_booking_content #sb_dateview_container .weeks-name .name:nth-child(6),
    #sb_booking_content #sb_dateview_container .weeks-name .name:nth-child(7) {
        color: #f4c85d !important;
    }


    /* ======================================================
       5. GRILLE DES DATES
       ====================================================== */

    #sb_booking_content #sb_dateview_container .weeks-date .inner {

        display: grid !important;
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;

        width: 100% !important;

        gap: 3px 0 !important;

        padding: 5px 0 2px !important;
        margin: 0 !important;
    }


    #sb_booking_content #sb_dateview_container .weeks-date .date,
    #sb_booking_content #sb_dateview_container .weeks-date .day {

        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;

        height: 27px !important;

        margin: 0 !important;
        padding: 0 !important;

        float: none !important;
        flex: none !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 11px !important;

        color: #fff !important;

        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }


    /* Liens des dates */
    #sb_booking_content #sb_dateview_container .weeks-date a {

        width: 27px !important;
        height: 27px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: auto !important;
        padding: 0 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 11px !important;

        color: #fff !important;

        background: transparent !important;
        border: 0 !important;
        border-radius: 50% !important;
        box-shadow: none !important;
    }


    /* Date sélectionnée */
    #sb_booking_content #sb_dateview_container .weeks-date .selected a,
    #sb_booking_content #sb_dateview_container .weeks-date .active a,
    #sb_booking_content #sb_dateview_container .weeks-date a.selected,
    #sb_booking_content #sb_dateview_container .weeks-date a.active {

        background:
            linear-gradient(
                180deg,
                #1768e2 0%,
                #0a4eb8 55%,
                #052d72 100%
            ) !important;

        border: 1.5px solid #f0bd3f !important;

        color: #fff !important;

        box-shadow:
            0 0 7px rgba(240,189,63,.38) !important;
    }


    /* Dates non disponibles */
    #sb_booking_content #sb_dateview_container .weeks-date .disabled,
    #sb_booking_content #sb_dateview_container .weeks-date .disabled a {

        color: rgba(255,255,255,.34) !important;
        opacity: 1 !important;
    }


    /* ======================================================
       6. TITRE "HORAIRES DE DÉBUT DISPONIBLES"
       ====================================================== */

    #sb_booking_content .timeline-wrapper .container-caption {

        width: 100% !important;

        margin: 8px 0 10px !important;
        padding: 0 !important;

        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        font-style: normal !important;
        line-height: 1.25 !important;
        letter-spacing: .5px !important;

        color: #f4c85d !important;

        text-align: center !important;
        text-shadow: 0 1px 4px rgba(0,0,0,.5) !important;
    }


    /* ======================================================
       7. CADRE NOIR DES HORAIRES -> BLEU
       ====================================================== */

    #sb_booking_content #sb_time_slots_container {

        width: 100% !important;
        max-width: 210px !important;

        margin: 0 auto !important;
        padding: 8px !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                160deg,
                #061d4d 0%,
                #082c68 50%,
                #041633 100%
            ) !important;

        border: 1.5px solid #e5b33c !important;
        border-radius: 16px !important;

        box-shadow:
            inset 0 1px 2px rgba(255,255,255,.08),
            0 0 8px rgba(229,179,60,.15) !important;
    }


    /* ======================================================
       8. BOUTONS HORAIRES
       ====================================================== */

    #sb_booking_content #sb_time_slots_container .sb-cell,
    #sb_booking_content #sb_time_slots_container a {

        width: 100% !important;
        max-width: none !important;

        min-height: 38px !important;

        margin: 0 0 6px !important;
        padding: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                180deg,
                #1767df 0%,
                #0c50bd 45%,
                #062b70 100%
            ) !important;

        border: 1.3px solid #e5b33c !important;
        border-radius: 10px !important;

        box-shadow:
            inset 0 1px 1px rgba(255,255,255,.22),
            0 2px 5px rgba(0,0,0,.22) !important;

        color: #fff8e8 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 12px !important;
        font-weight: 600 !important;

        text-align: center !important;
        text-decoration: none !important;
    }


    #sb_booking_content #sb_time_slots_container .sb-cell:last-child,
    #sb_booking_content #sb_time_slots_container a:last-child {
        margin-bottom: 0 !important;
    }


    /* ======================================================
       9. SUPPRIMER TOUS LES PSEUDO-CADRES
       ====================================================== */

    #sb_booking_content #sb_dateview_container .section-pd::before,
    #sb_booking_content #sb_dateview_container .section-pd::after,
    #sb_booking_content #sb_dateview_container .calendar::before,
    #sb_booking_content #sb_dateview_container .calendar::after,
    #sb_booking_content #sb_dateview_container .weeks-name::before,
    #sb_booking_content #sb_dateview_container .weeks-name::after,
    #sb_booking_content #sb_dateview_container .weeks-date::before,
    #sb_booking_content #sb_dateview_container .weeks-date::after,
    #sb_booking_content .timeline-wrapper::before,
    #sb_booking_content .timeline-wrapper::after,
    #sb_booking_content #sb_time_slots_container::before,
    #sb_booking_content #sb_time_slots_container::after {

        content: none !important;
        display: none !important;
    }

}
/* ==========================================================
   MOBILE — CONNEXION / INSCRIPTION APRÈS CHOIX DU CRÉNEAU
   Bleu nuit + or / nettoyage complet / traduction privacy
   ========================================================== */

@media screen and (max-width: 600px) {


    /* ======================================================
       1. GRAND BLOC PRINCIPAL : NOIR -> BLEU NUIT
       ====================================================== */

    #sb_booking_content #client-login.section {
        width: 100% !important;
        max-width: 240px !important;

        margin: 0 auto 20px !important;
        padding: 0 !important;

        box-sizing: border-box !important;
        overflow: hidden !important;

        background:
            linear-gradient(
                160deg,
                #06183d 0%,
                #082a68 48%,
                #041431 100%
            ) !important;

        border: 1.5px solid #e3b341 !important;
        border-radius: 18px !important;

        box-shadow:
            inset 0 1px 2px rgba(255,255,255,.08),
            0 0 10px rgba(226,177,57,.18) !important;
    }


    /* ======================================================
       2. ENLEVER LES SOUS-CADRES / FONDS PARASITES
       ====================================================== */

    #client-login::before,
    #client-login::after,
    #client-login .client-login-bar::before,
    #client-login .client-login-bar::after,
    #client-login .social::before,
    #client-login .social::after,
    #client-login .custom-form::before,
    #client-login .custom-form::after,
    #client-login .section-pd::before,
    #client-login .section-pd::after {
        content: none !important;
        display: none !important;
    }


    #client-login .client-login-bar,
    #client-login .social,
    #client-login .custom-form,
    #client-login .section-pd,
    #client-login .buttons,
    #client-login .btn-bar__social-links {

        background: transparent !important;

        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;

        border-radius: 0 !important;
    }


    /* ======================================================
       3. TITRE
       "VEUILLEZ VOUS CONNECTER POUR CONTINUER"
       ====================================================== */

    #client-login .title-main {

        width: 100% !important;

        margin: 0 !important;
        padding: 22px 14px 18px !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                180deg,
                #0e4ca8 0%,
                #08377e 100%
            ) !important;

        border: 0 !important;
        border-bottom: 1px solid rgba(229,179,60,.65) !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        letter-spacing: .7px !important;

        color: #f6d06d !important;

        text-align: center !important;
        text-transform: uppercase !important;

        text-shadow: 0 1px 4px rgba(0,0,0,.45) !important;
    }


    /* ======================================================
       4. ZONE RÉSEAUX SOCIAUX
       ====================================================== */

    #client-login .client-login-bar {

        margin: 0 !important;
        padding: 18px 14px !important;

        border-bottom: 1px solid rgba(229,179,60,.35) !important;
    }


    #client-login .social {

        margin: 0 !important;
        padding: 0 !important;

        text-align: center !important;
    }


    #client-login .social .txt {

        margin: 0 0 14px !important;
        padding: 0 8px !important;

        background: transparent !important;

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 15px !important;
        line-height: 1.35 !important;
        font-weight: 500 !important;

        color: #fff8e8 !important;

        text-align: center !important;
    }


    /* Barre Google + Facebook */
    #client-login .btn-bar__social-links {

        width: 100% !important;

        margin: 0 auto !important;
        padding: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        gap: 14px !important;
    }


    /* ======================================================
       5. GOOGLE / FACEBOOK : BOUTONS PROPRES
       ====================================================== */

    #client-login .btn-bar__social-links > a {

        width: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;

        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        overflow: hidden !important;

        background:
            linear-gradient(
                180deg,
                #1359c9 0%,
                #083b91 58%,
                #05265f 100%
            ) !important;

        border: 1.5px solid #e4b43d !important;
        border-radius: 50% !important;

        box-shadow:
            inset 0 1px 1px rgba(255,255,255,.25),
            0 0 7px rgba(228,180,61,.28) !important;

        text-decoration: none !important;
    }


    /* Enlever les vieux effets SimplyBook des icônes */
    #client-login .btn-bar__social-links > a::before,
    #client-login .btn-bar__social-links > a::after {

        box-shadow: none !important;
        border: 0 !important;
    }


    #client-login .btn-bar__social-links > a i {

        font-size: 22px !important;

        color: #fff !important;

        text-shadow: none !important;
    }


    /* Enlever les textes GOOGLE / FACEBOOK sous les icônes
       si SimplyBook les génère */
    #client-login .btn-bar__social-links > a {

        font-size: 0 !important;
        line-height: 0 !important;
    }

    #client-login .btn-bar__social-links > a i {

        font-size: 22px !important;
        line-height: 1 !important;
    }


    /* ======================================================
       6. FORMULAIRE : CONNEXION / NOUVEAU CLIENT
       ====================================================== */

    #client-login .custom-form {

        margin: 0 !important;
        padding: 0 !important;
    }


    #client-login .section-pd {

        margin: 0 !important;
        padding: 20px 16px !important;

        background: transparent !important;

        border: 0 !important;
        box-shadow: none !important;
    }


    /* Titres "Déjà client" / "Nouveaux clients" */
    #client-login .section-pd > div:first-child,
    #client-login .form-title,
    #client-login .caption {

        font-family: Cinzel, Georgia, serif !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;

        color: #f4c85d !important;

        text-align: center !important;
    }


    /* ======================================================
       7. LABELS
       ====================================================== */

    #client-login label {

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;

        color: #fff8e8 !important;
    }


    /* Astérisques obligatoires */
    #client-login label .required,
    #client-login .required {

        color: #f3bd45 !important;
    }


    /* ======================================================
       8. CHAMPS EMAIL / NOM / TÉL / MOT DE PASSE
       ====================================================== */

    #client-login input[type="text"],
    #client-login input[type="email"],
    #client-login input[type="password"],
    #client-login input[type="tel"],
    #client-login select {

        width: 100% !important;
        height: 42px !important;

        box-sizing: border-box !important;

        padding: 0 12px !important;

        background:
            linear-gradient(
                180deg,
                #071b3d 0%,
                #05142d 100%
            ) !important;

        border: 1px solid #b78c32 !important;
        border-radius: 10px !important;

        box-shadow:
            inset 0 1px 3px rgba(0,0,0,.35) !important;

        color: #fff8e8 !important;

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 14px !important;
    }


    #client-login input::placeholder {

        color: rgba(255,248,232,.55) !important;
        opacity: 1 !important;
    }


    #client-login input:focus,
    #client-login select:focus {

        border-color: #f0bf47 !important;

        outline: 0 !important;

        box-shadow:
            0 0 0 2px rgba(240,191,71,.12),
            inset 0 1px 3px rgba(0,0,0,.30) !important;
    }


    /* ======================================================
       9. CHECKBOXES PLUS PROPRES
       ====================================================== */

    #client-login input[type="checkbox"] {

        width: 17px !important;
        height: 17px !important;

        margin: 2px 7px 0 0 !important;

        accent-color: #135bcf !important;

        vertical-align: top !important;
    }


    #client-login .form-group {

        margin-bottom: 14px !important;
    }


    /* ======================================================
       10. TRADUIRE LE PRIVACY POLICY EN FRANÇAIS

       Le texte actuel :
       "I agree with Le Voyageur Mystique Privacy Policy"
       devient :
       "J’accepte la politique de confidentialité"
       ====================================================== */

    #client-login label:has(#sb_privacy_policy_link) {

        font-size: 0 !important;
    }


    #client-login label:has(#sb_privacy_policy_link)::after {

        content: "J’accepte la politique de confidentialité *";

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;

        color: #fff8e8 !important;
    }


    /* On garde le lien cliquable vers la politique
       mais sans afficher le texte anglais */
    #client-login #sb_privacy_policy_link {

        display: inline-block !important;

        width: 1px !important;
        height: 1px !important;

        overflow: hidden !important;

        font-size: 0 !important;

        opacity: 0 !important;
    }


    /* ======================================================
       11. LIEN RAPPEL MOT DE PASSE
       ====================================================== */

    #client-login a:not(.btn) {

        color: #f4c85d !important;
        text-decoration: none !important;
    }


    #client-login a:not(.btn):hover {

        color: #ffe39a !important;
    }


    /* ======================================================
       12. BOUTON
       "SE CONNECTER ET CONTINUER"
       ====================================================== */

    #client-login .button-wrapper,
    #client-login .btn-bar {

        width: 100% !important;

        margin: 16px 0 0 !important;
        padding: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }


    #client-login .button-wrapper .btn,
    #client-login .custom-form .btn:not(.btn--action),
    #client-login button[type="submit"] {

        width: 185px !important;
        min-height: 44px !important;

        margin: 0 auto !important;
        padding: 8px 14px !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                180deg,
                #1767df 0%,
                #0d51be 43%,
                #062d73 100%
            ) !important;

        border: 1.5px solid #e6b640 !important;
        border-radius: 24px !important;

        box-shadow:
            inset 0 1px 1px rgba(255,255,255,.28),
            0 0 8px rgba(230,182,64,.30) !important;

        color: #fff1c8 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;

        text-align: center !important;
        text-transform: uppercase !important;
        text-decoration: none !important;
    }


    /* ======================================================
       13. ENLEVER LES LIGNES BLANCHES / NOIRES PARASITES
       ====================================================== */

    #client-login hr,
    #client-login .separator,
    #client-login .client-login-bar + *,
    #client-login .social + * {

        border-color: rgba(229,179,60,.28) !important;
    }

}
/* ==========================================================
   MOBILE — CONNEXION / INSCRIPTION APRÈS CHOIX DU CRÉNEAU
   Bleu nuit + or / nettoyage complet / traduction privacy
   ========================================================== */

@media screen and (max-width: 600px) {


    /* ======================================================
       1. GRAND BLOC PRINCIPAL : NOIR -> BLEU NUIT
       ====================================================== */

    #sb_booking_content #client-login.section {
        width: 100% !important;
        max-width: 240px !important;

        margin: 0 auto 20px !important;
        padding: 0 !important;

        box-sizing: border-box !important;
        overflow: hidden !important;

        background:
            linear-gradient(
                160deg,
                #06183d 0%,
                #082a68 48%,
                #041431 100%
            ) !important;

        border: 1.5px solid #e3b341 !important;
        border-radius: 18px !important;

        box-shadow:
            inset 0 1px 2px rgba(255,255,255,.08),
            0 0 10px rgba(226,177,57,.18) !important;
    }


    /* ======================================================
       2. ENLEVER LES SOUS-CADRES / FONDS PARASITES
       ====================================================== */

    #client-login::before,
    #client-login::after,
    #client-login .client-login-bar::before,
    #client-login .client-login-bar::after,
    #client-login .social::before,
    #client-login .social::after,
    #client-login .custom-form::before,
    #client-login .custom-form::after,
    #client-login .section-pd::before,
    #client-login .section-pd::after {
        content: none !important;
        display: none !important;
    }


    #client-login .client-login-bar,
    #client-login .social,
    #client-login .custom-form,
    #client-login .section-pd,
    #client-login .buttons,
    #client-login .btn-bar__social-links {

        background: transparent !important;

        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;

        border-radius: 0 !important;
    }


    /* ======================================================
       3. TITRE
       "VEUILLEZ VOUS CONNECTER POUR CONTINUER"
       ====================================================== */

    #client-login .title-main {

        width: 100% !important;

        margin: 0 !important;
        padding: 22px 14px 18px !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                180deg,
                #0e4ca8 0%,
                #08377e 100%
            ) !important;

        border: 0 !important;
        border-bottom: 1px solid rgba(229,179,60,.65) !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        letter-spacing: .7px !important;

        color: #f6d06d !important;

        text-align: center !important;
        text-transform: uppercase !important;

        text-shadow: 0 1px 4px rgba(0,0,0,.45) !important;
    }


    /* ======================================================
       4. ZONE RÉSEAUX SOCIAUX
       ====================================================== */

    #client-login .client-login-bar {

        margin: 0 !important;
        padding: 18px 14px !important;

        border-bottom: 1px solid rgba(229,179,60,.35) !important;
    }


    #client-login .social {

        margin: 0 !important;
        padding: 0 !important;

        text-align: center !important;
    }


    #client-login .social .txt {

        margin: 0 0 14px !important;
        padding: 0 8px !important;

        background: transparent !important;

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 15px !important;
        line-height: 1.35 !important;
        font-weight: 500 !important;

        color: #fff8e8 !important;

        text-align: center !important;
    }


    /* Barre Google + Facebook */
    #client-login .btn-bar__social-links {

        width: 100% !important;

        margin: 0 auto !important;
        padding: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        gap: 14px !important;
    }


    /* ======================================================
       5. GOOGLE / FACEBOOK : BOUTONS PROPRES
       ====================================================== */

    #client-login .btn-bar__social-links > a {

        width: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;

        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        overflow: hidden !important;

        background:
            linear-gradient(
                180deg,
                #1359c9 0%,
                #083b91 58%,
                #05265f 100%
            ) !important;

        border: 1.5px solid #e4b43d !important;
        border-radius: 50% !important;

        box-shadow:
            inset 0 1px 1px rgba(255,255,255,.25),
            0 0 7px rgba(228,180,61,.28) !important;

        text-decoration: none !important;
    }


    /* Enlever les vieux effets SimplyBook des icônes */
    #client-login .btn-bar__social-links > a::before,
    #client-login .btn-bar__social-links > a::after {

        box-shadow: none !important;
        border: 0 !important;
    }


    #client-login .btn-bar__social-links > a i {

        font-size: 22px !important;

        color: #fff !important;

        text-shadow: none !important;
    }


    /* Enlever les textes GOOGLE / FACEBOOK sous les icônes
       si SimplyBook les génère */
    #client-login .btn-bar__social-links > a {

        font-size: 0 !important;
        line-height: 0 !important;
    }

    #client-login .btn-bar__social-links > a i {

        font-size: 22px !important;
        line-height: 1 !important;
    }


    /* ======================================================
       6. FORMULAIRE : CONNEXION / NOUVEAU CLIENT
       ====================================================== */

    #client-login .custom-form {

        margin: 0 !important;
        padding: 0 !important;
    }


    #client-login .section-pd {

        margin: 0 !important;
        padding: 20px 16px !important;

        background: transparent !important;

        border: 0 !important;
        box-shadow: none !important;
    }


    /* Titres "Déjà client" / "Nouveaux clients" */
    #client-login .section-pd > div:first-child,
    #client-login .form-title,
    #client-login .caption {

        font-family: Cinzel, Georgia, serif !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;

        color: #f4c85d !important;

        text-align: center !important;
    }


    /* ======================================================
       7. LABELS
       ====================================================== */

    #client-login label {

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;

        color: #fff8e8 !important;
    }


    /* Astérisques obligatoires */
    #client-login label .required,
    #client-login .required {

        color: #f3bd45 !important;
    }


    /* ======================================================
       8. CHAMPS EMAIL / NOM / TÉL / MOT DE PASSE
       ====================================================== */

    #client-login input[type="text"],
    #client-login input[type="email"],
    #client-login input[type="password"],
    #client-login input[type="tel"],
    #client-login select {

        width: 100% !important;
        height: 42px !important;

        box-sizing: border-box !important;

        padding: 0 12px !important;

        background:
            linear-gradient(
                180deg,
                #071b3d 0%,
                #05142d 100%
            ) !important;

        border: 1px solid #b78c32 !important;
        border-radius: 10px !important;

        box-shadow:
            inset 0 1px 3px rgba(0,0,0,.35) !important;

        color: #fff8e8 !important;

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 14px !important;
    }


    #client-login input::placeholder {

        color: rgba(255,248,232,.55) !important;
        opacity: 1 !important;
    }


    #client-login input:focus,
    #client-login select:focus {

        border-color: #f0bf47 !important;

        outline: 0 !important;

        box-shadow:
            0 0 0 2px rgba(240,191,71,.12),
            inset 0 1px 3px rgba(0,0,0,.30) !important;
    }


    /* ======================================================
       9. CHECKBOXES PLUS PROPRES
       ====================================================== */

    #client-login input[type="checkbox"] {

        width: 17px !important;
        height: 17px !important;

        margin: 2px 7px 0 0 !important;

        accent-color: #135bcf !important;

        vertical-align: top !important;
    }


    #client-login .form-group {

        margin-bottom: 14px !important;
    }


    /* ======================================================
       10. TRADUIRE LE PRIVACY POLICY EN FRANÇAIS

       Le texte actuel :
       "I agree with Le Voyageur Mystique Privacy Policy"
       devient :
       "J’accepte la politique de confidentialité"
       ====================================================== */

    #client-login label:has(#sb_privacy_policy_link) {

        font-size: 0 !important;
    }


    #client-login label:has(#sb_privacy_policy_link)::after {

        content: "J’accepte la politique de confidentialité *";

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;

        color: #fff8e8 !important;
    }


    /* On garde le lien cliquable vers la politique
       mais sans afficher le texte anglais */
    #client-login #sb_privacy_policy_link {

        display: inline-block !important;

        width: 1px !important;
        height: 1px !important;

        overflow: hidden !important;

        font-size: 0 !important;

        opacity: 0 !important;
    }


    /* ======================================================
       11. LIEN RAPPEL MOT DE PASSE
       ====================================================== */

    #client-login a:not(.btn) {

        color: #f4c85d !important;
        text-decoration: none !important;
    }


    #client-login a:not(.btn):hover {

        color: #ffe39a !important;
    }


    /* ======================================================
       12. BOUTON
       "SE CONNECTER ET CONTINUER"
       ====================================================== */

    #client-login .button-wrapper,
    #client-login .btn-bar {

        width: 100% !important;

        margin: 16px 0 0 !important;
        padding: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }


    #client-login .button-wrapper .btn,
    #client-login .custom-form .btn:not(.btn--action),
    #client-login button[type="submit"] {

        width: 185px !important;
        min-height: 44px !important;

        margin: 0 auto !important;
        padding: 8px 14px !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                180deg,
                #1767df 0%,
                #0d51be 43%,
                #062d73 100%
            ) !important;

        border: 1.5px solid #e6b640 !important;
        border-radius: 24px !important;

        box-shadow:
            inset 0 1px 1px rgba(255,255,255,.28),
            0 0 8px rgba(230,182,64,.30) !important;

        color: #fff1c8 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;

        text-align: center !important;
        text-transform: uppercase !important;
        text-decoration: none !important;
    }


    /* ======================================================
       13. ENLEVER LES LIGNES BLANCHES / NOIRES PARASITES
       ====================================================== */

    #client-login hr,
    #client-login .separator,
    #client-login .client-login-bar + *,
    #client-login .social + * {

        border-color: rgba(229,179,60,.28) !important;
    }

}
/* ==========================================================
   MOBILE — PAGE CONNEXION / INSCRIPTION
   SimplyBook
   ========================================================== */

@media screen and (max-width: 600px) {

    /* ================================
       CADRE PRINCIPAL
       ================================ */

    #sb_booking_content #client-login {
        width: 100% !important;
        max-width: 100% !important;

        background: #061b4a !important;
        border: 1.5px solid #d9aa3c !important;
        border-radius: 18px !important;

        padding: 0 !important;
        margin: 0 auto 20px !important;

        box-shadow: none !important;
        overflow: hidden !important;
    }


    /* Enlever les fonds noirs / gris parasites */
    #client-login .client-login-bar,
    #client-login .social,
    #client-login .txt,
    #client-login .custom-form,
    #client-login .section-pd {
        background: transparent !important;
        box-shadow: none !important;
    }


    /* ================================
       TITRE
       ================================ */

    #client-login .title-main {
        background: linear-gradient(
            180deg,
            #155fcf 0%,
            #0a429d 55%,
            #062d73 100%
        ) !important;

        color: #f5d27a !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 20px !important;
        font-weight: 600 !important;
        line-height: 1.18 !important;

        text-align: center !important;
        text-transform: uppercase !important;

        padding: 16px 12px !important;
        margin: 0 !important;

        border: 0 !important;
        border-bottom: 1px solid rgba(217,170,60,.55) !important;
    }


    /* ================================
       TEXTE SOUS LE TITRE
       ================================ */

    #client-login .client-login-bar {
        padding: 16px 14px 12px !important;
        margin: 0 !important;
        border: 0 !important;
    }

    #client-login .social .txt {
        color: #fff8e8 !important;

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 15px !important;
        line-height: 1.25 !important;

        text-align: center !important;

        margin: 0 0 10px !important;
        padding: 0 !important;
    }


    /* ================================
       GOOGLE + FACEBOOK
       ================================ */

    #client-login .buttons.brand.v2,
    #client-login .btn-bar__social-links {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        gap: 14px !important;

        width: 100% !important;

        margin: 0 auto 14px !important;
        padding: 0 !important;

        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }


    #client-login .btn-bar__social-links > a {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 1.5px solid #d9aa3c !important;
        border-radius: 50% !important;

        background: linear-gradient(
            180deg,
            #155fcf 0%,
            #073c91 100%
        ) !important;

        box-shadow:
            inset 0 1px 1px rgba(255,255,255,.25),
            0 0 7px rgba(217,170,60,.25) !important;
    }


    /* Taille des SVG / icônes */
    #client-login .btn-bar__social-links > a svg,
    #client-login .btn-bar__social-links > a .icon {
        width: 23px !important;
        height: 23px !important;
        max-width: 23px !important;
        max-height: 23px !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* Cacher les textes GOOGLE / FACEBOOK sous les logos */
    #client-login .btn-bar__social-links .btn-txt {
        display: none !important;
    }


    /* ================================
       FORMULAIRE
       ================================ */

    #client-login .custom-form {
        padding: 14px 16px 16px !important;
        margin: 0 !important;
    }


    /* On resserre fortement chaque ligne */
    #client-login .form-group {
        margin-top: 0 !important;
        margin-bottom: 10px !important;
        padding: 0 !important;
    }


    #client-login .form-group label {
        display: block !important;

        color: #fff8e8 !important;

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;

        margin: 0 0 4px !important;
        padding: 0 !important;

        line-height: 1.15 !important;
    }


    /* Champs */
    #client-login input[type="text"],
    #client-login input[type="email"],
    #client-login input[type="password"],
    #client-login input[type="tel"] {
        width: 100% !important;
        height: 40px !important;

        box-sizing: border-box !important;

        margin: 0 !important;
        padding: 7px 12px !important;

        background: #061735 !important;

        border: 1px solid rgba(217,170,60,.75) !important;
        border-radius: 10px !important;

        color: #fff8e8 !important;

        font-size: 14px !important;

        box-shadow: inset 0 0 7px rgba(0,0,0,.25) !important;
    }


    /* ================================
       "SE SOUVENIR DE MOI"
       ================================ */

    #client-login .form-group.remember-me {
        margin: 4px 0 8px !important;
    }


    /* ================================
       RAPPEL DE MOT DE PASSE
       ================================ */

    #client-login .button-wrapper {
        width: 100% !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;

        gap: 10px !important;

        margin: 8px 0 12px !important;
        padding: 0 !important;
    }


    #client-login .remind-pass,
    #client-login .remind-pass.sb-client-remind-popup {
        display: block !important;

        width: auto !important;
        max-width: 100% !important;

        margin: 0 auto !important;
        padding: 0 !important;

        color: #f5d27a !important;

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;

        line-height: 1.2 !important;
        text-align: center !important;

        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;

        text-decoration: none !important;
    }


    /* ================================
       BOUTON SE CONNECTER
       ================================ */

    #client-login #sb_sign_in_btn,
    #client-login button.btn.custom {
        width: 175px !important;
        min-width: 175px !important;
        height: 42px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 auto !important;
        padding: 0 12px !important;

        background: linear-gradient(
            180deg,
            #1766df 0%,
            #0b4db4 50%,
            #052762 100%
        ) !important;

        border: 1.5px solid #e5b33c !important;
        border-radius: 22px !important;

        color: #fff4d6 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1 !important;

        text-align: center !important;
        text-transform: uppercase !important;

        box-shadow:
            inset 0 1px 1px rgba(255,255,255,.25),
            0 0 7px rgba(229,179,60,.25) !important;
    }


    /* ================================
       SUPPRIMER CADRES PARASITES
       ================================ */

    #client-login::before,
    #client-login::after,
    #client-login .client-login-bar::before,
    #client-login .client-login-bar::after,
    #client-login .social::before,
    #client-login .social::after,
    #client-login .custom-form::before,
    #client-login .custom-form::after,
    #client-login .section-pd::before,
    #client-login .section-pd::after,
    #client-login .button-wrapper::before,
    #client-login .button-wrapper::after {
        content: none !important;
        display: none !important;
    }

}
/* ==========================================================
   MOBILE — FINITIONS CONNEXION / INSCRIPTION
   CENTRAGE + ICONES SOCIALES
   ========================================================== */

@media screen and (max-width: 600px) {

    /* ======================================================
       1. CONTENU DU CADRE PARFAITEMENT CENTRÉ
       ====================================================== */

    #client-login .client-login-bar,
    #client-login .custom-form,
    #client-login .section-pd {
        width: 100% !important;
        box-sizing: border-box !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }


    /* ======================================================
       2. TITRES
       ====================================================== */

    #client-login .title-main,
    #client-login .custom-form h3,
    #client-login .custom-form h4 {
        width: 100% !important;
        box-sizing: border-box !important;
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }


    /* ======================================================
       3. GOOGLE + FACEBOOK
       ====================================================== */

    #client-login .buttons.brand.v2,
    #client-login .btn-bar__social-links {
        width: 100% !important;

        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;

        gap: 16px !important;

        margin: 8px auto 18px !important;
        padding: 0 !important;
    }


    /* Boutons ronds */
    #client-login .btn-bar__social-links > a {
        position: relative !important;

        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;

        padding: 0 !important;
        margin: 0 !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        overflow: hidden !important;

        border: 1.5px solid #e5b33c !important;
        border-radius: 50% !important;

        background: linear-gradient(
            180deg,
            #1766df 0%,
            #0b4eae 55%,
            #052763 100%
        ) !important;

        box-shadow:
            inset 0 1px 1px rgba(255,255,255,.28),
            0 0 7px rgba(229,179,60,.28) !important;
    }


    /* ENLEVER TOUS LES TEXTES PARASITES
       Google / Facebook */
    #client-login .btn-bar__social-links .btn-txt,
    #client-login .btn-bar__social-links > a > .btn-txt,
    #client-login .btn-bar__social-links > a > span:not(.icon),
    #client-login .buttons.brand.v2 .btn-txt {
        display: none !important;
        visibility: hidden !important;
        width: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
    }


    /* Icône elle-même */
    #client-login .btn-bar__social-links .icon {
        position: absolute !important;

        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;

        width: 25px !important;
        height: 25px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        background: transparent !important;
    }


    #client-login .btn-bar__social-links .icon svg {
        position: static !important;

        width: 24px !important;
        height: 24px !important;
        max-width: 24px !important;
        max-height: 24px !important;

        margin: 0 !important;
        padding: 0 !important;

        display: block !important;
    }


    /* ======================================================
       4. LABEL + CHAMP TOUJOURS ALIGNÉS AU CENTRE
       ====================================================== */

    #client-login .custom-form .form-group {
        width: 100% !important;
        max-width: 190px !important;

        margin-left: auto !important;
        margin-right: auto !important;
        margin-bottom: 10px !important;

        padding: 0 !important;
    }


    #client-login .custom-form .form-group > label {
        width: 100% !important;

        display: block !important;

        margin: 0 auto 5px !important;
        padding: 0 !important;

        text-align: center !important;
    }


    #client-login .custom-form input[type="text"],
    #client-login .custom-form input[type="email"],
    #client-login .custom-form input[type="password"],
    #client-login .custom-form input[type="tel"] {
        display: block !important;

        width: 100% !important;
        max-width: 190px !important;

        margin-left: auto !important;
        margin-right: auto !important;

        box-sizing: border-box !important;
    }


    /* ======================================================
       5. CASES À COCHER
       Plus larges et propres
       ====================================================== */

    #client-login #sb_terms_and_conditions,
    #client-login [id*="terms"],
    #client-login .form-group--terms-user,
    #client-login .form-group--terms-cancel {
        width: 100% !important;
        max-width: 210px !important;

        margin-left: auto !important;
        margin-right: auto !important;

        padding: 0 !important;
        box-sizing: border-box !important;
    }


    #client-login .form-group--terms-user label,
    #client-login .form-group--terms-cancel label,
    #client-login #sb_terms_and_conditions label {
        width: 100% !important;

        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;

        gap: 7px !important;

        margin: 0 0 8px !important;
        padding: 0 !important;

        text-align: left !important;

        font-size: 12px !important;
        line-height: 1.25 !important;
    }


    /* Checkbox elle-même */
    #client-login input[type="checkbox"] {
        flex: 0 0 15px !important;

        width: 15px !important;
        height: 15px !important;

        min-width: 15px !important;

        margin: 1px 0 0 !important;
        padding: 0 !important;
    }


    /* ======================================================
       6. RAPPEL MOT DE PASSE
       ====================================================== */

    #client-login .remind-pass,
    #client-login .sb-client-remind-popup {
        display: block !important;

        width: 100% !important;
        max-width: 190px !important;

        margin: 8px auto 14px !important;

        text-align: center !important;
        line-height: 1.2 !important;
    }


    /* ======================================================
       7. BOUTON CONNEXION / CONTINUER
       ====================================================== */

    #client-login .button-wrapper {
        width: 100% !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-direction: column !important;

        margin-left: auto !important;
        margin-right: auto !important;
    }


    #client-login #sb_sign_in_btn,
    #client-login .button-wrapper button,
    #client-login .button-wrapper .btn {
        position: static !important;
        transform: none !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 175px !important;
        min-width: 175px !important;
        max-width: 175px !important;

        margin-left: auto !important;
        margin-right: auto !important;

        text-align: center !important;
    }

}
/* ==========================================================
   MOBILE — DERNIÈRES FINITIONS
   Services + hamburger + commentaires
   ========================================================== */

@media screen and (max-width: 600px) {

    /* ======================================================
       1. SERVICES — REMPLACER LE FOND NOIR PAR BLEU NUIT
       ====================================================== */

    #sb_booking_content .service-item.item-v1,
    #sb_booking_content .service-item .tab,
    #sb_booking_content .service-item .tab-pd,
    #sb_booking_content .service-item .content {
        background: #071d4a !important;
    }

    #sb_booking_content .service-item .tab-pd {
        border-top: 0 !important;
    }


    /* ======================================================
       2. MENU HAMBURGER — ALIGNEMENT PARFAIT
       ====================================================== */

    #header #sb_menu,
    #header #sb_menu ul,
    #header #sb_menu_list_items_container {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #header #sb_menu li.menu-item {
        width: 100% !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        margin: 0 !important;
        padding: 0 !important;

        text-align: center !important;
    }

    #header #sb_menu li.menu-item > a,
    #header #sb_menu li.menu-item > a.popup-hide {
        width: 100% !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        margin: 0 !important;
        padding: 14px 10px !important;

        text-align: center !important;
        text-indent: 0 !important;
    }

    /* Boutique avait un décalage propre à son lien */
    #header #sb_menu a[href="#products"] {
        position: static !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        text-align: center !important;
    }


    /* ======================================================
       3. PAGE COMMENTAIRES — CONTENEUR PLUS COMPACT
       ====================================================== */

    #reviews-view .page-pd {
        padding: 12px 10px 20px !important;
    }

    #reviews-view .container-fluid,
    #reviews-view .row {
        margin: 0 !important;
        padding: 0 !important;
    }

    #reviews-view .col-sm-6 {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ======================================================
       4. BLOC "LAISSER UN COMMENTAIRE"
       BLEU + MOINS GRAND
       ====================================================== */

    #sb_reviews_add_container {
        width: calc(100% - 16px) !important;
        max-width: 300px !important;

        margin: 0 auto 18px !important;
        padding: 18px 12px !important;

        box-sizing: border-box !important;

        background:
            linear-gradient(
                180deg,
                #08265f 0%,
                #061b46 55%,
                #041331 100%
            ) !important;

        border: 1px solid #d8aa3d !important;
        border-radius: 16px !important;

        box-shadow:
            inset 0 0 18px rgba(31,94,190,.14),
            0 0 10px rgba(0,0,0,.22) !important;
    }


    /* ======================================================
       5. TITRE "LAISSER UN COMMENTAIRE"
       ====================================================== */

    #sb_reviews_add_container .title-main {
        width: 100% !important;

        margin: 0 auto 18px !important;
        padding: 0 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 24px !important;
        font-weight: 500 !important;
        line-height: 1.15 !important;

        letter-spacing: .4px !important;

        color: #f2d88d !important;

        text-align: center !important;

        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }


    /* ======================================================
       6. FORMULAIRE COMMENTAIRE — RESSERRER
       ====================================================== */

    #sb_reviews_add_container .add-review,
    #sb_reviews_add_container .form,
    #sb_reviews_add_container .form-group {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #sb_reviews_add_container .form-group {
        margin: 0 0 10px !important;
        padding: 0 !important;
    }


    /* Sujet */
    #sb_reviews_add_container #feedback__subject {
        display: block !important;

        width: 100% !important;
        max-width: 250px !important;
        height: 40px !important;

        margin: 0 auto 10px !important;
        padding: 6px 12px !important;

        box-sizing: border-box !important;

        background: #061a43 !important;

        border: 1px solid #d8aa3d !important;
        border-radius: 9px !important;

        color: #fff8e8 !important;

        font-size: 13px !important;
    }


    /* Message */
    #sb_reviews_add_container textarea {
        display: block !important;

        width: 100% !important;
        max-width: 250px !important;
        min-height: 105px !important;

        margin: 0 auto 12px !important;
        padding: 10px 12px !important;

        box-sizing: border-box !important;

        background: #061a43 !important;

        border: 1px solid #d8aa3d !important;
        border-radius: 9px !important;

        color: #fff8e8 !important;

        font-size: 13px !important;

        resize: vertical !important;
    }


    /* ======================================================
       7. "REVOIR TITRE"
       C'est le placeholder du champ sujet
       On le remplace visuellement par "Titre"
       ====================================================== */

    #sb_reviews_add_container #feedback__subject::placeholder {
        color: transparent !important;
    }

    #sb_reviews_add_container #feedback__subject {
        position: relative !important;
    }


    /* ======================================================
       8. ÉTOILES
       ====================================================== */

    #sb_reviews_add_container .stars-container {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        gap: 8px !important;

        width: 100% !important;

        margin: 12px auto !important;
        padding: 0 !important;
    }


    /* ======================================================
       9. TEXTE SOUS LES ÉTOILES
       ====================================================== */

    #sb_reviews_add_container .social-container,
    #sb_reviews_add_container .social-container * {
        text-align: center !important;
    }

    #sb_reviews_add_container .social-container {
        margin: 8px auto 0 !important;

        font-size: 12px !important;
        line-height: 1.25 !important;
    }


    /* ======================================================
       10. TITRE "COMMENTAIRES"
       ====================================================== */

    #sb_reviews_list_container .title-main {
        width: 100% !important;

        margin: 18px auto 14px !important;
        padding: 0 !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 25px !important;
        font-weight: 500 !important;
        line-height: 1.1 !important;

        letter-spacing: .5px !important;

        color: #f2d88d !important;

        text-align: center !important;

        white-space: normal !important;
        word-break: normal !important;
    }


    /* ======================================================
       11. ENLEVER LES GROS ESPACES INUTILES
       ====================================================== */

    #reviews-view .section-divider {
        margin: 12px 0 !important;
    }

    #reviews-view .title-main {
        min-height: 0 !important;
    }

    #reviews-view #sb_reviews_add_container > div,
    #reviews-view #sb_reviews_list_container > div {
        min-height: 0 !important;
    }

}
/* ==========================================================
   MOBILE — PAGE COMMENTAIRES PROPRE
   ========================================================== */

@media screen and (max-width: 600px) {

    /* ===== GRAND CONTENEUR ===== */

    #reviews-view .page-pd,
    #reviews-view .container-fluid,
    #reviews-view .row,
    #reviews-view .col-sm-6,
    #reviews-view #sb_reviews_add_container {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }


    /* ===== UN SEUL CADRE PRINCIPAL ===== */

    #reviews-view #sb_reviews_add_container .add-review {
        background:
            linear-gradient(
                180deg,
                #082861 0%,
                #061f50 55%,
                #04183d 100%
            ) !important;

        border: 1px solid #d8aa3d !important;
        border-radius: 16px !important;

        box-shadow: none !important;

        padding: 16px 14px !important;
        margin: 0 auto 18px !important;

        width: 100% !important;
        box-sizing: border-box !important;
    }


    /* ===== ENLEVER TOUS LES CADRES INTERIEURS ===== */

    #reviews-view #sb_reviews_add_container .form,
    #reviews-view #sb_reviews_add_container .form-group,
    #reviews-view #sb_reviews_add_container .form-row,
    #reviews-view #sb_reviews_add_container .avatar,
    #reviews-view #sb_reviews_add_container .stars-container,
    #reviews-view #sb_reviews_add_container .social-container {
        background: transparent !important;

        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
    }


    /* ===== TITRE ===== */

    #reviews-view #sb_reviews_add_container .title-main {
        font-family: Cinzel, Georgia, serif !important;

        font-size: 21px !important;
        line-height: 1.15 !important;

        color: #f2d88d !important;

        text-align: center !important;

        margin: 0 0 16px !important;
        padding: 0 !important;
    }


    /* ===== AVATAR ===== */

    #reviews-view #sb_reviews_add_container .avatar {
        margin: 0 auto 16px !important;
        text-align: center !important;
    }


    /* ===== CHAMPS ===== */

    #reviews-view #feedback__subject,
    #reviews-view textarea {
        width: 100% !important;

        background: #061a43 !important;

        border: 1px solid #d8aa3d !important;
        border-radius: 8px !important;

        box-shadow: none !important;
        outline: none !important;

        color: #fff8e8 !important;

        font-family: "Cormorant Garamond", Georgia, serif !important;
        font-size: 14px !important;

        box-sizing: border-box !important;
    }


    #reviews-view #feedback__subject {
        height: 40px !important;
        margin: 0 0 10px !important;
        padding: 7px 12px !important;
    }


    #reviews-view textarea {
        min-height: 95px !important;
        margin: 0 0 14px !important;
        padding: 10px 12px !important;
    }


    /* ===== ETOILES ===== */

    #reviews-view .stars-container {
        margin: 10px auto 12px !important;
        text-align: center !important;
    }


    /* ===== TEXTE CONNEXION ===== */

    #reviews-view .social-container {
        text-align: center !important;
        margin: 8px auto 0 !important;
    }

    #reviews-view .social-container .cap {
        margin: 0 auto 10px !important;
        line-height: 1.15 !important;
        text-align: center !important;
    }


    /* ===== BOUTON EMAIL ===== */

    #reviews-view a[href*="client/sign-in"] {
        width: 220px !important;
        min-height: 40px !important;

        margin: 12px auto 0 !important;
        padding: 0 12px !important;

        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        background:
            linear-gradient(
                180deg,
                #1766df 0%,
                #0d52c3 42%,
                #07398f 72%,
                #041d52 100%
            ) !important;

        border: 1.5px solid #e6b847 !important;
        border-radius: 22px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.28),
            0 0 7px rgba(230,184,71,.28) !important;

        box-sizing: border-box !important;
    }


    /* cacher le texte anglais */
    #reviews-view a[href*="client/sign-in"] .btn--txt {
        font-size: 0 !important;
    }


    /* mettre le texte français */
    #reviews-view a[href*="client/sign-in"] .btn--txt::after {
        content: "SE CONNECTER AVEC SON EMAIL" !important;

        font-family: Cinzel, Georgia, serif !important;
        font-size: 12px !important;
        font-weight: 600 !important;

        color: #fff3ce !important;

        white-space: nowrap !important;
    }


    /* ===== SUPPRIMER PSEUDO-CADRES ===== */

    #reviews-view #sb_reviews_add_container::before,
    #reviews-view #sb_reviews_add_container::after,
    #reviews-view .add-review::before,
    #reviews-view .add-review::after,
    #reviews-view .form::before,
    #reviews-view .form::after {
        content: none !important;
        display: none !important;
    }

}
@media screen and (max-width: 600px) {

    /* MENU OUVERT DU HAMBURGER — CENTRÉ */
    #header .nav-wrapper.active,
    #header .nav-wrapper.clearfix.active {
        position: absolute !important;

        left: 50% !important;
        right: auto !important;

        transform: translateX(-50%) !important;

        width: calc(100% - 28px) !important;
        max-width: 360px !important;

        margin: 0 !important;
    }

    /* CONTENU INTERIEUR DU MENU */
    #header #sb_menu {
        width: 100% !important;
        margin: 0 auto !important;
        padding: 10px 0 !important;
        box-sizing: border-box !important;
    }

    #header #sb_menu_list_items_container {
        width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    /* ALIGNEMENT IDENTIQUE DES 3 LIGNES */
    #header #sb_menu_list_items_container .menu-item {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: center !important;
    }

    #header #sb_menu_list_items_container .menu-item > a {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

        margin: 0 !important;
        padding: 12px 10px !important;

        box-sizing: border-box !important;
        text-align: center !important;
    }
}
/* ===== TEXTE DES CHAMPS COMMENTAIRE ===== */

#reviews-view #feedback__subject {
    color: #fff8e8 !important;
}

#reviews-view #feedback__subject::placeholder {
    color: #fff8e8 !important;
    opacity: 1 !important;
}

#reviews-view textarea::placeholder {
    color: #fff8e8 !important;
    opacity: 1 !important;
}
/* ==========================================================
   DESKTOP UNIQUEMENT — RECENTRAGE VERTICAL DU HEADER
   ========================================================== */

@media screen and (min-width: 769px) {

    /* ligne principale du header */
    #header .container-fluid > .row {
        display: flex !important;
        align-items: center !important;
    }

    /* zone contenant navigation + icônes */
    #header .header-controls {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }

    /* navigation */
    #header .nav-wrapper {
        display: flex !important;
        align-items: center !important;
    }

    #header #sb_menu {
        display: flex !important;
        align-items: center !important;
    }

    #header #sb_menu_list_items_container {
        display: flex !important;
        align-items: center !important;
        margin: 0 !important;
    }

    /* enlève le décalage vertical des éléments */
    #header .menu-item,
    #header .menu-item > a,
    #header .header-controls > * {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
}