/*
 * WP Capacitor Safe-Area Insets
 *
 * Zero-config coverage for Woodmart theme, WooCommerce, Elementor sticky
 * widgets, WP admin bar, and the nsport child-theme custom header.
 *
 * Cross-platform inset resolution:
 *   var(--safe-area-inset-*)  → Android, set by @capacitor-community/safe-area
 *                              (Android WebView can't override env()).
 *   env(safe-area-inset-*)    → iOS + desktop browsers (native CSS).
 *   0px                       → fallback outside Capacitor / non-cover viewports.
 *
 * Custom property aliases defined on :root so rules below read clean.
 */
:root {
    --wpcsa-top:    var(--safe-area-inset-top,    env(safe-area-inset-top,    0px));
    --wpcsa-bottom: var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px));
    --wpcsa-left:   var(--safe-area-inset-left,   env(safe-area-inset-left,   0px));
    --wpcsa-right:  var(--safe-area-inset-right,  env(safe-area-inset-right,  0px));
}

/* ------------------------------------------------------------------
 * 1. In-flow content — push everything below the status bar and above
 *    the gesture-nav pill. Harmless on desktop (insets are 0).
 * ------------------------------------------------------------------ */
html {
    padding-top: var(--wpcsa-top);
    padding-bottom: var(--wpcsa-bottom);
}

/* ------------------------------------------------------------------
 * 2. Top-anchored fixed / sticky elements — position:fixed ignores
 *    html padding, so each element has to shift itself by the inset.
 * ------------------------------------------------------------------ */

/* Woodmart sticky header (active state + cloned copy used during the
   scroll-slide animation). */
.whb-sticked .whb-main-header,
.whb-clone,
/* Woodmart fixed full-screen search + full-screen menu overlays. */
.wd-fs-menu,
.wd-search-full-screen,
/* Woodmart skip-links (a11y, top-left when keyboard focused). */
.wd-skip-links,
/* Woodmart popup builder (rendered edge-to-edge). */
.wd-popup-builder-wrap.wd-scrolling-on,
/* WP admin bar for logged-in users. */
#wpadminbar,
/* nsport child theme custom sticky header + slide-in mobile panel. */
.nsport-custom-header,
.nsport-mobile-panel,
/* Generic Elementor sticky widgets. */
.elementor-sticky--effects,
.elementor-sticky--active {
    top: var(--wpcsa-top) !important;
}

/* When Woodmart sticky nav is pinned full-height on the side, it runs
   from status-bar edge to gesture-nav edge. */
.wd-sticky-nav,
.wpb_column.wd-side-hidden {
    padding-top: var(--wpcsa-top);
    padding-bottom: var(--wpcsa-bottom);
}

/* ------------------------------------------------------------------
 * 3. Bottom-anchored fixed / sticky elements.
 * ------------------------------------------------------------------ */

/* Woodmart mobile bottom toolbar (the icon bar with shop/blog/etc). */
.wd-toolbar,
/* Woodmart cookies popup (full-width bottom banner). */
.wd-cookies-popup,
/* nsport child theme custom mobile shopbar. */
.sp-mobile-shopbar {
    bottom: var(--wpcsa-bottom) !important;
}

/* Sticky scroll-to-top button — float clear of the gesture-nav. */
.scrollToTop {
    bottom: calc(20px + var(--wpcsa-bottom));
}

/* WooCommerce single-product sticky add-to-cart button. Standalone case. */
.wd-sticky-btn {
    bottom: var(--wpcsa-bottom);
}
/* When the Woodmart toolbar is also visible, the button stacks on top
   of the 55px toolbar AND the safe-area floor. */
.sticky-toolbar-on .wd-sticky-btn {
    bottom: calc(55px + var(--wpcsa-bottom));
}

/* Sticky footer (position:sticky, so padding shifts the footer content,
   not the element itself — just adds breathing room above the nav pill). */
.sticky-footer-on .wd-footer {
    padding-bottom: var(--wpcsa-bottom);
}

/* Woodmart sticky social icons — right-pinned vertical strip, center of
   viewport. Nudge its center so it doesn't clip under status/nav. */
.wd-sticky-social {
    padding-top: var(--wpcsa-top);
    padding-bottom: var(--wpcsa-bottom);
}

/* ------------------------------------------------------------------
 * 4. Side drawers — left/right insets matter in landscape on phones
 *    with notches-on-side, and every drawer needs top+bottom padding
 *    so its internal content clears both system bars.
 * ------------------------------------------------------------------ */
.cart-widget-side,
.wd-popup-builder-wrap.wd-scrolling-on,
.wd-close-side {
    padding-top: var(--wpcsa-top);
    padding-bottom: var(--wpcsa-bottom);
}
.cart-widget-side.wd-right  { right: var(--wpcsa-right); }
.cart-widget-side.wd-left   { left:  var(--wpcsa-left); }
.wd-sidebar-opener.wd-right { right: var(--wpcsa-right); }
.wd-sidebar-opener.wd-left  { left:  var(--wpcsa-left); }

/* ------------------------------------------------------------------
 * 5. Common non-Woodmart cookie / notification bars (harmless when
 *    the selector doesn't match anything).
 * ------------------------------------------------------------------ */
.cookie-notice-container,
#cookie-law-info-bar,
.moove-gdpr-info-bar-container {
    padding-bottom: var(--wpcsa-bottom);
}