/* ============================================================================
   REFONTE APP — Écran SORTIES fidèle à la maquette 08.
   Scopé html.apprefonte + @media ≤768px. 100% additif/réversible :
   supprimer ce fichier + le bloc .ar-sorties de sortir.php = retour à l'état d'avant.
   Chargé APRÈS zz-polish.css (ordre alpha) → prime.
   ============================================================================ */
html.apprefonte .ar-sorties { display: none; }

@media (max-width: 768px), (pointer: coarse) and (max-width: 1366px), (display-mode: standalone) and (max-width: 1366px) {
  /* Masquer TOUT l'ancien contenu v1 (enfants directs du <main class="pub-content">).
     La bottom-nav et le footer sont HORS de .pub-content → conservés. */
  /* AUDIT MASQUE 15/08 : bloc SORTIE OFFICIELLE (.so-off-bloc = so_public_block_html) EXEMPTÉ
     du masque — les sorties officielles sont RETIRÉES de la liste ($rows) donc absentes de
     .ar-sorties ; ce bloc est leur SEULE surface (annonce « en préparation » + carte
     d'inscription quand l'équipe publie une officielle). Sinon inaccessible en mode app.
     Affichage seul, réversible. */
  html.apprefonte:has(.ar-sorties) .pub-content > *:not(.ar-sorties):not(.so-off-bloc):not(.ann-banner-wrap):not(.flash) { display: none !important; }
  /* Le remonter en tête (événement phare mis en avant par l'équipe). */
  html.apprefonte:has(.ar-sorties) body.page-sorties main.pub-content { display: flex; flex-direction: column; }
  html.apprefonte body.page-sorties .ar-sorties { order: 1; }
  html.apprefonte body.page-sorties .so-off-bloc { order: 0; margin: 6px 0 4px; }
  /* En-tête d'écran épuré (maquette) → on retire la barre de marque globale SUR CET ÉCRAN. */
  /* AUDIT COUVERTURE 15/08 : gater `:has(.ar-sorties)` (sinon topbar masquée sur sortie/edit-sortie). */
  html.apprefonte:has(.ar-sorties) body.page-sorties .pub-topbar { display: none !important; }

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

  /* ---- En-tête d'écran ---- */
  html.apprefonte .ar-so-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:12px 0 4px; }
  html.apprefonte .ar-so-titles h1 { margin:0; font:800 27px/1.05 'Inter',system-ui,sans-serif; color:var(--ar-ink); letter-spacing:-.3px; }
  html.apprefonte .ar-so-titles p { margin:6px 0 0; font-size:13.5px; line-height:1.4; color:var(--ar-ink-soft); }
  html.apprefonte .ar-so-hact { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
  html.apprefonte .ar-so-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-so-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-so-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-so-tabs { display:flex; gap:20px; margin:18px 2px 4px; border-bottom:1px solid var(--ar-hairline); }
  html.apprefonte .ar-so-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-so-tab b { font-weight:700; opacity:.7; }
  html.apprefonte .ar-so-tab.is-active { color:var(--ar-cyan); border-bottom-color:var(--ar-cyan); }
  html.apprefonte .ar-so-tab.is-active b { opacity:1; }

  /* ---- Carte héro ---- */
  html.apprefonte .ar-so-hero { margin:16px 0 4px; border-radius:20px; overflow:hidden; background:var(--ar-surface); border:1px solid var(--ar-hairline); }
  html.apprefonte .ar-so-hero-img { position:relative; height:188px; }
  html.apprefonte .ar-so-hero-img img { width:100%; height:100%; object-fit:cover; display:block; }
  html.apprefonte .ar-so-hero-badge { position:absolute; top:12px; left:12px; background:rgba(7,22,36,.72); color:var(--ar-cyan); border:1px solid var(--ar-cyan-40,rgba(53,215,209,.4)); padding:4px 11px; border-radius:999px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; }
  html.apprefonte .ar-so-hero-body { padding:16px; }
  html.apprefonte .ar-so-hero-body h2 { margin:0 0 10px; font:800 20px/1.25 'Inter',system-ui,sans-serif; color:var(--ar-ink); }
  html.apprefonte .ar-so-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); }
  html.apprefonte .ar-so-org { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ar-ink-soft); margin:12px 0 14px; }
  html.apprefonte .ar-so-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-so-hero-actions { display:flex; gap:10px; }
  html.apprefonte .ar-so-btn { flex:1; 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-so-btn.ar-ghost { background:transparent; color:var(--ar-ink); border:1px solid var(--ar-hairline); }
  html.apprefonte .ar-so-btn.ar-cyan { background:var(--ar-cyan); color:var(--ar-on-accent); }

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