/* ═══════════════════════════════════════════════════════════════════════════
   MIDSPOT — DA « pin paysage » (planche 2)
   Chargé après styles.css et styles_cat.css : ne contient que les surcharges
   de composants propres à la nouvelle direction artistique.
   Palette et polices : voir :root dans styles.css (--forest, --sauge, --menthe,
   --sable, --terre, --soleil ; Plus Jakarta Sans titres, Inter textes).
   ═══════════════════════════════════════════════════════════════════════════ */

/* Police manuscrite des accroches (« Deux adresses, un seul spot ») */
:root {
  --ff-script: 'Caveat', 'Segoe Script', cursive;
  --r-lg: 22px;
  --pill: 999px;
}

/* ── Fonds : aplats (fin des anciennes textures à pois et du motif « M ») ── */
body::before,
#main::before,
#main::after { content: none !important; background-image: none !important; }
#sidebar,
.landing-overlay,
.lp-scroll,
.p-head,
.b-opt,
.b-opt.sel,
.cat-picker-popup,
.cat-picker-item,
.cat-picker--food:hover,
.cat-picker--sport:hover,
.cat-picker--culture:hover { background-image: none; }

/* ── Logo & wordmark ─────────────────────────────────────────────────────── */
.lp-logo-img,
.sb-mark-img { width: 36px; height: 36px; object-fit: contain; }
.lp-wordmark,
.sb-wordmark {
  font-family: var(--ff-display);
  font-weight: 800;
  letter-spacing: -.035em;
  color: var(--forest);
}
.lp-wordmark { font-size: 1.3rem; }

/* ── Header landing : barre de recherche arrondie, bouton pilule ─────────── */
.lsw-bar { border-radius: var(--r-lg); }
.lsw-field { border-radius: 16px; }
.lsw-spotter {
  border-radius: var(--pill);
  font-family: var(--ff-display);
  font-weight: 700;
}
.lsw-tab { font-family: var(--ff-display); }
.lsw-tab--culture.lsw-tab--active { border-bottom-color: var(--violet); color: #9A6B10; }

/* ── Hero ────────────────────────────────────────────────────────────────── */
.landing-inner { max-width: 1100px; }
.landing-hero,
.landing-banner { max-width: 720px; }
.landing-title {
  font-family: var(--ff-display);
  font-weight: 800;
  color: var(--forest);
  letter-spacing: -.035em;
}
.landing-desc { color: var(--muted); }
.landing-hero-badge {
  background: var(--g-light);
  border: 1px solid var(--menthe);
  color: var(--forest);
  font-family: var(--ff-display);
  padding: .3rem .8rem;
}

/* Illustration d'accueil (paysage, chemin, deux pins) */
.landing-art {
  position: relative;
  width: 100%;
  margin: -.5rem 0 0;
  border-radius: 28px;
  overflow: hidden;
  background: linear-gradient(180deg, var(--cream) 0%, var(--sable) 100%);
}
.landing-art img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1200 / 420;
  object-fit: cover;
  object-position: center bottom;
}
.landing-art-accent {
  position: absolute;
  left: 6%;
  top: 14%;
  font-family: var(--ff-script);
  font-weight: 600;
  font-size: clamp(1.35rem, 3.2vw, 2.2rem);
  line-height: 1;
  color: var(--forest);
  transform: rotate(-5deg);
  transform-origin: left center;
}
/* Trait jaune soleil sous l'accroche */
.landing-art-accent::after {
  content: '';
  display: block;
  width: 78%;
  height: 12px;
  margin-top: .15rem;
  border-bottom: 3px solid var(--soleil);
  border-radius: 0 0 60% 40%;
}

/* ── Bannière « C'est fait pour toi quand… » : aplat forêt + soleil ─────── */
.landing-banner {
  background: var(--forest);
  border-radius: 26px;
}
/* Soleil dans le coin de la bannière */
.landing-banner::before {
  top: -26px;
  right: 48px;
  width: 64px;
  height: 64px;
  background: var(--soleil);
}
.landing-banner-intro { color: var(--menthe); }

/* ── Tarifs ──────────────────────────────────────────────────────────────── */
.landing-pricing { max-width: 1000px; width: 100%; }
.pricing-card {
  border-radius: var(--r-lg);
  border: 1.5px solid var(--border);
  box-shadow: var(--shadow);
}
.pricing-badge-top { background: var(--forest); border-radius: var(--pill); }
.pricing-btn {
  border-radius: var(--pill);
  font-family: var(--ff-display);
  font-weight: 700;
}
.pricing-btn--coral { background: var(--terre); }
.pricing-btn--coral:hover { background: #C9623F; }

/* ── Boutons principaux de l'app ─────────────────────────────────────────── */
.search-btn {
  border-radius: var(--pill);
  background: var(--forest);
  box-shadow: 0 6px 18px rgba(15, 77, 63, .25);
}
.search-btn:hover:not(:disabled) { background: var(--g-deeper); }
.sidebar-premium-btn { border-radius: var(--pill); }

/* ── Mobile ──────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .landing-art { border-radius: 22px; }
  /* Recadrage léger : les deux pins (x≈300 et x≈880 sur 1200) restent visibles */
  .landing-art img { aspect-ratio: 2.1 / 1; object-position: center bottom; }
  .landing-banner::before { width: 44px; height: 44px; top: -20px; right: 22px; }
  .landing-art-accent { top: 10%; left: 5%; }
}

/* ═══ Vue app : cartes de résultats ═════════════════════════════════════════ */
.s-card { border-radius: var(--r-lg); width: 232px; }
.s-card.sel { border-color: var(--forest); }

/* « Meilleur spot » : pilule forêt, casse normale (planche) */
.sc-best-badge {
  background: var(--forest);
  color: #fff;
  border-radius: var(--pill);
  text-transform: none;
  letter-spacing: 0;
  font-family: var(--ff-display);
  font-weight: 700;
}

/* En-tête : vignette illustrée + type + nom */
.sc-head { display: flex; align-items: center; gap: .65rem; }
.sc-head-txt { min-width: 0; display: flex; flex-direction: column; gap: .12rem; }
.sc-thumb {
  flex-shrink: 0;
  width: 54px;
  height: 54px;
  border-radius: 14px;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 7px;
  background-image: url('/static/illustrations/thumb-hills.svg');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.sc-thumb span {
  font-size: 1.15rem;
  line-height: 1;
  filter: drop-shadow(0 1px 1px rgba(20, 48, 42, .15));
}
.sc-thumb--food    { background-color: #FCE3D6; }
.sc-thumb--cafe    { background-color: #FCEFC9; }
.sc-thumb--sport   { background-color: #DDF0E8; }
.sc-thumb--culture { background-color: #F3E6CE; }

.sc-cat {
  color: var(--muted);
  font-weight: 500;
  font-size: .68rem;
  letter-spacing: 0;
  font-family: var(--ff-body);
}
.sc-name { font-size: .95rem; font-weight: 800; letter-spacing: -.01em; }
.sc-desc { color: var(--muted); }

/* Note : « ★ 4,6 (124) », sans pastille jaune */
.sc-rating {
  background: none;
  border-color: transparent;
  color: var(--ink);
  padding-inline: .1rem;
  font-weight: 700;
}
.sc-star { color: var(--soleil); font-size: .85rem; }
.sc-rating-n { color: var(--muted); font-weight: 500; }

/* Lien Maps : pilule forêt au contour */
.sc-maps-link {
  color: var(--forest);
  border-color: var(--menthe);
  font-weight: 700;
}
.sc-maps-link:hover { background: var(--forest); color: #fff; border-color: var(--forest); }

.car-label { color: var(--forest); letter-spacing: .08em; }

/* Bouton « Voir les offres » : secondaire, ne concurrence pas la recherche */
.sidebar-premium-btn {
  background: transparent;
  color: var(--terre);
  border: 1.5px solid rgba(224, 123, 87, .45);
  box-shadow: none;
  font-size: .85rem;
  padding: .55rem;
}
.sidebar-premium-btn:hover { background: var(--coral-bg); color: #C45F3C; }

@media (max-width: 768px) {
  .s-card { width: 250px; }
}

/* ═══ Chips & pastilles : blanches à contour (planche), sélection forêt ═════ */
.chip,
.lsw-chip {
  background: var(--surface);
  border: 1.5px solid var(--border);
  color: var(--ink);
  font-family: var(--ff-display);
  font-weight: 600;
  box-shadow: 0 1px 4px rgba(20, 48, 42, .04);
}
.chip:hover,
.lsw-chip:hover { border-color: var(--menthe); background: var(--g-light); }
.chip.sel,
.lsw-chip--sel {
  background: var(--forest);
  border-color: var(--forest);
  color: #fff;
}
.t-pill { background: var(--surface); }
.t-pill.sel { background: var(--g-light); }
.chips-more-btn,
.lsw-chips-more-btn { border-radius: var(--pill); }
.add-p-btn { border-radius: var(--pill); }
.b-opt { background-color: var(--surface); border-radius: 14px; }
.b-opt.sel { background-color: var(--g-light); border-color: var(--sauge); }
.btn-ico svg { display: block; }

/* ═══ Carte MapLibre : contrôles aux couleurs de la DA ════════════════════════ */
.maplibregl-ctrl-group {
  border-radius: 14px !important;
  box-shadow: 0 2px 10px rgba(20, 48, 42, .1) !important;
  overflow: hidden;
}
.maplibregl-ctrl-attrib { background: rgba(251, 247, 239, .85) !important; font-family: var(--ff-body); }
.maplibregl-ctrl-attrib a { color: var(--muted); }
/* Au-dessus du carrousel de résultats */
#app.midspot-results-mode .maplibregl-ctrl-bottom-right { bottom: var(--carousel-h, 0px); }

/* Accueil de la vue carte (avant recherche) : le paysage au-dessus du texte */
#empty.map-welcome-overlay::before {
  content: '';
  display: block;
  width: min(560px, 86%);
  aspect-ratio: 1200 / 420;
  background: url('/static/illustrations/landscape.svg') center bottom / contain no-repeat;
  margin-bottom: .5rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   BARRE LATÉRALE — refonte DA : fond sable, cartes blanches flottantes
   ═══════════════════════════════════════════════════════════════════════════ */
#sidebar {
  background: var(--cream);
  border-right: 1px solid var(--border);
  box-shadow: none;
}
.sb-head {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  background: var(--cream);
  border-bottom: none;
  padding: 1.15rem 1.15rem .6rem;
}
.sb-sub { color: var(--muted); font-size: .74rem; }
#plan-badge {
  background: var(--sable) !important;
  color: var(--forest) !important;
  border-radius: var(--pill);
  font-family: var(--ff-display);
  font-weight: 800;
  letter-spacing: .06em;
}

/* Boutons ronds de l'en-tête : Accueil + compte */
.sb-head-btns { display: flex; align-items: center; gap: .4rem; }
.sb-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  height: 38px;
  min-width: 38px;
  padding: 0 .6rem;
  border-radius: var(--pill);
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--forest);
  cursor: pointer;
  font-family: var(--ff-display);
  font-weight: 700;
  font-size: .8rem;
  box-shadow: 0 1px 4px rgba(20, 48, 42, .05);
  transition: background .15s, border-color .15s, color .15s;
}
.sb-icon-btn:hover { background: var(--g-light); border-color: var(--menthe); }
.sb-icon-btn:focus-visible { outline: 2px solid var(--forest); outline-offset: 2px; }
#sb-acct-btn,
.sb-home-btn { padding: 0; width: 38px; }
.sb-icon-lbl { display: none; }   /* icône seule : place pour la marque ; libellé en aria-label / title */
.sb-head-brand { min-width: 0; }
.sb-logo--brand { flex-wrap: nowrap; white-space: nowrap; }
.cat-badge { white-space: nowrap; }
.sb-acct-initial {
  width: 28px; height: 28px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--forest); color: #fff; font-size: .8rem;
}
/* La croix mobile de fermeture reste gérée par styles.css (#nav-panel-close) */

/* Badge de catégorie */
.cat-badge { border-radius: var(--pill); font-family: var(--ff-display); font-weight: 700; }

.sb-body { background: var(--cream); padding-top: .4rem; }

/* Titres de section : libellé forêt + petit point, sans emoji */
.sec-title {
  color: var(--forest);
  font-size: .66rem;
  letter-spacing: .1em;
  font-weight: 800;
}
.sec-title::before,
.sec-title:not([data-icon])::before {
  content: '' !important;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--soleil);
  opacity: 1;
  flex-shrink: 0;
}
.sec-title::after { background: var(--cream-dark); }
.sec-optional { color: var(--muted); font-weight: 600; text-transform: none; letter-spacing: 0; }

/* ── Cartes participants ─────────────────────────────────────────────────── */
.p-card,
.p-card[data-pi="0"],
.p-card[data-pi="1"],
.p-card[data-pi="2"] {
  --pc: var(--blue);
  --pc-bg: var(--blue-bg);
  background: var(--surface);
  border: 1px solid var(--border);
  border-top: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: 0 4px 18px rgba(20, 48, 42, .06);
  margin-bottom: .75rem;
  position: relative;
}
.p-card[data-pi="1"] { --pc: var(--coral); --pc-bg: var(--coral-bg); }
.p-card[data-pi="2"] { --pc: var(--violet); --pc-bg: var(--violet-bg); }
.p-card:focus-within { z-index: 5; }

.p-head,
.lsw-panel .lsw-participants-scope .p-head {
  background: none;
  border-bottom: none;
  padding: .8rem .9rem .2rem;
}
.p-av,
.lsw-panel .lsw-participants-scope .p-av {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--pc) !important;
  color: #fff !important;
  font-family: var(--ff-display);
  font-weight: 800;
  font-size: .85rem;
  box-shadow: 0 0 0 3px var(--pc-bg);
}
.p-name-inp { font-family: var(--ff-display); font-weight: 700; font-size: .95rem; }
.rm-btn { width: 28px; height: 28px; border-radius: 50%; font-size: 1rem; }

.p-body { padding: .55rem .9rem .9rem; gap: .7rem; }

/* Champ adresse : pilule sable, picto repère à la couleur du participant */
.addr-inp-row,
.lsw-panel .lsw-participants-scope .addr-inp-row {
  background: var(--cream);
  border: 1.5px solid transparent;
  border-radius: 14px;
  min-height: 44px;
}
.addr-inp-row:focus-within,
.p-card[data-pi] .addr-inp-row:focus-within {
  background: var(--surface);
  border-color: var(--pc);
  box-shadow: 0 0 0 3px var(--pc-bg);
}
.addr-ico { position: relative; color: var(--pc); margin: 0 .3rem 0 .7rem; font-size: 0; }
.addr-ico::after { content: none !important; }
.addr-inp { font-family: var(--ff-body); font-size: .86rem; padding: .6rem .4rem; }
.addr-x { font-size: .95rem; }
/* Adresse validée : contour à la couleur du participant + pastille ✓ sur le repère */
.p-card[data-pi].addr-ok .addr-inp-row,
.lsw-panel .lsw-participants-scope .p-card.addr-ok .addr-inp-row {
  background: var(--surface);
  border-color: var(--pc);
}
.addr-ok-ico {
  display: none;
  position: absolute;
  right: -6px;
  bottom: -5px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--pc);
  color: #fff;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 2px var(--surface);
}
.p-card.addr-ok .addr-ok-ico { display: inline-flex; }
.addr-ok-ico svg { width: 9px; height: 9px; }

/* Modes de transport : 5 tuiles picto + libellé sur une seule ligne */
.t-label,
.lsw-panel .lsw-participants-scope .t-label {
  font-size: .72rem;
  font-weight: 600;
  color: var(--muted);
  text-transform: none;
  letter-spacing: 0;
  margin-bottom: -.2rem;
}
.t-row,
.lsw-panel .lsw-participants-scope .t-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .35rem;
}
.t-pill,
.lsw-panel .lsw-participants-scope .t-pill {
  flex-direction: column;
  justify-content: center;
  gap: .2rem;
  padding: .5rem .15rem .4rem;
  border-radius: 12px;
  border: 1.5px solid var(--border);
  background: var(--surface);
  color: var(--muted);
  font-size: .62rem;
  font-weight: 600;
  min-width: 0;
  white-space: nowrap;
}
.t-pill-lbl { overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.t-pill:hover { border-color: var(--menthe); color: var(--forest); }
.t-pill.sel,
.lsw-panel .lsw-participants-scope .t-pill.sel {
  background: var(--pc-bg);
  border-color: var(--pc);
  color: var(--pc);
}

/* Ajouter une personne : pilule en pointillés */
.add-p-btn {
  border: 1.5px dashed var(--menthe);
  background: transparent;
  color: var(--forest);
  font-family: var(--ff-display);
  font-weight: 700;
}
.add-p-btn:hover { background: var(--g-light); border-color: var(--sauge); }

/* Budget, période, niveau : tuiles blanches, sélection menthe */
.b-opt { border: 1.5px solid var(--border); box-shadow: 0 1px 4px rgba(20, 48, 42, .04); }
.b-lbl { font-family: var(--ff-display); font-weight: 700; color: var(--ink); }
.period-btn,
.level-btn {
  border-radius: var(--pill) !important;
  background: var(--surface);
  border: 1.5px solid var(--border);
  font-family: var(--ff-display);
  font-weight: 600;
}
.period-btn.sel,
.level-btn.sel { background: var(--forest) !important; border-color: var(--forest) !important; color: #fff !important; }

/* Curseur de durée */
#time-sl { accent-color: var(--forest); }
.sl-val { font-family: var(--ff-display); font-weight: 800; color: var(--forest); }

/* Interrupteur zones sensibles */
.tog-row { background: var(--surface); border: 1.5px solid var(--border); border-radius: 16px; }
.tog-row.on { background: var(--g-light); border-color: var(--sauge); }
.tog-lbl { display: flex; align-items: center; gap: .4rem; font-family: var(--ff-display); font-weight: 700; color: var(--ink); }
.tog-lbl svg { color: var(--sauge); flex-shrink: 0; }
.tog-row.on .tog-sw { background: var(--forest); }

/* Pied : fond sable, séparation douce */
.sb-foot { background: var(--cream); border-top: 1px solid var(--border); }

/* Pictos trait dans les puces de temps (cartes) et badges de la carte */
.t-chip,
.m-badge { display: inline-flex; align-items: center; gap: .25rem; }
.t-chip .ui-ico,
.m-badge-mode .ui-ico { display: block; }
.m-badge { font-family: var(--ff-display); }

/* ── Bouton Accueil sur la carte (mobile uniquement : sur ordinateur, il est dans la sidebar) ── */
.map-home-btn { display: none; }
@media (max-width: 768px) {
  .map-home-btn {
    display: flex;
    position: absolute;
    z-index: 950;
    top: calc(0.65rem + env(safe-area-inset-top, 0px));
    left: calc(max(0.65rem, env(safe-area-inset-left, 0px)) + 48px);
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--forest);
    box-shadow: 0 2px 10px rgba(20, 48, 42, .09);
    cursor: pointer;
  }
  #app.landing-mode .map-home-btn,
  #app.mobile-nav-open .map-home-btn { display: none; }
  .nav-burger,
  .map-acct-btn { border-radius: 12px !important; background: var(--surface) !important; color: var(--forest) !important; }
}

/* Sur ordinateur, le compte est déjà dans l'en-tête de la sidebar */
@media (min-width: 769px) {
  #app:not(.landing-mode) .map-acct-btn { display: none !important; }
}

/* Formulaire participants de l'accueil : mêmes cartes que la sidebar (sans liseré latéral) */
.lsw-panel .lsw-participants-scope .p-card[data-pi="0"],
.lsw-panel .lsw-participants-scope .p-card[data-pi="1"],
.lsw-panel .lsw-participants-scope .p-card[data-pi="2"] { border-left: 1px solid var(--border); border-radius: 20px; }
.lsw-add-p-btn {
  border: 1.5px dashed var(--menthe);
  border-radius: var(--pill);
  color: var(--forest);
  font-family: var(--ff-display);
  font-weight: 700;
  padding: .55rem 1rem;
}
.lsw-panel-close { border-radius: 50% !important; background: var(--surface) !important; border: 1px solid var(--border) !important; color: var(--forest) !important; }

/* ═══ Pictos Lucide (remplacent les emojis) ═════════════════════════════════ */
.ui-ico { display: inline-block; flex-shrink: 0; vertical-align: -0.18em; }
.ico { display: inline-flex; align-items: center; vertical-align: -0.2em; }
.ico svg { display: block; }

/* Onglets de catégorie, badges, boutons période / niveau : picto + texte alignés */
.lsw-tab,
.cat-badge,
.landing-hero-badge,
.period-btn,
.level-btn,
.lsw-period-btn,
.cookie-cat-name,
.profile-edit-trigger,
.hours-tag,
.sc-link,
.sc-phone,
.sc-venue,
.sc-trail-info,
.sc-event-date,
.sc-ending-badge,
.sc-temporality,
.sc-weather-badge,
.pricing-badge-top,
.dd-loading { display: inline-flex; align-items: center; gap: .3rem; }
.dd-loading { display: flex; }
.landing-hero-badge .ui-ico { color: var(--sauge); }
.cat-badge .ui-ico { color: currentColor; }
.cat-badge-change { margin-left: .35rem; opacity: .7; font-weight: 600; }

/* Chips : picto trait à gauche du libellé */
.chip,
.lsw-chip { display: inline-flex; align-items: center; gap: .35rem; }
.chip .ui-ico,
.lsw-chip .ui-ico { color: var(--sauge); }
.chip.sel .ui-ico,
.lsw-chip--sel .ui-ico { color: var(--soleil); }

/* Tuiles budget : picto dans une pastille */
.b-em,
.lsw-budget-ico {
  width: 36px; height: 36px; border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--g-light); color: var(--forest);
  margin-bottom: .35rem;
}
.b-opt.sel .b-em,
.lsw-budget-btn--sel .lsw-budget-ico { background: var(--forest); color: #fff; }

/* Vignettes de lieux : picto dans la vignette illustrée */
.sc-thumb { color: var(--forest); padding-top: 9px; }
.sc-thumb--food    { color: #B4532F; }
.sc-thumb--cafe    { color: #8A5F0A; }
.sc-thumb--culture { color: #6B4F1D; }

/* Liste d'autocomplétion : picto à la place de l'emoji */
.dd-ico { color: var(--sauge); display: flex; align-items: center; }

/* Historique */
.h-emoji { color: var(--forest); display: inline-flex; }

/* Sélecteur de catégorie */
.cat-picker-em { color: var(--forest); display: inline-flex; }

/* Offres de l'accueil : pastilles colorées (gratuit, flash, boost) */
.pricing-ico {
  width: 48px; height: 48px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  background: var(--g-light); color: var(--forest);
  font-size: 0;
}
.pricing-ico--flash { background: #FCE3D6; color: #C45F3C; }
.pricing-ico--boost { background: #FCEFC9; color: #9A6B10; }

/* ═══ Formulaire de l'accueil : bouton « Suivant » ══════════════════════════ */
.lsw-panel-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-top: 1rem;
  padding-top: .85rem;
  border-top: 1px solid var(--border);
}
.lsw-step { font-size: .75rem; color: var(--muted); font-weight: 600; }
.lsw-next-btn {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .7rem 1.3rem;
  border: none;
  border-radius: var(--pill);
  background: var(--forest);
  color: #fff;
  font-family: var(--ff-display);
  font-weight: 700;
  font-size: .92rem;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(15, 77, 63, .22);
  transition: background .15s, transform .15s;
}
.lsw-next-btn:hover { background: var(--g-deeper); transform: translateY(-1px); }
.lsw-next-btn--go { background: var(--terre); box-shadow: 0 4px 14px rgba(224, 123, 87, .3); }
.lsw-next-btn--go:hover { background: #C9623F; }
@media (max-width: 768px) {
  /* Bottom sheet : le bouton reste accessible en bas du panneau */
  .lsw-panel-foot {
    position: sticky;
    bottom: calc(-20px - env(safe-area-inset-bottom, 0px));
    background: var(--surface);
    margin: 1rem -16px 0;
    padding: .8rem 16px calc(.8rem + env(safe-area-inset-bottom, 0px));
  }
  .lsw-next-btn { flex: 1; justify-content: center; }
}

/* ── Suppression de compte (panneau compte › Mon profil) ── */
.account-delete { margin: 28px 1.2rem 1.2rem; border-top: 1px solid var(--border); padding-top: 14px; }
.account-delete summary { cursor: pointer; font-size: 13px; color: var(--terre); font-weight: 600; list-style: none; }
.account-delete summary::-webkit-details-marker { display: none; }
.account-delete form { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.account-delete-txt { font-size: 13px; line-height: 1.45; color: var(--muted); margin: 0; }
.account-delete input { font: inherit; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--surface); }
.account-delete-btn { align-self: flex-start; border: 0; border-radius: var(--pill); padding: 10px 18px; font-weight: 700; background: var(--terre); color: var(--sable); cursor: pointer; }
.account-delete-msg { font-size: 13px; color: var(--terre); margin: 0; min-height: 1em; }

/* ═══ Cartes de résultats : trajets en tête, appel direct ═══════════════════ */
.sc-times { display: flex; flex-wrap: wrap; gap: .3rem; }
.sc-phone { display: block; text-decoration: none; }
.sc-call-link { display: none; }

/* Échec de recherche : reste visible au-dessus du bouton jusqu'à la recherche suivante */
.search-error {
  margin: 0 0 .6rem;
  padding: .6rem .8rem;
  border-radius: 12px;
  background: var(--coral-bg);
  color: var(--terre);
  font-size: .8rem;
  line-height: 1.4;
  font-weight: 600;
}

/* ═══ Téléphone ═════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Carrousel : un peu plus haut, et la carte défile plutôt que d'être coupée */
  #carousel { max-height: min(50vh, 380px); }
  .sc-desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .sc-phone { display: none; }
  .sc-call-link { display: inline-flex; }

  /* Tiroir de recherche : le pied collant ne garde que l'essentiel (offres et mentions sont sur l'accueil) */
  .sb-foot #sidebar-premium-btn,
  .sb-foot .sb-legal { display: none; }
}

/* Suggestions d'adresse ouvertes vers le haut (champ bas de l'écran, clavier ouvert — app.js) */
.addr-dd.addr-dd--up { top: auto; bottom: calc(100% + 6px); }
@media (max-width: 768px) { .addr-dd { overflow-y: auto; overscroll-behavior: contain; } }

/* Profil : le formulaire d'édition a display:flex, qui annulait l'attribut hidden
   (vue et formulaire s'affichaient ensemble) */
#profile-edit[hidden],
#profile-view[hidden] { display: none; }

/* En-tête de l'accueil sur téléphone : la ligne logo se replie au défilement (app_cat.js) */
@media (max-width: 768px) {
  .lp-header .lp-header-row1 {
    max-height: 64px;
    overflow: hidden;
    transition: max-height .25s ease, opacity .2s ease, margin .25s ease, padding .25s ease;
  }
  .lp-header.lp-header--mobile-compact .lp-header-row1 {
    max-height: 0;
    opacity: 0;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
  }
}
@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
  .lp-header .lp-header-row1 { transition: none; }
}

/* iPhone : Safari zoome automatiquement sur tout champ dont le texte fait moins de 16 px
   (la page restait agrandie et décalée après la saisie). 16 px sur tous les écrans tactiles.
   On ne bloque pas le zoom (maximum-scale=1) : il reste utile pour l'accessibilité. */
@media (pointer: coarse), (max-width: 768px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea {
    font-size: 16px !important;
  }
}