/* ==========================================================================
   WESTOREX Global Spacing Fix — Ensure all pages have safe top spacing
   Applied AFTER all other CSS to guarantee no page is cut off at the top
   ========================================================================== */

/* ── Hide announcement bar completely (deprecated) ──────────────────────── */
.announcement-bar {
    display: none !important;
}

/* ── SAFE DEFAULT — every main content area gets top spacing ────────────── */
.site-main {
    padding-top: calc(var(--header-height) + 30px);
}

/* Homepage keeps its own logic (hero fills viewport) */
.home .site-main,
.page-template-front-page .site-main {
    padding-top: 0;
    margin-top: var(--header-height) !important;
}

/* Product single & category archives already handled by their own pages */
body.single-product .site-main,
body.woocommerce-shop .site-main,
body.tax-product_cat .site-main,
body.tax-product_tag .site-main,
body.woocommerce-account .site-main,
body.woocommerce-cart .site-main,
body.woocommerce-checkout .site-main {
    padding-top: calc(var(--header-height) + 40px);
}

/* Shop archive + product category + tag pages ALL use .shop-page class */
main.shop-page,
.site-main.shop-page,
body.woocommerce main.shop-page,
body.tax-product_cat main.shop-page,
body.tax-product_tag main.shop-page,
body.post-type-archive-product main.shop-page {
    padding-top: calc(var(--header-height) + 40px) !important;
    padding-bottom: 80px !important;
}

/* Product page */
.product-page {
    padding-top: calc(var(--header-height) + 30px) !important;
    padding-bottom: 80px;
}

/* Cart page uses .wstx-cart-page — already has correct padding */
.wstx-cart-page {
    padding-top: calc(var(--header-height) + 50px) !important;
}

/* Checkout - already handled in checkout-premium.css */
body.woocommerce-checkout .site-main {
    padding-top: calc(var(--header-height) + 40px) !important;
}

/* My Account */
.wstx-account-page {
    padding-top: calc(var(--header-height) + 40px);
    padding-bottom: 80px;
}

/* Content pages (About, Size Guide, FAQ, Shipping) use .wstx-content-page */
/* Their hero already has calc(var(--header-height) + 120px) — no fix needed */
.wstx-content-page .wstx-page-hero {
    padding-top: calc(var(--header-height) + 100px);
}
.wstx-content-page .wstx-page-hero--compact {
    padding-top: calc(var(--header-height) + 70px);
}

/* Contact page */
.contact-page {
    padding-top: calc(var(--header-height) + 60px) !important;
    padding-bottom: 80px;
}

/* Wishlist page */
.wstx-wishlist-page,
body.page-template-page-wishlist .site-main {
    padding-top: calc(var(--header-height) + 40px);
}

/* Legal / generic page */
.wstx-page-main,
body:not(.home):not(.woocommerce-page):not(.single-product) .site-main:not(.wstx-content-page):not(.wstx-account-page):not(.wstx-cart-page):not(.shop-page):not(.product-page):not(.error-404-page):not(.wstx-404-page):not(.contact-page) {
    padding-top: calc(var(--header-height) + 40px);
}

/* 404 page */
.error-404-page,
.wstx-404-page {
    padding-top: calc(var(--header-height) + 50px) !important;
    padding-bottom: 80px;
}

/* ── Mobile — reduce padding since header may be smaller ───────────────── */
@media (max-width: 767px) {
    .site-main {
        padding-top: calc(var(--header-height) + 20px);
    }

    .home .site-main,
    .page-template-front-page .site-main {
        padding-top: 0;
        margin-top: var(--header-height) !important;
    }

    body.single-product .site-main,
    body.woocommerce-shop .site-main,
    body.tax-product_cat .site-main,
    body.tax-product_tag .site-main,
    body.woocommerce-cart .site-main,
    body.woocommerce-checkout .site-main,
    body.woocommerce-account .site-main {
        padding-top: calc(var(--header-height) + 20px) !important;
    }

    main.shop-page,
    .site-main.shop-page,
    body.woocommerce main.shop-page,
    body.tax-product_cat main.shop-page,
    body.tax-product_tag main.shop-page,
    body.post-type-archive-product main.shop-page {
        padding-top: calc(var(--header-height) + 60px) !important;
    }

    .product-page,
    .wstx-cart-page,
    .wstx-account-page {
        padding-top: calc(var(--header-height) + 20px) !important;
    }

    .wstx-content-page .wstx-page-hero {
        padding-top: calc(var(--header-height) + 50px);
    }
    .wstx-content-page .wstx-page-hero--compact {
        padding-top: calc(var(--header-height) + 40px);
    }
}
