/** * UNIVGA PWA — App Shell * Styles appliqués UNIQUEMENT lorsque l'app est lancée en mode installé * (classe .univga-pwa-standalone ajoutée sur par app-shell.js / head inline). * En navigateur classique, ces règles n'ont aucun effet. */ /* ── Masquer le « chrome » du site (thème ReHub + WordPress + UNIVGA) ── */ html.univga-pwa-standalone #main_header, html.univga-pwa-standalone #theme_footer, html.univga-pwa-standalone .footer-bottom, /* zone widgets footer (GROUPE UNIVGA / Trustpilot / CINVU) */ html.univga-pwa-standalone #wpadminbar, html.univga-pwa-standalone #rhmobpnlcustom, html.univga-pwa-standalone #rhmobtoppnl, html.univga-pwa-standalone #slide-menu-mobile, html.univga-pwa-standalone #rhslidingMenu, html.univga-pwa-standalone #mobile-menu-icons, html.univga-pwa-standalone #logo_mobile_wrapper, html.univga-pwa-standalone #topcontrol, html.univga-pwa-standalone .responsive_nav_wrap.rh_mobile_menu, html.univga-pwa-standalone .header_placeholder, html.univga-pwa-standalone .rh-floating-block, html.univga-pwa-standalone .floating-panel-mobile, /* Barre supérieure globale UNIVGA (avatar « Mon compte » + bouton Pré-inscription) */ html.univga-pwa-standalone .uvg-gtopbar, html.univga-pwa-standalone .uvg-gaccount, /* Bulle flottante AURIA / WhatsApp + son panneau + ticker de notifications */ html.univga-pwa-standalone #univga-wa-bubble, html.univga-pwa-standalone .univga-walead-panel, html.univga-pwa-standalone .univga-walead-overlay, html.univga-pwa-standalone .auria-header-ticker, html.univga-pwa-standalone #auria-bell-trigger, html.univga-pwa-standalone #auria-drawer, html.univga-pwa-standalone #auria-drawer-backdrop { display: none !important; } /* Neutraliser l'offset de l'admin bar WP */ html.univga-pwa-standalone { margin-top: 0 !important; } html.univga-pwa-standalone body { margin-top: 0 !important; /* Espace pour la barre d'onglets fixe + zone sûre (encoche/gesture bar) */ padding-bottom: calc(62px + env(safe-area-inset-bottom, 0px)) !important; } /* Retirer marges/paddings parasites en tête de contenu */ html.univga-pwa-standalone #content, html.univga-pwa-standalone .rh_content, html.univga-pwa-standalone .container.content_wrap { padding-top: 0 !important; margin-top: 0 !important; } /* ── Espace compte : rendu plein écran « app » ── */ html.univga-pwa-standalone .univga-account-wrapper { border-radius: 0 !important; box-shadow: none !important; margin: 0 !important; min-height: calc(100vh - 62px); } /* Barre supérieure du compte : collante + zone sûre haute */ html.univga-pwa-standalone .account-topbar { position: sticky; top: 0; z-index: 900; padding-top: calc(10px + env(safe-area-inset-top, 0px)) !important; background: #fff; box-shadow: 0 1px 8px rgba(11, 79, 140, .06); } /* ── Entête « app » épurée sur les pages d'onglet (avatar retiré) ── */ html.univga-pwa-standalone .topbar-search, html.univga-pwa-standalone .topbar-user-mini, html.univga-pwa-standalone .topbar-user-dropdown, html.univga-pwa-standalone .topbar-dropdown, html.univga-pwa-standalone .topbar-bm-btn, html.univga-pwa-standalone .topbar-org-btn { display: none !important; } html.univga-pwa-standalone .account-topbar { display: flex; align-items: center; gap: 12px; border-bottom: 1px solid #eef2f7; } /* Hamburger (menu) + bouton Accueil : pastilles douces */ html.univga-pwa-standalone .account-topbar .mobile-menu-toggle, html.univga-pwa-standalone .account-topbar .uvg-topbar-home { width: 40px; height: 40px; flex: none; border: 0; border-radius: 13px; cursor: pointer; display: grid; place-items: center; font-size: 1rem; -webkit-tap-highlight-color: transparent; transition: transform .15s ease; } html.univga-pwa-standalone .account-topbar .mobile-menu-toggle { background: #eef3f9; color: #0B4F8C; } html.univga-pwa-standalone .account-topbar .uvg-topbar-home { margin-left: auto; background: linear-gradient(135deg, #0B4F8C, #1565C0); color: #fff; box-shadow: 0 5px 14px rgba(11, 79, 140, .32); } html.univga-pwa-standalone .account-topbar .mobile-menu-toggle:active, html.univga-pwa-standalone .account-topbar .uvg-topbar-home:active { transform: scale(.9); } /* Fil d'Ariane transformé en titre de section */ html.univga-pwa-standalone .topbar-breadcrumb { flex: 1; min-width: 0; border: 0 !important; background: transparent !important; padding: 0 !important; } html.univga-pwa-standalone .topbar-breadcrumb .breadcrumb-home, html.univga-pwa-standalone .topbar-breadcrumb .breadcrumb-sep { display: none !important; } html.univga-pwa-standalone .topbar-breadcrumb .breadcrumb-current { font-size: 1.18rem; font-weight: 800; color: #16263a; letter-spacing: -.015em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* ── Sidebar : ouverture/fermeture fluide (drawer) ── */ @media (max-width: 768px) { html.univga-pwa-standalone .univga-account-sidebar { left: 0 !important; transform: translateX(-100%); transition: transform .36s cubic-bezier(.4, 0, .2, 1), box-shadow .36s ease; will-change: transform; border-radius: 0 20px 20px 0; box-shadow: none; z-index: 100000; padding-top: env(safe-area-inset-top, 0px); } html.univga-pwa-standalone .univga-account-sidebar.open { transform: translateX(0); box-shadow: 0 24px 70px rgba(8, 20, 40, .42); } html.univga-pwa-standalone .sidebar-overlay { display: block !important; opacity: 0; visibility: hidden; background: rgba(8, 20, 40, .55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); z-index: 99999; transition: opacity .32s ease, visibility .32s ease; } html.univga-pwa-standalone .sidebar-overlay.show { opacity: 1; visibility: visible; } } /* ── Barre d'onglets inférieure (style Android / Material) ── */ .univga-pwa-bottomnav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 99998; display: flex; align-items: stretch; justify-content: space-around; background: #ffffff; border-top: 1px solid #e8edf3; box-shadow: 0 -4px 18px rgba(11, 79, 140, .08); padding-bottom: env(safe-area-inset-bottom, 0px); height: calc(62px + env(safe-area-inset-bottom, 0px)); font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; } .univga-pwa-bottomnav__item { flex: 1 1 0; border: 0; background: transparent; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 8px 2px 6px; color: #8a97a8; font-size: 11px; font-weight: 600; text-decoration: none; position: relative; transition: color .18s ease; -webkit-tap-highlight-color: transparent; } .univga-pwa-bottomnav__item i { font-size: 19px; line-height: 1; transition: transform .18s ease; } .univga-pwa-bottomnav__item span { line-height: 1; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .univga-pwa-bottomnav__item.is-active { color: #0B4F8C; } .univga-pwa-bottomnav__item.is-active i { transform: translateY(-1px) scale(1.06); } /* Indicateur (pilule) au-dessus de l'onglet actif */ .univga-pwa-bottomnav__item.is-active::before { content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 30px; height: 3px; border-radius: 0 0 4px 4px; background: #0B4F8C; } /* Pastille de badge éventuelle */ .univga-pwa-bottomnav__item .univga-pwa-badge { position: absolute; top: 6px; left: calc(50% + 8px); min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: #e23b3b; color: #fff; font-size: 9px; line-height: 16px; text-align: center; font-weight: 700; } /* Effet pression */ .univga-pwa-bottomnav__item:active i { transform: scale(.9); } /* Sur grand écran (tablette installée), on centre la barre */ @media (min-width: 900px) { .univga-pwa-bottomnav { max-width: 620px; left: 50%; transform: translateX(-50%); border-radius: 18px 18px 0 0; } }