/* =====================================================
   STANDALONE-OVERRIDES.CSS - GerPay
   Correcoes de layout para quando o sistema roda SEM a
   barra do navegador: PWA instalado na tela inicial
   (display-mode: standalone).

   Antes este arquivo se chamava capacitor-overrides.css e
   o gate era html.capacitor, ligado pelo User-Agent do APK.
   O problema que ele resolve, porem, nunca foi "ser um APK":
   e nao ter a chrome do navegador reservando o espaco da
   status bar / home indicator. Um PWA instalado tem
   exatamente a mesma necessidade, entao o gate passou a ser
   html.standalone-app, ligado por display-mode em
   assets/js/session-guard-mobile-config.js.

   env(safe-area-inset-*) retorna 0px onde nao ha notch,
   entao as regras degradam sozinhas. O navegador comum
   continua sem a classe e portanto sem nenhuma destas
   regras — igual ao comportamento anterior.
   ===================================================== */

/* ==========================================
   1. LOGIN PAGE - Safe Area
   ========================================== */
html.standalone-app body.gerpay-login-page {
    /* Push flex container content down to respect status bar */
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
}

/* ==========================================
   2. HEADER FIXOS (Produtos / Venda / Relatorio)
   Os headers .app-header e .mobile-header tem
   position:fixed e height:60px. O safe-area-inset-top
   precisa ser somado ao padding interno.

   O height vira auto para acomodar o padding extra.
   ========================================== */
html.standalone-app .app-header,
html.standalone-app .mobile-header {
    height: auto !important;
    min-height: 60px;
    padding-top: calc(env(safe-area-inset-top, 0px) + 10px) !important;
    padding-bottom: 10px !important;
}

/* A definicao completa de nav.bottom-nav vivia aqui, porque na epoca
   venda_mobile.css e produtos_mobile.css nao estilizavam .bottom-nav.
   Hoje as quatro paginas do modulo de venda definem a sua propria
   (venda_mobile.css, produtos_mobile.css, relatorio_mobile.css e
   dashboard-vendedora_mobile.css), cada uma com o respectivo bloco
   html.standalone-app .bottom-nav para o safe-area inferior. O bloco
   daqui era codigo morto e saiu. */

/* ==========================================
   3. MODAIS - Safe area no topo
   ========================================== */
html.standalone-app .modal-overlay,
html.standalone-app .mobile-modal-overlay {
    padding-top: env(safe-area-inset-top, 0px);
}

html.standalone-app .scanner-modal {
    padding-top: env(safe-area-inset-top, 0px);
}

/* ==========================================
   4. SIDEBAR - Safe area no topo
   ========================================== */
html.standalone-app .sidebar {
    padding-top: env(safe-area-inset-top, 0px);
}
