/**
 * P0053 — Couche UX PWA (scopée .pwa-standalone uniquement).
 * Ne modifie pas le rendu navigateur classique.
 */

/* ——— Boot / safe areas ——— */
html.pwa-standalone {
    --pwa-safe-top: env(safe-area-inset-top, 0px);
    --pwa-safe-right: env(safe-area-inset-right, 0px);
    --pwa-safe-bottom: env(safe-area-inset-bottom, 0px);
    --pwa-safe-left: env(safe-area-inset-left, 0px);
    --pwa-bottom-nav-h: 64px;
    /* Espace total sous le contenu utile : nav fixe + safe-area (une seule fois). */
    --pwa-bottom-clearance: calc(var(--pwa-bottom-nav-h) + var(--pwa-safe-bottom));
    /*
     * P0094f — respiration visuelle (16–24px) au-dessus de la bottom-nav,
     * en plus de --pwa-bottom-clearance (sans double-compter la safe-area).
     */
    --pwa-content-breath: 1.25rem;
    /* Fin de scroll drawer Plus : clearance (nav+safe) + respiration. */
    --pwa-drawer-scroll-end: calc(var(--pwa-bottom-clearance) + var(--pwa-content-breath));
    /* P0090i — réserve bas page-wrap (nav-h + gap + safe). */
    --pwa-dots-gap: 0.5rem;
    /* P0090j — bande pagination : respiration haute + petit écart bas vers la nav. */
    --pwa-pagination-breath: 1.15rem;
    --pwa-pagination-gap: 0.4rem;
    --pwa-pager-slide-ms: 260ms;
    --pwa-pager-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --pwa-green: #1bbd68;
    --pwa-green-dark: #159653;
    --pwa-orange: #ff7a00;
    --pwa-ink: #151922;
    /*
     * P0090 — canvas WebKit sous le viewport CSS : blanc comme la bottom-nav.
     * Background uniquement (pas de height / dvh / fill-available).
     */
    background-color: #fff;
}

html.pwa-standalone body.admin-app,
html.pwa-standalone body.page-app {
    padding-left: var(--pwa-safe-left);
    padding-right: var(--pwa-safe-right);
}

/* ——— Shell admin/user compact ——— */
html.pwa-standalone body.admin-app {
    /* Plus de topbar : hauteur 0 pour libérer l’iframe (safe-area sur .admin-main). */
    --admin-topbar-h: 0px;
}

/*
 * P0055l2 — masquer le chrome supérieur redondant (hamburger / titre / loupe / ↻).
 * Le nœud reste dans le DOM : #menuToggle sert encore à « Plus », #adminSearch à la recherche.
 */
html.pwa-standalone .admin-topbar {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 1200;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    overflow: visible;
    pointer-events: none;
    gap: 0;
}

html.pwa-standalone .admin-topbar__toggle,
html.pwa-standalone .admin-topbar__title-wrap,
html.pwa-standalone .admin-topbar__actions,
html.pwa-standalone .admin-topbar__eyebrow,
html.pwa-standalone .admin-search__toggle {
    display: none !important;
}

html.pwa-standalone .admin-main {
    padding-top: var(--pwa-safe-top);
    padding-bottom: var(--pwa-bottom-clearance);
    overflow: hidden;
}

html.pwa-standalone .admin-sidebar__brand-sub {
    display: none;
}

html.pwa-standalone .admin-sidebar {
    padding-top: var(--pwa-safe-top);
    /*
     * P0094f — la bottom-nav reste persistante (z-index 1060) au-dessus du drawer.
     * Ne pas réserver la safe-area ici : elle est dans --pwa-drawer-scroll-end
     * (via --pwa-bottom-clearance) sur la zone scrollable .admin-sidebar__nav.
     */
    padding-bottom: 0;
}

/* Footer vide en PWA (liens masqués) : la réserve basse est sur __nav. */
html.pwa-standalone .admin-sidebar__footer {
    display: none;
}

html.pwa-standalone .admin-sidebar__nav {
    padding-bottom: var(--pwa-drawer-scroll-end);
}

html.pwa-standalone .page-toast-wrap {
    /* Au-dessus de la bottom-nav + respiration (évite toasts masqués). */
    bottom: calc(var(--pwa-bottom-clearance, 4.5rem) + var(--pwa-content-breath, 1.25rem));
    right: max(0.75rem, var(--pwa-safe-right, 0px));
    left: max(0.75rem, var(--pwa-safe-left, 0px));
}

/* Recherche drawer PWA */
html.pwa-standalone .admin-sidebar__search {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: calc(100% - 1.5rem);
    min-height: 48px;
    margin: 0.35rem 0.75rem 0.85rem;
    padding: 0.65rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.95rem;
    font-weight: 650;
    text-align: left;
    cursor: pointer;
}

html.pwa-standalone .admin-sidebar__search i {
    font-size: 1.1rem;
    opacity: 0.9;
}

html.pwa-standalone .admin-sidebar__search:active {
    background: rgba(255, 255, 255, 0.1);
}

/* Overlay recherche (réutilise #adminSearch / champ / panel existants) */
html.pwa-standalone .admin-search {
    pointer-events: auto;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
    max-width: none;
    height: 0;
    margin: 0;
    overflow: visible;
    z-index: 1300;
    flex: none;
}

html.pwa-standalone .admin-search.is-open {
    left: 0.65rem;
    right: 0.65rem;
    top: calc(var(--pwa-safe-top) + 0.45rem);
    width: auto;
    height: auto;
}

html.pwa-standalone .admin-search.is-open .admin-search__field {
    display: flex;
    min-height: 48px;
    padding: 0.45rem 0.75rem;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #d5dbe5;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.16);
}

html.pwa-standalone .admin-search__panel {
    left: 0;
    right: 0;
    top: calc(100% + 0.4rem);
    max-height: min(60vh, 22rem);
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18);
}

/* Masquer le lien « site public » dans l’app installée (moins chrome web) */
html.pwa-standalone .admin-sidebar__site-link {
    display: none;
}

/* ——— Bottom navigation ——— */
.pwa-bottom-nav {
    display: none;
}

html.pwa-standalone .pwa-bottom-nav {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1060;
    /*
     * P0090 — boîte = barre utile + safe-area, ancrée bottom:0.
     * Agrandit vers le HAUT (NAV B = IH). Boutons dans la zone nav-h ;
     * padding-bottom peint la safe-area en blanc (pas de ::after hors viewport).
     */
    box-sizing: border-box;
    height: calc(var(--pwa-bottom-nav-h) + env(safe-area-inset-bottom, 0px));
    padding: 0.25rem 0.35rem env(safe-area-inset-bottom, 0px);
    background: #ffffff;
    border-top: 1px solid #e8ecf2;
    box-shadow: 0 -6px 24px rgba(21, 25, 34, 0.08);
    justify-content: space-around;
    align-items: stretch;
}

html.pwa-standalone .pwa-bottom-nav__item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* P0090 — ancrage bas de la zone utile (géométrie nav). */
    justify-content: flex-end;
    gap: 0.15rem;
    min-height: 48px;
    padding: 0.35rem 0.25rem;
    border: 0;
    background: transparent;
    color: #64748b;
    text-decoration: none;
    font-family: inherit;
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.1;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    /*
     * Léger décalage bas proportionnel à la safe-area (pas de px iPhone).
     * Reste au-dessus du Home Indicator (padding-bottom nav = safe entière).
     */
    transform: translateY(calc(env(safe-area-inset-bottom, 0px) * 0.22));
}

html.pwa-standalone .pwa-bottom-nav__item i {
    font-size: 1.25rem;
    line-height: 1;
}

html.pwa-standalone .pwa-bottom-nav__item.is-active {
    color: var(--pwa-green-dark);
}

html.pwa-standalone .pwa-bottom-nav__item.is-active i {
    color: var(--pwa-green);
}

/* ——— Dashboard PWA : tuiles (remplissage vertical) ——— */
/*
 * P0094f — fin de scroll pages iframe.
 * Le shell (.admin-main) réserve déjà --pwa-bottom-clearance sous l’iframe ;
 * ici uniquement la respiration UX (évite double safe-area / gros blanc page courte).
 */
html.pwa-standalone .page-wrap {
    padding-left: max(0.85rem, var(--pwa-safe-left));
    padding-right: max(0.85rem, var(--pwa-safe-right));
    padding-bottom: var(--pwa-content-breath);
}

/* Tuiles seules (pas le double-accueil pager) : remplir la zone utile. */
html.pwa-standalone .page-wrap:has(.pwa-dash-tiles):not(:has(.pwa-admin-pager)) {
    display: flex;
    flex-direction: column;
    min-height: calc(
        100dvh
        - var(--pwa-safe-top, 0px)
        - var(--pwa-bottom-clearance, 64px)
    );
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
    box-sizing: border-box;
}

/*
 * P0072d — Accueil admin avec pager : dans l’iframe, 100dvh − clearance
 * soustrayait une 2ᵉ fois la bottom-nav et poussait les dots hors vue.
 * Ancrage sur height:100% (iframe).
 *
 * P0072i+ — la bottom-nav shell (z-index 1060) recouvre le bas de l’iframe
 * (même constat que P0062e2 pour les modales).
 *
 * P0090i — padding bas = nav-h + gap + safe-area (pas gap seul).
 * P0090h (dots-gap seul) masquait les dots derrière la nav dès que
 * SAFE=0 (Android) : la composante nav-h doit toujours être présente.
 * box-sizing:border-box : la hauteur 100% inclut ce padding.
 */
html.pwa-standalone:has(.pwa-admin-pager),
html.pwa-standalone body.page-app:has(.pwa-admin-pager) {
    height: 100%;
    max-height: 100%;
    overflow: hidden;
}

html.pwa-standalone .page-wrap:has(.pwa-admin-pager) {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
    padding-top: 0.35rem;
    padding-bottom: calc(
        var(--pwa-bottom-nav-h)
        + var(--pwa-dots-gap, 0.5rem)
        + env(safe-area-inset-bottom, 0px)
    );
    box-sizing: border-box;
}

/* P0072b — double accueil admin (Instant T | Applications), style launcher.
 * P0072j — hors standalone : jamais visible (desktop web / Chrome onglet). */
.pwa-admin-pager {
    display: none;
}

.pwa-admin-pager__viewport {
    overflow: visible;
}

.pwa-admin-pager__track {
    display: block;
    transform: none;
}

.pwa-admin-pager__page {
    width: auto;
    min-height: 0;
}

.pwa-admin-pager__dots {
    display: none;
}

html.pwa-standalone .pwa-admin-pager {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    margin: 0;
}

html.pwa-standalone .pwa-admin-pager__viewport {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    /* pan-y : scroll vertical navigateur ; horizontal laissé au JS (swipe pages). */
    touch-action: pan-y;
}

html.pwa-standalone .pwa-admin-pager__track {
    display: flex;
    width: 200%;
    height: 100%;
    transform: translate3d(0, 0, 0);
    transition: transform var(--pwa-pager-slide-ms, 260ms) var(--pwa-pager-ease, cubic-bezier(0.22, 1, 0.36, 1));
    will-change: transform;
    background: #f0f2f6;
}

html.pwa-standalone .pwa-admin-pager[data-page="1"] .pwa-admin-pager__track,
html.pwa-standalone .pwa-admin-pager.is-page-apps .pwa-admin-pager__track {
    transform: translate3d(-50%, 0, 0);
}

html.pwa-standalone .pwa-admin-pager__page {
    width: 50%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding-bottom: 0.25rem;
    box-sizing: border-box;
    touch-action: pan-y;
}

/*
 * P0072h — Instant T : plus de ::after flex qui gonflait le scrollHeight
 * (faux vide scrollable). Le swipe menus est sur la bande dots (P0072g) ;
 * le swipe Organisation reste dans l’iframe.
 * P0072i — padding bas ~12–16px seulement (respiration avant dots).
 */
html.pwa-standalone .pwa-admin-pager__page[data-pager-page="0"] {
    display: block;
    min-height: 0;
    padding-bottom: 0.75rem;
}

html.pwa-standalone .pwa-admin-pager__page[data-pager-page="0"]::after {
    content: none;
    display: none;
}

html.pwa-standalone .pwa-admin-pager__page[data-pager-page="1"] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-bottom: 0.75rem;
}

html.pwa-standalone .pwa-admin-pager__page[data-pager-page="1"] .pwa-dash-tiles {
    /* Remplit la zone visible sans augmenter le scrollHeight au-delà du contenu. */
    flex: 1 1 auto;
    min-height: 0;
}

/* Admin sans dossier actif : Applications seules */
.pwa-admin-apps {
    display: none;
}

html.pwa-standalone .pwa-admin-apps {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

html.pwa-standalone .pwa-admin-apps .pwa-dash-tiles {
    flex: 1 1 auto;
}

html.pwa-standalone .page-wrap:has(.pwa-admin-apps) {
    display: flex;
    flex-direction: column;
    min-height: calc(
        100dvh
        - var(--pwa-safe-top, 0px)
        - var(--pwa-bottom-clearance, 64px)
    );
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
    box-sizing: border-box;
}

/* Membre sans dossier actif — état vide centré */
.pwa-home-upcoming {
    display: none;
}

html.pwa-standalone .pwa-home-upcoming {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    min-height: calc(
        100dvh
        - var(--pwa-safe-top, 0px)
        - var(--pwa-bottom-clearance, 64px)
        - 2rem
    );
    text-align: center;
    gap: 1.1rem;
    padding: 2rem 1.25rem;
    box-sizing: border-box;
}

html.pwa-standalone .page-wrap:has(.pwa-home-upcoming) {
    display: flex;
    flex-direction: column;
    min-height: calc(
        100dvh
        - var(--pwa-safe-top, 0px)
        - var(--pwa-bottom-clearance, 64px)
    );
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
    box-sizing: border-box;
}

html.pwa-standalone .pwa-home-upcoming__logo {
    width: 5.5rem;
    height: 5.5rem;
    border-radius: 1.25rem;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
}

html.pwa-standalone .pwa-home-upcoming__title {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: rgba(15, 23, 42, 0.78);
}

/*
 * P0090j — bande pagination : respiration haute, dots ancrés en bas,
 * petit écart (--pwa-pagination-gap) au-dessus de la bottom-nav.
 * Swipe Instant T ↔ Applications uniquement ici (P0072g).
 */
html.pwa-standalone .pwa-admin-pager__dots {
    position: relative;
    z-index: 6;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 0.65rem;
    flex: 0 0 auto;
    flex-shrink: 0;
    margin: 0;
    min-height: calc(2.5rem + var(--pwa-pagination-breath, 1.15rem));
    height: auto;
    max-height: calc(3.5rem + var(--pwa-pagination-breath, 1.15rem));
    padding: var(--pwa-pagination-breath, 1.15rem) 0.35rem var(--pwa-pagination-gap, 0.4rem);
    box-sizing: border-box;
    pointer-events: auto;
    touch-action: pan-y;
    -webkit-user-select: none;
    user-select: none;
    background: #f0f2f6;
    border-top: 1px solid rgba(21, 25, 34, 0.08);
}

/* Indicateur actif glissant (P0090j) — positionnée en JS. */
html.pwa-standalone .pwa-admin-pager__thumb {
    position: absolute;
    left: 0;
    top: 0;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: var(--pwa-green, #1bbd68);
    box-shadow: 0 0 0 2px rgba(27, 189, 104, 0.28);
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    transform: translate3d(0, 0, 0);
    transition:
        transform var(--pwa-pager-slide-ms, 260ms) var(--pwa-pager-ease, cubic-bezier(0.22, 1, 0.36, 1)),
        opacity 0.12s ease;
}

html.pwa-standalone .pwa-admin-pager__thumb.is-ready {
    opacity: 1;
}

html.pwa-standalone .pwa-admin-pager__dot {
    position: relative;
    z-index: 2;
    width: 0.5rem;
    height: 0.5rem;
    min-width: 2.5rem;
    min-height: 2.5rem;
    padding: 0;
    border-radius: 50%;
    background: rgba(21, 25, 34, 0.35);
    background-clip: content-box;
    box-sizing: border-box;
    border: 0.85rem solid transparent;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    pointer-events: auto;
    touch-action: pan-y;
    transition:
        background-color 0.18s ease,
        box-shadow 0.18s ease,
        transform 0.18s ease;
}

html.pwa-standalone .pwa-admin-pager__dot.is-active {
    width: 0.55rem;
    height: 0.55rem;
    /* Le thumb vert porte l’état actif ; le dot reste une cible + repère. */
    background: rgba(21, 25, 34, 0.22);
    background-clip: content-box;
    transform: none;
    box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
    html.pwa-standalone .pwa-admin-pager__track,
    html.pwa-standalone .pwa-admin-pager__thumb,
    html.pwa-standalone .pwa-admin-pager__dot {
        transition: none;
    }
}

html.pwa-standalone .pwa-dash-tiles {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(4, minmax(0, 1fr));
    gap: clamp(0.45rem, 1.4vh, 0.75rem);
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    margin-top: 0.15rem;
    padding: 0;
    align-content: stretch;
}

.pwa-dash-tiles {
    display: none;
}

html.pwa-standalone .dash-quick,
html.pwa-standalone .dash-grid {
    display: none !important;
}

html.pwa-standalone .dash-hero {
    display: none !important;
}

html.pwa-standalone .pwa-admin-pager .pwa-tile {
    touch-action: pan-y;
}

html.pwa-standalone .pwa-tile {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 0;
    height: 100%;
    padding: clamp(0.7rem, 1.6vh, 1.05rem) 0.9rem;
    border-radius: 1rem;
    text-decoration: none;
    color: #fff;
    box-shadow: 0 10px 24px rgba(21, 25, 34, 0.12);
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    overflow: hidden;
}

html.pwa-standalone .pwa-tile:active {
    transform: scale(0.98);
}

html.pwa-standalone .pwa-tile__icon {
    width: clamp(2.35rem, 5.5vh, 2.85rem);
    height: clamp(2.35rem, 5.5vh, 2.85rem);
    border-radius: 0.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.18);
    font-size: clamp(1.2rem, 2.6vh, 1.4rem);
}

html.pwa-standalone .pwa-tile__label {
    font-size: clamp(0.98rem, 2.1vh, 1.08rem);
    font-weight: 800;
    line-height: 1.2;
    margin-top: clamp(0.45rem, 1.5vh, 0.9rem);
}

html.pwa-standalone .pwa-tile__meta {
    margin-top: 0.2rem;
    font-size: 0.75rem;
    font-weight: 600;
    opacity: 0.92;
}

html.pwa-standalone .pwa-tile__badge {
    position: absolute;
    top: 0.65rem;
    right: 0.65rem;
    min-width: 1.4rem;
    height: 1.4rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.28);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Palette cohérente Amicale */
html.pwa-standalone .pwa-tile--dossiers {
    background: linear-gradient(145deg, #1bbd68, #0f8f4c);
}
html.pwa-standalone .pwa-tile--caisse {
    background: linear-gradient(145deg, #ff8a1f, #e06a00);
}
html.pwa-standalone .pwa-tile--parents {
    background: linear-gradient(145deg, #2aa8a0, #1a7f79);
}
html.pwa-standalone .pwa-tile--asbl {
    background: linear-gradient(145deg, #3d6ea8, #2a4f7a);
}
html.pwa-standalone .pwa-tile--compta {
    background: linear-gradient(145deg, #5b6bc0, #3f4a93);
}
html.pwa-standalone .pwa-tile--stock {
    background: linear-gradient(145deg, #6b8f3c, #4f6b2c);
}
html.pwa-standalone .pwa-tile--evenements {
    background: linear-gradient(145deg, #e07a45, #c45a28);
}
html.pwa-standalone .pwa-tile--comptes {
    background: linear-gradient(145deg, #4a5568, #2d3748);
}
html.pwa-standalone .pwa-tile--organisation {
    background: linear-gradient(145deg, #1e2433, #151922);
}

/* ——— Socle modales / formulaires / touch ——— */
html.pwa-standalone .modal-dialog {
    margin: 0.5rem;
    max-width: calc(100% - 1rem);
}

/* P0056b : compositeur Parents = plein iframe, pas les marges modal génériques */
html.pwa-standalone #modalBulkMail .modal-dialog {
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

/*
 * P0062e2 — Bottom sheets Bootstrap (dont #amicaleConfirmModal) :
 * alignées en bas de l’iframe, mais la bottom-nav est fixed sur le shell parent
 * (z-index 1060) et recouvre toujours le bas de l’iframe. Sans clearance,
 * footer/actions (Définir / Retirer / Remplacer, etc.) passent derrière la nav.
 */
@media (max-width: 575.98px) {
    html.pwa-standalone .modal-dialog {
        margin: 0;
        max-width: 100%;
        min-height: 100%;
        display: flex;
        align-items: flex-end;
        box-sizing: border-box;
        /* Zone utile au-dessus de Plus | Dossiers | Comptabilité | Accueil */
        padding-bottom: var(--pwa-bottom-clearance);
    }
    html.pwa-standalone .modal-content {
        border-radius: 1rem 1rem 0 0;
        width: 100%;
        max-width: 100%;
        max-height: calc(100dvh - var(--pwa-bottom-clearance) - 0.75rem);
        display: flex;
        flex-direction: column;
        overflow: hidden;
        /* Clearance déjà sur .modal-dialog : ne pas re-ajouter safe-area ici. */
        padding-bottom: 0;
    }
    html.pwa-standalone .modal-header,
    html.pwa-standalone .modal-footer {
        flex-shrink: 0;
    }
    html.pwa-standalone .modal-body {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }
    html.pwa-standalone .modal-footer .page-btn,
    html.pwa-standalone .modal-footer .reu-btn,
    html.pwa-standalone .modal-footer .btn {
        min-height: 44px;
    }
    html.pwa-standalone #modalBulkMail .modal-dialog {
        align-items: stretch !important;
        min-height: 100%;
        height: 100%;
        padding-bottom: 0 !important;
    }
    html.pwa-standalone #modalBulkMail .modal-content {
        border-radius: 0 !important;
        max-height: none;
        height: 100%;
        padding-bottom: 0;
        overflow: hidden;
    }
}

html.pwa-standalone .form-control,
html.pwa-standalone .form-select,
html.pwa-standalone input[type="text"],
html.pwa-standalone input[type="email"],
html.pwa-standalone input[type="password"],
html.pwa-standalone input[type="number"],
html.pwa-standalone input[type="date"],
html.pwa-standalone input[type="time"],
html.pwa-standalone input[type="datetime-local"],
html.pwa-standalone textarea,
html.pwa-standalone select {
    min-height: 44px;
    font-size: 16px; /* évite zoom iOS / Android agressif */
}

html.pwa-standalone .btn,
html.pwa-standalone .reu-btn,
html.pwa-standalone .page-btn,
html.pwa-standalone .caisse-btn {
    min-height: 44px;
}

/* Helpers tableaux (à utiliser progressivement) */
html.pwa-standalone .pwa-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

html.pwa-standalone .pwa-table-scroll > table {
    min-width: 640px;
}

/* Table → cartes (opt-in : ajouter .pwa-table-cards sur le wrapper) */
html.pwa-standalone .pwa-table-cards {
    display: block;
}

@media (max-width: 575.98px) {
    html.pwa-standalone .pwa-table-cards table,
    html.pwa-standalone .pwa-table-cards thead,
    html.pwa-standalone .pwa-table-cards tbody,
    html.pwa-standalone .pwa-table-cards th,
    html.pwa-standalone .pwa-table-cards td,
    html.pwa-standalone .pwa-table-cards tr {
        display: block;
    }
    html.pwa-standalone .pwa-table-cards thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        border: 0;
    }
    html.pwa-standalone .pwa-table-cards tr {
        margin-bottom: 0.75rem;
        padding: 0.75rem;
        border: 1px solid rgba(21, 25, 34, 0.12);
        border-radius: 0.75rem;
        background: #fff;
    }
    html.pwa-standalone .pwa-table-cards td {
        border: 0;
        padding: 0.25rem 0;
    }
    html.pwa-standalone .pwa-table-cards td[data-label]::before {
        content: attr(data-label);
        display: block;
        font-size: 0.7rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.02em;
        color: #6b7280;
        margin-bottom: 0.1rem;
    }
    /* Colonnes secondaires : opt-in masquer */
    html.pwa-standalone .pwa-col-secondary {
        display: none !important;
    }
}

/* ——— Mon compte : logout footer retiré en PWA (action dans la sheet) ——— */
html.pwa-standalone .admin-sidebar__logout {
    display: none !important;
}

html.pwa-standalone .admin-sidebar__user {
    min-height: 52px;
}

/* ——— P0056 : drawer = menu secondaire (bottom-nav = primaire) ——— */
html.pwa-standalone .admin-sidebar__brand {
    display: none !important;
}

html.pwa-standalone .admin-nav-link[data-pwa-drawer="hide"],
html.pwa-standalone .admin-nav-group--pwa-hide {
    display: none !important;
}

html.pwa-standalone .admin-nav-group {
    margin-bottom: 0.55rem;
}

html.pwa-standalone .admin-nav-group__label {
    padding-bottom: 0.3rem;
    font-size: 0.62rem;
}

html.pwa-standalone .admin-nav-link {
    min-height: 44px;
    padding: 0.48rem 0.75rem;
    margin-bottom: 0.06rem;
    font-size: 0.88rem;
    border-radius: 10px;
}

html.pwa-standalone .admin-sidebar__search {
    min-height: 44px;
    margin: 0.25rem 0.75rem 0.55rem;
    padding: 0.5rem 0.85rem;
}

/* ——— P0056 : tuile mail pleine largeur (accueil) ——— */
html.pwa-standalone .pwa-dash-mail {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    min-height: 64px;
    max-height: 72px;
    margin: 0 0 0.55rem;
    padding: 0.65rem 0.9rem;
    border-radius: 0.9rem;
    text-decoration: none;
    color: #fff;
    background: linear-gradient(135deg, #2aa8a0, #1a7f79);
    box-shadow: 0 8px 20px rgba(26, 127, 121, 0.22);
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

html.pwa-standalone .pwa-dash-mail:active {
    transform: scale(0.99);
}

html.pwa-standalone .pwa-dash-mail__icon {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.65rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.2);
    font-size: 1.15rem;
    flex-shrink: 0;
}

html.pwa-standalone .pwa-dash-mail__text {
    flex: 1 1 auto;
    min-width: 0;
}

html.pwa-standalone .pwa-dash-mail__title {
    display: block;
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.2;
}

html.pwa-standalone .pwa-dash-mail__sub {
    display: block;
    margin-top: 0.12rem;
    font-size: 0.72rem;
    font-weight: 600;
    opacity: 0.9;
}

html.pwa-standalone .pwa-dash-mail__chevron {
    opacity: 0.85;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.pwa-dash-mail {
    display: none;
}

/* P0069 — Accueil membre : app-like, plat, dense.
 * P0072j — hors standalone : masqué (séparation desktop web). */
.pwa-home {
    display: none;
    margin: 0 0 0.5rem;
    padding: 0.35rem 0.15rem 0.25rem;
    border-radius: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    color: #151922;
}

html.pwa-standalone .pwa-home {
    display: block;
}

.pwa-home__head {
    margin: 0 0 0.85rem;
    padding: 0 0.15rem;
}

.pwa-home__title {
    margin: 0;
    font-size: clamp(1.35rem, 5.2vw, 1.65rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.2;
    color: #151922;
}

.pwa-home__empty {
    margin: 0.35rem 0.15rem 0;
    padding: 0.85rem 0.9rem;
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.9rem;
    font-weight: 600;
    color: #5b6472;
}

.pwa-home__section {
    margin: 0 0 1rem;
}

.pwa-home__section:last-child {
    margin-bottom: 0.25rem;
}

.pwa-home__section-title {
    margin: 0 0 0.4rem;
    padding: 0 0.15rem;
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #6b7280;
}

.pwa-home-vote {
    margin: 0 0 0.45rem;
    padding: 0.75rem 0.85rem;
    border-radius: 0.9rem;
    border: 0;
    background: #fff;
    box-shadow: 0 1px 0 rgba(21, 25, 34, 0.04);
}

.pwa-home-vote:last-child {
    margin-bottom: 0;
}

.pwa-home-vote__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 750;
    line-height: 1.3;
    letter-spacing: -0.01em;
}

.pwa-home-vote__closes {
    margin: 0.15rem 0 0;
    font-size: 0.78rem;
    font-weight: 600;
    color: #6b7280;
}

.pwa-home-vote__options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.65rem;
}

.pwa-home-vote__btn {
    appearance: none;
    flex: 1 1 calc(33.333% - 0.3rem);
    min-width: 4.5rem;
    border: 1px solid rgba(21, 25, 34, 0.1);
    background: #f8fafc;
    color: #151922;
    border-radius: 0.75rem;
    min-height: 2.75rem;
    padding: 0.45rem 0.65rem;
    font-size: 0.9rem;
    font-weight: 700;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.pwa-home-vote__btn:active {
    transform: scale(0.98);
    background: #eef2f6;
}

.pwa-home-vote__done {
    margin: 0.55rem 0 0;
    padding: 0.45rem 0.65rem;
    border-radius: 0.65rem;
    background: rgba(26, 127, 121, 0.08);
    font-size: 0.88rem;
    font-weight: 700;
    color: #14706b;
}

.pwa-home__hint {
    margin: 0;
    padding: 0.35rem 0.15rem;
    font-size: 0.88rem;
    color: #6b7280;
}

.pwa-home-jourj-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.pwa-home-jourj {
    margin: 0;
}

.pwa-home-jourj__btn {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    min-height: 2.75rem;
    padding: 0.55rem 0.7rem;
    border: 0;
    border-radius: 0.75rem;
    background: #fff;
    box-shadow: 0 1px 0 rgba(21, 25, 34, 0.04);
    text-align: left;
    font: inherit;
    color: #151922;
    -webkit-tap-highlight-color: transparent;
}

.pwa-home-jourj__btn:disabled {
    opacity: 1;
    color: #151922;
}

.pwa-home-jourj__btn:active:not(:disabled) {
    transform: scale(0.99);
}

.pwa-home-jourj__mark {
    flex: 0 0 auto;
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 0.35rem;
    border: 1.5px solid #cbd5e1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    font-weight: 800;
    color: #159653;
    background: #fff;
}

.pwa-home-jourj.is-done .pwa-home-jourj__mark {
    border-color: #159653;
    background: rgba(21, 150, 83, 0.1);
}

.pwa-home-jourj__label {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.95rem;
    font-weight: 650;
    line-height: 1.3;
}

.pwa-home-jourj.is-done .pwa-home-jourj__label {
    color: #475569;
}

.pwa-home-jourj__caption {
    margin: 0.15rem 0 0 2.35rem;
    font-size: 0.72rem;
    color: #94a3b8;
}

.pwa-home-task-list {
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: 0.9rem;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(21, 25, 34, 0.04);
}

.pwa-home-task {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 3.1rem;
    padding: 0.55rem 0.85rem;
    border-top: 1px solid rgba(21, 25, 34, 0.06);
}

.pwa-home-task:first-child {
    border-top: 0;
}

.pwa-home-task__label {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.95rem;
    font-weight: 650;
    line-height: 1.3;
}

.pwa-home-task.is-done .pwa-home-task__label {
    color: #6b7280;
    font-weight: 600;
}

.pwa-home-task__state {
    flex-shrink: 0;
    font-size: 0.8rem;
    font-weight: 700;
    color: #14706b;
    white-space: nowrap;
}

.pwa-home-task__btn {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    flex-shrink: 0;
    border: 1px solid rgba(21, 25, 34, 0.12);
    background: #fff;
    color: #374151;
    border-radius: 0.7rem;
    min-height: 2.75rem;
    padding: 0.35rem 0.8rem;
    font-size: 0.84rem;
    font-weight: 750;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.pwa-home-task__btn-ico {
    font-size: 0.95rem;
    line-height: 1;
}

.pwa-home-task__btn--primary {
    background: #159653;
    border-color: #159653;
    color: #fff;
    box-shadow: 0 4px 12px rgba(21, 150, 83, 0.22);
}

.pwa-home-task__btn--primary:active {
    transform: scale(0.98);
}

.pwa-home-task__btn--ghost {
    border: 0;
    background: transparent;
    color: #6b7280;
    min-height: 2.5rem;
    padding: 0.25rem 0.45rem;
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 0.15em;
    box-shadow: none;
}

.pwa-home-org-frame {
    display: block;
    width: 100%;
    min-height: 16rem;
    height: 16rem;
    border: 0;
    border-radius: 0.65rem;
    background: transparent;
    box-shadow: none;
    overflow: hidden;
}

/*
 * P0072f — iframe Organisation : plus de hauteur viewport fixe (74vh)
 * qui créait un scroll interne. La hauteur est pilotée par postMessage
 * (contenu réel) ; overflow hidden => un seul scroll = page parent.
 * P0072i — placeholder court ; JS fixe height inline sur le contenu réel.
 */
html.pwa-standalone .pwa-home-org-frame {
    min-height: 8rem;
    height: 8rem;
    max-height: none;
    overflow: hidden;
}

/* Scrollbar discrète du vrai conteneur vertical (pages du pager) */
html.pwa-standalone .pwa-admin-pager__page {
    scrollbar-width: thin;
    scrollbar-color: rgba(21, 25, 34, 0.28) transparent;
}

html.pwa-standalone .pwa-admin-pager__page::-webkit-scrollbar {
    width: 4px;
}

html.pwa-standalone .pwa-admin-pager__page::-webkit-scrollbar-track {
    background: transparent;
}

html.pwa-standalone .pwa-admin-pager__page::-webkit-scrollbar-thumb {
    background: rgba(21, 25, 34, 0.28);
    border-radius: 999px;
}

html.pwa-standalone .pwa-admin-pager__page::-webkit-scrollbar-thumb:active {
    background: rgba(21, 25, 34, 0.42);
}

html.pwa-standalone .pwa-home {
    margin: 0 0 0.35rem;
    padding-bottom: 0.15rem;
}

html.pwa-standalone .page-wrap:has(.pwa-home):not(:has(.pwa-admin-pager)) {
    padding-left: max(0.85rem, env(safe-area-inset-left, 0px));
    padding-right: max(0.85rem, env(safe-area-inset-right, 0px));
    padding-bottom: calc(0.75rem + var(--pwa-bottom-clearance, 64px));
}

/* Legacy Instant T hooks (unused Accueil) — keep selectors for soft compat */
.pwa-instant-t {
    display: none;
}

html.pwa-standalone .pwa-instant-t {
    display: none;
}

html.pwa-standalone .pwa-instant-t__primary {
    display: none;
}

/* ——— Login PWA : premier écran d’app (pas de carte glass) ——— */
html.pwa-standalone body.auth-body {
    background: #151922;
}

html.pwa-standalone .auth-bg {
    background: #151922;
}

html.pwa-standalone .auth-bg::after {
    opacity: 0.12;
}

html.pwa-standalone .auth-page {
    align-items: stretch;
    justify-content: flex-start;
    min-height: 100dvh;
    padding:
        max(1.25rem, env(safe-area-inset-top, 0px))
        max(1.15rem, env(safe-area-inset-right, 0px))
        max(1.25rem, env(safe-area-inset-bottom, 0px))
        max(1.15rem, env(safe-area-inset-left, 0px));
}

html.pwa-standalone .auth-card,
html.pwa-standalone .auth-card--wide {
    max-width: none;
    width: 100%;
    margin: 0;
    padding: 0.5rem 0 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

html.pwa-standalone .auth-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
    margin-bottom: 1.75rem;
}

html.pwa-standalone .auth-brand {
    pointer-events: none;
}

html.pwa-standalone .auth-brand__logo {
    width: 64px;
    height: 64px;
    border-radius: 18px;
}

html.pwa-standalone .auth-brand__title {
    font-size: 1.35rem;
}

html.pwa-standalone .auth-brand__sub {
    display: none;
}

html.pwa-standalone .auth-head__icon {
    display: none;
}

html.pwa-standalone .auth-head__title {
    font-size: 1.55rem;
}

html.pwa-standalone .auth-head__subtitle {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.62);
    max-width: 22rem;
}

html.pwa-standalone .auth-form .form-control {
    min-height: 48px;
    font-size: 16px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.09);
}

html.pwa-standalone .auth-btn {
    border-radius: 14px;
    min-height: 48px;
}

html.pwa-standalone .auth-btn--primary {
    box-shadow: none;
}

html.pwa-standalone .auth-links a[href="../index.php"],
html.pwa-standalone .auth-links a[href="/index.php"],
html.pwa-standalone .auth-actions a[href="../index.php"] {
    display: none;
}

/* P0055c — Dossiers / Sécurité Beaumont dans l’iframe PWA */
html.pwa-standalone .reunions-app {
    padding-bottom: 0.5rem;
}

html.pwa-standalone .securite-beaumont-panel {
    margin-bottom: 0.5rem;
}

html.pwa-standalone .securite-beaumont-main {
    padding-bottom: calc(5.75rem + var(--pwa-safe-bottom));
}

html.pwa-standalone .securite-beaumont-pager {
    position: static;
    background: transparent;
    border: 0;
    box-shadow: none;
}

html.pwa-standalone .securite-chapters-sheet {
    z-index: 2200;
}

html.pwa-standalone .reunion-list-item {
    min-height: 44px;
}

html.pwa-standalone #viewList .reunions-header--list {
    margin-top: 0;
}

html.pwa-standalone #viewList .reunions-filters {
    margin-bottom: 0.65rem;
}

html.pwa-standalone .reunions-tache-add-btn {
    min-height: 48px;
}


/* P0055n — masquer × workspaces en standalone (Android Back) */
html.pwa-standalone .dossier-workspace__close,
html.pwa-standalone .securite-beaumont-close {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* P0062e1 — bandeau événement actif compact (audit Android) */
html.pwa-standalone #viewDetail .reunions-active-event {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.55rem;
    margin: 0.45rem 0 0;
    padding: 0.5rem 0.65rem;
    min-height: 0;
    max-height: none;
    border-radius: 0.85rem;
    background: #fff;
    border: 1px solid rgba(21, 25, 34, 0.1);
    box-shadow: 0 4px 14px rgba(21, 25, 34, 0.06);
}

html.pwa-standalone #viewDetail .reunions-active-event.is-current {
    background: rgba(27, 189, 104, 0.1);
    border-color: rgba(27, 189, 104, 0.35);
}

html.pwa-standalone #viewDetail .reunions-active-event__text {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.25;
    color: #151922;
}

html.pwa-standalone #viewDetail .reunions-active-event__btn {
    flex: 0 0 auto;
    width: auto;
    min-height: 44px;
    padding: 0.45rem 0.85rem;
    font-size: 0.8rem;
    font-weight: 750;
    white-space: nowrap;
}

html.pwa-standalone #viewDetail .reunions-active-event__name {
    display: inline;
    font-weight: 750;
}