/* Force grid layout - override WooCommerce's float columns-4 system */
.woocommerce ul.products.columns-4,
.woocommerce-page ul.products.columns-4,
.woocommerce ul.products,
.woocommerce-page ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Kill clearfix pseudo-elements that become ghost grid items */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after,
.featured-products-section ul.products::before,
.featured-products-section ul.products::after {
    display: none !important;
    content: none !important;
}
/* Kill WooCommerce's float + 22% width on each item */
.woocommerce ul.products.columns-4 li.product,
.woocommerce-page ul.products.columns-4 li.product,
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* Full image, no padding */
.woocommerce ul.products li.product a img {
    width: 100% !important;
    height: 280px !important;
    object-fit: contain !important;
    padding: 12px !important;
    background: #f8f9fa;
    display: block !important;
}

/* Larger product title */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 17px !important;
    font-weight: 700 !important;
    padding: 12px 16px 4px !important;
}

/* Black price */
.woocommerce ul.products li.product .price {
    font-size: 16px !important;
    color: #000 !important;
    padding: 0 16px 12px !important;
    display: block !important;
}

/* Big pill Add to Cart button */
.woocommerce ul.products li.product .button {
    display: block !important;
    width: calc(100% - 32px) !important;
    margin: 0 16px 16px !important;
    padding: 14px 20px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    border-radius: 50px !important;
    border: 2px solid #111 !important;
    background: transparent !important;
    color: #111 !important;
    text-align: center !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
}

.woocommerce ul.products li.product .button:hover {
    background: #111 !important;
    color: #fff !important;
}/* Fix homepage featured products grid */
.featured-products-section .products-grid {
    display: block !important;
}

.featured-products-section ul.products.columns-4,
.featured-products-section ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.featured-products-section ul.products li.product {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Full image */
.featured-products-section ul.products li.product a img {
    width: 100% !important;
    height: 280px !important;
    object-fit: contain !important;
    padding: 12px !important;
    background: #f8f9fa;
    display: block !important;
}

/* Product title */
.featured-products-section ul.products li.product .woocommerce-loop-product__title {
    font-size: 17px !important;
    font-weight: 700 !important;
    padding: 12px 16px 4px !important;
}

/* Price */
.featured-products-section ul.products li.product .price {
    font-size: 16px !important;
    color: #000 !important;
    padding: 0 16px 12px !important;
    display: block !important;
}

/* Big pill button */
.featured-products-section ul.products li.product .button {
    display: block !important;
    width: calc(100% - 32px) !important;
    margin: 0 16px 16px !important;
    padding: 14px 20px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    border-radius: 50px !important;
    border: 2px solid #111 !important;
    background: transparent !important;
    color: #111 !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

.featured-products-section ul.products li.product .button:hover {
    background: #111 !important;
    color: #fff !important;
}body {
    background-color: #f4f4f4 !important;
}body {
    background-color: #f4f4f4 !important;
}

/* ===== MOBILE FIXES ===== */
@media (max-width: 768px) {
    /* Fix product gallery sticky offset on mobile */
    .woocommerce div.product .woocommerce-product-gallery {
        position: relative !important;
        top: 0 !important;
    }

    /* Fix shop grid - 2 columns on mobile instead of 3 */
    .woocommerce ul.products.columns-4,
    .woocommerce-page ul.products.columns-4,
    .woocommerce ul.products,
    .woocommerce-page ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }

    .featured-products-section ul.products.columns-4,
    .featured-products-section ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }

    /* Center hero logo on mobile */
    .hero-section {
        align-items: center !important;
        justify-content: center !important;
    }

    .hero-bg-image {
        object-fit: contain !important;
        object-position: center center !important;
    }

    /* Fix featured products - show title/price by letting link expand */
    .featured-products-section ul.products li.product a.woocommerce-LoopProduct-link,
    .featured-products-section ul.products li.product a.woocommerce-loop-product__link {
        overflow: visible !important;
        height: auto !important;
        display: block !important;
    }

    .featured-products-section ul.products li.product a img {
        height: 140px !important;
    }
}

/* ===== SITE-WIDE FONT: TIMES NEW ROMAN ===== */
body, h1, h2, h3, h4, h5, h6, p, a, li, span, div,
input, button, select, textarea, label,
.woocommerce, .woocommerce-page {
    font-family: "Times New Roman", Times, serif !important;
}

/* ===== CENTER NAVIGATION MENU ===== */
nav.main-navigation,
.main-navigation ul,
.nav-menu,
header nav ul,
.site-navigation ul {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    list-style: none !important;
}

/* ===== HEADER & FOOTER: DARK STEEL GRAY BACKGROUND ===== */
.site-header,
header.site-header,
#masthead,
.header-wrapper,
.site-branding-wrapper,
.navigation-wrapper,
nav.main-navigation,
.announcement-bar,
.site-footer,
footer.site-footer,
#colophon,
.footer-wrapper,
.footer-bottom {
    background-color: #d4d5d6 !important;
    border-color: #d4d5d6 !important;
}

/* ===== HEADER & FOOTER: LIGHT CONTRASTING TEXT ===== */
.site-header,
.site-header *,
#masthead,
#masthead *,
.header-wrapper *,
.announcement-bar,
.announcement-bar *,
nav.main-navigation *,
.site-footer,
.site-footer *,
footer.site-footer *,
#colophon *,
.footer-wrapper *,
.footer-bottom * {
    color: #1a1a1a !important;
}

.site-header a,
#masthead a,
nav a,
nav.main-navigation a,
.site-footer a,
footer a,
#colophon a {
    color: #1a1a1a !important;
}

.site-header a:hover,
nav a:hover,
.site-footer a:hover,
footer a:hover {
    color: #000000 !important;
    opacity: 0.9;
}

/* ===== SITE TITLE (ADXWellness) BIGGER ===== */
.site-title,
.site-title a,
#masthead .site-title,
#masthead .site-title a,
.site-branding .site-title {
    font-size: 2.4rem !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

/* ===== MENU BAR FONT BIGGER ===== */
nav.main-navigation a,
nav.main-navigation li a,
.nav-menu li a,
.main-navigation ul li a,
header nav ul li a {
    font-size: 1.2rem !important;
    font-weight: 600 !important;
}

/* ===== PRICES: BLACK EVERYWHERE ===== */
.woocommerce .price,
.woocommerce .price *,
.woocommerce-Price-amount,
.woocommerce-Price-amount *,
span.amount,
.price ins,
.price del,
.price .amount,
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: #000000 !important;
}

/* ===== HEADER TEXT BIGGER ===== */
.site-header,
.header-wrapper,
.site-branding {
    font-size: 1.1rem !important;
}

/* Override light text back to dark for light gray background */
.site-header *,
#masthead *,
.header-wrapper *,
.announcement-bar,
.announcement-bar *,
nav.main-navigation *,
.site-footer *,
footer.site-footer *,
#colophon *,
.footer-wrapper *,
.footer-bottom * {
    color: #1a1a1a !important;
}

.site-header a,
#masthead a,
nav a,
nav.main-navigation a,
.site-footer a,
footer a,
#colophon a {
    color: #1a1a1a !important;
}

.site-header a:hover,
nav a:hover,
.site-footer a:hover,
footer a:hover {
    color: #000000 !important;
    opacity: 0.75;
}

/* ===== FORCE LIGHT GRAY ON HEADER/FOOTER (stronger specificity) ===== */
html body header.site-header,
html body .site-header,
html body #masthead,
html body .header-wrapper,
html body .site-branding-wrapper,
html body .navigation-wrapper,
html body nav.main-navigation,
html body .announcement-bar,
html body footer.site-footer,
html body .site-footer,
html body #colophon,
html body .footer-wrapper,
html body .footer-bottom {
    background: #c8c9ca !important;
    background-color: #c8c9ca !important;
}

html body header.site-header *,
html body #masthead *,
html body .announcement-bar *,
html body nav.main-navigation *,
html body footer.site-footer *,
html body #colophon * {
    color: #1a1a1a !important;
}

/* ===== HIDE SITE TITLE (ADXWellness) FROM HEADER ===== */
.site-title,
.site-title a,
p.site-title {
    display: none !important;
}

/* ===== SHORTER HEADER ===== */
.site-branding-wrapper,
.site-branding {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    min-height: unset !important;
}

.header-wrapper,
.site-header {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.navigation-wrapper,
nav.main-navigation {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    min-height: unset !important;
}

/* ===== HIDE CATEGORY & BRAND META ON PRODUCT PAGES ===== */
.product_meta,
.woocommerce div.product .product_meta,
.woocommerce-product-details__short-description + .product_meta,
.posted_in,
.tagged_as,
span.posted_in,
span.tagged_as,
.woocommerce div.product p.posted_in,
.woocommerce div.product span.posted_in {
    display: none !important;
}

/* ===== HIDE SUBSCRIBE SECTION ===== */
section.subscribe-section,
.subscribe-section {
    display: none !important;
}

/* ===== LARGER FOOTER FONT ===== */
.site-footer,
.site-footer *,
#colophon,
#colophon * {
    font-size: 1.2rem !important;
    line-height: 1.7 !important;
}

/* ===== BIGGER ANNOUNCEMENT BAR ===== */
.announcement-bar {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

/* ===== NAV INLINE WITH HEADER ICONS ===== */
/* Make header a positioning context */
header.site-header {
    position: relative !important;
}

/* Remove the separate nav row by overlaying it on the header-inner row */
header.site-header nav.main-navigation {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    z-index: 5 !important;
    pointer-events: none !important;
}

header.site-header nav.main-navigation ul,
header.site-header nav.main-navigation ul.nav-menu {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 4px !important;
    pointer-events: all !important;
    list-style: none !important;
}

header.site-header nav.main-navigation ul li a {
    font-size: 1.1rem !important;
    padding: 6px 12px !important;
    pointer-events: all !important;
    display: block !important;
}

/* ===== HOMEPAGE: BLACK BACKGROUND, WHITE TEXT ===== */

/* Entire page body */
body,
html body,
.home.blog,
.adx-front-page,
#page,
.site,
.site-main,
#main {
    background-color: #000000 !important;
    background: #000000 !important;
    color: #ffffff !important;
}

/* Header & announcement bar: black */
html body header.site-header,
html body .header-inner,
html body .header-left,
html body .header-right,
html body .site-branding,
html body nav.main-navigation,
html body .announcement-bar {
    background-color: #000000 !important;
    background: #000000 !important;
    color: #ffffff !important;
}

/* Footer: black */
html body footer.site-footer,
html body #colophon,
html body .footer-wrapper,
html body .footer-bottom,
html body .footer-inner {
    background-color: #000000 !important;
    background: #000000 !important;
    color: #ffffff !important;
}

/* All text white */
html body header.site-header *,
html body .announcement-bar *,
html body nav.main-navigation *,
html body footer.site-footer *,
html body #colophon *,
html body .footer-wrapper *,
html body .site-main *,
html body #main *,
html body .featured-products-section *,
html body .woocommerce *,
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6,
html body p, html body a, html body span, html body li {
    color: #ffffff !important;
}

/* Nav & footer links: white */
html body a,
html body nav a,
html body footer a {
    color: #ffffff !important;
}

html body a:hover,
html body nav a:hover,
html body footer a:hover {
    color: #cccccc !important;
    opacity: 1 !important;
}

/* Product cards: dark background so they stand out */
html body ul.products li.product,
html body .woocommerce ul.products li.product {
    background: #111111 !important;
    border-radius: 8px !important;
    padding: 12px !important;
}

/* Prices stay black as previously set — override back to white on black bg */
html body .woocommerce .price,
html body .woocommerce .price *,
html body .woocommerce-Price-amount,
html body .woocommerce-Price-amount *,
html body span.amount {
    color: #ffffff !important;
}

/* Featured products section: black */
html body .featured-products-section,
html body .featured-products-section .container,
html body .featured-products-section .section-header {
    background-color: #000000 !important;
    background: #000000 !important;
}

/* Section titles white */
html body .section-title,
html body .featured-products-section h2 {
    color: #ffffff !important;
}

/* ===== KEEP HERO SECTION WHITE ===== */
html body .hero-section {
    background: #ffffff !important;
    background-color: #ffffff !important;
}

/* ===== KEEP POPUP TEXT DARK (white box on dark overlay) ===== */
#adx-disclaimer-overlay > div,
#adx-disclaimer-overlay > div * {
    color: #1a1a1a !important;
}
#adx-disclaimer-overlay > div h2,
#adx-disclaimer-overlay > div p {
    color: #1a1a1a !important;
}
#adx-disclaimer-overlay > div button {
    color: #ffffff !important;
    background: #1a1a1a !important;
}

/* ===== SHOP PAGE TITLE: MATCH CART TITLE SIZE (44px) ===== */
.page-hero .container,
.page-hero .container * {
    font-size: 2.75rem !important;
    font-weight: 700 !important;
}

/* ===== HEADER: BLACK BACKGROUND + WHITE TEXT/ICONS ON ALL PAGES ===== */
html body header.site-header,
html body .header-inner,
html body .header-left,
html body .header-right,
html body .site-branding,
html body .announcement-bar,
html body nav.main-navigation {
    background: #000000 !important;
    background-color: #000000 !important;
}

/* White nav & header links */
html body nav.main-navigation a,
html body nav.main-navigation li a,
html body .header-left a,
html body .header-right a,
html body .announcement-bar,
html body .announcement-bar * {
    color: #ffffff !important;
}

/* White SVG icon strokes (search, account, cart) */
html body header svg path,
html body header svg circle,
html body header svg line,
html body header svg polyline,
html body header svg rect {
    stroke: #ffffff !important;
}

/* ===== HOMEPAGE FEATURED PRODUCTS: WHITE CARDS + BLACK TEXT ===== */
.home ul.products li.product,
.adx-front-page ul.products li.product {
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
}

.home ul.products li.product *,
.adx-front-page ul.products li.product * {
    color: #000000 !important;
}

/* ===== FEATURED PRODUCTS BLACK TEXT: higher specificity to beat #main rule ===== */
html body #main ul.products li.product,
html body #main .products li.product {
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
}

html body #main ul.products li.product *,
html body #main .products li.product *,
html body #main ul.products li.product .woocommerce-Price-amount,
html body #main ul.products li.product .price,
html body #main ul.products li.product h2,
html body #main ul.products li.product a {
    color: #000000 !important;
}


/* ===== HEADER WHITE: beat #masthead ID specificity ===== */
html body #masthead nav.main-navigation a,
html body #masthead nav.main-navigation li a,
html body #masthead #site-navigation a,
html body #masthead .header-icon-btn,
html body #masthead .header-icon-btn *,
html body #masthead .nav-menu a,
html body #masthead .nav-menu li a {
    color: #ffffff !important;
}

html body #masthead svg path,
html body #masthead svg circle,
html body #masthead svg line,
html body #masthead svg polyline,
html body #masthead svg rect {
    stroke: #ffffff !important;
    fill: none !important;
}

/* Keep cart badge number visible */
html body #masthead .cart-count,
html body #masthead .cart-contents-count {
    color: #ffffff !important;
    background: #0000ff !important;
}

/* ===== PRODUCT PAGE TABS: white background + black text ===== */
html body .woocommerce-tabs,
html body .woocommerce-tabs .wc-tabs,
html body .woocommerce-tabs .panel,
html body .woocommerce-Tabs-panel {
    background: #ffffff !important;
    background-color: #ffffff !important;
}

html body .woocommerce-tabs .wc-tabs li a,
html body .woocommerce-tabs .wc-tabs li,
html body .woocommerce-tabs .panel,
html body .woocommerce-tabs .panel *,
html body .woocommerce-Tabs-panel,
html body .woocommerce-Tabs-panel *,
html body .woocommerce-product-details__short-description,
html body .woocommerce-product-details__short-description * {
    color: #000000 !important;
    background-color: transparent;
}

html body .woocommerce-tabs .wc-tabs {
    border-bottom-color: #cccccc !important;
}

/* ===== HIDE STOCK COUNT ON PRODUCT PAGES ===== */
p.stock,
.woocommerce-product-details p.stock,
.single-product p.stock,
span.stock,
.stock {
    display: none !important;
}


/* ===== PRODUCT PAGE TABS: beat #main ID specificity ===== */
html body #main .woocommerce-tabs,
html body #main .woocommerce-tabs .wc-tabs,
html body #main .woocommerce-tabs .panel,
html body #main .woocommerce-Tabs-panel {
    background: #ffffff !important;
    background-color: #ffffff !important;
}

html body #main .woocommerce-tabs .wc-tabs li,
html body #main .woocommerce-tabs .wc-tabs li a,
html body #main .woocommerce-tabs .panel *,
html body #main .woocommerce-Tabs-panel * {
    color: #000000 !important;
    background-color: transparent !important;
}

/* Tab links themselves: give them a light background so they're visible on black page */
html body #main .woocommerce-tabs .wc-tabs li a {
    background-color: #f0f0f0 !important;
    padding: 8px 16px !important;
    border-radius: 4px 4px 0 0 !important;
}

html body #main .woocommerce-tabs .wc-tabs li.active a,
html body #main .woocommerce-tabs .wc-tabs li.active_tab a {
    background-color: #ffffff !important;
    color: #000000 !important;
}


/* ===== 1. FIX HEADER GRAY STRIPS: #masthead ID beats all class-based gray rules ===== */
html body #masthead {
    background: #000000 !important;
    background-color: #000000 !important;
}

/* ===== 2. HOMEPAGE NAV: larger font + wider spacing (desktop only) ===== */
@media (min-width: 769px) {
    html body #masthead nav.main-navigation .nav-menu li a,
    html body #masthead #site-navigation .nav-menu li a {
        font-size: 1.15rem !important;
        padding: 6px 28px !important;
        letter-spacing: 0.5px !important;
    }
}

/* ===== 3. FEATURED PRODUCTS: 3 on desktop, 4 on mobile ===== */
@media (min-width: 769px) {
    .featured-products-section ul.products li.product:nth-child(4) {
        display: none !important;
    }
}
@media (max-width: 768px) {
    .featured-products-section ul.products {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .featured-products-section ul.products li.product:nth-child(4) {
        display: block !important;
    }
}

/* ===== 4. PAGE HERO HEIGHT: smaller on shop/cart/account pages ===== */
.page-hero {
    padding: 18px 24px !important;
    min-height: auto !important;
}

/* ===== 5. PAGE TITLES: royal blue (#00b5fe) from logo ===== */
html body #main .page-hero h1,
html body #main .page-hero .container,
html body #main .page-hero .page-title {
    color: #00b5fe !important;
}


/* === ADDED CHANGES === */

/* 1. ADD TO CART POPUP: black font */
.woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-message a,
.woocommerce-message p,
.wc-forward,
.wc-block-components-notice-banner,
.wc-block-components-notice-banner__content,
.wc-block-components-notice-banner p {
    color: #000000 !important;
}

/* 2. CHECKOUT PAGE: larger product font + description (desktop only) */
@media (min-width: 769px) {
    .woocommerce-checkout .woocommerce-checkout-review-order-table .product-name,
    .woocommerce-checkout .woocommerce-checkout-review-order-table td,
    .woocommerce-checkout .woocommerce-checkout-review-order-table th,
    .wc-block-components-order-summary-item__name,
    .wc-block-components-order-summary-item__description,
    .wc-block-components-totals-item,
    .wc-block-components-totals-item__label,
    .wc-block-components-totals-item__value {
        font-size: 1.1rem !important;
        line-height: 1.5 !important;
    }
}

/* 3. PAGE TITLES: darker royal blue */
html body #main .page-hero h1,
html body #main .page-hero .container,
html body #main .page-hero .page-title {
    color: #002366 !important;
}


/* === FIX: Add-to-cart notice black text (beats #main * white override) === */
html body #main .woocommerce-notices-wrapper .woocommerce-message,
html body #main .woocommerce-notices-wrapper .woocommerce-message *,
html body #main .woocommerce-notices-wrapper .woocommerce-message a,
html body #main .woocommerce-notices-wrapper .woocommerce-message a.button,
html body #main .woocommerce-notices-wrapper .woocommerce-message a.wc-forward,
html body .woocommerce-notices-wrapper .woocommerce-message,
html body .woocommerce-notices-wrapper .woocommerce-message *,
html body .woocommerce-notices-wrapper .woocommerce-message a.button {
    color: #000000 !important;
}
