/* ══════════════════════════════════════════════════════════════════
   Xaaya — Styles des fonctionnalités avancées (v9.1)
   Carte · Galerie · Comparateur · QR · Score de confiance ·
   Vus récemment · Recherche vocale · View Transitions
   ────────────────────────────────────────────────────────────────── */

/* ── Transitions de page fluides (navigateurs compatibles) ──────── */
@view-transition { navigation: auto; }
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
}

/* ════════════════════ CARTE INTERACTIVE ════════════════════════ */
#xmapCanvas { width: 100%; height: 100%; min-height: 420px; border-radius: var(--r-lg); overflow: hidden; z-index: 1; }
.xmap-error { display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-muted);font-size:14px; }

.xmap-pin-dot{
  width:38px;height:38px;border-radius:50% 50% 50% 0;background:var(--pin,#0468A5);
  transform:rotate(-45deg);box-shadow:0 4px 12px rgba(0,0,0,.3);
  display:flex;align-items:center;justify-content:center;border:2.5px solid #fff;
}
.xmap-pin-dot span{ transform:rotate(45deg);color:#fff;font-size:10px;font-weight:800;letter-spacing:-.02em; }

.xmap-pop{ width:240px; }
.xmap-pop-img{ height:120px;background-size:cover;background-position:center;background-color:var(--bg-raised);border-radius:8px 8px 0 0; }
.xmap-pop-body{ padding:10px 4px 4px; }
.xmap-pop-price{ font-weight:800;color:var(--primary);font-size:15px; }
.xmap-pop-title{ font-size:13px;color:var(--text-primary);margin:2px 0;line-height:1.3; }
.xmap-pop-city{ font-size:12px;color:var(--text-muted); }
.xmap-pop-link{ display:inline-block;margin-top:6px;font-size:12.5px;font-weight:700;color:var(--primary);text-decoration:none; }
.leaflet-popup-content{ margin:10px 12px; }

/* ════════════════════ GALERIE PLEIN ÉCRAN ══════════════════════ */
.xgal-overlay{
  position:fixed;inset:0;z-index:100000;background:rgba(6,12,20,.96);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  animation:xgalIn .25s ease; backdrop-filter:blur(6px);
}
@keyframes xgalIn{ from{opacity:0} to{opacity:1} }
.xgal-stage{ flex:1;display:flex;align-items:center;justify-content:center;width:100%;overflow:hidden;padding:56px 12px 0; }
.xgal-img{ max-width:92vw;max-height:74vh;object-fit:contain;border-radius:8px;transition:transform .2s ease;user-select:none;touch-action:none;box-shadow:0 24px 60px rgba(0,0,0,.5); }
.xgal-close{ position:absolute;top:14px;right:18px;background:rgba(255,255,255,.12);color:#fff;border:none;width:42px;height:42px;border-radius:50%;font-size:26px;cursor:pointer;line-height:1;z-index:2; }
.xgal-close:hover{ background:rgba(255,255,255,.25); }
.xgal-counter{ position:absolute;top:20px;left:50%;transform:translateX(-50%);color:#fff;font-size:14px;font-weight:600;background:rgba(0,0,0,.4);padding:5px 14px;border-radius:var(--r-pill); }
.xgal-nav{ position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.12);color:#fff;border:none;width:52px;height:52px;border-radius:50%;font-size:30px;cursor:pointer;z-index:2;transition:background .2s; }
.xgal-nav:hover{ background:rgba(255,255,255,.28); }
.xgal-prev{ left:16px; } .xgal-next{ right:16px; }
.xgal-thumbs{ display:flex;gap:8px;padding:14px;overflow-x:auto;max-width:96vw;scrollbar-width:thin; }
.xgal-thumb{ flex:0 0 auto;width:66px;height:50px;border-radius:7px;background-size:cover;background-position:center;border:2px solid transparent;cursor:pointer;opacity:.55;transition:.2s; }
.xgal-thumb.active{ opacity:1;border-color:#fff; }
@media (max-width:640px){ .xgal-nav{width:42px;height:42px;font-size:24px;} .xgal-img{max-height:64vh;} }

/* ════════════════════ COMPARATEUR ══════════════════════════════ */
#xcompare-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:9996;
  background:var(--bg-card);border-top:1px solid var(--border-default);
  box-shadow:0 -8px 28px rgba(4,104,165,.14);animation:xbarUp .3s ease;
}
@keyframes xbarUp{ from{transform:translateY(100%)} to{transform:translateY(0)} }
.xcompare-inner{ max-width:var(--max-w,1200px);margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px; }
.xcompare-count{ font-size:14px;color:var(--text-secondary); }
.xcompare-count strong{ color:var(--primary);font-size:16px; }
.xcompare-actions{ display:flex;gap:8px; }

.xcompare-overlay{ position:fixed;inset:0;z-index:100001;background:var(--bg-scrim,rgba(6,12,20,.6));display:flex;align-items:center;justify-content:center;padding:20px;animation:xgalIn .2s ease;backdrop-filter:blur(4px); }
.xcompare-modal{ background:var(--bg-base);border-radius:var(--r-xl);max-width:1000px;width:100%;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--shadow-xl); }
.xcompare-head{ display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--border-divider); }
.xcompare-head h3{ font-size:18px; }
.xcompare-x{ background:none;border:none;font-size:28px;line-height:1;cursor:pointer;color:var(--text-muted); }
.xcompare-body{ overflow:auto;padding:0; }
.xcompare-loading{ padding:48px;text-align:center;color:var(--text-muted); }
.xcompare-table-wrap{ overflow-x:auto; }
.xcompare-table{ width:100%;border-collapse:collapse;font-size:13.5px; }
.xcompare-table th,.xcompare-table td{ padding:12px 14px;border-bottom:1px solid var(--border-divider);text-align:center;vertical-align:middle; }
.xcompare-table thead th{ position:sticky;top:0;background:var(--bg-card);z-index:1;min-width:160px; }
.xcompare-label{ text-align:left !important;font-weight:600;color:var(--text-secondary);background:var(--bg-surface);position:sticky;left:0; }
.xcompare-card{ display:block;text-decoration:none;color:inherit; }
.xcompare-thumb{ height:90px;border-radius:8px;background:var(--bg-raised) center/cover no-repeat;display:flex;align-items:center;justify-content:center;margin-bottom:8px; }
.xcompare-thumb span{ font-size:11px;color:var(--text-hint); }
.xcompare-name{ font-size:13px;font-weight:600;color:var(--text-primary);line-height:1.3; }
.xcompare-remove{ margin-top:6px;background:none;border:none;color:var(--danger);font-size:12px;cursor:pointer; }

/* Bouton "Comparer" sur cartes */
.compare-btn.active{ background:var(--primary) !important;color:#fff !important;border-color:var(--primary) !important; }

/* ════════════════════ QR CODE ══════════════════════════════════ */
.xqr-overlay{ position:fixed;inset:0;z-index:100001;background:var(--bg-scrim,rgba(6,12,20,.6));display:flex;align-items:center;justify-content:center;padding:20px;animation:xgalIn .2s ease;backdrop-filter:blur(4px); }
.xqr-box{ background:var(--bg-card);border-radius:var(--r-xl);padding:28px;text-align:center;max-width:320px;position:relative;box-shadow:var(--shadow-xl); }
.xqr-close{ position:absolute;top:10px;right:14px;background:none;border:none;font-size:24px;cursor:pointer;color:var(--text-muted); }
.xqr-title{ font-weight:700;margin-bottom:16px;color:var(--text-primary); }
.xqr-canvas{ display:flex;align-items:center;justify-content:center;min-height:220px; }
.xqr-canvas canvas{ border-radius:10px; }
.xqr-loading{ color:var(--text-muted);font-size:13px; }
.xqr-hint{ margin-top:14px;font-size:12.5px;color:var(--text-muted); }

/* ════════════════════ SCORE DE CONFIANCE ═══════════════════════ */
.trust-panel{ border:1px solid var(--border-default);border-radius:var(--r-lg);padding:18px;background:var(--bg-card); }
.trust-gauge{ display:flex;align-items:center;gap:16px;margin-bottom:14px; }
.trust-ring{ position:relative;width:72px;height:72px;flex-shrink:0; }
.trust-ring svg{ transform:rotate(-90deg); }
.trust-ring-val{ position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:800;font-size:18px; }
.trust-ring-val small{ font-size:9px;font-weight:600;color:var(--text-muted); }
.trust-level{ font-weight:800;font-size:16px; }
.trust-sub{ font-size:12.5px;color:var(--text-muted); }
.trust-signals{ display:flex;flex-direction:column;gap:7px; }
.trust-signal{ display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-secondary); }
.trust-signal .ts-ic{ width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:11px;font-weight:800; }
.ts-ok{ background:var(--success-dim);color:var(--success); }
.ts-no{ background:var(--danger-dim);color:var(--danger); }
.ts-neutral{ background:var(--bg-raised);color:var(--text-muted); }

/* Verdict de prix */
.price-verdict{ display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;padding:5px 12px;border-radius:var(--r-pill); }
.pv-good{ background:var(--success-dim);color:var(--success); }
.pv-warn{ background:var(--warning-dim);color:var(--warning); }
.pv-neutral{ background:var(--primary-dim);color:var(--primary); }

/* ════════════════════ VUS RÉCEMMENT ════════════════════════════ */
.recent-strip{ display:flex;gap:12px;overflow-x:auto;padding:4px 2px 12px;scrollbar-width:thin; }
.recent-card{ flex:0 0 auto;width:150px;text-decoration:none;color:inherit;background:var(--bg-card);border:1px solid var(--border-divider);border-radius:var(--r-md);overflow:hidden;transition:transform .15s,box-shadow .15s; }
.recent-card:hover{ transform:translateY(-3px);box-shadow:var(--shadow-md); }
.recent-thumb{ height:90px;background:var(--bg-raised) center/cover no-repeat;display:flex;align-items:center;justify-content:center; }
.recent-thumb span{ font-size:11px;color:var(--text-hint); }
.recent-info{ padding:8px 10px; }
.recent-price{ font-weight:800;color:var(--primary);font-size:13px; }
.recent-title{ font-size:12px;color:var(--text-secondary);line-height:1.3;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }

/* ════════════════════ RECHERCHE VOCALE ═════════════════════════ */
.voice-btn{ background:none;border:none;cursor:pointer;color:var(--text-muted);display:inline-flex;align-items:center;justify-content:center;padding:6px;border-radius:50%;transition:.2s; }
.voice-btn:hover{ color:var(--primary);background:var(--primary-dim); }
.voice-btn.listening{ color:#fff;background:var(--danger);animation:voicePulse 1.2s infinite; }
@keyframes voicePulse{ 0%,100%{box-shadow:0 0 0 0 rgba(230,51,35,.5)} 50%{box-shadow:0 0 0 8px rgba(230,51,35,0)} }

/* Bouton flottant "autour de moi" sur la carte */
.xmap-locate{ position:absolute;right:14px;bottom:14px;z-index:1000;background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--r-pill);padding:9px 16px;font-size:13px;font-weight:700;color:var(--primary);cursor:pointer;box-shadow:var(--shadow-md);display:inline-flex;align-items:center;gap:7px; }
.xmap-locate:hover{ background:var(--primary);color:#fff; }

/* ════════════════════ BASCULE DE LANGUE FR/EN ══════════════════ */
.xnav-lang-toggle{
  display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:34px;padding:0 10px;
  background:var(--bg-raised);border:1px solid var(--border-default);border-radius:var(--r-md);
  font-family:var(--font-heading,inherit);font-size:12.5px;font-weight:800;letter-spacing:.04em;
  color:var(--text-secondary);cursor:pointer;transition:.18s;
}
.xnav-lang-toggle:hover{ background:var(--primary);color:#fff;border-color:var(--primary); }