/* ============================================================
   WOUGGO V2 — app.css
   ============================================================ */

body { background:var(--color-bg); overflow-x:hidden; margin:0; }

/* ── Sidebar ─────────────────────────────────────────────── */
/* Sidebar : definie une seule fois dans components.css.
   Ne pas la redefinir ici (la nav changerait de largeur
   d'une page a l'autre). */

/* ── Page wrapper ────────────────────────────────────────── */
.page-wrap { margin-left:var(--wg-sidebar-w);height:100vh;overflow:hidden; }
@media(max-width:768px){
  .page-wrap { margin-left:0; overflow-x:hidden; }
}

/* ── Vues ────────────────────────────────────────────────── */
.view { height:100vh;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;max-width:100%; }
.view.hidden { display:none; }

/* ══ VUE CHAT ═══════════════════════════════════════════════ */
#view-chat { background:var(--color-bg); }

/* Header — identique à l'original */
.chat-header {
  display:flex;justify-content:space-between;align-items:center;
  padding:.75rem 1rem;
  background:#fff;border-bottom:1px solid var(--color-border);
  position:sticky;top:0;z-index:10;flex-shrink:0;
}
.chat-header__left { display:flex;align-items:center;gap:.75rem; }
.chat-back { display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--color-bg);color:var(--color-txt);text-decoration:none;transition:background .15s; }
.chat-back:hover { background:#F0E8DF; }
.chat-header__title { font-size:1rem;font-weight:700;color:var(--color-txt); }
.location-pill { display:flex;align-items:center;gap:4px;padding:.375rem .875rem;border:1.5px solid var(--color-border-md);border-radius:999px;font-size:var(--text-caption);font-weight:500;color:var(--color-txt);background:#fff;cursor:pointer;transition:all .15s;font-family:inherit; }
.location-pill:hover { border-color:var(--color-accent);color:var(--color-accent); }

/* ── Zone messages ──────────────────────────────────────── */
.chat-messages {
  flex:1; overflow-y:auto;
  padding:1.5rem 1rem;
  display:flex; flex-direction:column;
  gap:1rem;
}

/* Wrapper centré pour chaque ligne de message */
.chat-msg-row {
  display:flex;
  width:100%;
  max-width:760px;
  margin:0 auto;
}

/* Ligne IA : avatar + bulle */
.chat-msg-row--ia {
  align-items:flex-end;
  gap:.75rem;
}

/* Ligne user : bulle à droite */
.chat-msg-row--user {
  justify-content:flex-end;
}

/* Avatar IA — cercle couleur ligne + favicon */
.chat-avatar-ia {
  width:36px; height:36px;
  border-radius:50%;
  background:var(--color-surf);
  border:1.5px solid var(--color-accent);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  align-self:flex-end;
  margin-bottom:2px;
  overflow:hidden;
}
.chat-avatar-ia::after { display:none; }
.chat-avatar-ia img {
  width:22px; height:22px;
  object-fit:contain;
}

/* Bulle IA — hauteur s'adapte au contenu */
.chat-bubble--ia {
  background:#fff; color:var(--color-txt);
  padding:1.125rem 1.375rem;
  border-radius:20px 20px 20px 6px;
  box-shadow:0 2px 12px rgba(0,0,0,.07);
  font-size:var(--text-body); line-height:1.6;
  word-break:break-word;
  display:inline-block;
  max-width:85%;
  width:fit-content;
  height:auto;
  min-height:0;
}
.chat-bubble--ia strong { color:var(--color-accent); }
.chat-bubble--ia p { margin-bottom:.5rem; }
.chat-bubble--ia p:last-child { margin-bottom:0; }

/* Bulle user — hauteur s'adapte au contenu */
.chat-bubble--user {
  background:var(--color-accent); color:#fff;
  padding:.625rem 1.125rem;
  border-radius:22px 22px 6px 22px;
  font-size:var(--text-body); line-height:1.5;
  word-break:break-word;
  display:inline-block;
  max-width:65%;
  width:fit-content;
  height:auto;
  min-height:0;
}

/* Typing indicator — fit-content */
.chat-typing-row {
  display:flex;
  align-items:flex-end;
  gap:.75rem;
  width:100%;
  max-width:760px;
  margin:0 auto;
}
.chat-typing {
  display:inline-flex; gap:5px; align-items:center;
  padding:0;
  background:transparent;
  width:fit-content;
}
.chat-typing span {
  width:7px; height:7px;
  background:var(--color-accent);
  border-radius:50%;
  animation:typing 1.2s infinite;
  opacity:.4;
  flex-shrink:0;
}
.chat-typing span:nth-child(2){animation-delay:.2s}
.chat-typing span:nth-child(3){animation-delay:.4s}
@keyframes typing{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-7px);opacity:1}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.9)}}

/* Bulle en mode typing — override complet */
.chat-bubble--ia.chat-bubble--typing {
  padding:.5rem .75rem;
  line-height:1;
  width:auto;
  max-width:none;
  min-width:0;
  display:inline-flex;
  align-items:center;
  height:auto;
}

/* ── Suggestions — centrées ─────────────────────────────── */
.chat-suggestions {
  display:flex;gap:.5rem;overflow-x:auto;
  padding:.5rem 1rem;
  scrollbar-width:none;flex-shrink:0;
  justify-content:center;
  flex-wrap:wrap;
  max-width:720px;
  width:100%;
  align-self:center;
}
.chat-suggestions::-webkit-scrollbar{display:none}
.chat-suggestion {
  flex-shrink:0;padding:.375rem .875rem;
  background:#fff;border:1.5px solid var(--color-border-md);border-radius:999px;
  font-size:var(--text-caption);font-weight:500;color:var(--color-txt);cursor:pointer;
  font-family:inherit;white-space:nowrap;transition:all .15s;
}
.chat-suggestion:hover{background:var(--color-accent);border-color:var(--color-accent);color:#fff;}

/* ── Barre saisie — centrée, max-width ─────────────────── */
.chat-input-wrap {
  flex-shrink:0;
  padding:.625rem 1rem;
  padding-bottom:calc(.625rem + env(safe-area-inset-bottom));
  background:#fff;border-top:1px solid var(--color-border);
  display:flex;flex-direction:column;align-items:center;gap:.375rem;
  position:relative;
  z-index:300; /* au-dessus de la bottom-nav (z-index:200) */
}
.chat-input-bar {
  display:flex;gap:.5rem;align-items:flex-end;
  width:100%;max-width:720px;
}
.chat-input {
  flex:1;min-height:44px;max-height:120px;
  padding:.6875rem 1rem;
  border:1.5px solid var(--color-border-md);border-radius:22px;
  font-size:16px; /* 16px min obligatoire — évite le zoom iOS au focus */
  font-family:inherit;
  resize:none;outline:none;
  background:var(--color-bg);color:var(--color-txt);
  transition:border-color .15s;line-height:1.4;
}
.chat-input:focus{border-color:var(--color-accent);background:#fff;}
.chat-input::placeholder{color:var(--color-muted);}
.chat-send-btn {
  width:44px;height:44px;flex-shrink:0;
  background:var(--color-accent);color:#fff;border-radius:50%;border:none;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:background .15s,transform .15s;
}
.chat-send-btn:hover{background:var(--color-accent-dark);transform:scale(1.05);}
.chat-send-btn:disabled{background:#DDD5CC;cursor:not-allowed;transform:none;}
.chat-footer-label{text-align:center;font-size:.6875rem;color:var(--color-muted);margin:.375rem 0 0;}

/* ══ VUE RÉSULTATS ══════════════════════════════════════════ */
#view-results { background:var(--color-bg); overflow-y:auto; }

.results-header {
  display:flex; align-items:center; gap:.75rem;
  padding:.75rem 1rem; background:var(--color-surf);
  border-bottom:0.5px solid var(--color-border);
  position:sticky; top:0; z-index:10; flex-shrink:0;
}
.results-back {
  display:flex; align-items:center; gap:.375rem;
  padding:.375rem .875rem; border-radius:var(--wg-r-pill);
  background:var(--color-bg); border:none; cursor:pointer;
  font-size:var(--text-label); font-weight:500;
  color:var(--color-txt); font-family:inherit;
  transition:background var(--wg-transition); white-space:nowrap;
}
.results-back svg { width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.results-back:hover { background:var(--color-deep); }
.results-query {
  font-size:var(--text-label); color:var(--color-sub);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-style:italic;
}

.filter-bar {
  display:flex; gap:.5rem; overflow-x:auto;
  padding:.625rem 1rem; scrollbar-width:none;
  flex-shrink:0; background:var(--color-surf);
  border-bottom:0.5px solid var(--color-border);
}
.filter-bar::-webkit-scrollbar { display:none; }
.filter-pill {
  flex-shrink:0; padding:.375rem .875rem; border-radius:var(--wg-r-pill);
  font-size:var(--text-caption); font-weight:500;
  border:1.5px solid var(--color-border-md);
  background:var(--color-surf); color:var(--color-txt);
  cursor:pointer; font-family:inherit; transition:all var(--wg-transition);
  white-space:nowrap;
}
.filter-pill:hover,
.filter-pill.active { background:var(--color-accent); border-color:var(--color-accent); color:#fff; }

/* ── Grille résultats — responsive ───────────────────────── */
.results-grid {
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:.875rem;
  padding:1rem 1rem 2rem;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}

@media(max-width:1200px) {
  .results-grid { grid-template-columns:repeat(4, 1fr); }
}

@media(max-width:900px) {
  .results-grid { grid-template-columns:repeat(3, 1fr); }
}

@media(max-width:600px) {
  .results-grid {
    grid-template-columns:repeat(2, 1fr) !important;
    gap:.5rem !important;
    padding:.5rem .5rem 5rem !important;
    margin:0 !important;
  }
}

@media(max-width:768px) {
  .results-header { padding:.625rem .75rem !important; }
  .filter-bar     { padding:.5rem .75rem !important; }
  .page-wrap      { padding-left:0 !important; padding-right:0 !important; }
}

/* Les cartes .card-lieu dans la grille résultats */
.results-grid .card-lieu {
  width:100%;
  min-width:0;
}

/* Carte résultat */
.result-card{background:var(--color-surf);border-radius:var(--wg-r-xl);box-shadow:0 2px 16px rgba(83,40,34,.08);overflow:hidden;cursor:pointer;transition:transform .2s,box-shadow .2s;width:100%;box-sizing:border-box;}
.result-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(83,40,34,.13);}
.result-card__img{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--color-raised);}
.result-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .3s;}
.result-card:hover .result-card__img img{transform:scale(1.04);}
.result-card__ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:48px;}
.result-card__badges{position:absolute;top:8px;left:8px;display:flex;flex-direction:column;gap:4px;}
.result-niv{position:absolute;top:8px;right:8px;padding:3px 8px;border-radius:999px;font-size:var(--text-micro);font-weight:700;color:#fff;}
.result-niv--gold{background:#F59E0B;}.result-niv--green{background:#10B981;}
.result-flash{position:absolute;bottom:8px;left:8px;padding:3px 8px;border-radius:999px;font-size:var(--text-micro);font-weight:700;color:#fff;background:var(--color-accent);animation:pulse-flash 1.5s infinite;}
.result-card__body{padding:.875rem;}
.result-card__nom{font-size:var(--text-body);font-weight:700;color:var(--color-txt);margin:0 0 4px;}
.result-card__meta{font-size:var(--text-caption);color:var(--color-sub);margin:0 0 3px;}
.result-card__note{font-size:var(--text-caption);font-weight:600;color:var(--color-txt);margin:0 0 4px;}
.result-card__note span{font-weight:400;color:var(--color-muted);}
.result-card__raison{font-size:.75rem;color:var(--color-accent);font-style:italic;margin:.375rem 0 .625rem;padding:.375rem .625rem;background:var(--color-bg);border-radius:8px;border-left:3px solid var(--color-accent);}
.result-card__actions{display:flex;gap:.5rem;margin-top:.5rem;}

/* ══ VUES DÉTAIL ════════════════════════════════════════════ */
#view-lieu, #view-evenement { background:var(--color-bg); }

/* ── Header flottant ─────────────────────────────────────── */
.dl-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;position:sticky;top:0;z-index:50;background:rgba(254,244,234,.92);backdrop-filter:blur(8px);border-bottom:0.5px solid var(--color-border);}
.dl-btn-icon{width:36px;height:36px;border-radius:50%;background:var(--color-surf);border:0.5px solid var(--color-border-md);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--color-txt);transition:background var(--wg-transition);}
.dl-btn-icon:hover{background:var(--color-raised);}
.dl-header-actions{display:flex;gap:.5rem;flex-wrap:wrap;}
.dl-btn-pill{display:inline-flex;align-items:center;gap:5px;padding:.375rem .875rem;background:var(--color-surf);border:0.5px solid var(--color-border-md);border-radius:var(--wg-r-pill);font-size:var(--text-caption);font-weight:500;cursor:pointer;color:var(--color-txt);font-family:inherit;transition:all var(--wg-transition);white-space:nowrap;}
.dl-btn-pill:hover{border-color:var(--color-accent);color:var(--color-accent);}
.dl-btn-pill.active{background:var(--color-accent-dim);border-color:var(--color-accent);color:var(--color-accent);}

/* ── Body ────────────────────────────────────────────────── */
.dl-body{
  padding:0 1.5rem 100px;
  max-width:1060px;
  margin:0 auto;
}

/* ── Top : titre + badges ────────────────────────────────── */
.dl-top{margin-bottom:1.25rem;}
.dl-titre{font-size:var(--text-h1);font-weight:700;color:var(--color-txt);margin-bottom:.625rem;line-height:1.25;}
.dl-badges{display:flex;flex-wrap:wrap;gap:.375rem;margin-bottom:.625rem;}
.dl-badge{padding:3px 10px;border-radius:var(--wg-r-pill);font-size:var(--text-micro);font-weight:600;}
.dl-badge--verifie{background:var(--color-success-light);color:var(--color-success-txt);}
.dl-badge--business{background:var(--color-gold-bg);color:var(--color-gold);}
.dl-badge--ouvert{background:var(--color-success-light);color:var(--color-success-txt);}
.dl-badge--ferme{background:var(--color-danger-bg);color:var(--color-danger);}
.dl-badge--cat{background:var(--color-raised);color:var(--color-sub);}
.dl-sous-titre{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:var(--text-caption);color:var(--color-sub);}
.dl-dot{width:3px;height:3px;background:var(--color-muted);border-radius:50%;}
.dl-note-inline{color:var(--color-accent);font-weight:600;}
.dl-avis-link{text-decoration:underline;cursor:pointer;}
.dl-prix{font-weight:600;color:var(--color-txt);}

/* ── Slider photos ───────────────────────────────────────── */
.dl-slider {
  position:relative; width:100%; height:340px;
  overflow:hidden; border-radius:var(--wg-r-xl);
  margin-bottom:0; background:var(--color-raised);
  cursor:grab;
}
.dl-slider:active { cursor:grabbing; }
.dl-slider-track {
  display:flex; height:100%;
  transition:transform .35s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
.dl-slide { flex-shrink:0; width:100%; height:100%; }
.dl-slide img { width:100%; height:100%; object-fit:cover; display:block; }
.dl-slider-ph {
  width:100%; height:280px; border-radius:var(--wg-r-xl);
  background:var(--color-raised); display:flex;
  align-items:center; justify-content:center;
  font-size:4rem; margin-bottom:1.5rem;
}

/* Boutons prev/next */
.dl-slider-btn {
  position:absolute; top:50%; transform:translateY(-50%);
  width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,.88); backdrop-filter:blur(6px);
  border:0.5px solid var(--color-border-md); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  color:var(--color-txt); transition:background var(--wg-transition);
  z-index:5;
}
.dl-slider-btn:hover { background:#fff; }
.dl-slider-btn--prev { left:12px; }
.dl-slider-btn--next { right:12px; }

/* Dots */
.dl-slider-dots {
  position:absolute; bottom:12px; left:50%; transform:translateX(-50%);
  display:flex; gap:5px; z-index:5;
}
.dl-slider-dot {
  width:6px; height:6px; border-radius:50%;
  background:rgba(255,255,255,.5); cursor:pointer;
  transition:all .2s;
}
.dl-slider-dot.active { background:#fff; width:18px; border-radius:3px; }

/* Compteur */
.dl-slider-counter {
  position:absolute; top:12px; right:12px;
  background:rgba(0,0,0,.45); color:#fff; backdrop-filter:blur(4px);
  border-radius:20px; padding:3px 10px;
  font-size:var(--text-micro); font-weight:600; z-index:5;
}

@media(max-width:600px){
  .dl-slider { height:260px; border-radius:0; margin-left:-1.25rem; margin-right:-1.25rem; width:calc(100% + 2.5rem); }
}

/* ── Billetterie ─────────────────────────────────────────── */
.billet-form-group { display:flex; flex-direction:column; gap:.25rem; margin-bottom:.625rem; }
.billet-label { font-size:var(--text-caption); font-weight:600; color:var(--color-txt); }
.billet-input {
  height:40px; padding:0 .875rem;
  border:1.5px solid var(--color-border-md);
  border-radius:var(--wg-r-lg); font-size:var(--text-label);
  font-family:inherit; color:var(--color-txt);
  background:var(--color-raised); outline:none;
  transition:border-color var(--wg-transition);
}
.billet-input:focus { border-color:var(--color-accent); background:var(--color-surf); }

.billet-qty-row { display:flex; align-items:center; gap:.75rem; }
.billet-qty-btn {
  width:32px; height:32px; border-radius:50%;
  background:var(--color-raised); border:1.5px solid var(--color-border-md);
  font-size:18px; cursor:pointer; display:flex;
  align-items:center; justify-content:center;
  color:var(--color-txt); font-family:inherit;
  transition:all var(--wg-transition);
}
.billet-qty-btn:hover { background:var(--color-accent); color:#fff; border-color:var(--color-accent); }
.billet-qty-val { font-size:var(--text-h3); font-weight:700; color:var(--color-txt); min-width:24px; text-align:center; }
.billet-total { font-size:var(--text-label); color:var(--color-sub); margin:.25rem 0; }
.billet-qr-btn {
  display:inline-flex; align-items:center; gap:.375rem;
  padding:.5rem 1.25rem; border-radius:var(--wg-r-lg);
  background:var(--color-accent); color:#fff;
  border:none; font-size:var(--text-label); font-weight:600;
  cursor:pointer; font-family:inherit;
  transition:background var(--wg-transition);
}
.billet-qr-btn:hover { background:var(--color-accent-dark); }

/* Modal billet QR */
.billet-modal-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.55);
  z-index:9000; display:flex; align-items:center; justify-content:center;
  padding:1.25rem;
}
.billet-modal {
  background:var(--color-surf); border-radius:var(--wg-r-xl);
  width:100%; max-width:340px; padding:1.5rem;
  position:relative; text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.3);
}
.billet-modal-close {
  position:absolute; top:.875rem; right:.875rem;
  width:28px; height:28px; border-radius:50%;
  background:var(--color-raised); border:none; cursor:pointer;
  font-size:14px; color:var(--color-sub); display:flex;
  align-items:center; justify-content:center;
}
.billet-modal-header { margin-bottom:1rem; }
.billet-modal-event { font-size:var(--text-label); font-weight:700; color:var(--color-txt); margin-bottom:.25rem; }
.billet-modal-date  { font-size:var(--text-caption); color:var(--color-sub); }
.billet-modal-lieu  { font-size:var(--text-caption); color:var(--color-sub); }
.billet-qr-wrap {
  background:var(--color-raised); border-radius:var(--wg-r-lg);
  padding:1rem; display:flex; align-items:center; justify-content:center;
  margin:1rem 0;
}
.billet-modal-infos { margin-bottom:.75rem; }
.billet-modal-infos p { font-size:var(--text-caption); color:var(--color-sub); margin:2px 0; }
.billet-code {
  font-family:monospace; font-size:var(--text-micro);
  background:var(--color-raised); padding:3px 8px;
  border-radius:4px; display:inline-block; margin-top:.25rem;
  color:var(--color-muted);
}
.billet-modal-mention { font-size:var(--text-micro); color:var(--color-muted); }
/* ── Layout détail événement 3 colonnes ──────────────────── */
.ev-layout {
  display:grid; grid-template-columns:320px 1fr 300px;
  gap:2rem; padding:1.5rem 1.5rem 4rem;
  max-width:1200px; margin:0 auto; align-items:start;
}
@media(max-width:1024px){
  .ev-layout{grid-template-columns:280px 1fr;}
  .ev-col-widget{grid-column:1 / -1;}
}
@media(max-width:700px){
  .ev-layout{grid-template-columns:1fr;padding:.75rem .75rem 5rem;gap:1rem;}
}
.ev-affiche-wrap{border-radius:var(--wg-r-xl);overflow:hidden;aspect-ratio:3/4;background:var(--color-raised);position:sticky;top:80px;}
.ev-affiche-wrap img{width:100%;height:100%;object-fit:cover;display:block;}
.ev-affiche-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:5rem;background:var(--color-raised);}
.ev-col-infos{padding-top:.25rem;}
.ev-titre{font-size:1.75rem;font-weight:800;color:var(--color-txt);line-height:1.2;margin-bottom:.75rem;}
.ev-badges{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.5rem;}
.ev-prix-inline{font-size:var(--text-label);color:var(--color-sub);margin-bottom:1.25rem;}
.ev-pub{border-radius:var(--wg-r-xl);overflow:hidden;border:1.5px solid #FDBA74;cursor:pointer;margin-bottom:1rem;transition:border-color var(--wg-transition),box-shadow var(--wg-transition);}
.ev-pub:hover{border-color:var(--color-accent);box-shadow:0 4px 20px rgba(249,115,22,.12);}
.ev-pub img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;}
.ev-pub__body{padding:.75rem;background:var(--color-surf);}
.ev-pub__label{display:inline-block;font-size:9px;font-weight:700;background:rgba(249,115,22,.9);color:#fff;padding:2px 8px;border-radius:4px;margin-bottom:.25rem;letter-spacing:.04em;text-transform:uppercase;}
.ev-pub__titre{font-size:var(--text-caption);font-weight:700;color:var(--color-txt);margin-bottom:.25rem;}
.ev-pub__desc{font-size:var(--text-micro);color:var(--color-sub);margin-bottom:.375rem;}
.ev-pub__cta{font-size:var(--text-micro);font-weight:700;color:var(--color-accent);}

/* ── Layout media row (slider + widget côte à côte) ─────── */
.dl-media-row {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 1.5rem;
  margin-bottom: .25rem;
  align-items: start;
}
@media(max-width:900px) {
  .dl-media-row { grid-template-columns: 1fr; }
  .dl-media-right { display: none; }
}

.dl-media-left .dl-slider {
  height: 420px;
  border-radius: var(--wg-r-xl);
}
@media(max-width:900px) {
  .dl-media-left .dl-slider { height: 260px; border-radius: 0; margin-left: -1.25rem; margin-right: -1.25rem; width: calc(100% + 2.5rem); }
}

/* ── Galerie Airbnb 1+2 ──────────────────────────────────── */
.dl-galerie {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-rows: 220px 220px;
  gap: 6px;
  border-radius: var(--wg-r-xl);
  overflow: hidden;
  margin-bottom: .875rem;
  cursor: pointer;
}
.dl-galerie__main {
  grid-row: 1 / 3;
  overflow: hidden;
  position: relative;
}
.dl-galerie__main img,
.dl-galerie__thumb img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform .3s ease;
}
.dl-galerie__main:hover img,
.dl-galerie__thumb:hover img { transform: scale(1.04); }
.dl-galerie__thumbs { display: contents; }
.dl-galerie__thumb {
  overflow: hidden; position: relative; background: var(--color-raised);
}
.dl-galerie__ph { width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:3rem; }
.dl-galerie__ph-full { height:440px;border-radius:var(--wg-r-xl);display:flex;align-items:center;justify-content:center;font-size:5rem;background:var(--color-raised);margin-bottom:.875rem; }
.dl-galerie__thumb--last { position: relative; }
.dl-galerie__voir-tout {
  position: absolute; bottom: 10px; right: 10px;
  background: rgba(255,255,255,.95); border: 1px solid #E5E7EB;
  border-radius: 8px; padding: 6px 12px;
  font-size: 12px; font-weight: 600; font-family: inherit;
  cursor: pointer; color: #532822;
  display: flex; align-items: center; gap: 6px;
  transition: background .15s;
}
.dl-galerie__voir-tout:hover { background: #fff; }
/* La version mobile de la galerie est definie en bas de ce
   fichier (carrousel a accroche). Ne pas la redefinir ici. */

/* ── Lightbox ─────────────────────────────────────────────── */
.dl-lightbox {
  position: fixed; inset: 0; background: rgba(0,0,0,.92);
  z-index: 9000; display: flex; align-items: center;
  justify-content: center; padding: 1rem;
}
.dl-lightbox__close {
  position: absolute; top: 1rem; right: 1rem;
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,255,255,.15); border: none;
  color: #fff; font-size: 18px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s;
}
.dl-lightbox__close:hover { background: rgba(255,255,255,.25); }
.dl-lightbox__img-wrap { max-width: 90vw; max-height: 90vh; position: relative; text-align: center; }
.dl-lightbox__img-wrap img { max-width: 100%; max-height: 86vh; object-fit: contain; border-radius: 8px; display: block; }
.dl-lightbox__counter { color: rgba(255,255,255,.7); font-size: 13px; margin-top: 8px; }
.dl-lightbox__nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,255,255,.15); border: none;
  color: #fff; cursor: pointer; display: flex;
  align-items: center; justify-content: center;
  transition: background .15s;
}
.dl-lightbox__nav:hover { background: rgba(255,255,255,.25); }
.dl-lightbox__nav--prev { left: 1rem; }
.dl-lightbox__nav--next { right: 1rem; }

/* ── Slider lieu — format carré universel ── */
.dl-layout-left .dl-slider { height: auto; aspect-ratio: 1/1; margin-bottom: .875rem; }
.dl-slide { position: relative; width: 100%; height: 100%; overflow: hidden; flex-shrink: 0; }
.dl-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }

.dl-media-right { position: sticky; top: 80px; }

/* Sur desktop : masquer la col-right dans le main-grid */
.dl-col-right--mobile { display: none; }
@media(max-width:900px) {
  .dl-col-right--mobile { display: block; }
  .dl-main-grid { grid-template-columns: 1fr !important; }
}

.dl-mini-map {
  width:100%; height:280px;
  border-radius:var(--wg-r-lg);
  overflow:hidden; margin-top:.875rem;
  border:0.5px solid var(--color-border);
  cursor:pointer;
  z-index:0;
}
.dl-mini-map--hidden { display:none; }

/* ── Card adresse ────────────────────────────────────────── */
.dl-adresse-card {
  display:flex; align-items:center; justify-content:space-between;
  background:var(--color-raised); border-radius:var(--wg-r-lg);
  padding:.875rem 1rem; gap:1rem;
  border:0.5px solid var(--color-border);
}
.dl-adresse-info {
  display:flex; align-items:flex-start; gap:.625rem; flex:1; min-width:0;
}
.dl-adresse-info svg { flex-shrink:0; color:var(--color-accent); margin-top:2px; }
.dl-adresse-rue  { font-size:var(--text-label); font-weight:500; color:var(--color-txt); }
.dl-adresse-ville{ font-size:var(--text-caption); color:var(--color-sub); margin-top:2px; }
.dl-adresse-link {
  font-size:var(--text-caption); font-weight:600; color:var(--color-accent);
  text-decoration:none; white-space:nowrap; flex-shrink:0;
  transition:opacity var(--wg-transition);
}
.dl-adresse-link:hover { opacity:.75; }

/* ── Layout détail lieu ──────────────────────────────────── */
.dl-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 1.5rem;
  align-items: start;
}
.dl-layout-left  { min-width: 0; }
.dl-layout-right { position: sticky; top: 80px; }

.dl-layout-left .dl-slider { height: 420px; margin-bottom: .875rem; }

@media(max-width:900px) {
  .dl-layout { grid-template-columns: 1fr; }
  .dl-layout-right { display: none; }
  .dl-layout-left .dl-slider { height: 260px; border-radius: 0; margin-left: -1.25rem; margin-right: -1.25rem; width: calc(100% + 2.5rem); }
}

/* ── Sections ────────────────────────────────────────────── */
.dl-section{padding:1.25rem 0;border-bottom:0.5px solid var(--color-border);}
.dl-section:last-child{border-bottom:none;}
.dl-section-title{font-size:var(--text-h3);font-weight:700;color:var(--color-txt);margin-bottom:.875rem;}
.dl-section-sub{font-size:var(--text-caption);font-weight:400;color:var(--color-sub);margin-left:.375rem;}

/* ── Host ────────────────────────────────────────────────── */
.dl-host-row{display:flex;align-items:center;gap:.875rem;}
.dl-host-avatar{width:48px;height:48px;border-radius:50%;background:var(--color-accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--text-h3);font-weight:700;flex-shrink:0;}
.dl-host-name{font-size:var(--text-label);font-weight:600;color:var(--color-txt);}
.dl-host-sub{font-size:var(--text-caption);color:var(--color-sub);}

/* ── Flash ───────────────────────────────────────────────── */
.dl-flash{display:flex;align-items:flex-start;gap:.75rem;background:var(--color-accent-dim);border:0.5px solid rgba(240,94,43,.25);border-radius:var(--wg-r-lg);padding:.875rem 1rem;margin-bottom:1rem;}
.dl-flash-icon{font-size:1.25rem;flex-shrink:0;}
.dl-flash-txt{font-size:var(--text-label);font-weight:600;color:var(--color-accent);}
.dl-flash-expire{font-size:var(--text-caption);color:var(--color-sub);margin-top:2px;}

/* ── Description ─────────────────────────────────────────── */
.dl-desc{font-size:var(--text-body);color:var(--color-sub);line-height:1.65;}
.dl-desc--collapsed{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.dl-show-more{font-size:var(--text-label);font-weight:600;color:var(--color-txt);text-decoration:underline;cursor:pointer;background:none;border:none;font-family:inherit;margin-top:.5rem;padding:0;}

/* ── Tags ────────────────────────────────────────────────── */
.dl-tags-wrap{display:flex;flex-wrap:wrap;gap:.5rem;}
.dl-tag{padding:6px 14px;border:0.5px solid var(--color-border-md);border-radius:var(--wg-r-pill);font-size:var(--text-caption);color:var(--color-sub);}

/* ── Horaires ────────────────────────────────────────────── */
.dl-horaires{display:grid;grid-template-columns:auto 1fr;gap:5px 1.25rem;}
.dl-h-jour{font-size:var(--text-label);color:var(--color-sub);}
.dl-h-jour.today{font-weight:700;color:var(--color-txt);}
.dl-h-heure{font-size:var(--text-label);color:var(--color-txt);}
.dl-h-heure.open{color:var(--color-success-txt);font-weight:600;}
.dl-h-heure.ferme{color:var(--color-danger);}

/* ── Section header avec bouton PDF ─────────────────────── */
.dl-section-header {
  display:flex; align-items:center;
  justify-content:space-between;
  margin-bottom:.875rem;
}
.dl-section-header .dl-section-title { margin-bottom:0; }

.dl-menu-pdf-btn {
  display:inline-flex; align-items:center; gap:.375rem;
  padding:.375rem .875rem;
  background:var(--color-raised);
  border:0.5px solid var(--color-border-md);
  border-radius:var(--wg-r-pill);
  font-size:var(--text-caption); font-weight:600;
  color:var(--color-txt); text-decoration:none;
  transition:all var(--wg-transition);
  white-space:nowrap;
  flex-shrink:0;
}
.dl-menu-pdf-btn:hover {
  background:var(--color-accent-dim);
  border-color:var(--color-accent);
  color:var(--color-accent);
}
.dl-menu-pdf-btn svg { stroke:currentColor; flex-shrink:0; }
.dl-menu{display:flex;flex-direction:column;gap:1rem;}
.dl-menu-cat{font-size:var(--text-micro);font-weight:700;color:var(--color-txt);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.5rem;}
.dl-menu-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:0.5px solid var(--color-border);}
.dl-menu-item:last-child{border-bottom:none;}
.dl-menu-nom{font-size:var(--text-label);color:var(--color-txt);}
.dl-menu-prix{font-size:var(--text-label);font-weight:700;color:var(--color-gold);flex-shrink:0;margin-left:1rem;}

/* ── Localisation ────────────────────────────────────────── */
.dl-adresse{font-size:var(--text-label);color:var(--color-sub);margin-bottom:.875rem;}
.dl-map-placeholder{display:flex;align-items:center;justify-content:center;gap:.5rem;height:140px;background:var(--color-raised);border:0.5px solid var(--color-border);border-radius:var(--wg-r-lg);font-size:var(--text-label);color:var(--color-sub);cursor:pointer;transition:background var(--wg-transition);margin-top:.75rem;}
.dl-map-placeholder:hover{background:var(--color-deep);}

/* ── Avis ────────────────────────────────────────────────── */
.dl-avis-item{padding:.875rem 0;border-bottom:0.5px solid var(--color-border);}
.dl-avis-item:last-child{border-bottom:none;}
.dl-avis-head{display:flex;align-items:center;gap:.75rem;margin-bottom:.5rem;}
.dl-avis-avatar{width:38px;height:38px;border-radius:50%;background:var(--color-accent-dim);display:flex;align-items:center;justify-content:center;font-size:var(--text-label);font-weight:700;color:var(--color-accent);flex-shrink:0;}
.dl-avis-meta{flex:1;min-width:0;}
.dl-avis-nom{font-size:var(--text-label);font-weight:600;color:var(--color-txt);}
.dl-avis-date{font-size:var(--text-caption);color:var(--color-sub);}
.dl-avis-etoiles-row{display:flex;gap:2px;flex-shrink:0;}
.dl-avis-txt{font-size:var(--text-label);color:var(--color-sub);line-height:1.55;margin-top:.25rem;}
.dl-avis-vide{font-size:var(--text-label);color:var(--color-muted);font-style:italic;padding:.5rem 0;}

/* ── Formulaire notation ─────────────────────────────────── */
.dl-avis-form {
  background:var(--color-raised);
  border-radius:var(--wg-r-lg);
  padding:1rem; margin-bottom:1.25rem;
  border:0.5px solid var(--color-border);
}
.dl-avis-form-label {
  font-size:var(--text-label); font-weight:600;
  color:var(--color-txt); margin-bottom:.625rem;
}
.dl-avis-stars-input {
  display:flex; gap:6px; margin-bottom:.875rem;
}
.dl-avis-star-btn {
  width:32px; height:32px; border:none; background:none;
  cursor:pointer; padding:0; border-radius:4px;
  transition:transform .1s;
}
.dl-avis-star-btn:hover { transform:scale(1.15); }
.dl-avis-star-btn svg {
  width:28px; height:28px; display:block;
}
.dl-avis-star-btn svg path { fill:var(--color-border-md); transition:fill .15s; }
.dl-avis-star-btn.hovered svg path,
.dl-avis-star-btn.selected svg path { fill:var(--color-gold); }

.dl-avis-textarea {
  width:100%; border:0.5px solid var(--color-border-md);
  border-radius:var(--wg-r-md); padding:.625rem .875rem;
  font-size:var(--text-label); font-family:inherit;
  color:var(--color-txt); background:var(--color-surf);
  resize:none; outline:none; margin-bottom:.75rem;
  transition:border-color var(--wg-transition);
}
.dl-avis-textarea:focus { border-color:var(--color-accent); }
.dl-avis-textarea::placeholder { color:var(--color-muted); }

.dl-avis-submit {
  width:100%; padding:.75rem; border-radius:var(--wg-r-md);
  background:var(--color-accent); color:#fff; border:none;
  font-size:var(--text-label); font-weight:600; font-family:inherit;
  cursor:pointer; transition:background var(--wg-transition);
}
.dl-avis-submit:hover:not(:disabled) { background:var(--color-accent-dark); }
.dl-avis-submit:disabled {
  background:var(--color-border); color:var(--color-muted); cursor:not-allowed;
}

/* Mini-carte cachée si pas de coords */
.dl-mini-map--hidden { display:none; }

/* ── Bloc publicitaire colonne droite ────────────────────── */
.dl-pub-block { margin-top:.75rem; }

.dl-pub-card {
  display:block; text-decoration:none;
  background:var(--color-surf);
  border:0.5px solid var(--color-border-md);
  border-radius:var(--wg-r-xl);
  overflow:hidden;
  transition:box-shadow var(--wg-transition);
}
.dl-pub-card:hover { box-shadow:var(--wg-shadow-md); }

.dl-pub-label {
  font-size:var(--text-micro);
  font-weight:500;
  color:var(--color-muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  padding:.5rem .875rem .25rem;
}
.dl-pub-img {
  width:100%;
  aspect-ratio:16/7;
  object-fit:cover;
  display:block;
}
.dl-pub-body {
  padding:.875rem;
}
.dl-pub-titre {
  font-size:var(--text-label);
  font-weight:700;
  color:var(--color-txt);
  margin-bottom:.25rem;
}
.dl-pub-desc {
  font-size:var(--text-caption);
  color:var(--color-sub);
  line-height:1.5;
  margin-bottom:.625rem;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.dl-pub-cta {
  display:inline-flex;
  align-items:center;
  gap:.375rem;
  font-size:var(--text-caption);
  font-weight:600;
  color:var(--color-accent);
}

/* Pub fictive */
.dl-pub-card--fictive {
  background:linear-gradient(135deg, var(--color-raised) 0%, #fff 100%);
  border-style:dashed;
  cursor:default;
}
.dl-pub-fictive-hero {
  display:flex; align-items:center; gap:.875rem;
  background:var(--color-accent-dim);
  padding:1rem .875rem;
  font-size:2rem;
}
.dl-pub-fictive-tag {
  font-size:var(--text-label); font-weight:700;
  color:var(--color-accent);
}
.dl-pub-fictive-sub {
  font-size:var(--text-caption); color:var(--color-sub);
  margin-top:2px;
}
.dl-pub-cta-btn {
  display:inline-flex; align-items:center;
  padding:.5rem 1rem;
  background:var(--color-accent); color:#fff;
  border-radius:var(--wg-r-pill);
  font-size:var(--text-caption); font-weight:600;
  text-decoration:none;
  transition:background var(--wg-transition);
  margin-top:.25rem;
}
.dl-pub-cta-btn:hover { background:var(--color-accent-dark); }

/* ── Carte droite supprimée ──────────────────────────────── */
.dl-mini-map-right { display:none; }
.dl-col-right{position:sticky;top:80px;}
.dl-contact-card{background:var(--color-surf);border:0.5px solid var(--color-border-md);border-radius:var(--wg-r-xl);padding:1.25rem;box-shadow:var(--wg-shadow-md);}
.dl-contact-prix{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.75rem;}
.dl-contact-prix-val{font-size:var(--text-h2);font-weight:700;color:var(--color-txt);}
.dl-contact-prix-label{font-size:var(--text-caption);color:var(--color-sub);}
.dl-contact-note{display:flex;align-items:center;gap:.5rem;font-size:var(--text-caption);margin-bottom:1rem;border-top:0.5px solid var(--color-border);padding-top:.75rem;}
.dl-contact-note-avis{text-decoration:underline;cursor:pointer;color:var(--color-sub);}
.dl-contact-mention{font-size:var(--text-micro);color:var(--color-muted);text-align:center;margin-top:.75rem;}

/* ── CTAs ────────────────────────────────────────────────── */
.dl-cta{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.875rem 1rem;border-radius:var(--wg-r-lg);font-size:var(--text-label);font-weight:600;font-family:inherit;cursor:pointer;text-decoration:none;margin-bottom:.5rem;transition:all var(--wg-transition);border:none;}
.dl-cta--whatsapp{background:#25D366;color:#fff;}
.dl-cta--whatsapp:hover{background:#1DA851;}
.dl-cta--secondary{background:transparent;color:var(--color-txt);border:0.5px solid var(--color-border-md);}
.dl-cta--secondary:hover{border-color:var(--color-accent);color:var(--color-accent);background:var(--color-accent-dim);}
.dl-cta--ghost{background:var(--color-raised);color:var(--color-txt);}
.dl-cta--ghost:hover{background:var(--color-deep);}
.dl-cta--parcours{background:var(--color-accent-dim);color:var(--color-accent);}
.dl-cta--parcours:hover{background:rgba(240,94,43,.18);}
.dl-cta--sm{padding:.625rem 1rem;font-size:var(--text-caption);flex:1;}

/* ── Barre mobile ────────────────────────────────────────── */
.dl-mobile-bar{display:none !important;}

/* ══ BOTTOM NAV ════════════════════════════════════════════ */
.bottom-nav{display:none;}
@media(max-width:768px){
  .bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;height:64px;background:#fff;border-top:1px solid var(--color-border);align-items:center;justify-content:space-around;z-index:200;padding-bottom:env(safe-area-inset-bottom);}
  .page-wrap{padding-bottom:64px;}
  .detail-header{position:fixed;}
}
.bottom-nav__item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:44px;color:var(--color-muted);text-decoration:none;cursor:pointer;transition:color .15s;}
.bottom-nav__item.active{color:var(--color-accent);}
.bottom-nav__label{font-size:var(--text-micro);font-weight:500;}
.bnav-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;}
.bnav-icon svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.bnav-center{position:relative;}
.bnav-fab{width:52px;height:52px;background:var(--color-accent);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:-16px;box-shadow:0 4px 16px rgba(249,115,22,.4);}
.bnav-fab svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}

/* ── Misc ─────────────────────────────────────────────────── */
.villes-list{display:flex;flex-direction:column;gap:4px;max-height:300px;overflow-y:auto;}
.ville-item{display:flex;justify-content:space-between;align-items:center;padding:.625rem 1rem;border-radius:8px;cursor:pointer;transition:background .15s;}
.ville-item:hover{background:var(--color-bg);}
.ville-item__nom{font-weight:600;color:var(--color-txt);}
.ville-item__pays{font-size:var(--text-label);color:var(--color-sub);}
@keyframes pulse-flash{0%,100%{opacity:1}50%{opacity:.7}}

/* ══ RESPONSIVE MOBILE CHAT ══════════════════════════════════ */
@media (max-width: 767px) {
  /* Vue chat pleine hauteur */
  #view-chat {
    display: flex;
    flex-direction: column;
    height: 100dvh;
    /* Espace pour la barre de saisie fixe. --chat-bar-h est MESUREE en JS :
       la hauteur reelle varie selon le bandeau, la zone de securite de
       l'iPhone et le champ qui grandit sur plusieurs lignes. La valeur de
       repli sert uniquement avant la premiere mesure. */
    padding-bottom: var(--chat-bar-h, calc(84px + env(safe-area-inset-bottom, 0px)));
  }

  /* Messages scrollables */
  .chat-messages {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    /* Marge supplementaire : le dernier message doit rester entierement
       visible une fois le defilement arrive en bas. */
    padding-bottom: 1rem;
    scroll-padding-bottom: 1rem;
  }

  /* Input fixé en bas, JAMAIS couvert par quoi que ce soit */
  .chat-input-wrap {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    background: #fff !important;
    border-top: 1px solid var(--color-border) !important;
    padding: 0.625rem 1rem !important;
    padding-bottom: calc(0.625rem + env(safe-area-inset-bottom)) !important;
  }

  /* Anti-zoom iOS */
  .chat-input {
    font-size: 16px !important;
  }

  /* Bouton send toujours cliquable */
  .chat-send-btn {
    min-width: 48px !important;
    min-height: 48px !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    cursor: pointer !important;
  }
}

/* ══ MASQUER LA BOTTOM-NAV SUR LA PAGE CHAT MOBILE ══════════ */
/* La bottom-nav interfère avec le champ de saisie du chat */
@media (max-width: 767px) {
  #view-chat ~ .bottom-nav,
  #view-chat:not(.hidden) ~ * .bottom-nav {
    display: none !important;
  }
}

/* ══ CLAVIER OUVERT (mobile) ═════════════════════════════════
   Quand le clavier occupe la moitie de l'ecran, chaque pixel compte : on
   masque le bandeau sous la barre de saisie pour garder le maximum de
   place aux messages. L'en-tete reste visible : il porte le bouton de
   fermeture, et le masquer provoquerait un saut visuel.
   ============================================================ */
@media (max-width: 767px) {
  body.clavier-ouvert .chat-footer-label { display: none; }
}

/* ══ FICHE DETAIL — ORDRE MOBILE ═════════════════════════════
   Sur telephone, l'ordre du bureau n'est pas le bon : le prix et le bouton
   de contact se retrouvaient tout en bas, apres les avis. L'utilisateur
   devait traverser toute la page pour savoir combien ca coute et appeler.
   On reordonne en CSS (le HTML garde l'ordre du bureau, non modifie).

   Deux niveaux d'imbrication :
     .dl-layout-left  > galerie | dl-col-left (sections) | contact
     .dl-col-left     > flash | sections

   Chaque section porte une classe dediee : certaines sont conditionnelles
   (menu, ambiance), donc un ordre base sur la position serait faux.
   ============================================================ */
@media (max-width: 767px) {
  /* Niveau 1 : photos -> prix/contact -> le reste */
  .dl-layout-left { display: flex; flex-direction: column; }
  .dl-layout-left > .dl-galerie          { order: 1; }
  .dl-layout-left > .dl-col-right--mobile{ order: 2; }
  .dl-layout-left > .dl-col-left         { order: 3; }

  /* Niveau 2 : ordre des sections */
  .dl-col-left { display: flex; flex-direction: column; }
  .dl-col-left > .dl-flash          { order: 1; }
  .dl-col-left > .dl-s-desc         { order: 2; }
  .dl-col-left > .dl-s-horaires     { order: 3; }
  .dl-col-left > .dl-s-localisation { order: 4; }
  .dl-col-left > .dl-s-menu         { order: 5; }
  .dl-col-left > .dl-s-ambiance     { order: 6; }
  .dl-col-left > .dl-s-avis         { order: 7; }
  .dl-col-left > .dl-s-host         { order: 8; }
}

/* ── Bloc prix + contact compact (fiche mobile) ────────────────
   Prix a gauche, deux boutons ronds a droite. La note d'avis et
   "Ajouter au parcours" ont ete retirees de ce bloc : elles
   existent deja sur la page (section avis + pilule "Parcours" du
   header flottant). Le widget sticky desktop (.dl-layout-right)
   utilise .dl-contact-card SANS --compact : il garde ses CTA
   pleine largeur, ne pas y toucher. ──────────────────────────── */
.dl-contact-card--compact{padding:1rem 1.125rem;}
.dl-contact-row{display:flex;align-items:center;justify-content:space-between;gap:.875rem;}
.dl-contact-card--compact .dl-contact-prix{flex:1;min-width:0;flex-wrap:wrap;gap:.375rem;margin-bottom:0;}
.dl-contact-card--compact .dl-contact-prix-val{white-space:nowrap;}
.dl-contact-card--compact .dl-contact-mention{margin-top:.75rem;}

.dl-contact-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0;}
.dl-ico-cta{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;text-decoration:none;flex-shrink:0;transition:all var(--wg-transition);}
.dl-ico-cta--whatsapp{background:#25D366;color:#fff;}
.dl-ico-cta--whatsapp:hover{background:#1DA851;}
.dl-ico-cta--secondary{background:var(--color-raised);color:var(--color-txt);border:0.5px solid var(--color-border-md);}
.dl-ico-cta--secondary:hover{border-color:var(--color-accent);color:var(--color-accent);background:var(--color-accent-dim);}

/* .dl-col-right est sticky (top:80px) pour le widget desktop. Sur
   mobile la colonne est affichee dans le flux (max-width:900px) :
   on annule le sticky, sinon le bloc prix reste colle sous le
   header pendant le scroll. */
@media (max-width:900px){
  .dl-col-right--mobile{position:static;top:auto;}
}

@media (max-width:359px){
  .dl-contact-card--compact .dl-contact-prix-val{font-size:var(--text-h3);}
  .dl-ico-cta{width:40px;height:40px;}
}

/* ════════════════════════════════════════════════════════════
   GALERIE FICHE — CARROUSEL A ACCROCHE SUR MOBILE
   ------------------------------------------------------------
   En desktop la galerie est une grille 1 grande + 2 vignettes.
   Transposee telle quelle sur un ecran de 390px, elle donnait
   deux vignettes d'environ 120px de large : illisibles.

   Sur mobile elle devient un carrousel qui defile a l'horizontale
   avec accroche (scroll-snap) : une photo plein cadre par geste,
   avec l'inertie native du navigateur. Pas une ligne de JS —
   donc rien a gerer cote glisser-deposer, et ca reste fluide sur
   un telephone modeste.

   .dl-galerie__thumbs est deja en display:contents, les vignettes
   sont donc des enfants directs et deviennent des diapositives.
   ════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .dl-galerie {
    display: flex;
    grid-template-columns: none;
    grid-template-rows: none;
    gap: 6px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
  }
  .dl-galerie::-webkit-scrollbar { display: none; }

  .dl-galerie__main,
  .dl-galerie__thumb {
    display: block;          /* les vignettes etaient masquees ici */
    flex: 0 0 100%;
    grid-row: auto;
    height: 290px;
    scroll-snap-align: center;
    overflow: hidden;
  }

  /* La vignette "+N photos" garde son voile par-dessus l'image. */
  .dl-galerie__voir-tout { font-size: var(--text-label); }
}

/* ══ DESKTOP : LES RÉSULTATS EN TROISIÈME COLONNE ════════════
   Au-dessus de 1180px, les résultats ne remplacent plus le chat :
   ils s'ouvrent dans une colonne à sa droite et la conversation
   reste utilisable pendant qu'on parcourt les cartes.
   Les fiches lieu/événement, elles, continuent de prendre toute
   la largeur — leur mise en page est pensee pour ça.

   Tout est conditionne a @supports : un navigateur sans container
   queries ne saurait pas redimensionner la grille dans le panneau,
   il garde donc le comportement actuel (une vue a la fois). */
@supports (container-type: inline-size) {
  @media (min-width: 1180px) {
    .page-wrap { display: flex; align-items: stretch; }
    .view      { flex: 1 1 0; min-width: 0; }

    /* Le chat passe de pleine largeur à colonne : on accompagne le
       mouvement plutôt que de le faire sauter. La règle globale
       prefers-reduced-motion de components.css neutralise ça. */
    #view-chat { transition: flex-basis .3s cubic-bezier(.22,.61,.36,1); }

    /* Panneau ouvert : le chat se resserre, les résultats prennent le reste. */
    body.wg-panneau #view-chat {
      flex: 0 0 clamp(380px, 38%, 560px);
      border-right: 1px solid var(--color-border);
    }
    body.wg-panneau #view-results { flex: 1 1 0; }

    /* Les deux en-têtes sont côte à côte : leurs barres doivent
       s'aligner, sinon le décalage de quelques pixels saute aux yeux. */
    body.wg-panneau .chat-header,
    body.wg-panneau .results-header { min-height: 61px; box-sizing: border-box; }

    /* En panneau, "Retour" devient "Fermer" : on ne quitte pas une page,
       on referme une colonne. Deux boutons distincts plutot qu'un libelle
       reecrit en JS — chacun garde son icone et son intitule. */
    body.wg-panneau .results-back  { display: none; }
    body.wg-panneau .results-close { display: inline-flex; }
  }
}

/* Bouton "Fermer" du panneau — masqué partout ailleurs. */
.results-close {
  display: none;
  align-items: center; gap: .375rem;
  padding: .375rem .875rem; border-radius: var(--wg-r-pill);
  border: 1.5px solid var(--color-border-md); background: var(--color-surf);
  color: var(--color-txt); font-family: inherit; font-size: var(--text-caption);
  font-weight: 600; cursor: pointer; flex-shrink: 0;
  transition: border-color .15s, color .15s;
}
.results-close:hover { border-color: var(--color-accent); color: var(--color-accent); }

/* ── Grille résultats : largeur du PANNEAU, pas de la fenêtre ──
   Les media queries plus haut raisonnaient en largeur d'écran ; dans
   une colonne de 500px sur un écran de 1400px elles donneraient cinq
   cartes côte à côte. Le conteneur devient la référence. */
#view-results { container-type: inline-size; container-name: wg-panneau; }

@container wg-panneau (max-width: 1200px) { .results-grid { grid-template-columns: repeat(4, 1fr); } }
@container wg-panneau (max-width:  900px) { .results-grid { grid-template-columns: repeat(3, 1fr); } }
@container wg-panneau (max-width:  620px) {
  .results-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: .5rem !important;
    padding: .5rem .5rem 5rem !important;
    margin: 0 !important;
  }
}

/* ══ CARTE "VOIR LES PROPOSITIONS" ═══════════════════════════
   Chaque réponse de l'IA qui a produit des résultats garde sa
   propre carte : on peut rouvrir les propositions d'il y a trois
   questions sans relancer la recherche. Remplace l'ancien bouton
   unique, qui ne pointait que vers la dernière. */
.chat-res-card {
  display: flex; align-items: center; gap: .625rem;
  width: 100%; margin-top: .875rem;
  padding: .625rem .75rem;
  background: var(--color-bg);
  border: 1.5px solid var(--color-border-md);
  border-radius: var(--wg-r-lg, 14px);
  font-family: inherit; text-align: left; cursor: pointer;
  transition: border-color .15s, background .15s;
}
.chat-res-card:hover { border-color: var(--color-accent); background: var(--color-accent-light); }
/* Carte dont les résultats sont actuellement à l'écran. */
.chat-res-card.active { border-color: var(--color-accent); background: var(--color-accent-light); }

.chat-res-card__ico {
  display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; flex-shrink: 0;
  border-radius: 9px; background: var(--color-accent); color: #fff;
}
.chat-res-card__txt   { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.chat-res-card__titre { font-size: var(--text-caption); font-weight: 700; color: var(--color-txt); line-height: 1.3; }
.chat-res-card__sub   {
  font-size: var(--text-label, 11px); color: var(--color-muted); line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.chat-res-card__fleche { color: var(--color-muted); flex-shrink: 0; display: flex; }
.chat-res-card:hover .chat-res-card__fleche,
.chat-res-card.active .chat-res-card__fleche { color: var(--color-accent); }

/* Un lieu sans numero WhatsApp n'affiche pas de bouton WhatsApp.
   Les aides whatsappReserver/whatsappContacter renvoient une chaine
   vide dans ce cas ; sans cette regle, le lien pointerait sur la page
   courante et donnerait un bouton mort. */
#view-lieu a[href=""] { display: none !important; }