/* ============================================================================
   REFONTE APP — Écran VOYAGES fidèle maquette 09. Scopé html.apprefonte + ≤768px.
   Additif/réversible. Chargé après zz-*.css (ordre alpha) → prime.
   ============================================================================ */
html.apprefonte .ar-voyages { display: none; }

@media (max-width: 768px), (pointer: coarse) and (max-width: 1366px), (display-mode: standalone) and (max-width: 1366px) {
  html.apprefonte:has(.ar-voyages) .pub-content > *:not(.ar-voyages):not(.ann-banner-wrap):not(.flash) { display: none !important; }
  /* AUDIT COUVERTURE 15/08 : gater `:has(.ar-voyages)` — sinon la topbar est masquée aussi sur
     les pages sœurs page-voyages SANS bloc refonte (mes-brouillons, edit-voyage, voyage-inviter,
     compagnons-inviter, parcours) → barre du haut disparue. */
  html.apprefonte:has(.ar-voyages) body.page-voyages .pub-topbar { display: none !important; }

  html.apprefonte .ar-voyages { display: block; padding: 6px 14px calc(var(--ar-navh,64px) + var(--ar-safe-b,0px) + 84px); color: var(--ar-ink); }

  /* En-tête */
  html.apprefonte .ar-vy-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:12px 0 4px; }
  html.apprefonte .ar-vy-titles h1 { margin:0; font:800 27px/1.05 'Inter',system-ui,sans-serif; color:var(--ar-ink); letter-spacing:-.3px; }
  html.apprefonte .ar-vy-titles p { margin:6px 0 0; font-size:13.5px; color:var(--ar-ink-soft); }
  html.apprefonte .ar-vy-hact { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
  html.apprefonte .ar-vy-hact .ar-ic { width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--ar-surface);border:1px solid var(--ar-hairline);font-size:18px;text-decoration:none; }
  html.apprefonte .ar-vy-hact .ar-av { width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--ar-cyan);color:var(--ar-on-accent);font-weight:800;font-size:14px;text-decoration:none; }

  /* Bouton principal */
  html.apprefonte .ar-vy-propose { display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 2px;padding:15px;width:100%;box-sizing:border-box;border:0;border-radius:var(--ar-r-md,16px);background:var(--ar-cyan);color:var(--ar-on-accent);font-weight:800;font-size:15.5px;text-decoration:none;box-shadow:0 6px 18px rgba(53,215,209,.18); }

  /* Onglets */
  html.apprefonte .ar-vy-tabs { display:flex; gap:20px; margin:18px 2px 4px; border-bottom:1px solid var(--ar-hairline); }
  html.apprefonte .ar-vy-tab { padding:8px 0 12px; font-size:14px; font-weight:600; color:var(--ar-ink-soft); text-decoration:none; border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap; }
  html.apprefonte .ar-vy-tab b { font-weight:700; opacity:.7; }
  html.apprefonte .ar-vy-tab.is-active { color:var(--ar-cyan); border-bottom-color:var(--ar-cyan); }

  /* Héro */
  html.apprefonte .ar-vy-hero { margin:16px 0 4px; border-radius:20px; overflow:hidden; background:var(--ar-surface); border:1px solid var(--ar-hairline); }
  html.apprefonte .ar-vy-hero-img { position:relative; height:190px; }
  html.apprefonte .ar-vy-hero-img img { width:100%;height:100%;object-fit:cover;display:block; }
  html.apprefonte .ar-vy-hero-badge { position:absolute; top:12px; left:12px; background:rgba(7,22,36,.72); color:var(--ar-ink); border:1px solid var(--ar-hairline); padding:4px 11px; border-radius:999px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; }
  html.apprefonte .ar-vy-hero-status { position:absolute; top:12px; right:12px; background:color-mix(in srgb, var(--st) 22%, #071624); color:var(--st); border:1px solid color-mix(in srgb, var(--st) 55%, transparent); padding:4px 11px; border-radius:999px; font-size:11px; font-weight:800; }
  html.apprefonte .ar-vy-hero-body { padding:16px; }
  html.apprefonte .ar-vy-hero-body h2 { margin:0 0 10px; font:800 20px/1.25 'Inter',system-ui,sans-serif; color:var(--ar-ink); }
  html.apprefonte .ar-vy-line { display:flex; align-items:center; gap:6px; font-size:13.5px; color:var(--ar-ink-soft); margin:4px 0; }
  html.apprefonte .ar-amber { color:var(--ar-amber); }

  /* Timeline d'étapes */
  html.apprefonte .ar-vy-time { display:flex; flex-wrap:wrap; align-items:center; gap:6px 4px; margin:12px 0 4px; }
  html.apprefonte .ar-vy-node { display:inline-flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ar-ink); background:var(--ar-surface-2,#102B40); border:1px solid var(--ar-hairline); border-radius:999px; padding:5px 11px; }
  html.apprefonte .ar-vy-dot { width:7px; height:7px; border-radius:50%; background:var(--ar-amber); box-shadow:0 0 0 3px color-mix(in srgb, var(--ar-amber) 22%, transparent); }
  html.apprefonte .ar-vy-time-link { width:14px; height:2px; border-radius:2px; background:color-mix(in srgb, var(--ar-amber) 45%, transparent); }

  html.apprefonte .ar-vy-org { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13px; color:var(--ar-ink-soft); margin:12px 0 14px; }
  html.apprefonte .ar-vy-org .ar-av { width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--ar-cyan);color:var(--ar-on-accent);font-weight:800;font-size:11px; }
  html.apprefonte .ar-vy-parts { color:var(--ar-ink); }
  html.apprefonte .ar-vy-btn { display:flex;align-items:center;justify-content:center;gap:6px;padding:12px;border-radius:12px;font-weight:700;font-size:14px;text-decoration:none; }
  html.apprefonte .ar-vy-btn.ar-cyan { background:var(--ar-cyan); color:var(--ar-on-accent); }

  /* Section passés + cartes */
  html.apprefonte .ar-vy-secttitle { margin:22px 2px 12px; font:700 15px/1 'Inter',system-ui,sans-serif; color:var(--ar-ink); }
  html.apprefonte .ar-vy-list { display:flex; flex-direction:column; gap:12px; }
  html.apprefonte .ar-vy-card { display:flex; align-items:center; gap:12px; padding:10px; border-radius:16px; background:var(--ar-surface); border:1px solid var(--ar-hairline); text-decoration:none; }
  html.apprefonte .ar-vy-card-img { flex:0 0 auto; width:64px;height:64px;border-radius:12px;overflow:hidden; }
  html.apprefonte .ar-vy-card-img img { width:100%;height:100%;object-fit:cover;display:block; }
  html.apprefonte .ar-vy-card-body { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
  html.apprefonte .ar-vy-card-title { font-weight:700; font-size:14.5px; color:var(--ar-ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  html.apprefonte .ar-vy-card-meta { font-size:12.5px; color:var(--ar-ink-soft); }
  html.apprefonte .ar-vy-card-chev { flex:0 0 auto; color:var(--ar-ink-soft); font-size:24px; line-height:1; padding-right:4px; }
  html.apprefonte .ar-vy-empty { padding:30px 10px; text-align:center; color:var(--ar-ink-soft); font-size:14px; }
  html.apprefonte .ar-vy-empty a { color:var(--ar-cyan); }
}
