/* ============================================================
   LEWA.CI — styles.css  |  Bootstrap 5 + utils.css compatible
   Auteur : Valère Damahou  |  v1.0
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Parkinsans:wght@300..800&display=swap');

/* ---- VARIABLES ---- */
:root {
  --lw-primary:       #fa454a;
  --lw-primary-hov:   #e03a3f;
  --lw-primary-soft:  #feefef;
  --lw-dark:          #13131c;
  --lw-white:         #f2fafc; /* body bg color */
  --lw-success:       #28a745;
  --lw-muted:         #6c6f75;
  --lw-ink-3:        #8a9099;
  --lw-line:         #e7ecef;
  --lw-nav-h:         62px;
  --lw-bnav-h:        64px;
  --lw-font: 'Parkinsans', system-ui, sans-serif;
  --lw-shadow: 0 1px 2px rgba(19,19,28,.05), 0 6px 20px -12px rgba(19,19,28,.14);
}

/* ---- GLOBAL ---- */
*, *::before, *::after { box-sizing: border-box; }
body {
  font-family: var(--lw-font);
  background: var(--lw-white);
  color: var(--lw-dark);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  accent-color: #fa454a;
  scroll-behavior: smooth;
}
::selection{
  background-color: #ffe2e3;
  color: #7c181b;
}
a { text-decoration: none; color: var(--lw-primary);}
img { display: block; max-width: 100%; }

/* Bootstrap primary overrides */
.text-primary  { color: var(--lw-primary) !important; }
.bg-primary    { background-color: var(--lw-primary) !important; }
.border-primary{ border-color: var(--lw-primary) !important; }
.btn-primary   { background: var(--lw-primary) !important; border-color: var(--lw-primary) !important; font-family: var(--lw-font); font-weight: 700; border-radius: 10px; }
.btn-primary:hover { background: var(--lw-primary-hov) !important; border-color: var(--lw-primary-hov) !important; }
.btn-outline-primary { color: var(--lw-primary) !important; border-color: var(--lw-primary) !important; font-family: var(--lw-font); font-weight: 700; border-radius: 10px; }
.btn-outline-primary:hover { background: var(--lw-primary) !important; color: white !important; }

/* ---- PAGE WRAPPER ---- */
.page-wrap {
  padding-top: calc(var(--lw-nav-h) + 10px);
  padding-bottom: calc(var(--lw-bnav-h) + 16px);
  min-height: 100vh;
}
@media (min-width: 992px) { .page-wrap { padding-bottom: 40px; } }

/* ============================================================
   NAVBAR
   ============================================================ */
#lw-navbar .lw-nav {
  height: var(--lw-nav-h);
  background: rgba(242,250,252,.96);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(0,0,0,.05);
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
}
.lw-logo {
  font-weight: 800; font-size: 1.35rem;
  color: var(--lw-dark); text-decoration: none;
  letter-spacing: -.04em; flex-shrink: 0;
  font-family: var(--lw-font);
}
.lw-logo img{
  width: 150px;
  max-width: 100%;
}

@media screen and (max-width: 885px){
  .lw-logo img{
  width: 120px; 
}
}

.nav-search-compact {
  display: flex; align-items: center;
  background: white; border: 1.5px solid #e5e7eb;
  border-radius: 30px; padding: 7px 7px 7px 14px;
  gap: 10px; cursor: pointer; transition: box-shadow .2s;
  flex: 1; max-width: 400px;
}
.nav-search-compact:hover { box-shadow: 0 2px 14px rgba(0,0,0,.1); border-color: #d1d5db; }
.nav-search-compact span { font-size: .82rem; color: var(--lw-muted); flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-search-compact-input {
  border: none; outline: none; background: transparent; flex: 1; min-width: 0;
  font-family: var(--lw-font); font-size: .82rem; color: var(--lw-dark); padding: 0;
}
.nav-search-compact-input::placeholder { color: var(--lw-muted); }
.nav-search-compact .search-icon-wrap {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--lw-primary); display: flex;
  align-items: center; justify-content: center;
  flex-shrink: 0; color: white; font-size: .75rem; padding: 0; cursor: pointer;
}

/* Suggestions "recherches recentes" sous la barre de recherche compacte */
.nav-search-suggest {
  display: none; position: absolute; top: calc(100% + 6px); left: 0; right: 0;
  background: white; border: 1px solid #e5e7eb; border-radius: 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.1); padding: 8px; z-index: 1050;
}
.nav-search-suggest.show { display: block; }
.nav-search-suggest-label {
  font-size: .72rem; font-weight: 700; color: var(--lw-muted);
  text-transform: uppercase; letter-spacing: .03em; padding: 4px 10px 6px;
}
.nav-search-suggest-item {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px;
  font-size: .82rem; color: var(--lw-dark); text-decoration: none; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
.nav-search-suggest-item i { color: var(--lw-muted); font-size: .78rem; }
.nav-search-suggest-item:hover { background: var(--lw-primary-soft); color: var(--lw-primary); }

.nav-icon-btn {
  width: 38px; height: 38px; border-radius: 50%;
  border: none; background: #ffffff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: var(--lw-dark); transition: background .15s;
  position: relative; flex-shrink: 0;
}
.nav-icon-btn:hover { background: #eeeded; }
.nav-notif-dot {
  position: absolute; top: 5px; right: 5px;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--lw-primary); border: 1.5px solid var(--lw-white);
}

/* Dropdown notifications (navbar site) */
.lw-notif-menu { max-height: 420px; overflow-y: auto; }
.lw-notif-item { position: relative; white-space: normal; }
.lw-notif-item.unread { background: var(--lw-primary-soft); }
.lw-notif-ico {
  width: 35px; height: 35px; border-radius: 10px; background: #feefef; color: var(--lw-primary);
  display: flex; align-items: center; justify-content: center; font-size: .85rem;
}
.lw-notif-title { font-size: .82rem; font-weight: 600; color: #13131c; line-height: 1.3; }
.lw-notif-body { font-size: .75rem; color: #6b7280; line-height: 1.35; margin-top: 1px; }
.lw-notif-time { font-size: .7rem; color: var(--lw-muted); margin-top: 2px; }
.lw-notif-unread-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--lw-primary);
  flex-shrink: 0; align-self: center;
}
.nav-user-btn {
  display: flex; align-items: center; gap: 8px;
  background: white; border: 1.5px solid #e5e7eb;
  border-radius: 30px; padding: 5px 14px 5px 8px;
  cursor: pointer; transition: all .15s; flex-shrink: 0;
}
.nav-user-btn:hover { box-shadow: 0 2px 10px rgba(0,0,0,.1); }
.nav-user-btn .nav-avatar {
  width: 28px; height: 28px; border-radius: 50%;
  object-fit: cover;
}
@media screen and (max-width: 885px) {
 .dropdown-menu.lw-notif-menu.show{
  min-width: 283px !important;
  position: absolute;
  inset: 37px 0px auto auto !important;
  margin: 0px auto; 
}
}

/* ============================================================
   HERO (conteneur arrondi dans .container)
   ============================================================ */
.lw-hero {
  border-radius: 20px; overflow: hidden;
  position: relative; min-height: 420px;
  display: flex; align-items: flex-end;
  background: var(--lw-dark);
}
@media (max-width: 767px) { .lw-hero { min-height: 375px; border-radius: 16px; }}

.lw-hero-bg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
}
.lw-hero-ov {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to top, rgba(19,19,28,.82) 0%, rgba(19, 19, 28, 0.351) 67%, rgba(0,0,0,.05) 100%);
}
.lw-hero-body { position: relative; z-index: 2; padding: 2rem; width: 100%; }
@media (max-width: 767px) {.lw-hero-body {padding: 1.3rem;}}
/* Stats strip on hero */
.hero-stat { color: white; text-align: right; }
.hero-stat .val { font-size: 1.5rem; font-weight: 800; line-height: 1; }
.hero-stat .lab { font-size: .72rem; opacity: .75; margin-top: 2px; }

/* ---- SEARCH PILL ---- */
.lw-spill {
  background: white; border-radius: 14px; padding: 8px;
  display: flex; align-items: center; gap: 4px;
  box-shadow: 0 8px 40px rgba(0,0,0,.2);
}
.lw-spill-f {
  flex: 1; padding: 4px 12px; border: none; outline: none;
  background: transparent; font-family: var(--lw-font);
  cursor: pointer; min-width: 0;
}
.lw-spill-f .fl { font-weight: 700; font-size: .72rem; color: var(--lw-dark); display: block; line-height: 1.3; }
.lw-spill-f .fv { font-size: .8rem; color: var(--lw-muted); }
.lw-spill-sep { width: 1px; height: 28px; background: #e5e7eb; flex-shrink: 0; }
.lw-spill-btn {
  width: 44px; height: 44px; border-radius: 11px; border: none;
  background: var(--lw-primary); color: white; font-size: 1rem;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0; transition: background .15s, transform .1s;
}
.lw-spill-btn:hover { background: var(--lw-primary-hov); }
.lw-spill-btn:active { transform: scale(.95); }

.lw-spill-input-field {
  border: none; outline: none; background: transparent; width: 100%;
  padding: 0; font-family: var(--lw-font); font-size: .8rem; color: var(--lw-dark);
}
.lw-spill-input-field::placeholder { color: var(--lw-muted); }
.lw-spill-dd-toggle {
  border: none; outline: none; background: transparent; width: 100%;
  padding: 0; margin: 0; text-align: left; cursor: pointer; display: block;
}
.lw-city-dd-menu { max-height: 260px; overflow-y: auto; min-width: 220px; }
.lw-city-dd-menu .dropdown-item.active,
.lw-city-dd-menu .dropdown-item:active { background: var(--lw-primary); color: white; }

@media (max-width: 767px) {
  .lw-spill { border-radius: 12px; flex-wrap: wrap; gap: 6px; padding: 10px; }
  .lw-spill-f { flex: 1 1 calc(50% - 6px); background: #f7f8fa; border-radius: 8px; padding: 8px 12px; }
  .lw-spill-sep { display: none; }
  .lw-spill-btn { flex: 0 0 100%; width: 100%; border-radius: 10px; height: 42px; }
  .lw-spill-input-field {
  font-size: .92rem; 
  min-height: 33px;
}
}

/* ============================================================
   CATEGORY TABS
   ============================================================ */
.lw-cats {
  display: flex; gap: 8px;
  overflow-x: auto; scrollbar-width: none; padding: 4px 0;
}
.lw-cats::-webkit-scrollbar { display: none; }
.lw-cat {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 8px 16px; border-radius: 12px; border: 1.5px solid #e5e7eb;
  background: white; color: #6b7280; font-size: .74rem; font-weight: 600;
  white-space: nowrap; cursor: pointer; transition: all .18s;
  font-family: var(--lw-font); text-decoration: none;
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
}
.lw-cat i, .lw-cat svg { font-size: 1.1rem; }
.lw-cat-img { width: 22px; height: 22px; object-fit: contain; border-radius: 6px; }
.lw-cat:hover, .lw-cat.active {
  border-color: var(--lw-primary);
  color: var(--lw-primary);
  background: var(--lw-primary-soft);
}

/* ============================================================
   AD CARD
   ============================================================ */
.ad-card { cursor: pointer; }

.ad-img-wrap {
  border-radius: 14px; overflow: hidden;
  aspect-ratio: 4/3; background: #e5e7eb;
  position: relative; margin-bottom: .72rem;
}
.ad-img-wrap img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .45s ease;
}
.ad-card:hover .ad-img-wrap img { transform: scale(1.06); }

/* Overlay badge + fav */
.ad-badge { position: absolute; top: 9px; left: 3px; z-index: 3; }
.ad-fav-btn {
  position: absolute; top: 9px; right: 9px; z-index: 5;
  width: 29px; height: 29px; border-radius: 50%;
  background: rgba(255,255,255,.88); border: none;
  display: flex; align-items: center; justify-content: center;
  color: var(--lw-muted); font-size: .9rem; cursor: pointer;
  transition: all .18s; backdrop-filter: blur(6px);
}
.ad-fav-btn:hover, .ad-fav-btn.liked { color: var(--lw-primary); }
.ad-fav-btn.liked { background: white; }

/* Carousel dots */
.ad-dots {
  position: absolute; bottom: 9px; left: 50%; transform: translateX(-50%);
  z-index: 3; display: flex; gap: 4px; align-items: center;
}
.ad-dots .d {
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(255,255,255,.55); transition: all .22s;
}
.ad-dots .d.a { width: 14px; border-radius: 3px; background: white; }

/* Nav arrows (show on hover) */
.ad-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 4;
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(255,255,255,.9); border: none;
  display: flex; align-items: center; justify-content: center;
  font-size: .7rem; color: var(--lw-dark); cursor: pointer;
  opacity: 0; transition: opacity .2s; backdrop-filter: blur(4px);
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
}
.ad-nav.prev { left: 8px; }
.ad-nav.next { right: 8px; }
.ad-card:hover .ad-nav { opacity: 1; }

/* Rating overlay */
.ad-rating {
  position: absolute; bottom: 9px; left: 9px; z-index: 3;
  background: rgba(19,19,28,.72); backdrop-filter: blur(6px);
  color: white; font-size: .72rem; font-weight: 700;
  padding: 3px 8px; border-radius: 7px;
  display: flex; align-items: center; gap: 3px;
}

/* Info */
.ad-title {
  font-weight: 500; font-size: .87rem; color: var(--lw-dark);
  line-height: 1.3; margin-bottom: 3px;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
@media screen and (max-width: 885px){
.ad-title {
  font-weight: 500; font-size: .8rem;  
}
}
.ad-loc {
  font-size: .75rem; color: #6b7280;
  display: flex; align-items: center; gap: 3px; margin-bottom: 4px;
}
.ad-price { font-weight: 600; font-size: .75rem; color: var(--lw-dark); }
.ad-price .per { font-weight: 400; font-size: .73rem; color: var(--lw-muted); }

/* VIP badge */
.badge-vip {
  display: inline-flex; align-items: center; gap: 3px;
  background: linear-gradient(135deg, #f59e0b, #f97316);
  color: white; font-size: .66rem; font-weight: 700;
  padding: 3px 8px; border-radius: 6px; letter-spacing: .03em;
}
.badge-cat {
  display: inline-flex; align-items: center;
  background: rgba(19,19,28,.7); backdrop-filter: blur(6px);
  color: white; font-size: .66rem; font-weight: 600;
  padding: 3px 9px; border-radius: 6px;
}

/* Indisponibilité (occupation / maintenance — Brief.md §3) */
.badge-unavailable {
  display: inline-flex; align-items: center; gap: 3px;
  background: #dc2626; color: white; font-size: .66rem; font-weight: 700;
  padding: 3px 8px; border-radius: 6px; letter-spacing: .03em;
}
.ad-card.ad-card--unavailable { opacity: .55; }
.ad-card.ad-card--unavailable .ad-fav-btn { opacity: 1; }
.status-badge--unavailable {
  background: rgba(220, 38, 38, .1); color: #dc2626;
  font-size: .7rem; font-weight: 700; padding: 3px 9px; border-radius: 6px;
}

/* ======================
   SECTION HEADER
   ====================== */
.sec-hd { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 1rem; }
.sec-title { font-size: 1.3rem; font-weight: 600; color: var(--lw-dark); margin: 0; letter-spacing: -.01em; }
.sec-sub { font-size: 1rem; color: #6e747c; margin: 2px 0 0; }
.sec-more { font-size: .78rem; font-weight: 700; color: var(--lw-primary); text-decoration: none; white-space: nowrap; }
.sec-more:hover { text-decoration: underline; }
@media screen and (max-width: 885px){
  .sec-title { font-size: 1rem;}
}
/* ============================================================
   HORIZONTAL SCROLL ROW (carousel sections)
   Cartes visibles : ~2 mobile, ~4 large ecran (>=992px), ~5 tres large (>=1200px)
   ============================================================ */
.lw-row-carousel { position: relative; }
.lw-hrow {
  display: flex; gap: 12px;
  overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; padding-bottom: 4px;
  cursor: grab;
}
.lw-hrow:active { cursor: grabbing; }
.lw-hrow::-webkit-scrollbar { display: none; }
.lw-hrow > .ad-card { flex: 0 0 calc(50% - 6px); max-width: 220px; scroll-snap-align: start; }
@media (min-width: 576px)  { .lw-hrow > .ad-card { flex: 0 0 calc(42% - 8px); max-width: 240px; } }
@media (min-width: 992px)  { .lw-hrow > .ad-card { flex: 0 0 calc(25% - 9px); max-width: 260px; } }
@media (min-width: 1200px) { .lw-hrow > .ad-card { flex: 0 0 calc(20% - 10px); max-width: 280px; } }

.row-car-nav { display: none; }
@media (min-width: 768px) { .row-car-nav { display: flex; } }

.ad-card-more {
  flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  border: 1.5px dashed #d1d5db; border-radius: 14px; aspect-ratio: 4/3;
  text-decoration: none; color: var(--lw-dark); transition: all .18s;
}
.ad-card-more:hover { border-color: var(--lw-primary); color: var(--lw-primary); background: var(--lw-primary-soft); }
.ad-card-more-inner { text-align: center; }
.ad-card-more-inner i { font-size: 1.3rem; display: block; margin-bottom: 6px; }
.ad-card-more-inner span { font-size: .8rem; font-weight: 700; }

/* Carte "Tout afficher" en fin de carousel commune : mosaïque des 3 premières photos */
.ad-card-showall { text-decoration: none; color: var(--lw-dark); display: block; }
.ad-card-showall .showall-grid {
  position: relative; aspect-ratio: 4/3; border-radius: 14px; overflow: hidden;
  background: #e5e7eb; box-shadow: 0 4px 16px rgba(0,0,0,.1);
  display: grid; grid-template-columns: 1.5fr 1fr; grid-template-rows: 1fr 1fr; gap: 3px;
}
.ad-card-showall .showall-cell { background-size: cover; background-position: center; background-color: #dfe3e8; }
.ad-card-showall .showall-cell:first-child { grid-row: 1 / 3; }
.ad-card-showall .showall-cell:only-child { grid-column: 1 / 3; }
.ad-card-showall .showall-badge {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: rgba(19,19,28,.28); color: #fff; font-size: 1.4rem; transition: background .18s;
}
.ad-card-showall:hover .showall-badge { background: rgba(19,19,28,.45); }
.ad-card-showall .showall-label {
  margin: .6rem 0 0; text-align: center; font-size: .82rem; font-weight: 500; color: var(--lw-dark);
}
.ad-card-showall:hover .showall-label { color: var(--lw-primary); }

/* =========================================== 
   LIRE PLUS / MOINS (description fiche bien)
   =========================================== */
.lw-desc-clamp {
  display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical;
  overflow: hidden; white-space: pre-line;
}
.lw-desc-clamp.lw-desc-expanded {
  display: block; -webkit-line-clamp: unset; overflow: visible;
}

/* =============== 
   CITY CARD
   =============== */
.city-card {
  border-radius: 14px; overflow: hidden;
  aspect-ratio: 4/3; position: relative;
  cursor: pointer; display: block;
}
.city-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s; }
.city-card:hover img { transform: scale(1.07); }
.city-card-ph {
  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #dfe7ee 0%, #c8d4de 100%); color: #94a3b8; font-size: 1.6rem;
}
.city-ov {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(19,19,28,.72) 0%, transparent 55%);
}
.city-info { position: absolute; bottom: 10px; left: 12px; color: white; }
.city-name { font-weight: 700; font-size: .88rem; margin: 0; }
.city-count { font-size: .72rem; opacity: .85; }

/* =================
   HOW IT WORKS
   ================= */
.hiw-card {
  text-align: center; padding: 1.6rem 1rem;
  background: white; border-radius: 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.hiw-icon {
  width: 54px; height: 54px; border-radius: 16px;
  background: var(--lw-primary-soft); color: var(--lw-primary);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.3rem; margin: 0 auto 1rem;
}
.hiw-num {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--lw-primary); color: white;
  font-size: .7rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  position: absolute; top: -8px; right: -8px;
}

/* ============== 
   CTA BOX
   ============== */
.lw-cta-box {
  border-radius: 20px; overflow: hidden;
  position: relative; padding: 3rem 2rem;
  background: var(--lw-dark); color: white;
  text-align: center;
  z-index: 1;
}
.lw-cta-box::after {
  content: ''; position: absolute; inset: 0;
  z-index: 1;
  background: linear-gradient(to top, #161515 0%, #010101 86%);
}
.lw-cta-body { position: relative; z-index: 10}

/* ============= 
   BUTTONS
   ============= */
.btn-lw {
  display: inline-flex; align-items: center; gap: .4rem;
  font-weight: 700; font-family: var(--lw-font); font-size: .88rem;
  border: none; cursor: pointer; text-decoration: none;
  border-radius: 10px; padding: .62rem 1.3rem;
  transition: all .15s; line-height: 1.4; white-space: nowrap;
}
.btn-lw {
  background: var(--lw-primary); color: #fff; border: none;
}
.btn-lw:hover, .btn-lw:focus { background: var(--lw-primary-hov); color: #fff; }
.btn-lw-soft { background: var(--lw-primary-soft); color: var(--lw-primary); border: none; }
.btn-lw-soft:hover { background: #fde0e1; color: var(--lw-primary-hov); }
.btn-lw:active { transform: scale(.97); }
.btn-lw:disabled, .btn-lw.disabled,
.btn:disabled, .btn.disabled,
button:disabled, input[type="submit"]:disabled {
  opacity: .55; cursor: not-allowed; pointer-events: none;
  transform: none !important;
}
.btn-lw-primary { background: var(--lw-primary); color: white; }
.btn-lw-primary:hover { background: var(--lw-primary-hov); color: white; }
.btn-lw-outline { background: transparent; color: var(--lw-primary); border: 1.5px solid var(--lw-primary); padding: .58rem 1.25rem; }
.btn-lw-outline:hover { background: var(--lw-primary-soft); color: var(--lw-primary); }
.btn-lw-ghost { background: #e1e3e7; color: var(--lw-dark); }
.btn-lw-ghost:hover { background: #e9eef7; color: var(--lw-dark); }
.btn-lw-dark { background: var(--lw-dark); color: white; }
.btn-lw-dark:hover { background: #1e1e2e; color: white; }
.btn-lw-pill { border-radius: 30px !important; }
.btn-lw-lg { padding: .75rem 2rem; font-size: .95rem; }
.btn-lw-sm { padding: .36rem .9rem; font-size: .77rem; border-radius: 8px !important; }

.btn-publish{background-color: var(--lw-primary); color: white}
.btn-publish:hover { background: var(--lw-primary-hov);}

.btn-circ {
  width: 33px; height: 33px; border-radius: 50%;
  border: 1.5px solid #e5e7eb; background: white;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all .15s; color: #7e7e7e;
  font-size: .75rem; flex-shrink: 0;
}
.btn-circ:hover { border-color: var(--lw-primary); color: var(--lw-primary); background: var(--lw-primary-soft); }
.btn-circ.active { border-color: var(--lw-primary); background: var(--lw-primary); color: white; }

/* WhatsApp button */
.btn-wa { background: #25d366; color: white; border-radius: 10px; }
.btn-wa:hover { background: #20bc5c; color: white; }

/* ============== 
   FORMS
  =============== */
.lw-ctrl,.form-control, .form-select {
  display: block; width: 100%;
  border: 1.5px solid #e5e7eb; border-radius: 10px;
  padding: .65rem 1rem; font-family: var(--lw-font); font-size: .88rem;
  color: var(--lw-dark); outline: none;
  transition: border-color .15s, box-shadow .15s;
  line-height: 1.4;
}
.lw-ctrl:not(:disabled),.form-control:not(:disabled), .form-select:not(:disabled) { 
  border: 1.5px solid #e5e7eb; 
  color: var(--lw-dark); background: white;  
}
.input-group > input{
  width:  85%
}

.lw-ctrl:focus,.form-control:focus,.form-select:focus { border-color: var(--lw-primary); box-shadow: 0 0 0 3px rgba(250,69,74,.1); }
.lw-label { font-weight: 600; font-size: .8rem; color: #374151; margin-bottom: 5px; display: block; }
.lw-ctrl-icon { position: relative; }
.lw-ctrl-icon .icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--lw-muted); font-size: .9rem; pointer-events: none; }
.lw-ctrl-icon .lw-ctrl { padding-left: 36px; }

/* ============================================================
   BOTTOM NAVIGATION (mobile)
   ============================================================ */
#lw-bottom-nav .bnav {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 1040;
  height: var(--lw-bnav-h);
  background: rgba(255,255,255,.97);
  backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
  border-top: 1px solid rgba(0,0,0,.07);
  display: flex; align-items: center;
  box-shadow: 0 -2px 20px rgba(0,0,0,.05);
  padding: 0 6px;
}
.bnav-item {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px;
  text-decoration: none; color: var(--lw-muted); font-size: .59rem; font-weight: 600;
  padding: 6px 2px; border-radius: 10px; transition: color .18s;
  font-family: var(--lw-font);
}
.bnav-item i { font-size: 1.15rem; transition: transform .18s; }
.bnav-item:hover, .bnav-item.active { color: var(--lw-primary); }
.bnav-item.active i { transform: scale(1.12); }
.bnav-center { flex: 1; display: flex; justify-content: center; }
.bnav-cta {
  width: 52px; height: 52px; border-radius: 16px;
  background: var(--lw-primary); color: white;
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 2px; text-decoration: none;
  font-size: .54rem; font-weight: 700;
  box-shadow: 0 4px 16px rgba(250,69,74,.38);
}
.bnav-cta i { font-size: 1.25rem; }
@media (min-width: 992px) { #lw-bottom-nav { display: none !important; } }

/* ============================================================
   FILTER BAR (listings)
   ============================================================ */
.lw-filter-bar {
  position: sticky; top: var(--lw-nav-h); z-index: 90;
  background: rgba(242,250,252,.96); backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(0,0,0,.05);
  padding: 10px 0;
}

.filter-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 14px; border-radius: 20px; font-size: .8rem; font-weight: 600;
  border: 1.5px solid #e5e7eb; background: white; cursor: pointer;
  transition: all .15s; white-space: nowrap; font-family: var(--lw-font);
  color: var(--lw-dark);
}
.filter-chip:hover, .filter-chip.active {
  border-color: var(--lw-primary); color: var(--lw-primary); background: var(--lw-primary-soft);
}
.filter-chip-img { width: 16px; height: 16px; object-fit: contain; border-radius: 4px; }
.filter-chip-scroll { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.filter-chip-scroll::-webkit-scrollbar { display: none; }

/* ============================================================
   CAT-OPTION — chips de sélection (type de logement, étape 1 pub)
   Grid + indicateur radio-check, plus lisible que .filter-chip seul.
   ============================================================ */
.cat-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;
}
.cat-option {
  position: relative; display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; border-radius: 14px; border: 1.5px solid #e5e7eb;
  background: white; cursor: pointer; transition: all .15s; margin-bottom: 0;
}
.cat-option:hover { border-color: var(--lw-primary); }
.cat-option.active { border-color: var(--lw-primary); background: var(--lw-primary-soft); }
.cat-option-icon {
  width: 38px; height: 38px; flex-shrink: 0; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: #f3f4f6; color: #6b7280; font-size: 1rem; transition: all .15s;
}
.cat-option.active .cat-option-icon { background: var(--lw-primary); color: white; }
.cat-option-label { font-size: .84rem; font-weight: 600; color: var(--lw-dark); flex-grow: 1; }
.cat-option.active .cat-option-label { color: var(--lw-primary); }
.cat-option-radio { color: #d1d5db; font-size: 1rem; flex-shrink: 0; }
.cat-option.active .cat-option-radio { color: var(--lw-primary); }

/* ============================================================
   NUM-STEPPER — stepper +/- pour champs numériques (surface, étages)
   ============================================================ */
.num-stepper {
  display: flex; align-items: center; justify-content: space-between;
  border: 1.5px solid #e5e7eb; border-radius: 12px; padding: 4px;
  background: white;
}
.num-stepper-btn {
  width: 32px; height: 32px; flex-shrink: 0; border-radius: 9px; border: none;
  background: #f3f4f6; color: var(--lw-dark); font-size: .75rem;
  display: flex; align-items: center; justify-content: center; transition: all .15s;
}
.num-stepper-btn:hover { background: var(--lw-primary); color: white; }
.num-stepper-btn:active { transform: scale(.92); }
.num-stepper-value { font-weight: 700; font-size: .9rem; color: var(--lw-dark); min-width: 24px; text-align: center; }
.num-stepper-unit { font-size: .78rem; color: var(--lw-muted); padding: 0 6px; white-space: nowrap; }

.badge-discount-hint {
  font-size: .7rem; font-weight: 700; color: #15803d; background: #dcfce7;
  border-radius: 20px; padding: .3rem .65rem; white-space: nowrap;
}

/* ============================================================
   LOCATION MAP — carte Leaflet (choix du repère à l'étape 1)
   ============================================================ */
.location-map {
  width: 100%; height: 260px; border-radius: 16px; overflow: hidden;
  border: 1.5px solid #e5e7eb;
}

/* ============================================================
   PROPERTY GALLERY (PC: airbnb grid, mobile: carousel)
   ============================================================ */
.lw-gallery-pc {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 200px 200px;
  gap: 8px; border-radius: 18px; overflow: hidden;
}
.lw-gallery-pc .g-main { grid-column: 1/3; grid-row: 1/3; overflow: hidden; display: block; }
.lw-gallery-pc .g-th { overflow: hidden; position: relative; display: block; }
.lw-gallery-pc img { width: 100%; height: 100%; object-fit: cover; cursor: pointer; transition: transform .4s; }
.lw-gallery-pc img:hover { transform: scale(1.04); }
.lw-gallery-pc .g-all-btn {
  position: absolute; bottom: 12px; right: 12px;
  background: white; border: 1.5px solid #e5e7eb; border-radius: 9px;
  padding: 6px 14px; font-size: .78rem; font-weight: 700; color: var(--lw-dark);
  box-shadow: 0 2px 8px rgba(0,0,0,.12); z-index: 2; pointer-events: none;
}

/* ---- GALERIE MOBILE (fiche bien) ---- */
.lw-gm-frame { position: relative; border-radius: 14px; overflow: hidden; height: 300px; background: #e5e7eb; }
.lw-gm-frame .carousel-item, .lw-gm-frame .carousel-item img { height: 300px; }
.lw-gm-frame img { width: 100%; object-fit: cover; }
.lw-gm-expand {
  position: absolute; top: 12px; right: 12px; z-index: 3;
  width: 38px; height: 38px; border-radius: 50%; border: none;
  background: rgba(19,19,28,.55); backdrop-filter: blur(4px); color: white; font-size: .85rem;
}
.lw-gm-count {
  position: absolute; bottom: 12px; right: 12px; z-index: 3;
  background: rgba(19,19,28,.6); color: white; border-radius: 20px;
  padding: 3px 11px; font-size: .74rem; font-weight: 600;
}
.lw-gm-thumbs { display: flex; gap: 6px; overflow-x: auto; padding: 8px 2px 2px; scrollbar-width: none; }
.lw-gm-thumbs::-webkit-scrollbar { display: none; }
.lw-gm-thumb {
  flex: 0 0 auto; width: 58px; height: 44px; border-radius: 8px; overflow: hidden;
  border: 2px solid transparent; padding: 0; background: #e5e7eb; opacity: .65; transition: all .15s;
}
.lw-gm-thumb img { width: 100%; height: 100%; object-fit: cover; }
.lw-gm-thumb.active { border-color: var(--lw-primary); opacity: 1; }

/* ---- GLIGHTBOX : correctifs galerie photo (annonce show) ----
   1) .goverlay est figé à "100vh" par la lib : sur mobile, quand la barre
      d'adresse du navigateur se rétracte après ouverture, la zone gagnée
      n'est plus couverte par l'overlay et laisse voir le fond blanc de la
      page en dessous. "100dvh" suit la hauteur réelle visible.
   2) Le thème "clean" de GLightbox positionne .gprev/.gnext hors écran
      (top:-100%) sous 769px et ne compte que sur le swipe : on les rend
      visibles et tapables pour permettre de défiler les photos sans avoir
      à fermer la lightbox et recliquer une miniature. */
.glightbox-container, .goverlay { height: 100vh; height: 100dvh; }
@media (max-width: 768px) {
  .glightbox-clean .gprev, .glightbox-clean .gnext {
    top: 50%; transform: translateY(-50%);
    background: rgba(0,0,0,.4);
  }
}

/* Mobile gallery carousel customization */
.gallery-carousel .carousel-indicators button {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(255,255,255,.6); border: none; margin: 0 3px;
  transition: all .22s;
}
.gallery-carousel .carousel-indicators button.active { width: 18px; border-radius: 4px; background: white; }
.gallery-carousel .carousel-control-prev,
.gallery-carousel .carousel-control-next {
  width: 36px; height: 36px; top: 50%; transform: translateY(-50%);
  bottom: auto; opacity: 1;
}
.gallery-carousel .carousel-control-prev { left: 10px; }
.gallery-carousel .carousel-control-next { right: 10px; }
.carousel-ctrl-circle {
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(255,255,255,.9); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  color: var(--lw-dark); font-size: .8rem;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
}

/* ---- PROPERTY BOOKING CARD ---- */
.lw-book-card {
  background: white; border-radius: 18px;
  box-shadow: 0 4px 30px rgba(0,0,0,.12); padding: 1.4rem;
}
.price-main {
  font-size: 1.7rem;
  font-weight: 800;
  color: var(--dark);
  line-height: 1.1;
}
.price-sub {
  font-size: .86rem;
  color: var(--lw-muted);
}

/* ---- DATE PICKER CARD ---- */
.date-pick-wrap {
  border: 1.5px solid #e5e7eb; border-radius: 12px; overflow: hidden;
}
.date-pick-wrap .dp-field {
  padding: 10px 14px; flex: 1;
}
.date-pick-wrap .dp-field .dp-label { font-size: .68rem; font-weight: 700; color: #374151; display: block; margin-bottom: 2px; }
.date-pick-wrap .dp-field input { border: none; outline: none; font-family: var(--lw-font); font-size: .85rem; color: var(--lw-dark); width: 100%; background: transparent; }
.dp-sep { width: 1px; background: #e5e7eb; align-self: stretch; }

/* ---- AMENITY CHIPS ---- */
.amenity-chip {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .5rem .7rem;
  border-radius: 10px;
  background: #fffeff;
  font-size: .84rem;
  font-weight: 500;
}
.amenity-chip i {
  font-size: .95rem;
  color: var(--lw-primary);
  flex-shrink: 0;
}

/* ---- FIXED CONTACT BAR (mobile, property) ---- */
.lw-contact-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 1030;
  background: rgba(255,255,255,.97); backdrop-filter: blur(18px);
  border-top: 1px solid rgba(0,0,0,.07);
  padding: 10px 16px;
  box-shadow: 0 -2px 16px rgba(0,0,0,.07);
  display: none;
}
@media (max-width: 991px) { .lw-contact-bar { display: flex; align-items: center; gap: 10px; } }

/* ---- HOST CARD ---- */
.host-avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; border: 3px solid white; box-shadow: 0 2px 10px rgba(0,0,0,.12); }

/* ---- PAGES PAIEMENT (retour GeniusPay : attente / échec) ---- */
.pay-status-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 84px; height: 84px; border-radius: 50%; font-size: 2rem;
}
.pay-status-ico-wait { background: var(--lw-primary-soft); color: var(--lw-primary); }
.pay-status-ico-fail { background: #fee2e2; color: #dc2626; font-size: 2.2rem; }
.pay-status-title { font-weight: 800; font-size: 1.25rem; letter-spacing: -.02em; }
.pay-ref {
  display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; color: #6b7280;
  background: #f7f7f9; border-radius: 20px; padding: 6px 14px;
}
.pay-ref strong { color: var(--lw-dark); }
.pay-meta-lab { font-size: .72rem; color: #6b7280; font-weight: 600; }

/* ============================================================
   FICHE BIEN (page-property) — refonte
   ============================================================ */
body.page-property { background: #f2fafc; }
body.page-property #lw-bottom-nav { display: none !important; }
@media (max-width: 991px) {
  body.page-property .page-wrap { padding-bottom: 84px; }
}

/* En-tête */
.prop-crumb { font-size: .78rem; color: #6b7280; }
.prop-crumb a { color: #6b7280; }
.prop-crumb a:hover { color: var(--lw-primary); }
.prop-crumb .sep { font-size: .6rem; }
.prop-crumb .cur { color: var(--lw-dark); font-weight: 600; }
.prop-back { width: 34px; height: 34px; }
.prop-h1 { font-size: clamp(1.1rem, 3vw, 1.5rem); font-weight: 600;  margin: 0 0 10px; }
.prop-sub { font-size: .8rem; color: #6b7280; }
.prop-sub i { margin-right: 3px; }

/* Contenu */
.prop-desc { font-size: .88rem; line-height: 1.7; color: #374151; white-space: pre-line; }
.prop-rule { font-size: .83rem; }
.prop-rule-lab { font-weight: 600; font-size: .78rem; color: var(--lw-muted); }
.prop-rule-note { font-size: .82rem; color: #6b7280; white-space: pre-line; margin: 0; }
.prop-loc-line { font-size: .83rem; color: #6b7280; }
.prop-loc-hint { font-size: .75rem; color: var(--lw-muted); }
.prop-map { border-radius: 14px; overflow: hidden; height: 240px; z-index: 0; }
.prop-map-empty {
  border-radius: 14px; overflow: hidden; height: 200px; background: #eef1f5;
  display: flex; align-items: center; justify-content: center;
}

/* Bloc hôte cliquable */
.host-card-link {
  display: flex; gap: 14px; align-items: center; padding: 12px;
  background: white; border: 1px solid #eef1f5; border-radius: 16px;
  color: inherit; transition: box-shadow .18s, transform .18s;
}
.host-card-link:hover { box-shadow: 0 6px 22px rgba(0,0,0,.08); transform: translateY(-1px); color: inherit; }
.host-verif {
  position: absolute; bottom: -2px; right: -2px; color: #16a34a; font-size: 1rem;
  background: white; border-radius: 50%; line-height: 1;
}
.host-verif-badge { font-size: .66rem; font-weight: 700; }
.host-since { font-size: .78rem; color: #6b7280; }
.host-see { font-size: .78rem; font-weight: 600; color: var(--lw-primary); }
.min-w-0 { min-width: 0; }

.book-note { font-size: .74rem; color: var(--lw-muted); margin-top: 6px; }

/* Barre d'actions mobile */
.lw-contact-bar .cb-from { font-size: .64rem; color: var(--lw-muted); font-weight: 700; letter-spacing: .03em; }
.lw-contact-bar .cb-price { font-size: 1rem; font-weight: 800; color: var(--lw-dark); white-space: nowrap; }
.lw-contact-bar .cb-mode { font-size: .68rem; font-weight: 400; color: var(--lw-muted); }
.prop-share-fab {
  position: fixed; right: 16px; bottom: 82px; z-index: 1031;
  width: 42px; height: 42px; border-radius: 50%; border: none;
  background: var(--lw-dark); color: white; font-size: .95rem;
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
  display: flex; align-items: center; justify-content: center;
}
.prop-sheet { height: auto; border-radius: 20px 20px 0 0; }
.prop-sheet .offcanvas-body { padding: 16px 18px 24px; }

/* ---- REVIEW CARD ---- */
.review-card { padding: 1rem 1.2rem; border-radius: 14px; background: white; box-shadow: 0 1px 6px rgba(0,0,0,.06); }
.reviewer-avatar { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; }

/* ============================================================
   DASHBOARD
   ============================================================ */
.lw-dash-sidebar { position: sticky; top: calc(var(--lw-nav-h) + 16px); }
.dash-nav-lnk {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: 10px;
  text-decoration: none; color: #4b5563;
  font-weight: 500; font-size: .88rem; transition: all .15s;
  margin-bottom: 2px; font-family: var(--lw-font);
}
.dash-nav-lnk i { width: 18px; text-align: center; flex-shrink: 0; }
.dash-nav-lnk:hover, .dash-nav-lnk.active { background: var(--lw-primary-soft); color: var(--lw-primary); }

/* Horizontal ad card in dashboard */
.dash-ad {
  background: white; border-radius: 14px;
  box-shadow: 0 1px 5px rgba(0,0,0,.07); transition: box-shadow .2s;
}
.dash-ad:hover { box-shadow: 0 4px 16px rgba(0,0,0,.1); }
.lw-highlight-flash { animation: lwHighlightFlash 2.2s ease-out; }
@keyframes lwHighlightFlash {
  0% { box-shadow: 0 0 0 3px var(--lw-primary); }
  100% { box-shadow: 0 1px 5px rgba(0,0,0,.07); }
}
.dash-ad-img { width: 110px; flex-shrink: 0; }
.dash-ad-img img { width: 100%; height: 100%; min-height: 90px; object-fit: cover; }
@media (min-width: 992px) { .dash-ad-img { width: 130px; } }
.dash-ad-body { flex: 1; padding: 10px 12px; min-width: 0; }
.dash-ad-actions { border-top: 1px solid #f3f4f6; padding: 8px 12px; }

/* Composant carte list-style (components/list-card.blade.php) */
.list-card-title { font-size: .84rem; }
.list-card-meta { font-size: .74rem; color: var(--lw-muted); }
.list-card-meta i { font-size: .68rem; }
.list-card-price { font-size: .78rem; font-weight: 700; color: var(--lw-dark); }
.list-card-ellipsis { width: 32px; height: 32px; }
.list-card-ellipsis i { font-size: .78rem; }
@media (max-width: 767.98px) {
  .list-card-ellipsis { width: 28px; height: 28px; }
  .list-card-ellipsis i { font-size: .72rem; }
}

/* Reservation card */
.res-card { background: white; border-radius: 14px; overflow: hidden; box-shadow: 0 1px 5px rgba(0,0,0,.07); }
.res-card-img { width: 90px; flex-shrink: 0; }
.res-card-img img { width: 100%; height: 100%; min-height: 80px; object-fit: cover; }

/* Status badges */
.status-pending  { background: #fff8e1; color: #b45309; }
.status-confirm  { background: #dcfce7; color: #15803d; }
.status-cancel   { background: #fee2e2; color: #b91c1c; }
.status-badge { font-size: .72rem; font-weight: 700; padding: 3px 9px; border-radius: 6px; }

/* Message list */
.msg-item {
  display: flex; gap: 10px; padding: 12px; border-radius: 12px;
  cursor: pointer; transition: background .15s; text-decoration: none; color: inherit;
}
.msg-item:hover { background: #f9fafb; }
.msg-item.unread { background: var(--lw-primary-soft); }
.msg-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.msg-unread-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--lw-primary); flex-shrink: 0; margin-top: 4px; }

/* ============================================================
   PUBLISH STEPS
   ============================================================ */
.pub-steps-bar { display: flex; gap: 6px; }
.pub-seg { flex: 1; height: 4px; border-radius: 2px; background: #e5e7eb; transition: background .3s; }
.pub-seg.done   { background: rgba(250,69,74,.3); }
.pub-seg.active { background: var(--lw-primary); }

.pub-step-view { display: none; }
.pub-step-view.active { display: block; }

.pub-step-label {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 12px 4px 4px; border-radius: 20px;
  background: var(--lw-primary-soft); font-size: .78rem; font-weight: 700;
  color: var(--lw-primary);
}
.pub-step-label .num {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--lw-primary); color: white;
  display: flex; align-items: center; justify-content: center;
  font-size: .7rem; font-weight: 800;
}

/* ---- PLAN CARDS ---- */
.plan-card {
  border: 2px solid #e5e7eb; border-radius: 14px; padding: 1.2rem;
  cursor: pointer; transition: all .2s; position: relative;
  font-family: var(--lw-font);
}
.plan-card:hover, .plan-card.selected { border-color: var(--lw-primary); background: var(--lw-primary-soft); }
.plan-card .plan-radio { position: absolute; top: 14px; right: 14px; }
.plan-card.featured::before {
  content: '⭐ Recommandé';
  position: absolute; top: -11px; left: 50%; transform: translateX(-50%);
  background: var(--lw-primary); color: white; font-size: .67rem; font-weight: 700;
  padding: 2px 12px; border-radius: 10px; white-space: nowrap; font-family: var(--lw-font);
}

/* ---- OPERATOR CARDS ---- */
.op-card {
  border: 2px solid #e5e7eb; border-radius: 12px; padding: 1rem;
  cursor: pointer; transition: all .2s; text-align: center;
}
.op-card:hover, .op-card.selected { border-color: var(--lw-primary); background: var(--lw-primary-soft); }
.op-logo { height: 40px; object-fit: contain; }

/* ============================================================
   AUTH / ONBOARDING
   ============================================================ */
.auth-card { background: white; border-radius: 20px; box-shadow: 0 8px 40px rgba(0,0,0,.1); padding: 2rem; }
.onboard-step { display: none; }
.onboard-step.active { display: block; }
.onboard-option {
  border: 2px solid #e5e7eb; border-radius: 12px; padding: .9rem 1rem;
  cursor: pointer; transition: all .18s; text-align: left;
  width: 100%; background: white; font-family: var(--lw-font);
  margin-bottom: 8px; display: flex; align-items: center; gap: 12px;
}
.onboard-option:hover, .onboard-option.selected { border-color: var(--lw-primary); background: var(--lw-primary-soft); color: var(--lw-primary); }

/* Layout des pages auth */
.auth-body { margin: 0; padding: 0; background: #f2fafc; }
.auth-wrap {min-height: 100vh; display: flex; align-items: stretch; }
.auth-split { display: grid; grid-template-columns: 1fr 1fr; min-height: calc(100vh - 62px); }
@media (max-width: 991px) {
  .auth-split { grid-template-columns: 1fr; }
  .auth-visual { display: none !important; }
}
.auth-visual { position: relative; overflow: hidden; }
.auth-visual img { width: 100%; height: 100%; object-fit: cover; }
.auth-visual-ov {
  position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 2.5rem;
  background: linear-gradient(to bottom, rgba(19,19,28,.3), rgba(19,19,28,.75));
}
.auth-visual-title { color: white; font-weight: 800; font-size: 1.6rem; letter-spacing: -.02em; line-height: 1.2; margin-bottom: .6rem; }
.auth-visual-text { color: rgba(255,255,255,.75); font-size: .85rem; line-height: 1.6; max-width: 340px; margin: 0; }
.auth-visual-stats { color: white; }
.auth-visual-stats .val { font-size: 1.2rem; font-weight: 800; }
.auth-visual-stats .lbl { font-size: .72rem; opacity: .7; }
.auth-form-side { display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; background: #f2fafc; }
.auth-form-inner { width: 100%; max-width: 420px; }
.auth-logo-lg { font-size: 1.6rem; display: inline-block; }
.auth-subtitle { font-size: .83rem; color: #6b7280; }
.auth-hint { font-size: .8rem; color: var(--lw-muted); }
.auth-legal { font-size: .76rem; text-align: center; color: var(--lw-muted); }
.auth-legal a { color: var(--lw-primary); }
.auth-link { font-size: .8rem; color: var(--lw-primary); font-weight: 600; text-decoration: none; }
.auth-link-muted { font-size: .78rem; color: var(--lw-muted); text-decoration: none; }
.auth-link-muted:hover { color: var(--lw-dark); }
.auth-phone-code { max-width: 110px; flex-shrink: 0; }
.auth-cta-sm { font-size: .83rem; }
.rounded-8 { border-radius: 8px !important; }
.rounded-12 { border-radius: 12px !important; }
.rounded-16 { border-radius: 16px !important; }
.rounded-30 { border-radius: 30px !important; }
/* Saisie du code à 6 chiffres */
.otp-input { width: 46px; height: 52px; font-size: 1.4rem; border-radius: 10px; }
.otp-input:focus { border-color: var(--lw-primary); box-shadow: 0 0 0 3px rgba(250,69,74,.1); }

/* Wizard d'onboarding (inscription) */
.onboard-progress { display: flex; gap: 6px; margin-bottom: 1.5rem; }
.ob-seg { flex: 1; height: 4px; border-radius: 2px; background: #e5e7eb; transition: background .3s; }
.ob-seg.active { background: var(--lw-primary); }
.ob-seg.done { background: rgba(250,69,74,.35); }
.ob-screen { display: none; }
.ob-screen.active { display: block; }
.ob-emoji { font-size: 3rem; margin-bottom: .5rem; }
.ob-opt-title { font-weight: 600; font-size: .85rem; }
.ob-opt-sub { font-size: .76rem; color: var(--lw-muted); }
.ob-ico-fb { color: #1877f2; }
.ob-ico-wa { color: #25d366; }
.ob-finish-icon {
  width: 72px; height: 72px; background: var(--lw-primary-soft); border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 2rem; margin: 0 auto 1rem;
}

/* Upload photo de profil (wizard inscription) */
.avatar-upload { position: relative; display: inline-block; cursor: pointer; }
.avatar-upload img {
  width: 88px; height: 88px; border-radius: 50%; object-fit: cover;
  border: 3px solid white; box-shadow: 0 2px 10px rgba(0,0,0,.12);
}
.avatar-upload-badge {
  position: absolute; right: 0; bottom: 2px; width: 28px; height: 28px; border-radius: 50%;
  background: var(--lw-primary); color: white; font-size: .72rem;
  display: flex; align-items: center; justify-content: center; border: 2px solid white;
}
.avatar-upload-spinner { position: absolute; right: 4px; bottom: 6px; color: var(--lw-primary); }

/* Spinner de chargement centralise sur les boutons submit (script.js: lwInitFormSubmitSpinners) */
.lw-btn-spinner { margin-left: .5rem; }
.lw-btn-loading { cursor: not-allowed; }

/* Options avec pseudo-radio (cercle indiquant visuellement le choix, cf. README auth) */
.onboard-option .ob-radio { position: absolute; opacity: 0; pointer-events: none; }
.onboard-option { position: relative; padding-right: 2.6rem; }
.onboard-option::after {
  content: ''; position: absolute; right: 1rem; top: 50%; transform: translateY(-50%);
  width: 20px; height: 20px; border-radius: 50%; border: 2px solid #d1d5db;
  background: white; transition: all .18s;
}
.onboard-option:has(.ob-radio:checked) { border-color: var(--lw-primary); background: var(--lw-primary-soft); color: var(--lw-primary); }
.onboard-option:has(.ob-radio:checked)::after {
  border-color: var(--lw-primary);
  background: radial-gradient(circle, var(--lw-primary) 0 5px, white 6px);
}

/* ============================================================
   PUBLICATION D'ANNONCE (wizard)
   ============================================================ */
.pub-wrap { max-width: 680px; margin: 0 auto; }
.pub-title { letter-spacing: -.02em; }
.pub-subtitle { font-size: .88rem; color: #6c6f75; }
.pub-subtitle a { color: var(--lw-primary); }
.pub-counter { font-size: .72rem; color: var(--lw-muted); margin-top: 4px; }
.pub-step-counter { font-size: .74rem; color: var(--lw-muted); }

/* --- Génération IA de la description (étape 1 publication) --- */
.pub-ai-hint { font-size: .72rem; line-height: 1.3; max-width: 34ch; }
.pub-ai-quota { font-size: .7rem; }
.btn-ai-generate {
  display: inline-flex; align-items: center; gap: 2px;
  font-size: .78rem; font-weight: 700; line-height: 1;
  color: #fff; background: var(--lw-primary); border: 0;
  padding: 8px 14px; border-radius: 9px; cursor: pointer;
  transition: background .15s ease, opacity .15s ease;
}
.btn-ai-generate:hover { background: var(--lw-primary-hov); color: #fff; }
.btn-ai-generate:disabled { opacity: .55; cursor: not-allowed; }
.btn-ai-generate.is-loading { opacity: .8; cursor: progress; }
.btn-ai-generate.is-loading i { animation: lw-ai-spin .8s linear infinite; }
.btn-ai-locked { background: #6c757d; }
.btn-ai-locked:hover { background: #5c636a; }
.pub-desc-autogrow { overflow-y: hidden; resize: none; min-height: 140px; }
@keyframes lw-ai-spin { to { transform: rotate(360deg); } }
.pub-sublabel { font-size: .73rem; }
.pub-ico-xs { font-size: .7rem; }
.pub-ico-sm { font-size: .8rem; }
.pub-ico-wa { color: #25d366; }
.pub-currency { font-size: .68rem; font-weight: 700; color: var(--lw-muted); left: 10px !important; }
.pub-price-input { padding-left: 48px !important; }
.pub-phone-prefix { font-size: .75rem; font-weight: 700; color: var(--lw-muted); left: 10px !important; }
.pub-phone-input { padding-left: 48px !important; }
.pub-switch-label { font-size: .85rem; font-weight: 500; }
.pub-locked-switch { opacity: .85; }
.pub-locked-switch .form-check-input { opacity: .55; }
.pub-price-hint {
  background: #fff8e6; border: 1px solid #fde68a; border-radius: 16px;
  padding: .75rem 1rem; font-size: .78rem; line-height: 1.5; color: #78350f;
}
.pub-price-hint strong { color: #92400e; }
.pub-sim-bar {
  display: flex; align-items: center; justify-content: space-between;
  background: white; border-radius: 16px; padding: .85rem 1rem; box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.counter-row { display: flex; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid #f3f4f6; }
.counter-row:last-of-type { border-bottom: none; }
.counter-label { font-size: .86rem; font-weight: 500; }
.counter-value { min-width: 22px; text-align: center; }
.counter-btn { width: 30px; height: 30px; }
.photo-drop { border: 2px dashed #e5e7eb; border-radius: 14px; padding: 2.5rem 1rem; text-align: center; cursor: pointer; transition: all .18s; background: white; }
.photo-drop:hover, .photo-drop.over { border-color: var(--lw-primary); background: var(--lw-primary-soft); }
.photo-drop-icon { font-size: 2rem; color: #d1d5db; display: block; margin-bottom: .7rem; }
.photo-drop-title { font-size: .88rem; }
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.photo-thumb { border-radius: 10px; overflow: hidden; aspect-ratio: 1; position: relative; background: #e5e7eb; cursor: pointer; }
.photo-thumb img { width: 100%; height: 100%; object-fit: cover; }
.photo-thumb.uploading { display: flex; align-items: center; justify-content: center; }
.photo-thumb .del-btn { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; border-radius: 50%; background: rgba(0,0,0,.65); color: white; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: .58rem; }
.photo-thumb .main-badge { position: absolute; bottom: 4px; left: 4px; background: var(--lw-primary); color: white; font-size: .58rem; font-weight: 700; padding: 2px 6px; border-radius: 4px; }

/* Vidéo de présentation (SPEC §2.5) : dropzone + vignette, mêmes codes que .photo-drop/.photo-thumb */
.video-thumb { max-width: 280px; border-radius: 10px; overflow: hidden; aspect-ratio: 16/9; position: relative; background: #111827; }
.video-thumb video, .video-thumb img { width: 100%; height: 100%; object-fit: cover; opacity: .55; }
.video-thumb .video-play-btn { position: absolute; inset: 0; margin: auto; width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,.92); border: none; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; color: var(--lw-primary); cursor: pointer; }
.video-thumb .del-btn { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; border-radius: 50%; background: rgba(0,0,0,.65); color: white; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: .58rem; z-index: 1; }
.amenity-toggle { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 10px; border: 1.5px solid #e5e7eb; cursor: pointer; transition: all .15s; font-size: .82rem; font-weight: 500; user-select: none; white-space: nowrap; }
.amenity-toggle i { color: var(--lw-muted); }
.amenity-toggle.on { border-color: var(--lw-primary); background: var(--lw-primary-soft); color: var(--lw-primary); }
.amenity-toggle.on i { color: var(--lw-primary); }
.amenity-toggle-check { color: #d1d5db; font-size: .9rem; margin-left: 2px; }
.amenity-toggle.on .amenity-toggle-check { color: var(--lw-primary); }
.prev-card { background: white; border-radius: 16px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,.08); }
.prev-card-img { border-radius: 16px 16px 0 0; overflow: hidden; aspect-ratio: 16/9; background: #e5e7eb; }
.prev-card-img img { width: 100%; height: 100%; object-fit: cover; }
.prev-title { font-size: .92rem; }
.prev-loc { font-size: .77rem; color: #6b7280; }
.prev-loc i { color: var(--lw-primary); }

/* Carte de prévisualisation horizontale (étape 4 : photo à gauche, infos à droite) */
.prev-card-h { display: flex; align-items: stretch; }
.prev-card-h .prev-card-img { width: 130px; flex-shrink: 0; border-radius: 16px 0 0 16px; aspect-ratio: auto; }
.prev-card-h .prev-card-body { flex: 1 1 auto; min-width: 0; padding: .75rem 1rem; }
@media (max-width: 380px) {
  .prev-card-h .prev-card-img { width: 96px; }
}
.prev-meta-footer {
  display: flex; flex-wrap: wrap; gap: .35rem .9rem;
  font-size: .74rem; color: var(--lw-muted);
}
.prev-meta-footer i { color: #c4c9d2; margin-right: 3px; }
.prev-meta { font-size: .76rem; color: #6b7280; }
.prev-meta i { color: var(--lw-primary); }
.prev-price { font-size: .95rem; }
.prev-price-mode { font-weight: 400; font-size: .74rem; color: var(--lw-muted); }
.step-nav-bar { position: sticky; bottom: 0; background: rgba(242,250,252,.97); backdrop-filter: blur(14px); border-top: 1px solid rgba(0,0,0,.06); padding: 12px 0; z-index: 100; margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); }
.plan-price { font-size: 1.2rem; }
.plan-price-sm { font-size: 1rem; font-weight: 800; color: var(--lw-primary); }
.plan-features { font-size: .75rem; color: #4b5563;}
.plan-feature-off { color: var(--lw-muted); }
.plan-feature-off i { color: #f87171; }
.plan-radio { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #e5e7eb; flex-shrink: 0; transition: all .15s; }
.plan-card.selected .plan-radio { border-color: var(--lw-primary); background: radial-gradient(circle, var(--lw-primary) 0 4px, white 5px); }
.pack-card { background: white; border-radius: 14px; border: 1.5px solid #e5e7eb; padding: 1rem; text-align: center; }
@media screen and (max-width: 885px){
  .pack-card-body {padding: .75rem;}
  .plan-features {
  font-size: .65rem;
  color: #4b5563;
}
}
.credit-banner { background: var(--lw-primary-soft); border: 1.5px solid var(--lw-primary); border-radius: 14px; padding: 1rem; color: var(--lw-dark); }
.credit-banner i { color: var(--lw-primary); }
.op-logo-badge { width: 40px; height: 40px; border-radius: 10px; margin: 0 auto 6px; display: flex; align-items: center; justify-content: center; font-weight: 900; color: white; font-size: 1.1rem; }
.op-wave { background: #0057ff; }
.op-om { background: #ff6600; }
.op-label { font-size: .82rem; font-weight: 600; }
.pay-summary { background: #f9fafb; font-size: .85rem; }
.pay-amount { color: var(--lw-primary); }
.disabled-link { opacity: .5; pointer-events: auto; }
.lw-alert-warning {
  display: flex; gap: 10px; padding: 12px 14px; border-radius: 12px;
  background: #fff8e1; color: #92400e; font-size: .82rem; line-height: 1.55;
}
.lw-alert-warning i { color: #f59e0b; }

/* ============================================================
   GLASS EFFECTS
   ============================================================ */
.glass { background: rgba(255,255,255,.72); backdrop-filter: blur(16px); border: 1px solid rgba(255,255,255,.5); }
.glass-dark { background: rgba(19,19,28,.65); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,.1); color: white; }

/* ============================================================
   MODALS
   ============================================================ */
.modal-content { border: none !important; border-radius: 20px !important; }
.modal-handle { width: 36px; height: 4px; border-radius: 2px; background: #e5e7eb; margin: 0 auto 12px; }
@media (max-width: 575px) {
  .modal-dialog.modal-sheet { margin: 0 !important; position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important; max-width: none !important; }
  .modal-sheet .modal-content { border-radius: 20px 20px 0 0 !important; }
}
.m-step { display: none; }
.m-step.active { display: block; }

/* ============================================================
   OFFCANVAS
   ============================================================ */
.offcanvas.lw-bottom { border-radius: 20px 20px 0 0; max-height: 80vh; }
.offcanvas.lw-right  { border-radius: 20px 0 0 20px; }
.offcanvas-handle { width: 36px; height: 4px; border-radius: 2px; background: #e5e7eb; margin: 0 auto 14px; }

/* ============================================================
   DROPDOWN
   ============================================================ */
.dropdown-menu {
  border: none !important; border-radius: 14px !important;
padding: 6px !important;
      box-shadow: rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
    display: none;
    visibility: hidden;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.25s ease-out, transform 0.25s ease-out;
    pointer-events: none;
}

.dropup .dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0;
  border-right: 0.3em solid transparent;
  border-bottom: 0.3em solid;
  border-left: 0.3em solid transparent;
}
.dropup .dropdown-toggle:empty::after {
  margin-left: 0;
}
.dropdown-menu.show {
    display: block;
    animation: dropdownFadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    z-index: 150;
}
@keyframes dropdownFadeIn {
    from {
        opacity: 0;
        transform: translateY(12px);
        /* Départ légèrement plus bas */
    }

    to {
        opacity: 1;
        transform: translateY(0);
        /* Arrivée à sa place exacte */
    }
}
.dropdown-item { border-radius: 8px !important; padding: 6px 12px !important; font-size: .82rem !important; font-weight: 500 !important; transition: background .12s !important; font-family: var(--lw-font) !important; }
.dropdown-item:hover,.dropdown-item.active { background: var(--lw-primary-soft) !important; color: var(--lw-primary) !important; }
.dropdown-item.text-danger:hover { background: #fef2f2 !important; color: #dc2626 !important; }

/* ============================================================
   TOAST / POPUP ALERTS
   ============================================================ */
.lw-toast-stack {
  position: fixed; top: calc(var(--lw-nav-h) + 8px); left: 50%;
  transform: translateX(-50%); z-index: 9999;
  width: 90%; max-width: 380px; pointer-events: none;
}
.lw-toast {
  background: white; border-radius: 13px;
  box-shadow: 0 8px 32px rgba(0,0,0,.14);
  padding: 12px 16px; margin-bottom: 8px;
  display: flex; gap: 10px; align-items: flex-start;
  animation: toast-in .28s ease; pointer-events: all;
}
@keyframes toast-in { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }

/* Alert strip */
.lw-alert-warn { background: #fffbeb; border-radius: 10px; padding: 10px 14px; font-size: .8rem; color: #78350f; display: flex; gap: 8px; }
.lw-alert-info { background: #eff6ff; border-left: 3px solid #3b82f6; border-radius: 10px; padding: 10px 14px; font-size: .8rem; color: #1e40af; display: flex; gap: 8px; }
.lw-alert-danger { background: var(--lw-primary-soft); border-left: 3px solid var(--lw-primary); border-radius: 10px; padding: 10px 14px; font-size: .8rem; color: #7f1d1d; display: flex; gap: 8px; }

/* ============================================================
   FOOTER
   ============================================================ */
.lw-foot { background: var(--lw-dark); color: rgba(255,255,255,.7); padding: 3rem 0 1.5rem; }
.foot-link { color: rgba(255,255,255,.6); text-decoration: none; font-size: .84rem; display: block; margin-bottom: 7px; transition: color .15s; }
.foot-link:hover { color: white; }
.foot-logo { font-weight: 800; font-size: 1.4rem; color: white; letter-spacing: -.04em; }
.foot-logo img{
  width: 160px;
  max-width: 100%;
}
@media screen and (max-width: 885px){
  .foot-logo img{
    width: 110px; 
  }
}

/* ============================================================
   SCROLLBAR
   ============================================================ */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 3px; }

/* ============================================================
   MISC
   ============================================================ */
.lw-divider { border: none; border-top: 1px solid #f3f4f6; margin: 1.2rem 0; }
.text-truncate-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cursor-pointer { cursor: pointer; }
.bg-soft { background-color: var(--lw-primary-soft) !important; }
.text-lw-primary { color: var(--lw-primary) !important; }

/* Star rating */
.stars .fa-star { color: #fbbf24; font-size: .78rem; }
.stars .fa-star.empty { color: #e5e7eb; }

/* Sticky input bar on property mobile */
.sticky-bottom-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 1030;
  background: rgba(255,255,255,.97); backdrop-filter: blur(18px);
  border-top: 1px solid rgba(0,0,0,.07); padding: 10px 16px;
  box-shadow: 0 -2px 16px rgba(0,0,0,.06);
}

/* become host page */
.hiw-step{counter-increment:step-counter}.step-num{width:40px;height:40px;border-radius:50%;background:var(--lw-primary-soft);color:var(--lw-primary);font-weight:800;font-size:.9rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.step-line{width:2px;background:#f3f4f6;flex-shrink:0;margin:6px 0 6px 19px}.earn-pill{display:inline-flex;align-items:center;gap:6px;background:var(--lw-primary-soft);color:var(--lw-primary);font-weight:700;font-size:.82rem;padding:6px 14px;border-radius:20px}.faq-item{border-bottom:1px solid #f3f4f6}.faq-btn{width:100%;text-align:left;background:#fff0;border:none;padding:1rem 0;font-family:var(--lw-font);font-size:.88rem;font-weight:600;color:var(--lw-dark);cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px}.faq-body{font-size:.83rem;line-height:1.6;color:#4b5563;padding:0 0 1rem;display:none}.faq-item.open .faq-body{display:block}.faq-item.open .faq-icon{transform:rotate(45deg);color:var(--lw-primary)}.faq-icon{transition:transform .2s,color .2s;color:var(--lw-muted);font-size:.8rem;flex-shrink:0}.feature-card{background:#fff;border-radius:16px;padding:1.4rem;box-shadow:0 1px 6px rgb(0 0 0 / .06)}.feature-icon{width:48px;height:48px;border-radius:14px;background:var(--lw-primary-soft);color:var(--lw-primary);display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:1rem}.testimonial-card{background:#fff;border-radius:16px;padding:1.3rem;box-shadow:0 2px 12px rgb(0 0 0 / .06)}.sim-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid #f3f4f6;font-size:.85rem}.sim-row:last-child{border-bottom:none}
/* ===== Listing — etat vide ===== */
.lw-empty-icon{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--lw-primary-soft);color:var(--lw-primary);font-size:1.7rem;}
.lw-empty h5{color:var(--lw-dark);}

/* ===== Vérification hôte (SPEC §3) ===== */
.lw-verif-hero{background:#fff;border:1px solid #f0f1f3;border-radius:18px;padding:1.3rem;box-shadow:0 1px 6px rgb(0 0 0 / .05);}
.lw-verif-badge{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;flex-shrink:0;}
.lw-verif-badge.is-warning{background:#fff7e6;color:#c07d00;}
.lw-verif-badge.is-success{background:#e8f8ee;color:#12894a;}
.lw-verif-badge.is-danger{background:var(--lw-primary-soft);color:var(--lw-primary);}
.lw-doc-drop{position:relative;border:2px dashed #d7dae0;border-radius:14px;background:#fafbfc;padding:14px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;overflow:hidden;}
.lw-doc-drop:hover,.lw-doc-drop.is-drag{border-color:var(--lw-primary);background:var(--lw-primary-soft);}
.lw-doc-drop.has-file{border-style:solid;border-color:#12894a;background:#fff;}
.lw-doc-drop input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;}
.lw-doc-ph{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px;color:#6b7280;}
.lw-doc-ph i{font-size:1.5rem;color:var(--lw-muted);}
.lw-doc-ph .fs-8{font-size:.72rem;}
.lw-doc-preview{display:none;position:relative;}
.lw-doc-drop.has-file .lw-doc-ph{display:none;}
.lw-doc-drop.has-file .lw-doc-preview{display:block;}
.lw-doc-preview img{width:100%;height:150px;object-fit:cover;border-radius:10px;display:block;}
.lw-doc-preview .lw-doc-change{position:absolute;top:8px;right:8px;background:rgba(19,19,28,.72);color:#fff;font-size:.7rem;font-weight:700;padding:4px 10px;border-radius:20px;}
.lw-doc-title{font-weight:700;font-size:.82rem;color:var(--lw-dark);}
.lw-doc-hint{font-size:.72rem;color:var(--lw-muted);}
/* Bannière compte non vérifié */
.lw-verif-alert{border:none;border-radius:0;background:#fff7e6;color:#8a5a00;font-size:.82rem;}
.lw-verif-alert .btn{white-space:nowrap;}

/* =====================================================================
   Phase 7 — Espace hôte (tableau de bord & gestion)
   ===================================================================== */

/* Navigation horizontale (mobile) */
.dash-tab-nav { display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; }
.dash-tab-nav::-webkit-scrollbar { display:none; }
.dash-tab-btn { padding:8px 16px; border-radius:20px; border:1.5px solid #e5e7eb; background:#fff; font-size:.8rem; font-weight:600; cursor:pointer; white-space:nowrap; transition:all .15s; color:#4b5563; text-decoration:none; }
.dash-tab-btn:hover, .dash-tab-btn.active { border-color:var(--lw-primary); background:var(--lw-primary-soft); color:var(--lw-primary); }

/* Barre + offcanvas de navigation compte (mobile) */
.acc-mobile-bar { display:flex; align-items:center; justify-content:space-between; gap:10px; background:#fff; border-radius:16px; padding:10px 12px; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.acc-mobile-avatar { width:40px; height:40px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.acc-offcanvas { width:290px; max-width:86vw; border-radius:0 20px 20px 0; }
.acc-offcanvas-links { display:flex; flex-direction:column; }

/* Lien sidebar désactivé (module à venir) + badge "Bientôt" */
.dash-nav-lnk.disabled { opacity:.55; cursor:default; }
.dash-nav-lnk.disabled:hover { background:transparent; color:#4b5563; }
.lw-soon { margin-left:auto; font-size:.6rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; background:#f3f4f6; color:var(--lw-muted); padding:2px 7px; border-radius:10px; }

/* Pastille crédits */
.cred-pill { display:inline-flex; align-items:center; gap:5px; padding:4px 12px; border-radius:20px; background:var(--lw-primary-soft); color:var(--lw-primary); font-size:.78rem; font-weight:700; }

/* Cartes de statistiques */
.stat-card { background:#fff; border-radius:14px; padding:1rem 1.1rem; box-shadow:0 1px 5px rgba(0,0,0,.07); height:100%; }
.stat-ico { width:34px; height:34px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; font-size:.9rem; margin-bottom:.5rem; }
.stat-val { font-size:1.5rem; font-weight:800; color:var(--lw-dark); line-height:1; }
.stat-label { font-size:.74rem; color:var(--lw-muted); margin-top:3px; }
.stat-trend { font-size:.72rem; font-weight:700; }
.trend-up { color:#22c55e; }
.trend-dn { color:#ef4444; }

/* Mini graphe en barres (vues 14 j) sans librairie externe */
.lw-barchart { display:flex; align-items:flex-end; gap:5px; height:120px; }
.lw-barchart .bar { flex:1; background:var(--lw-primary-soft); border-radius:5px 5px 0 0; min-height:3px; position:relative; transition:background .15s; }
.lw-barchart .bar > span { position:absolute; top:0; left:0; right:0; bottom:0; background:var(--lw-primary); border-radius:5px 5px 0 0; }
.lw-barchart .bar:hover { background:#fee2e2; }
.lw-bar-axis { display:flex; gap:5px; margin-top:6px; }
.lw-bar-axis > div { flex:1; text-align:center; font-size:.62rem; color:#c0c4cc; }

/* Ligne "vide" générique dans les panneaux */
.lw-empty-panel { background:#fff; border-radius:16px; box-shadow:0 1px 5px rgba(0,0,0,.07); padding:2rem 1rem; text-align:center; color:var(--lw-muted); }
.lw-empty-panel i { font-size:1.8rem; margin-bottom:.5rem; display:block; color:#d1d5db; }

/* Messages hôte (liste unidirectionnelle) */
.lw-msg-item { transition:box-shadow .15s, background .15s; border:1.5px solid transparent; }
.lw-msg-item:hover { box-shadow:0 4px 14px rgba(0,0,0,.09); }
.lw-msg-item.unread { border-color:var(--lw-primary-soft); background:#fffdfd; }
.lw-msg-item.unread .fw-bold { color:var(--lw-primary) !important; }
.lw-msg-dot { width:9px;height:9px;border-radius:50%;background:var(--lw-primary);margin-top:6px; }

/* Avis : sélecteur d'étoiles (soumission) + affichage */
.lw-star-input { display:flex; gap:6px; justify-content:center; font-size:1.6rem; cursor:pointer; }
.lw-star-input i { color:#d1d5db; transition:color .1s, transform .1s; }
.lw-star-input i:hover { transform:scale(1.1); }
.lw-stars i { font-size:.78rem; margin-right:1px; }

/* ============================================================
   Modal Checkout centralise (components/_modal-checkout.blade.php)
   ============================================================ */
.checkout-content { border-radius: 20px; overflow: hidden; }
.checkout-header { padding: 1.5rem 1.5rem .75rem; text-align: center; }
.checkout-title { font-size: 1.15rem; font-weight: 800; color: var(--lw-dark); margin: 0 0 .25rem; }
.checkout-title i { color: var(--lw-primary); }
.checkout-sub { font-size: .82rem; color: var(--lw-muted); margin: 0; }

.checkout-body { padding: 0 1.5rem 1.25rem; }

.checkout-recap {
  display: flex; align-items: center; gap: .75rem;
  background: var(--lw-primary-soft); border-radius: 14px;
  padding: .75rem 1rem; margin-bottom: 1.25rem;
}
.checkout-recap-img { width: 46px; height: 46px; border-radius: 10px; object-fit: cover; flex-shrink: 0; }
.checkout-recap-title { font-size: .86rem; font-weight: 700; color: var(--lw-dark); }
.checkout-recap-meta { font-size: .74rem; color: var(--lw-muted); }
.checkout-recap-amount { font-size: .95rem; font-weight: 800; color: var(--lw-primary); white-space: nowrap; }

.checkout-section { margin-bottom: 1.1rem; }
.checkout-section-title { font-size: .78rem; font-weight: 700; color: #6b7280; text-transform: uppercase; letter-spacing: .02em; margin-bottom: .5rem; }

.checkout-input { border-radius: 10px !important; font-size: .88rem; margin-bottom: .5rem; }

.checkout-pm-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.checkout-pm-card {
    position: relative;
    display: flex; flex-direction: column; align-items: center; gap: .3rem;
    padding: .6rem .4rem; border: 1.5px solid #e5e7eb; border-radius: 12px;
    background: #fff; cursor: pointer; transition: all .15s;
}
.checkout-pm-card:hover { border-color: var(--lw-primary); }
.checkout-pm-card.is-selected { border-color: var(--lw-primary); background: var(--lw-primary-soft); }
.checkout-pm-radio {
    position: absolute; top: .4rem; right: .4rem;
    width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid #d1d5db;
    background: #fff;
}
.checkout-pm-card.is-selected .checkout-pm-radio {
    border-color: var(--lw-primary); background: var(--lw-primary);
    box-shadow: inset 0 0 0 3px #fff;
}
.checkout-pm-card img { width: 28px; height: 28px; object-fit: contain; }
.checkout-pm-label { font-size: .68rem; font-weight: 600; color: var(--lw-dark); text-align: center; line-height: 1.15; }

.checkout-phone-group { display: flex; gap: .5rem; }
.checkout-dial { flex: 0 0 110px; border-radius: 10px !important; font-size: .85rem; }
.checkout-phone { flex: 1; border-radius: 10px !important; font-size: .88rem; }

.checkout-footer { padding: 1rem 1.5rem 1.5rem; display: flex; flex-direction: column; align-items: center; gap: .6rem; }
.checkout-cta {
  display: flex; align-items: center; justify-content: center; width: 100%;
  border: none; border-radius: 12px; padding: .85rem 1.5rem;
  background: var(--lw-primary); color: #fff; font-weight: 800; font-size: .92rem;
  transition: background .15s;
}
.checkout-cta:hover:not(:disabled) { background: var(--lw-primary-hov); }
.checkout-cta:disabled { background: #e5e7eb; color: var(--lw-muted); cursor: not-allowed; }
.checkout-close { border: none; background: transparent; color: #9ca3af; font-size: .78rem; font-weight: 400; padding: .2rem; }
.checkout-close:hover { color: var(--lw-muted); text-decoration: underline; }

/* Retraits : panneau vide compact (réutilise .lw-empty-panel) */
.form-switch .form-check-input { 
    width: 45px;
    height: 24px; 
    margin-right: 6px;
}
@media screen and (max-width: 768px) {
  .form-switch .form-check-input { 
    width: 40px;
    height: 22px; 
}
}
.form-check-input:checked {
    background-color: #fa454a;
    border-color: #fa454a;
}
.bg-soft-primary{background-color: var(--lw-primary-soft) !important;}
.text-primary{color: var(--lw-primary) !important;}
.text-success{color: var(--lw-success) !important}
.fw-bold{font-weight: 800}

/* ============================================================
   LAZY LOADING IMAGES (public/site/assets/js/lazy-image.js)
   ============================================================ */
img.lazy {
    background-color: var(--lw-primary-soft);
    opacity: .55;
    transition: opacity .35s ease;
}
img.lazy-loaded {
    opacity: 1;
}
img.lazy-error {
    opacity: 1;
    background-color: #f3f4f6;
    object-fit: none;
}

/* ============================================================
   ERROR PAGES (403, 404, 419, 500, 503, 504)
   ============================================================ */
.error-page-wrap {
  max-width: 460px; margin: 0 auto; text-align: center;
}
.error-page-img {
  width: 180px; max-width: 55%; margin: 0 auto 1.5rem;
}
.error-page-code {
  font-weight: 800; font-size: .78rem; letter-spacing: .12em;
  text-transform: uppercase; color: var(--lw-primary); margin-bottom: .5rem;
}
.error-page-title {
  font-weight: 800; font-size: 1.5rem; color: var(--lw-dark); margin-bottom: .7rem;
}
.error-page-desc {
  color: var(--lw-muted); font-size: .9rem; line-height: 1.65; margin-bottom: 1.75rem;
}
.error-page-actions {
  display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center;
}

/* Property details Page */
/* ---------- Titre / rating ---------- */
.rating-inline { display: flex; align-items: center; gap: .25rem; font-weight: 600; }
.rating-inline .fas.fa-star { color: var(--lw-dark); }
.stars { color: var(--lw-primary); letter-spacing: 1px; }
.stars .fas.fa-star { font-size: .95rem; }
.dot-sep::before {
  content: "·";
  margin: 0 .5rem; 
}
.btn-ghost {
  background: #fff;
  border: 1px solid #e9eef1;
  color: var(--lw-dark);
  border-radius: 16px;
}
.btn-ghost:hover, .btn-ghost:focus{
  background: var(--lw-primary-soft);
  color: var(--lw-primary);
    border: 1px solid var(--lw-primary);
}
.content-block {
  padding: 26px 0;
  border-bottom: 1px solid var(--lw-line);
} 
.section-title { font-weight: 600; font-size: 1.28rem; }
@media (max-width: 991.98px){
  /* body { padding-bottom: calc(var(--lw-bnav-h) + 20px); } */
  .section-title { font-size: 1.16rem; }
}
.facts { display: flex; flex-wrap: wrap; gap: 10px; }
.fact {
  display: flex; align-items: center; gap: .6rem;
  background: #fff; border: 1px solid var(--lw-line); border-radius: 16px;
  padding: .7rem .95rem; min-width: 132px;
}
.fact .fi {
  width: 38px; height: 38px; border-radius: 10px; background: var(--lw-white);
  display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem; color: var(--lw-dark);
}
.fact .fl { font-size: .74rem; color: var(--lw-ink-3); line-height: 1.1; }
.fact .fv { font-weight: 700; font-size: .92rem; }

.btn-app {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-weight: 600;
  border-radius: 50px;
  padding: .55rem 1.35rem;
  border: none;
  cursor: pointer;
  transition: all .3s;
  font-size: .92rem;
  line-height: 1.4;
  text-decoration: none;
}
.btn-app-sm {
  padding: .38rem 1rem;
  font-size: .83rem;
}
.btn-app-primary {
  background: var(--lw-primary);
  color: #fff;
}
.btn-app-primary:hover {
  background: var(--lw-primary-hov);
  color: #fff;
}
.btn-app-soft {
  background: #feefef;
  color: var(--lw-primary);
}
.btn-app-soft:hover {
  background: #fddcdd;
  color: var(--lw-primary);
}
.btn-app-white {
  background: #fff;
  color: var(--lw-dark);
  border: 1.5px solid var(--lw-line);
}
.btn-app-white:hover {
  border-color: var(--lw-primary);
  color: var(--lw-primary);
}
.btn-whatsapp {
  background: #25d366;
  color: #fff;
  font-weight: 600;
  border-radius: 50px;
  border: none;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .55rem 1.2rem;
  cursor: pointer;
  transition: background .3s ease-in-out;
  font-size: .92rem;
  text-decoration: none;
}
.btn-whatsapp:hover {
  background: #1ebe5b;
  color: #fff;
}

.wh-45{height: 45px; width: 45px}
.lw-card {
  background: #fff;
  border: 1px solid var(--lw-line);
  border-radius: var(--lw-radius);
  box-shadow: var(--lw-shadow); 
}
@media (min-width: 576px) {
  .p-sm-4 {
    padding: 1.5rem !important;
  }
}
.host-row {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.host-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  flex: 0 0 auto;
  position: relative;
}
.badge-verified {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  font-size: .74rem;
  font-weight: 700;
  color: #0f8a5f;
  background: #e6f6ee;
  padding: .2rem .55rem;
  border-radius: 999px;
}
.book-tabs {
  display: flex;
  gap: .3rem;
  padding: .3rem;
  background: #f5f5f7;
  border-radius: 10px;
}
.book-tab {
  flex: 1;
  padding: .38rem .5rem;
  border-radius: 8px;
  border: none;
  font-size: .78rem;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all .3s;
  background: transparent;
  color: var(--lw-muted);
  font-family: inherit;
}
.book-tab.active {
  background: #fff;
  color: var(--lw-dark);
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.meta-list {
  font-size: .84rem;
  color: var(--lw-muted);
}
.meta-list .mi {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .35rem 0;
}
.report-link {
  color: var(--lw-ink-3);
  font-weight: 600;
  font-size: .86rem;
}

/* ============================================================
   Wizard réservation
   ============================================================ */
.wizard-steps { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.wizard-steps .ws {
  flex: 1; height: 5px; border-radius: 999px; background: var(--lw-line);
}
.wizard-steps .ws.done { background: var(--lw-primary); }
.wizard-steps .ws.current { background: var(--lw-primary); }
.step-label { font-size: .8rem; color: var(--lw-ink-3); font-weight: 700; }
.wizard-pane { display: none; }
.wizard-pane.active { display: block; animation: fadeIn .25s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(6px);} to { opacity:1; transform:none; } }

.stepper { display: inline-flex; align-items: center; border: 1px solid var(--lw-line); border-radius: 12px; overflow: hidden; }
.stepper button {
  width: 42px; height: 42px; border: none; background: #fff; font-size: 1.3rem; color: var(--lw-dark); line-height: 1;
}
.stepper button:disabled { color: var(--lw-line); }
.stepper button:hover:not(:disabled) { background: var(--lw-primary-soft); color: var(--lw-primary); }
.stepper .val { width: 52px; text-align: center; font-weight: 700; }

.check-step { display: flex; gap: .8rem; padding: .7rem 0; }
.check-step .num {
  flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; background: var(--lw-primary-soft);
  color: var(--lw-primary); font-weight: 800; display: inline-flex; align-items: center; justify-content: center; font-size: .85rem;
}
.check-step .ct { color: #5b6066; line-height: 1.5; font-size: .92rem; }
.notice {
  background: var(--lw-primary-soft); border-radius: 12px; padding: .85rem 1rem;
  color: var(--lw-primary-hov); font-size: .86rem; font-weight: 600; display: flex; gap: .6rem;
}
.notice i { font-size: 1.15rem; margin-top: 1px; }
.summary-row { display: flex; justify-content: space-between; padding: .45rem 0; color: #5b6066; }
.summary-row.total { border-top: 1px solid var(--lw-line); margin-top: .4rem; padding-top: .8rem; color: var(--lw-dark); font-weight: 800; font-size: 1.05rem; }
.pay-option { cursor: pointer; }
.pay-option input { display: none; }
.pay-option .po-box {
  border: 1.5px solid var(--lw-line); border-radius: 12px; padding: .85rem 1rem; display: flex; align-items: center; gap: .7rem; font-weight: 700;
}
.pay-option input:checked + .po-box { border-color: var(--lw-primary); background: var(--lw-primary-soft); color: var(--lw-primary); }
.po-logo { width: 34px; height: 34px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.2rem; background:#fff; border:1px solid var(--lw-line); }
.oc-price {
  display: flex;
  align-items: baseline;
  gap: .4rem;
}.oc-price .amount {
  font-size: 1.5rem;
  font-weight: 800;
}.oc-grabber {
  width: 42px;
  height: 5px;
  border-radius: 999px;
  background: var(--lw-line);
  margin: 10px auto 4px;
}
/* ==========================================================================
   FICHE BIEN — parcours de réservation (modal wizard)
   ========================================================================== */
.rule-item {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  font-size: .85rem;
  color: #5b6066;
  line-height: 1.5;
  padding: .35rem 0;
}
.rule-item i { margin-top: 3px; }

.summary-block {
  background: #f9fafb;
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  padding: .75rem 1rem;
}

/* ==========================================================================
   STATISTIQUES D'UNE ANNONCE (espace hôte)
   ========================================================================== */
.lw-stat-row { margin-bottom: .8rem; }
.lw-stat-row:last-child { margin-bottom: 0; }
.lw-stat-row .progress { height: 6px; border-radius: 999px; background: var(--lw-line); margin-top: .3rem; }
.lw-stat-row .progress-bar { background: var(--lw-primary); border-radius: 999px; }

/* Aperçu des analyses réservées à l'offre Hôte Pro. Le flou n'est qu'un effet
   visuel : ce qui est rendu dessous est un gabarit vide (le serveur n'envoie
   aucune donnée réelle à un hôte non éligible), donc retirer le filtre dans
   l'inspecteur ne révèle rien. */
.lw-stats-advanced { position: relative; }
.lw-stats-advanced.is-locked .lw-stats-advanced-body {
  filter: blur(5px);
  pointer-events: none;
  user-select: none;
  opacity: .7;
}
.lw-stats-lock {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, .55);
  border-radius: 16px;
}
.lw-stats-lock-badge {
  width: 52px;
  height: 52px;
  margin: 0 auto .75rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--lw-primary-soft);
  color: var(--lw-primary);
  font-size: 1.2rem;
}

/* Barres de gabarit de l'aperçu verrouillé : aucune valeur, uniquement la forme */
.lw-stat-row-ghost .ghost-label,
.lw-stat-row-ghost .ghost-value {
  display: inline-block;
  height: 9px;
  border-radius: 999px;
  background: var(--lw-line);
}
.lw-stat-row-ghost .ghost-label { width: 38%; }
.lw-stat-row-ghost .ghost-value { width: 16%; }
.lw-stat-row-ghost .progress-bar { background: var(--lw-line); }
.pagination .page-link { font-family:var(--lw-font);font-size:.83rem;border-radius:8px !important;border:1.5px solid #e5e7eb;color:var(--lw-dark);margin:0 2px; }
.pagination .page-item.active .page-link { background:var(--lw-primary);border-color:var(--lw-primary);color:white; }
.pagination .page-link:hover { background:var(--lw-primary-soft);color:var(--lw-primary);border-color:var(--lw-primary); }

@media screen and (max-width: 885px){
    .fs-xs-12{font-size: 12px}
  .fs-xs-13{font-size: 13px}
  .fs-xs-14{font-size: 14px}
  .fs-xs-15{font-size: 15px}
  .fs-xs-16{font-size: 16px}
  .fs-xs-17{font-size: 17px}
}

/* ============================================================
   PWA — barre d'installation (topnav), boutons footer, modale
   ============================================================ */
:root { --lw-pwa-bar-h: 58px; }

/* ---- Barre d'invitation en haut de page ---- */
.lw-pwa-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1060;
  height: var(--lw-pwa-bar-h);
  display: flex;
  align-items: center;
  background: var(--lw-dark);
  color: #fff;
  box-shadow: 0 2px 10px rgba(19,19,28,.18);
}
.lw-pwa-bar[hidden] { display: none; }
.lw-pwa-bar .container { padding-top: 0; padding-bottom: 0; }

.lw-pwa-bar-close {
  width: 24px; height: 24px; flex-shrink: 0;
  border: none; border-radius: 50%;
  background: rgba(255,255,255,.12);
  color: rgba(255,255,255,.75);
  font-size: .68rem; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; cursor: pointer;
}
.lw-pwa-bar-close:hover { background: rgba(255,255,255,.22); color: #fff; }

.lw-pwa-bar-ico {
  width: 38px; height: 38px; flex-shrink: 0;
  border-radius: 10px; background: #fff; object-fit: contain;
}
.lw-pwa-bar-title {
  font-size: .82rem; font-weight: 700; line-height: 1.2;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.lw-pwa-bar-sub {
  font-size: .7rem; line-height: 1.25; color: rgba(255,255,255,.6);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.lw-pwa-bar-btn {
  flex-shrink: 0; border: none; cursor: pointer;
  background: var(--lw-primary); color: #fff;
  font-family: var(--lw-font); font-weight: 700; font-size: .78rem;
  padding: 8px 18px; border-radius: 999px;
}
.lw-pwa-bar-btn:hover { background: var(--lw-primary-hov); }

/* Decalage du site quand la barre est visible */
body.lw-pwa-bar-on #lw-navbar .lw-nav { top: var(--lw-pwa-bar-h); }
body.lw-pwa-bar-on .page-wrap { padding-top: calc(var(--lw-nav-h) + var(--lw-pwa-bar-h) + 10px); }

/* ---- Boutons d'installation dans le footer ---- */
.lw-pwa-footer-label {
  font-size: .72rem; font-weight: 700; color: rgba(255,255,255,.5);
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: .55rem;
}
.lw-pwa-store-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: 10px; cursor: pointer;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  color: rgba(255,255,255,.85);
  font-family: var(--lw-font); text-align: left;
  transition: background .15s, border-color .15s;
}
.lw-pwa-store-btn:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.3); color: #fff; }
.lw-pwa-store-btn i { font-size: 1.35rem; flex-shrink: 0; }
.lw-pwa-store-btn span { display: block; font-size: .82rem; font-weight: 700; line-height: 1.1; }
.lw-pwa-store-btn small { display: block; font-size: .62rem; font-weight: 500; color: rgba(255,255,255,.55); }

/* ---- Modale d'aide a l'installation ---- */
.lw-pwa-modal-ico { width: 40px; height: 40px; border-radius: 10px; object-fit: contain; }
.lw-pwa-step {
  display: flex; align-items: flex-start; gap: 12px;
  font-size: .85rem; line-height: 1.55; color: var(--lw-muted);
  padding: 10px 0; border-bottom: 1px solid var(--lw-line);
}
.lw-pwa-step:last-child { border-bottom: none; }
.lw-pwa-step strong { color: var(--lw-dark); }
.lw-pwa-step-num {
  width: 26px; height: 26px; flex-shrink: 0; border-radius: 50%;
  background: var(--lw-primary-soft); color: var(--lw-primary);
  font-size: .78rem; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
}
.lw-pwa-note {
  margin-top: 14px; padding: 10px 12px; border-radius: 10px;
  background: var(--lw-primary-soft); color: var(--lw-primary);
  font-size: .76rem; line-height: 1.5;
}


/* ============================================================
   PAGE DEVENIR HOTE
   ============================================================ */

/* ---- Chiffres compacts (mobile) ---- */
.lw-mini-stat {
  background: #fff; border-radius: 14px; padding: 12px 8px;
  text-align: center; box-shadow: var(--lw-shadow);
}
.lw-mini-stat .val { font-size: 1.15rem; font-weight: 800; color: var(--lw-dark); line-height: 1.1; }
.lw-mini-stat .lab { font-size: .68rem; color: var(--lw-ink-3); margin-top: 2px; }

/* ---- Intertitres de la section "Pourquoi" ---- */
.lw-why-head {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
  margin: 0 0 1rem; font-size: .85rem; font-weight: 600; color: var(--lw-muted);
}
.lw-why-head-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 12px; border-radius: 999px;
  font-size: .74rem; font-weight: 700;
  background: #f1f3f5; color: var(--lw-muted);
}
.lw-why-head-good .lw-why-head-badge { background: var(--lw-primary-soft); color: var(--lw-primary); }

/* ---- Cartes d'arguments ---- */
.lw-why-card h6 { font-size: .88rem; line-height: 1.35; }
.lw-why-text { font-size: .81rem; color: var(--lw-muted); line-height: 1.55; margin: 0; }
.lw-why-card-pain { background: #fbfbfc; }
.lw-why-card-pain .feature-icon { background: #f1f3f5; color: var(--lw-ink-3); }

.lw-why-note {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 16px; border-radius: 14px;
  background: var(--lw-primary-soft); color: var(--lw-dark);
  font-size: .84rem; line-height: 1.6;
}
.lw-why-note i { color: var(--lw-primary); font-size: 1.05rem; margin-top: 2px; flex-shrink: 0; }

/* ---- Etapes du parcours ---- */
.lw-step-card {
  background: #fff; border-radius: 16px; padding: 1.15rem;
  box-shadow: var(--lw-shadow);
}
.lw-step-card .step-num { margin-bottom: .7rem; }
.lw-step-card h6 { font-size: .9rem; }

/* ---- Bloc reservation en ligne ---- */
.lw-online-box {
  background: #fff; border-radius: 20px; padding: 1.6rem;
  box-shadow: var(--lw-shadow);
}
.lw-check-list { list-style: none; padding: 0; margin: 1rem 0 0; }
.lw-check-list li {
  display: flex; align-items: flex-start; gap: 9px;
  font-size: .83rem; color: var(--lw-muted); line-height: 1.55; margin-bottom: .6rem;
}
.lw-check-list li i { color: #22c55e; margin-top: 3px; flex-shrink: 0; }

.lw-flow { display: flex; flex-direction: column; gap: 10px; }
.lw-flow-item {
  display: flex; align-items: flex-start; gap: 12px;
  background: var(--lw-white); border-radius: 14px; padding: 12px 14px;
}
.lw-flow-ico {
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
  background: #fff; color: var(--lw-primary);
  display: flex; align-items: center; justify-content: center; font-size: .9rem;
}
.lw-flow-title { font-size: .84rem; font-weight: 700; color: var(--lw-dark); }
.lw-flow-txt { font-size: .78rem; color: var(--lw-muted); line-height: 1.5; margin-top: 2px; }

/* ---- Choix du payeur des frais (simulateur) ---- */
.lw-fee-switch { display: flex; gap: 8px; }
.lw-fee-opt { flex: 1; cursor: pointer; margin: 0; }
.lw-fee-opt input { position: absolute; opacity: 0; pointer-events: none; }
.lw-fee-opt span {
  display: block; padding: 10px 12px; border-radius: 12px;
  border: 1.5px solid #e5e7eb; background: #fff; transition: border-color .15s, background .15s;
}
.lw-fee-opt strong { display: block; font-size: .8rem; color: var(--lw-dark); }
.lw-fee-opt small { display: block; font-size: .7rem; color: var(--lw-ink-3); margin-top: 1px; }
.lw-fee-opt input:checked + span { border-color: var(--lw-primary); background: var(--lw-primary-soft); }
.lw-fee-opt input:focus-visible + span { outline: 2px solid var(--lw-primary); outline-offset: 2px; }

/* ---- Cartes de plans ---- */
.lw-plan-featured { background: var(--lw-dark); color: #fff; }
.lw-plan-featured .lw-plan-unit,
.lw-plan-featured .lw-plan-list { color: rgba(255,255,255,.8); }
.lw-plan-featured .lw-plan-list i { color: #4ade80; }
.lw-plan-unit { font-size: .76rem; color: var(--lw-ink-3); }
.lw-plan-list { font-size: .83rem; color: #4b5563; }
.lw-plan-list li { display: flex; align-items: center; gap: 8px; margin-bottom: .5rem; }
.lw-plan-list li:last-child { margin-bottom: 0; }
.lw-plan-list i { color: #22c55e; flex-shrink: 0; }

/* ---- Offres multi-biens ---- */
.lw-multi-card {
  background: #fff; border-radius: 18px; padding: 1.4rem;
  box-shadow: var(--lw-shadow);
}
.lw-multi-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: .9rem; }
.lw-multi-tags span {
  font-size: .72rem; font-weight: 600; color: var(--lw-muted);
  background: var(--lw-white); border: 1px solid var(--lw-line);
  border-radius: 999px; padding: 5px 11px;
}

/* ---- CTA final : bouton secondaire ---- */
.lw-cta-ghost {
  background: rgba(255,255,255,.14); color: #fff;
  border: 1.5px solid rgba(255,255,255,.35);
}
.lw-cta-ghost:hover { background: rgba(255,255,255,.24); color: #fff; }


/* ============================================================
   BLOC EDITORIAL SEO (bas de page commune)
   ============================================================ */
.lw-seo-block {
  background: #fff;
  border: 1px solid var(--lw-line);
  border-radius: 16px;
  padding: 1.35rem 1.4rem;
  margin-top: .5rem;
}
.lw-seo-block-title {
  font-size: 1.02rem;
  font-weight: 800;
  letter-spacing: -.01em;
  color: var(--lw-dark);
  margin: 0 0 .85rem;
  padding-bottom: .7rem;
  border-bottom: 1px solid var(--lw-line);
}
.lw-seo-block-body { font-size: .86rem; line-height: 1.75; color: var(--lw-muted); }
.lw-seo-block-body > *:last-child { margin-bottom: 0; }
.lw-seo-block-body p { margin-bottom: .85rem; }
.lw-seo-block-body h2,
.lw-seo-block-body h3,
.lw-seo-block-body h4 {
  font-size: .95rem; font-weight: 700; color: var(--lw-dark);
  margin: 1.2rem 0 .5rem;
}
.lw-seo-block-body ul,
.lw-seo-block-body ol { padding-left: 1.15rem; margin-bottom: .85rem; }
.lw-seo-block-body li { margin-bottom: .3rem; }
.lw-seo-block-body a { color: var(--lw-primary); text-decoration: underline; }
.lw-seo-block-body blockquote {
  margin: 0 0 .85rem; padding: .6rem 0 .6rem 1rem;
  border-left: 3px solid var(--lw-primary);
  color: var(--lw-dark); font-style: italic;
}
.lw-seo-block-body strong { color: var(--lw-dark); }

@media (max-width: 575.98px) {
  .lw-seo-block { padding: 1.1rem; border-radius: 14px; }
  .lw-seo-block-title { font-size: .95rem; }
}

/* =====================================================================
   PAGE BOOST — pédagogie, programmation, estimation (2026-07-24)
   ===================================================================== */

/* --- Bloc "Pourquoi booster" + avantages du pack --- */
.boost-why {
  background: #fff;
  border: 1px solid #ffe6a8;
  border-radius: 16px;
  padding: 1rem;
  box-shadow: 0 1px 2px rgba(16,24,40,.05);
}
.boost-why-head { display: flex; gap: .75rem; align-items: flex-start; margin-bottom: .9rem; }
.boost-why-spark {
  flex-shrink: 0; width: 40px; height: 40px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg,#f59e0b,#f97316); color: #fff; font-size: 1.05rem;
}
.boost-why-head h5 { font-size: 1rem; }
.boost-adv { display: flex; flex-direction: column; gap: .7rem; }
.boost-adv-item { display: flex; gap: .7rem; align-items: flex-start; }
.boost-adv-ico {
  flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center; font-size: .85rem;
}
.boost-adv-title { font-weight: 700; font-size: .85rem; margin: 0 0 .1rem; color: var(--lw-dark); }
.boost-adv-desc  { font-size: .76rem; color: #8a93a5; margin: 0; line-height: 1.35; }
.boost-soon {
  display: inline-block; font-size: .6rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .03em; color: #7c3aed; background: #efe9fd;
  padding: .08rem .4rem; border-radius: 6px; vertical-align: middle; margin-left: .25rem;
}
.boost-info-btn {
  border: 0; background: transparent; color: #9ca3af; padding: 0 .15rem; font-size: .78rem;
  vertical-align: middle; cursor: pointer;
}
.boost-info-btn:hover { color: var(--lw-primary); }

/* --- Programmation du démarrage --- */
.boost-schedule {
  background: #f9fafb; border: 1px dashed #e5e7eb; border-radius: 12px; padding: .7rem .8rem;
}

/* --- Bloc estimation (révélateur) --- */
.boost-estimate {
  border-radius: 16px; overflow: hidden;
  border: 1px solid #e6dcfb;
  background: linear-gradient(180deg,#faf7ff 0%,#ffffff 60%);
  box-shadow: 0 4px 14px rgba(124,58,237,.08);
}
.boost-estimate-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: .7rem 1rem; font-weight: 700; font-size: .84rem; color: #fff;
  background: linear-gradient(135deg,#7c3aed,#a855f7);
}
.boost-estimate-days {
  font-size: .72rem; font-weight: 700; background: rgba(255,255,255,.22);
  padding: .1rem .5rem; border-radius: 20px;
}
.boost-estimate-grid { display: flex; padding: .9rem .6rem .3rem; text-align: center; }
.boost-est-cell { flex: 1; padding: 0 .3rem; }
.boost-est-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 9px; background: #f3edfe; color: #7c3aed;
  font-size: .78rem; margin-bottom: .35rem;
}
.boost-est-val { font-weight: 800; font-size: 1.02rem; color: var(--lw-dark); line-height: 1.15; }
.boost-est-lbl { font-size: .68rem; color: #8a93a5; text-transform: uppercase; letter-spacing: .02em; margin-top: .1rem; }
.boost-estimate-foot {
  display: flex; flex-wrap: wrap; gap: .35rem 1rem; justify-content: center;
  padding: .3rem 1rem .1rem; font-size: .72rem; color: #6b7280;
}
.boost-estimate-foot i { color: #7c3aed; }
.boost-estimate-note {
  margin: 0; padding: .6rem 1rem .85rem; font-size: .7rem; color: #9198a5; line-height: 1.4;
}
.boost-estimate-note i { color: #a855f7; }
.boost-estimate-note strong { color: #6b7280; }

/* --- Alerte douce (renvoi vers Suivi de Boost) --- */
.lw-alert-soft {
  display: flex; gap: .6rem; align-items: flex-start;
  background: #f6f3fe; border: 1px solid #e6dcfb; border-radius: 12px;
  padding: .7rem .85rem; font-size: .8rem; color: #4b5563;
}

/* =====================================================================
   PAGE SUIVI DE BOOST
   ===================================================================== */
.boost-track-status {
  border-radius: 16px; padding: 1.1rem 1rem; text-align: center; color: #fff;
}
.boost-track-status.is-active   { background: linear-gradient(135deg,#f59e0b,#f97316); }
.boost-track-status.is-scheduled{ background: linear-gradient(135deg,#2563eb,#3b82f6); }
.boost-track-status.is-ended    { background: linear-gradient(135deg,#6b7280,#9ca3af); }
.boost-track-badge {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
  background: rgba(255,255,255,.22); padding: .18rem .6rem; border-radius: 20px;
}
.boost-track-count { font-size: 2.4rem; font-weight: 800; line-height: 1.05; margin-top: .4rem; }
.boost-track-count-lbl { font-size: .8rem; opacity: .9; }
.boost-track-status .pub-subtitle { color: rgba(255,255,255,.92) !important; }
.boost-track-status strong { color: #fff; }

.boost-report {
  background: #fff; border: 1px solid #eef0f4; border-radius: 16px; padding: 1rem;
  box-shadow: 0 1px 2px rgba(16,24,40,.05);
}
.boost-report-head { font-weight: 700; font-size: .85rem; color: var(--lw-dark); margin-bottom: .7rem; }
.boost-report-head i { color: #7c3aed; margin-right: .3rem; }
.boost-report-tile {
  background: #f9fafb; border-radius: 12px; padding: .7rem .3rem; text-align: center; height: 100%;
}
.boost-report-val { font-size: 1.25rem; font-weight: 800; color: #00a550; line-height: 1.1; }
.boost-report-lbl { font-size: .7rem; color: #8a93a5; text-transform: uppercase; letter-spacing: .02em; }

.boost-hist-row {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  padding: .6rem 0; border-bottom: 1px solid #f1f3f7;
}
.boost-hist-row:last-child { border-bottom: 0; }

@media (max-width: 575.98px) {
  .boost-est-val { font-size: .92rem; }
  .boost-track-count { font-size: 2rem; }
}

/* =====================================================================
   SPOT VIP — carte flottante sponsorisée (brief-spot-vip.md, 2026-07-24)
   Ne bloque jamais la page : aucun backdrop, position fixe, non modale.
   ===================================================================== */
.lw-spot {
  position: fixed;
  left: 12px; right: 12px;
  bottom: calc(var(--lw-bnav-h, 64px) + 12px);
  z-index: 1035; /* au-dessus du contenu, sous les modales système (1055) et le bottom-nav (1040) */
  background: #fff;
  border: 1px solid #ffe1a6;
  border-radius: 16px;
  box-shadow: 0 10px 34px rgba(16,24,40,.22);
  overflow: hidden;
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .3s ease, transform .3s ease;
  will-change: opacity, transform;
}
.lw-spot.is-visible { opacity: 1; transform: translateY(0); }

.lw-spot-link {
  display: flex; align-items: stretch; gap: .7rem;
  padding: .6rem; text-decoration: none; color: var(--lw-dark); position: relative;
}
.lw-spot-thumb {
  flex-shrink: 0; width: 78px; height: 78px; border-radius: 12px; overflow: hidden;
  background: #f3f4f6;
}
.lw-spot-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.lw-spot-body { display: flex; flex-direction: column; justify-content: center; min-width: 0; gap: .1rem; padding-right: .5rem; }
.lw-spot-tag {
  display: inline-flex; align-items: center; gap: .25rem;
  font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
  color: #b45309;
}
.lw-spot-title {
  font-weight: 700; font-size: .86rem; line-height: 1.2;
  overflow: hidden; text-overflow: ellipsis; display: -webkit-box;
  -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.lw-spot-loc { font-size: .72rem; color: #8a93a5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lw-spot-loc i { color: #fa454a; font-size: .66rem; }
.lw-spot-price { font-size: .82rem; font-weight: 800; color: var(--lw-dark); }
.lw-spot-price small { font-weight: 500; color: #8a93a5; font-size: .68rem; }

.lw-spot-vip {
  position: absolute; bottom: .6rem; right: .6rem;
  display: inline-flex; align-items: center; gap: .2rem;
  font-size: .6rem; font-weight: 800; color: #b45309;
  background: linear-gradient(135deg,#fff3d6,#ffe1a6);
  padding: .12rem .4rem; border-radius: 20px;
}

.lw-spot-close {
  position: absolute; top: 6px; right: 6px; z-index: 2;
  width: 26px; height: 26px; border-radius: 50%; border: 0;
  background: rgba(19,19,28,.55); color: #fff; font-size: .7rem;
  display: flex; align-items: center; justify-content: center;
  cursor: default; opacity: .35; pointer-events: none;
  transition: opacity .3s ease;
}
.lw-spot-close.is-active { opacity: 1; pointer-events: auto; cursor: pointer; }
.lw-spot-close.is-active:hover { background: rgba(19,19,28,.8); }

/* Desktop : carte compacte ancrée en bas à droite (pas de bottom-nav). */
@media (min-width: 992px) {
  .lw-spot { left: auto; right: 24px; bottom: 24px; width: 360px; }
}

/* =====================================================================
   ALERTES NOUVEAUTÉS — footer newsletter + modal ciblé (2026-07-24)
   ===================================================================== */
.foot-newsletter { max-width: 320px; }
.foot-newsletter-label { font-size: .8rem; font-weight: 700; color: #fff; display: block; margin-bottom: .2rem; }
.foot-newsletter-label i { color: #f59e0b; margin-right: .25rem; }
.foot-newsletter-hint { font-size: .76rem; color: rgba(255,255,255,.5); margin: 0 0 .6rem; }
.foot-newsletter-row { display: flex; gap: .4rem; }
.foot-newsletter-input {
  flex: 1; min-width: 0; height: 42px; border-radius: 10px;
  border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.08);
  color: #fff; padding: 0 12px; font-size: .82rem; outline: none;
}
.foot-newsletter-input::placeholder { color: rgba(255,255,255,.4); }
.foot-newsletter-input:focus { border-color: var(--lw-primary); background: rgba(255,255,255,.12); }
.foot-newsletter-btn {
  flex-shrink: 0; width: 42px; height: 42px; border-radius: 10px; border: 0;
  background: var(--lw-primary); color: #fff; font-size: .9rem; cursor: pointer;
  transition: background .18s;
}
.foot-newsletter-btn:hover { background: var(--lw-primary-hov); }

.alert-modal-ico, .alert-unsub-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 54px; height: 54px; border-radius: 16px; font-size: 1.3rem;
}
.alert-modal-ico { background: #fff3d6; color: #d97706; }
.alert-unsub-ico { background: #f3f4f6; color: #9ca3af; width: 64px; height: 64px; font-size: 1.6rem; border-radius: 18px; }