/*
Theme Name: Contextic Store
Theme URI: https://contexticnetworks.com
Description: A custom WooCommerce child theme matching the Contextic Networks brand. Dark design with teal accents.
Author: Contextic Networks
Author URI: https://contexticnetworks.com
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: contextic-store
Tags: woocommerce, dark, custom-colors
*/

/* ==========================================================================
   CONTEXTIC STORE — Global Overrides
   ========================================================================== */

/* --- Base --- */
:root {
    --ctx-bg-deep: #050f18;
    --ctx-bg-card: #0f2033;
    --ctx-bg-section: #0a1828;
    --ctx-teal-primary: #2dd4bf;
    --ctx-teal-cta: #0e7490;
    --ctx-teal-cta-hover: #0ea5c9;
    --ctx-text-light: #e2eef5;
    --ctx-text-muted: #7ea8c0;
    --ctx-white: #ffffff;
    --ctx-border: rgba(45, 212, 191, 0.1);
    --ctx-brand: #10696e;
}

html, body {
    background-color: var(--ctx-bg-deep) !important;
    color: var(--ctx-text-light) !important;
    font-family: 'Outfit', system-ui, -apple-system, sans-serif !important;
}

/* --- Links --- */
a {
    color: var(--ctx-teal-primary);
    transition: color 0.2s ease;
}
a:hover {
    color: var(--ctx-teal-cta-hover);
}

/* --- Headings --- */
h1, h2, h3, h4, h5, h6,
.wp-block-heading {
    color: var(--ctx-white) !important;
    font-family: 'Outfit', system-ui, sans-serif !important;
}

p, li, span, div {
    font-family: 'Outfit', system-ui, sans-serif !important;
}

/* --- Header & Nav --- */
.wp-block-template-part header,
header.wp-block-template-part,
.wp-block-group.has-background {
    background-color: var(--ctx-bg-deep) !important;
    border-bottom: 1px solid var(--ctx-border) !important;
}

.wp-block-site-title a {
    color: var(--ctx-white) !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
}

.wp-block-navigation a {
    color: var(--ctx-text-muted) !important;
    font-weight: 500 !important;
    font-size: 0.9rem !important;
    transition: color 0.2s ease !important;
}
.wp-block-navigation a:hover {
    color: var(--ctx-white) !important;
}

/* --- Footer --- */
footer, .wp-block-template-part[slug="footer"] {
    background-color: var(--ctx-bg-deep) !important;
    color: var(--ctx-text-muted) !important;
    border-top: 1px solid var(--ctx-border) !important;
}

/* --- Buttons --- */
.wp-block-button__link,
.wp-element-button,
button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.wc-block-components-button,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
    background-color: var(--ctx-teal-cta) !important;
    color: var(--ctx-white) !important;
    border: none !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    font-family: 'Outfit', system-ui, sans-serif !important;
    padding: 12px 24px !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

.wp-block-button__link:hover,
.wp-element-button:hover,
button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.wc-block-components-button:hover {
    background-color: var(--ctx-teal-cta-hover) !important;
    transform: translateY(-1px);
}

/* --- WooCommerce Product Cards --- */
.wc-block-grid__product,
.woocommerce ul.products li.product,
.wp-block-post {
    background-color: var(--ctx-bg-card) !important;
    border: 1px solid var(--ctx-border) !important;
    border-radius: 24px !important;
    padding: 1.5rem !important;
    transition: all 0.3s ease !important;
    overflow: hidden !important;
}
.wc-block-grid__product:hover,
.woocommerce ul.products li.product:hover,
.wp-block-post:hover {
    border-color: rgba(45, 212, 191, 0.3) !important;
    transform: translateY(-4px) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3) !important;
}

/* Product images */
.wc-block-grid__product-image img,
.woocommerce ul.products li.product img,
.wp-block-post-featured-image img {
    border-radius: 16px !important;
    margin-bottom: 1rem !important;
}

/* Product titles */
.wc-block-grid__product-title,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wp-block-post-title {
    color: var(--ctx-white) !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
}

/* Product prices */
.wc-block-grid__product-price,
.woocommerce ul.products li.product .price,
.woocommerce .price {
    color: var(--ctx-teal-primary) !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
}

/* --- WooCommerce Single Product --- */
.woocommerce div.product {
    background-color: var(--ctx-bg-deep) !important;
}
.woocommerce div.product .product_title {
    color: var(--ctx-white) !important;
    font-weight: 800 !important;
}
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .description p {
    color: var(--ctx-text-muted) !important;
}

/* --- WooCommerce Tabs --- */
.woocommerce div.product .woocommerce-tabs ul.tabs {
    background: var(--ctx-bg-card) !important;
    border-color: var(--ctx-border) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: var(--ctx-text-muted) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--ctx-teal-primary) !important;
}

/* --- Cart & Checkout --- */
.woocommerce-cart .woocommerce,
.woocommerce-checkout .woocommerce,
.wc-block-cart,
.wc-block-checkout {
    color: var(--ctx-text-light) !important;
}

.woocommerce table.shop_table,
.wc-block-cart-items {
    background-color: var(--ctx-bg-card) !important;
    border: 1px solid var(--ctx-border) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
    border-color: var(--ctx-border) !important;
    color: var(--ctx-text-light) !important;
}

/* --- Form Inputs --- */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="search"],
textarea,
select,
.woocommerce input,
.woocommerce select,
.woocommerce textarea,
.wc-block-components-text-input input,
.wc-block-components-textarea {
    background-color: var(--ctx-bg-deep) !important;
    border: 1px solid rgba(45, 212, 191, 0.2) !important;
    border-radius: 12px !important;
    color: var(--ctx-white) !important;
    padding: 10px 16px !important;
    font-family: 'Outfit', system-ui, sans-serif !important;
    transition: border-color 0.2s ease !important;
}
input:focus, textarea:focus, select:focus {
    border-color: var(--ctx-teal-primary) !important;
    outline: none !important;
}

/* --- Notices & Alerts --- */
.woocommerce-message,
.woocommerce-info {
    background-color: var(--ctx-bg-card) !important;
    border-left: 4px solid var(--ctx-teal-primary) !important;
    color: var(--ctx-text-light) !important;
    border-radius: 12px !important;
}
.woocommerce-error {
    background-color: var(--ctx-bg-card) !important;
    border-left: 4px solid #ef4444 !important;
    color: #fca5a5 !important;
    border-radius: 12px !important;
}

/* --- Breadcrumbs --- */
.woocommerce .woocommerce-breadcrumb {
    color: var(--ctx-text-muted) !important;
    font-size: 0.85rem !important;
}
.woocommerce .woocommerce-breadcrumb a {
    color: var(--ctx-teal-primary) !important;
}

/* --- Pagination --- */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    background-color: var(--ctx-bg-card) !important;
    color: var(--ctx-text-muted) !important;
    border-color: var(--ctx-border) !important;
    border-radius: 8px !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current {
    background-color: var(--ctx-teal-cta) !important;
    color: var(--ctx-white) !important;
}

/* --- My Account --- */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
    background-color: var(--ctx-bg-card) !important;
    border-radius: 16px !important;
    border: 1px solid var(--ctx-border) !important;
    overflow: hidden !important;
    list-style: none !important;
    padding: 0 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    color: var(--ctx-text-muted) !important;
    padding: 12px 20px !important;
    display: block !important;
    transition: all 0.2s ease !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    background-color: rgba(45, 212, 191, 0.05) !important;
    color: var(--ctx-teal-primary) !important;
}

/* --- Scrollbar --- */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--ctx-bg-deep);
}
::-webkit-scrollbar-thumb {
    background: var(--ctx-bg-card);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--ctx-text-muted);
}

/* --- Selection --- */
::selection {
    background-color: rgba(45, 212, 191, 0.2);
    color: var(--ctx-teal-primary);
}

/* --- Utility: Content width --- */
.wp-site-blocks {
    max-width: 100% !important;
}

/* --- Block editor fixes --- */
.wp-block-group,
.wp-block-columns {
    color: var(--ctx-text-light) !important;
}

/* Star ratings */
.star-rating span::before,
.wc-block-components-product-rating .wc-block-components-product-rating__stars span::before {
    color: var(--ctx-teal-primary) !important;
}

/* Sale badge */
.woocommerce span.onsale,
.wc-block-grid__product-onsale {
    background-color: var(--ctx-teal-cta) !important;
    color: var(--ctx-white) !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
}

/* Quantity inputs */
.quantity .qty {
    background-color: var(--ctx-bg-card) !important;
    color: var(--ctx-white) !important;
    border: 1px solid var(--ctx-border) !important;
    border-radius: 8px !important;
}

/* WooCommerce Blocks specific */
.wc-block-grid__products {
    background: transparent !important;
}

/* Main content area */
.entry-content,
.page-content,
.post-content {
    color: var(--ctx-text-light) !important;
}


/* ==========================================================================
   ADDITIONAL FIXES — Product Cards & WooCommerce Blocks
   ========================================================================== */

/* Fix product card/image placeholder backgrounds */
.woocommerce ul.products li.product a img,
.wc-block-grid__product-image {
    background-color: var(--ctx-bg-card) !important;
}

/* WooCommerce product image placeholder */
.woocommerce-placeholder,
.wp-block-woocommerce-product-image img,
img.attachment-woocommerce_thumbnail {
    background-color: var(--ctx-bg-card) !important;
    border-radius: 16px !important;
}

/* All wrapper/container backgrounds */
.wp-block-woocommerce-product-collection,
.wp-block-woocommerce-all-products,
.wc-block-grid,
.products-block-post-template,
.wp-block-post-template {
    background: transparent !important;
}

/* Individual product in grid — force dark card */
.wp-block-post.product,
.wc-block-grid__product,
li.product {
    background-color: var(--ctx-bg-card) !important;
    border: 1px solid var(--ctx-border) !important;
    border-radius: 24px !important;
    padding: 1.5rem !important;
    overflow: hidden !important;
}

/* TwentyTwentyFive specific overrides */
.wp-block-group,
.wp-block-cover,
.wp-block-columns,
.wp-block-column {
    background-color: transparent !important;
}

/* Ensure the main content area is dark */
.is-layout-constrained,
.is-layout-flow,
.is-layout-flex {
    color: var(--ctx-text-light) !important;
}

/* Header area */
.wp-block-template-part:first-child,
header {
    background-color: var(--ctx-bg-deep) !important;
}

/* Remove Sample Page from nav — hide it via CSS for now */
.wp-block-navigation-item a[href*="sample-page"] {
    display: none !important;
}

/* WooCommerce result count and ordering */
.woocommerce-result-count {
    color: var(--ctx-teal-primary) !important;
}

.woocommerce-ordering select {
    background-color: var(--ctx-bg-card) !important;
    color: var(--ctx-text-light) !important;
    border: 1px solid var(--ctx-border) !important;
    border-radius: 12px !important;
    padding: 8px 16px !important;
}

/* Archive/page title */
.woocommerce-products-header__title,
.page-title {
    color: var(--ctx-white) !important;
    font-weight: 800 !important;
}

/* "Read more" / "Add to cart" on product cards */
.woocommerce ul.products li.product .button,
.wp-block-button__link,
a.add_to_cart_button {
    background-color: var(--ctx-teal-cta) !important;
    color: var(--ctx-white) !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    padding: 10px 20px !important;
    font-size: 0.85rem !important;
    text-transform: none !important;
    transition: all 0.2s ease !important;
}

.woocommerce ul.products li.product .button:hover,
a.add_to_cart_button:hover {
    background-color: var(--ctx-teal-cta-hover) !important;
    transform: translateY(-1px) !important;
}

/* Cookie consent banner fix */
.cookieadmin-popup {
    border-radius: 16px !important;
    border: 1px solid var(--ctx-border) !important;
}

/* Footer styling */
.wp-block-template-part:last-child {
    background-color: var(--ctx-bg-deep) !important;
    border-top: 1px solid var(--ctx-border) !important;
    color: var(--ctx-text-muted) !important;
}

/* SpeedyCache bar fix */
.ctx-topbar + .wp-site-blocks {
    background-color: var(--ctx-bg-deep) !important;
}

/* Body and site blocks */
.wp-site-blocks {
    background-color: var(--ctx-bg-deep) !important;
}

/* Mini cart */
.wc-block-mini-cart__button {
    color: var(--ctx-text-light) !important;
}

/* Fix any white flash on page load */
html {
    background-color: #050f18 !important;
}