/* ============================================================================
   REFONTE APP — Réglages : calage FIN sur la maquette 15 (charte sombre).
   Charge APRÈS zz-reglages-app.css : ne fait que RE-PEINDRE/RE-ESPACER les
   classes réelles du DOM (.ar-rg-*). Aucune structure, aucune fonction touchée.
   ROLLBACK : retirer l'inclusion de ce fichier — l'écran revient à zz-reglages-app.css.
   ============================================================================ */
@media (max-width: 768px), (pointer: coarse) and (max-width: 1366px), (display-mode: standalone) and (max-width: 1366px) {

  /* Jeton de couleurs local = charte maquette exacte (scopé, réversible) */
  html.apprefonte .ar-reglages {
    --rg-surface: #0D2233;
    --rg-cyan: #35D7D1;
    --rg-amber: #FFB65A;
    --rg-ink: #F6F0DF;
    --rg-ink-soft: rgba(246,240,223,.58);
    --rg-line: rgba(255,255,255,.08);
    --rg-danger: #DC352F;
    --rg-danger-ink: #FF6B5C;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 6px;
    color: var(--rg-ink);
  }

  /* En-tête : titre serif centré, flamme en coin haut-gauche */
  html.apprefonte .ar-rg-head { padding: 14px 0 18px; }
  html.apprefonte .ar-rg-fire { left: 2px; top: -1px; font-size: 34px; }
  html.apprefonte .ar-rg-head h1 { font-size: 33px; letter-spacing: .2px; color: var(--rg-ink); }

  /* Barre de recherche live (haut) */
  html.apprefonte .ar-rg-search {
    background: var(--rg-surface);
    border: 1px solid var(--rg-line);
    border-radius: 16px;
    padding: 15px 16px;
    gap: 12px;
    margin-bottom: 18px;
  }
  html.apprefonte .ar-rg-search > span { color: var(--rg-ink-soft); font-size: 17px; opacity: .8; }
  html.apprefonte .ar-rg-search input { color: var(--rg-ink); font-size: 16px; }
  html.apprefonte .ar-rg-search input::placeholder { color: var(--rg-ink-soft); }

  /* Liste UNIQUE : une carte, rangées séparées par un filet fin bord-à-bord */
  html.apprefonte .ar-rg-list {
    background: var(--rg-surface);
    border: 1px solid var(--rg-line);
    border-radius: 18px;
    margin-bottom: 20px;
  }
  html.apprefonte .ar-rg-row {
    gap: 15px;
    padding: 16px 16px;
    color: var(--rg-ink);
    border-bottom-color: var(--rg-line);
  }

  /* Icônes RONDES colorées (cyan discret) */
  html.apprefonte .ar-rg-ic {
    width: 46px;
    height: 46px;
    background: rgba(53,215,209,.08);
    border: 1px solid rgba(53,215,209,.22);
  }
  html.apprefonte .ar-rg-ic .ar-row-icon { width: 26px; height: 26px; }

  /* Textes de rangée */
  html.apprefonte .ar-rg-t { font-size: 16px; font-weight: 700; color: var(--rg-ink); }
  html.apprefonte .ar-rg-s { font-size: 13px; color: var(--rg-ink-soft); }

  /* Chevron droite */
  html.apprefonte .ar-rg-chev { color: var(--rg-ink-soft); font-size: 24px; }

  /* Zone dangereuse ROUGE (pause / suppression) — 1 seule carte cerclée rouge */
  html.apprefonte .ar-rg-danger {
    border: 1px solid rgba(220,53,47,.50);
    border-radius: 18px;
    background: rgba(220,53,47,.05);
  }
  html.apprefonte .ar-rg-drow {
    padding: 16px 16px;
    gap: 15px;
    background: transparent;
    color: var(--rg-danger-ink);
    border-bottom-color: rgba(220,53,47,.22);
  }
  html.apprefonte .ar-rg-drow .ar-rg-ic {
    background: rgba(220,53,47,.10);
    border-color: rgba(220,53,47,.42);
  }
  html.apprefonte .ar-rg-drow .ar-rg-t { color: var(--rg-danger-ink); }
  html.apprefonte .ar-rg-drow .ar-rg-s { color: var(--rg-ink-soft); }
  html.apprefonte .ar-rg-drow .ar-rg-chev { color: var(--rg-danger-ink); }
}