/* ============================================================================
   iOS WKWebView (Capacitor) — fixes spécifiques au moteur WebView iOS

   Sur iOS, le système intercepte les gestures (long-press → callout, double-tap
   → zoom, sélection texte) et fire un `pointercancel` qui tue les handlers
   custom (FAB long-press, map waypoint long-press, etc.). Ces règles désactivent
   les comportements natifs gênants sur les éléments interactifs.
   ============================================================================ */

button,
a,
.live-fab-tile,
.wx-fc-sb-btn,
.leaflet-container,
.leaflet-marker-icon,
[data-id],
[role="button"] {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
    /* Évite le délai 300ms et les comportements multi-touch indésirables */
    touch-action: manipulation;
}

/* Inputs et zones de texte gardent le comportement iOS natif pour saisie */
input,
textarea,
[contenteditable="true"],
[contenteditable=""],
.cm-content,
.message-input {
    -webkit-user-select: auto;
    user-select: auto;
    -webkit-touch-callout: default;
}

/* Désactive le tap highlight bleu/gris iOS sur les boutons custom */
button,
a,
.live-fab-tile,
[data-id] {
    -webkit-tap-highlight-color: transparent;
}

/* ============================================================================
   Safe area (notch / Dynamic Island) — iPhone X+ et iPad

   Sans ces regles, la top-bar a height:80px commence a 0 et la zone notch
   par-dessus la barre est TRANSPARENTE, donc le contenu de la page (scroll)
   apparait par transparence sous la barre. Solution : ajouter
   padding-top: env(safe-area-inset-top) a la top-bar, qui etend son hauteur
   visible derriere la notch avec son background opaque, et pousse le contenu
   interne (logo, tabs) en-dessous de la notch.
   ============================================================================ */
@supports (padding-top: env(safe-area-inset-top)) {
    /* Capacitor iOS met backgroundColor=#0f172a au WebView. Sans cela, la zone
       notch (safe area top) montre cette couleur sombre PAR-DESSUS le contenu
       du fait de status-bar-style:black-translucent. Force le bg WebView via
       html/body pour qu'il matche le topbar. */
    html {
        background-color: var(--c-bg, #ffffff) !important;
    }

    /* Top-bar app principale (.top-bar dans layout.css)
       Desktop : 80px ; mobile : 52px (harmonisation avec #live-topbar, request user).
       border-box : height = padding-top + contenu visible. */
    header.top-bar,
    .top-bar {
        /* Renforcement defensif position:fixed - sur iOS WKWebView, le compositeur
           peut perdre le fixed dans certains scenarios scroll. translateZ(0)
           force un layer GPU dedie pour la topbar -> reste vraiment fixe au top. */
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 1100 !important;
        transform: translateZ(0) !important;
        -webkit-transform: translateZ(0) !important;
        will-change: transform !important;
        box-sizing: border-box !important;
        padding-top: env(safe-area-inset-top) !important;
        height: calc(80px + env(safe-area-inset-top)) !important;
        /* S'assure que le bg de la top-bar englobe la zone notch */
        background-color: var(--c-bg, #ffffff) !important;
    }
    /* Body a deja padding-top: 80px pour compenser la top-bar fixed.
       Avec le topbar etendu, il faut ajouter la safe area. */
    body {
        padding-top: calc(80px + env(safe-area-inset-top)) !important;
    }
    /* Mobile : on rétrécit la top-bar à 52px (matche #live-topbar) ET le padding body. */
    @media (max-width: 768px) {
        header.top-bar,
        .top-bar {
            height: calc(52px + env(safe-area-inset-top)) !important;
        }
        body {
            padding-top: calc(52px + env(safe-area-inset-top)) !important;
        }
    }
    /* Top-bar Live/Track (#live-topbar) — vue plein ecran */
    #live-topbar {
        box-sizing: border-box !important;
        padding-top: env(safe-area-inset-top) !important;
        height: calc(52px + env(safe-area-inset-top)) !important;
    }
    /* Top-bar Forecast/Hub avec sidebar boutons — padding seul (height auto) */
    .wx-fc-sb,
    .wx-fc-topbar,
    .wx-hub-topbar {
        padding-top: max(env(safe-area-inset-top), 8px) !important;
    }
    /* Variables CSS globales exposees pour positionnement custom */
    body {
        --wxp-safe-top: env(safe-area-inset-top);
        --wxp-safe-bottom: env(safe-area-inset-bottom);
    }
    /* Safe area bas pour les bottom-bars / FAB */
    .live-fab-button,
    .live-fab-modal,
    .bottom-bar,
    [class*="bottom-tab"] {
        padding-bottom: max(env(safe-area-inset-bottom), 8px);
    }
}