/* ==================================================================
   Compatibilite avec l'application Android CHR Restauration
   ------------------------------------------------------------------
   L'appli affiche le site dans une vue web et ajoute sa propre barre
   du haut (#chr-app-topbar, posee directement sous <html>) et sa barre
   du bas (#chr-app-bottomnav). Toutes les regles ci-dessous ne
   s'appliquent QUE dans l'appli (html:has(>#chr-app-topbar)) : le site
   web n'est pas touche.
   Les :not(#a1):not(#a2)... servent seulement a passer devant les
   regles generales de l'appli (qui sont tres "fortes").
   ================================================================== */

/* ---------- Menu : le tiroir s'ouvre entre les deux barres de l'appli ---------- */
html:has(>#chr-app-topbar) #nm-tiroir:not(#a1):not(#a2):not(#a3){top:54px;bottom:62px;width:100%;box-shadow:none;z-index:9995}
html:has(>#chr-app-topbar) #nm-voile.mob:not(#a1):not(#a2):not(#a3){top:54px;bottom:62px;z-index:9994}

/* ---------- Accueil : cartes des rayons ---------- */
html:has(>#chr-app-topbar) .hr:not(#a1){padding:12px 14px 6px;background:transparent}
html:has(>#chr-app-topbar) .hr-sur:not(#a1),
html:has(>#chr-app-topbar) .hr-tete h1:not(#a1),
html:has(>#chr-app-topbar) .hr-tete p:not(#a1){display:none}
html:has(>#chr-app-topbar) .hr-tete:not(#a1){margin-bottom:12px;display:block}
html:has(>#chr-app-topbar) .hr-aide:not(#a1){display:flex;gap:10px;width:100%}
html:has(>#chr-app-topbar) .hr-grille:not(#a1){grid-template-columns:1fr;gap:14px}
html:has(>#chr-app-topbar) .hr-carte:not(#a1){border-radius:12px;border-color:#ece7e0;box-shadow:0 2px 8px rgba(15,41,66,.07);transform:none}
html:has(>#chr-app-topbar) .hr-img:not(#a1):after{background:linear-gradient(180deg,rgba(15,41,66,0) 30%,rgba(15,41,66,.9))}

/* liens : on annule le style "lien souligne" que l'appli met partout */
html:has(>#chr-app-topbar) .hr a:not(#a1):not(#a2):not(#a3):not(#a4),
html:has(>#chr-app-topbar) .hm a:not(#a1):not(#a2):not(#a3):not(#a4){border-bottom:0!important;border-radius:0!important;background:none!important;padding:0!important;gap:0!important;line-height:1.3!important;font-size:13.5px!important;font-weight:600!important;text-decoration:none!important}
html:has(>#chr-app-topbar) .hr-aide a:not(#a1):not(#a2):not(#a3):not(#a4){display:flex!important;flex:1;justify-content:center!important;padding:12px 10px!important;border-radius:999px!important;font-size:14px!important}
html:has(>#chr-app-topbar) .hr-aide a.b1:not(#a1):not(#a2):not(#a3):not(#a4){background:#f2932e!important;color:#fff!important}
html:has(>#chr-app-topbar) .hr-aide a.b2:not(#a1):not(#a2):not(#a3):not(#a4){background:#fff!important;color:#0f2942!important;border:1.5px solid #0f2942!important}
html:has(>#chr-app-topbar) .hr a.hr-img:not(#a1):not(#a2):not(#a3):not(#a4){display:block!important;height:130px;background:#e9eff4!important}
html:has(>#chr-app-topbar) .hr-img h2:not(#a1){font-size:18px;color:#fff}
html:has(>#chr-app-topbar) .hr-liste:not(#a1){display:block;padding:6px 16px 2px}
html:has(>#chr-app-topbar) .hr-liste li:not(#a1){border-color:#f1ede8}
html:has(>#chr-app-topbar) .hr-liste a:not(#a1):not(#a2):not(#a3):not(#a4){display:flex!important;justify-content:space-between!important;align-items:center!important;width:100%;padding:10px 0!important;color:#0f2942!important}
html:has(>#chr-app-topbar) .hr a.hr-tout:not(#a1):not(#a2):not(#a3):not(#a4){display:flex!important;justify-content:space-between!important;align-items:center!important;margin:6px 16px 16px!important;padding:12px 18px!important;border-radius:999px!important;background:#f2932e!important;color:#fff!important}

/* ---------- Accueil : bloc des marques ---------- */
html:has(>#chr-app-topbar) .hm:not(#a1){margin:10px 0;padding:18px 0}
html:has(>#chr-app-topbar) .hm-tete:not(#a1){padding:0 14px}
html:has(>#chr-app-topbar) .hm-tete p:not(#a1),
html:has(>#chr-app-topbar) .hm-chiffres:not(#a1){display:none}
html:has(>#chr-app-topbar) .hm h2:not(#a1){font-size:18px;color:#0f2942}
html:has(>#chr-app-topbar) .hm a.hm-btn:not(#a1):not(#a2):not(#a3):not(#a4){display:inline-flex!important;gap:8px!important;padding:10px 16px!important;border-radius:999px!important;background:#0f2942!important;color:#fff!important}
html:has(>#chr-app-topbar) .hm a.hm-logo:not(#a1):not(#a2):not(#a3):not(#a4){display:flex!important;width:120px;height:68px;padding:8px 10px!important;border:1px solid #ece7e0!important;border-radius:12px!important;background:#fff!important;color:#0f2942!important}