/* Une même zone visible pour les barres fixes, dès le démarrage de la session. */
:root {
    --app-viewport-height: 100vh;
    --app-viewport-top: 0px;
    --safe-top: 0px;
    --safe-right: 0px;
    --safe-bottom: 0px;
    --safe-left: 0px;
    --navigation-gutter: clamp(20px,2.2vw,38px);
    --topbar-block-padding: 0px;
    --modal-edge-gap: 24px;
}
@supports (height: 100dvh) { :root { --app-viewport-height: 100dvh; } }
@supports (padding: env(safe-area-inset-bottom)) {
    :root {
        --safe-top: env(safe-area-inset-top,0px);
        --safe-right: env(safe-area-inset-right,0px);
        --safe-bottom: env(safe-area-inset-bottom,0px);
        --safe-left: env(safe-area-inset-left,0px);
    }
}
html { scroll-padding-top: calc(var(--topbar-height) + var(--safe-top) + 16px); scroll-padding-bottom: calc(var(--bottom-nav-height) + 16px); }
.app-main { min-height: var(--app-viewport-height); padding-top: calc(var(--topbar-height) + var(--safe-top)); }
.topbar {
    top: var(--app-viewport-top);
    height: calc(var(--topbar-height) + var(--safe-top));
    padding-top: calc(var(--topbar-block-padding) + var(--safe-top));
    padding-bottom: var(--topbar-block-padding);
    padding-left: max(var(--navigation-gutter),var(--safe-left));
    padding-right: max(var(--navigation-gutter),var(--safe-right));
}
.sidebar {
    top: var(--app-viewport-top); bottom: auto; height: var(--app-viewport-height);
    padding: var(--safe-top) 0 var(--safe-bottom) var(--safe-left);
}
.sidebar-nav { overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; scroll-padding-block: 8px; }
.page-loading { top: calc(var(--app-viewport-top) + var(--topbar-height) + var(--safe-top)); }
.topbar input { font-size:16px; }
/* viewport-fit=cover ne doit pas placer les formulaires sous une encoche. */
.auth-layout { padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left); }
.auth-main { min-height:calc(var(--app-viewport-height) - var(--safe-top) - var(--safe-bottom)); }
.modal { top:var(--app-viewport-top); bottom:auto; height:var(--app-viewport-height); }
.modal-dialog {
    width:calc(100% - var(--modal-edge-gap) - var(--modal-edge-gap) - var(--safe-left) - var(--safe-right));
    margin-top:calc(var(--modal-edge-gap) + var(--safe-top)); margin-bottom:calc(var(--modal-edge-gap) + var(--safe-bottom));
}
.modal-dialog-centered { min-height:calc(var(--app-viewport-height) - var(--modal-edge-gap) - var(--modal-edge-gap) - var(--safe-top) - var(--safe-bottom)); }
.modal-content,.modal-content>form { max-height:calc(var(--app-viewport-height) - var(--modal-edge-gap) - var(--modal-edge-gap) - var(--safe-top) - var(--safe-bottom)); }

@media (max-width:1199px), (hover:none) and (pointer:coarse) {
    :root { --bottom-nav-height: calc(76px + var(--safe-bottom)); --navigation-gutter: 24px; }
    body.menu-open { position:fixed; top:var(--menu-scroll-offset,0px); left:0; right:0; width:100%; overflow:hidden; }
    .menu-open .app-main { pointer-events:none; }
    .menu-open .sidebar-scrim { top:var(--app-viewport-top); bottom:auto; height:var(--app-viewport-height); touch-action:none; }
    .mobile-bottom-nav {
        position:fixed; top:calc(var(--app-viewport-top) + var(--app-viewport-height) - var(--bottom-nav-height)); bottom:auto;
        height:var(--bottom-nav-height); margin:0;
        padding-top:8px; padding-bottom:calc(8px + var(--safe-bottom));
        padding-left:max(12px,var(--safe-left),calc((100% - 650px)/2));
        padding-right:max(12px,var(--safe-right),calc((100% - 650px)/2));
    }
    .mobile-bottom-nav>a,.mobile-bottom-nav>button { flex-shrink:1; }
    #main-content,.app-footer { padding-left:max(20px,var(--safe-left)); padding-right:max(20px,var(--safe-right)); }
}
@media (max-width:959px) { :root { --navigation-gutter:20px; } }
@media (max-width:639px) {
    :root { --bottom-nav-height:calc(74px + var(--safe-bottom)); --navigation-gutter:15px; --topbar-block-padding:10px; --modal-edge-gap:10px; }
    #main-content,.app-footer { padding-left:max(16px,var(--safe-left)); padding-right:max(16px,var(--safe-right)); }
}
@media (max-width:359px) {
    :root { --navigation-gutter:11px; }
    #main-content,.app-footer { padding-left:max(12px,var(--safe-left)); padding-right:max(12px,var(--safe-right)); }
}
[data-viewport-short="true"] .sidebar-head { padding-top:12px; padding-bottom:12px; }
[data-viewport-short="true"] .sidebar .tenant-identity { display:none; }
[data-viewport-short="true"] .sidebar-bottom { padding-top:8px; padding-bottom:8px; }
[data-viewport-short="true"] .sidebar-volume,[data-viewport-short="true"] .sidebar .product-credit { display:none; }
@media print { .app-main { min-height:0; padding:0; } }
