/* ==========================================================================
   Aplikacja mobilna Saniq (Capacitor). platform.js ustawia html.is-native i html.platform-ios / -android;
   w przeglądarce reguły z .is-native nie działają (poza banerem offline, który jest tam zawsze ukryty).
   Bezpieczne obszary: env(safe-area-inset-*) (viewport-fit=cover w aplikacji) oraz --safe-area-inset-*,
   które Capacitor wstrzykuje na Androidzie, gdy WebView nie raportuje env().
   ========================================================================== */

.native-offline-banner {
    display: flex; align-items: center; gap: 10px; padding: 10px 20px;
    background: var(--c-warn-50, #fff6e5); color: var(--c-warn, #9a5b00);
    border-bottom: 1px solid var(--c-line); font-size: 13px; font-weight: 500;
}
.native-offline-banner.hidden { display: none; }

html.is-native {
    --safe-top: max(env(safe-area-inset-top, 0px), var(--safe-area-inset-top, 0px));
    --safe-bottom: max(env(safe-area-inset-bottom, 0px), var(--safe-area-inset-bottom, 0px));
    --safe-left: max(env(safe-area-inset-left, 0px), var(--safe-area-inset-left, 0px));
    --safe-right: max(env(safe-area-inset-right, 0px), var(--safe-area-inset-right, 0px));
    -webkit-text-size-adjust: 100%;
}

/* Brak „gumowego” przewijania całej strony i podświetlenia dotknięć jak w przeglądarce */
html.is-native body { overscroll-behavior-y: none; -webkit-tap-highlight-color: transparent; }
html.is-native button, html.is-native .btn, html.is-native a { -webkit-touch-callout: none; }

/* Paski u góry: tło pod paskiem statusu, treść pod nim (notch, Dynamic Island, wycięcie aparatu) */
html.is-native .app-mobilebar {
    height: calc(var(--mobilebar-h) + var(--safe-top));
    padding-top: var(--safe-top);
}
html.is-native .app-topbar {
    height: calc(var(--topbar-h) + var(--safe-top));
    padding-top: var(--safe-top);
}
html.is-native .login-header {
    height: calc(68px + var(--safe-top));
    padding-top: var(--safe-top);
}
html.is-native .app-sidebar {
    padding-top: calc(24px + var(--safe-top));
    padding-bottom: calc(24px + var(--safe-bottom));
}

/* Dolna nawigacja i elementy nad nią (styles.css uwzględnia już env(); tu także zmienne Androida) */
html.is-native .app-tabbar { padding-bottom: calc(12px + var(--safe-bottom)); }
html.is-native body.has-tabbar .app-main { padding-bottom: calc(var(--tabbar-h) + var(--safe-bottom)); }
html.is-native .toast { bottom: calc(var(--tabbar-h) + 16px + var(--safe-bottom)); }

/* Okna dialogowe nie mogą wchodzić pod pasek statusu ani pasek gestów */
html.is-native .modal {
    padding-top: calc(16px + var(--safe-top));
    padding-bottom: calc(16px + var(--safe-bottom));
}

/* Poziomo: treść poza wycięciem ekranu */
html.is-native .app-main, html.is-native .login {
    padding-left: var(--safe-left);
    padding-right: var(--safe-right);
}

/* Ekran wymuszonej aktualizacji (platform.js) */
.native-update-overlay { z-index: 200; }