/*
 Theme Name:   WLD Storefront Child
 Theme URI:    https://westlondondarts.com
 Description:  Dark theme child theme for West London Darts WooCommerce store
 Author:       West London Darts
 Author URI:   https://westlondondarts.com
 Template:     storefront
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  wld-storefront-child
*/

/* ==========================================================================
   1. CSS Custom Properties (Design Tokens)
   ========================================================================== */

:root {
    --wld-bg: #0B0B0C;
    --wld-surface: #171719;
    --wld-panel: #1D1D20;
    --wld-primary: #F12D2D;
    --wld-accent: #FF4A4A;
    --wld-text: #F2F2F2;
    --wld-dark-text: #181818;
    --wld-muted: #A8A8AD;
    --wld-border: #303036;
    --wld-primary-hover: #D81F1F;
    --wld-primary-glow: rgba(241, 45, 45, 0.24);
    --wld-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -2px rgba(0, 0, 0, 0.2);
    --wld-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -4px rgba(0, 0, 0, 0.3);
    --wld-radius: 8px;
    --wld-radius-lg: 12px;
}

/* ==========================================================================
   2. Base / Body
   ========================================================================== */

html,
body,
.wld-dark-theme {
    background-color: var(--wld-bg);
    color: var(--wld-text);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 400;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a {
    color: var(--wld-text);
    transition: color 0.2s ease;
}

a:hover,
a:focus {
    color: var(--wld-primary);
    text-decoration: none;
}

::selection {
    background-color: var(--wld-primary);
    color: #ffffff;
}

/* ==========================================================================
   3. Typography
   ========================================================================== */

h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.widget-title,
.section-title,
.woocommerce-loop-product__title {
    font-family: 'Bebas Neue', 'Impact', sans-serif;
    font-weight: 400;
    letter-spacing: 0.08em;
    color: var(--wld-text);
    text-transform: uppercase;
}

h1 { font-size: 2.6rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.2rem; }
h6 { font-size: 1rem; }

.subheading,
.woocommerce-loop-category__title,
label,
th,
dt,
.widget-title span {
    font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif;
    font-weight: 600;
}

p, li, td, dd, span, input, textarea, select, button {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ==========================================================================
   4. Storefront Layout Overrides
   ========================================================================== */

.site-header,
.wld-header {
    background-color: var(--wld-bg);
    border-bottom: 2px solid var(--wld-primary-glow);
}

.site-content,
#content {
    background-color: var(--wld-bg);
}

.site-footer {
    background-color: var(--wld-bg);
    color: var(--wld-muted);
    border-top: 2px solid var(--wld-primary-glow);
}

.col-full,
.storefront-full-width-content .content-area {
    background-color: transparent;
}

.content-area,
.widget-area {
    background-color: transparent;
}

#secondary .widget {
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

#secondary .widget-title,
#secondary .widget h2,
#secondary .widget h3,
.widget-area .widget-title {
    font-family: 'Roboto Condensed', sans-serif !important;
    font-weight: 700;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--wld-text);
    border-bottom: 2px solid var(--wld-primary);
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
    word-break: normal;
    overflow-wrap: normal;
}

.hentry .entry-header {
    border-bottom-color: var(--wld-border);
}

/* ==========================================================================
   5. Navigation
   ========================================================================== */

.wld-nav,
.main-navigation,
.storefront-primary-navigation {
    background-color: var(--wld-bg);
}

.main-navigation ul li a,
.wld-nav a {
    color: var(--wld-muted);
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.9rem;
    padding: 0.75rem 1.25rem;
    transition: color 0.2s ease, background-color 0.2s ease;
}

.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a,
.wld-nav a:hover,
.wld-nav a.active {
    color: #ffffff;
    background-color: transparent;
}

.main-navigation ul.menu > li > a::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: var(--wld-primary);
    transition: width 0.3s ease;
    margin-top: 2px;
}

.main-navigation ul.menu > li:hover > a::after,
.main-navigation ul.menu > li.current-menu-item > a::after {
    width: 100%;
}

/* Sub-menus */
.main-navigation ul.menu ul {
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius);
    box-shadow: var(--wld-shadow-lg);
}

.main-navigation ul.menu ul li a {
    color: var(--wld-muted);
}

.main-navigation ul.menu ul li a:hover {
    color: #ffffff;
    background-color: rgba(218, 28, 28, 0.1);
}

/* ==========================================================================
   6. Buttons
   ========================================================================== */

.button,
button,
input[type="button"],
input[type="submit"],
.btn-primary,
.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 {
    background-color: var(--wld-primary);
    color: #ffffff;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border: none;
    border-radius: var(--wld-radius);
    padding: 0.75rem 2rem;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease;
    line-height: 1.4;
}

.button:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.btn-primary:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover {
    background-color: var(--wld-primary-hover);
    color: #ffffff;
    box-shadow: 0 0 20px var(--wld-primary-glow);
    transform: translateY(-1px);
}

.button:active,
button:active {
    transform: translateY(0);
}

.btn-outline {
    background-color: transparent;
    color: var(--wld-text);
    border: 2px solid var(--wld-border);
}

.btn-outline:hover {
    border-color: var(--wld-primary);
    color: #ffffff;
    background-color: transparent;
}

.woocommerce a.button.disabled,
.woocommerce a.button:disabled,
.woocommerce button.button.disabled,
.woocommerce button.button:disabled {
    background-color: var(--wld-surface);
    color: var(--wld-muted);
    border: 1px solid var(--wld-border);
    opacity: 0.6;
}

/* ==========================================================================
   7. Forms
   ========================================================================== */

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select,
.input-text {
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius);
    color: var(--wld-text);
    padding: 0.75rem 1rem;
    font-size: 0.9rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus,
.input-text:focus {
    border-color: var(--wld-primary);
    box-shadow: 0 0 0 2px var(--wld-primary-glow);
    outline: none;
    background-color: var(--wld-surface);
    color: var(--wld-text);
}

select {
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23A6A6A6' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
}

label {
    color: var(--wld-text);
    font-weight: 500;
}

::placeholder {
    color: var(--wld-muted);
    opacity: 0.7;
}

/* ==========================================================================
   8. WooCommerce Product Grid
   ========================================================================== */

.woocommerce-shop ul.products li.product-category,
.woocommerce-page.woocommerce-shop ul.products li.product-category {
    display: none;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius-lg);
    padding: 0;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    text-align: center;
}

.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
    transform: translateY(-4px);
    box-shadow: var(--wld-shadow-lg);
    border-color: var(--wld-primary-glow);
}

.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img {
    border-radius: 0;
    margin-bottom: 0;
    transition: transform 0.4s ease;
}

.woocommerce ul.products li.product:hover a img {
    transform: scale(1.05);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 1.1rem;
    padding: 0.75rem 1rem 0;
    color: var(--wld-text);
    letter-spacing: 0;
    line-height: 1.25;
}

.woocommerce ul.products li.product .price {
    color: var(--wld-primary);
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    font-size: 1.1rem;
    padding: 0.25rem 1rem;
}

.woocommerce ul.products li.product .price del {
    color: var(--wld-muted);
    opacity: 0.6;
}

.woocommerce ul.products li.product .price ins {
    color: var(--wld-primary);
    text-decoration: none;
    font-weight: 700;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button {
    margin: 0.75rem 1rem 1rem;
    width: calc(100% - 2rem);
    text-align: center;
    display: block;
}

/* Product image container */
.woocommerce ul.products li.product a {
    overflow: hidden;
    display: block;
}

/* ==========================================================================
   9. WooCommerce Sale Badge
   ========================================================================== */

.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
    background-color: var(--wld-primary);
    color: #ffffff;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: var(--wld-radius);
    padding: 0.25rem 0.75rem;
    min-height: auto;
    min-width: auto;
    line-height: 1.4;
    font-size: 0.75rem;
    top: 0.75rem;
    right: 0.75rem;
    left: auto;
    margin: 0;
}

/* ==========================================================================
   10. WooCommerce Single Product
   ========================================================================== */

.single-product div.product {
    background-color: transparent;
}

.single-product div.product .product_title {
    color: var(--wld-text);
    font-size: 2.4rem;
    line-height: 1;
    white-space: nowrap;
}

.single-product div.product .price {
    color: var(--wld-primary);
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
}

.single-product div.product .woocommerce-product-details__short-description {
    color: var(--wld-muted);
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    background-color: var(--wld-surface);
    border-color: var(--wld-border);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background-color: var(--wld-surface);
    border-color: var(--wld-border);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: var(--wld-muted);
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 600;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background-color: var(--wld-bg);
    border-bottom-color: var(--wld-bg);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--wld-text);
}

.woocommerce div.product .woocommerce-tabs .panel {
    background-color: var(--wld-bg);
    color: var(--wld-text);
    border-color: var(--wld-border);
}

.wld-product-weight-select {
    margin: 1rem 0 1.25rem;
}

.wld-product-weight-select label {
    display: block;
    margin-bottom: 0.4rem;
    color: var(--wld-muted);
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
}

.wld-product-weight-select select {
    width: min(100%, 220px);
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius);
    color: var(--wld-text);
    font-weight: 700;
    min-height: 44px;
    padding: 0.65rem 2rem 0.65rem 0.8rem;
}

/* Related products, cross-sells, upsells, new-in-store */
.related.products h2,
.upsells.products h2,
.cross-sells h2,
.storefront-product-section h2 {
    color: var(--wld-text);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product a h2,
.woocommerce ul.products li.product a h3,
.storefront-product-section ul.products li.product a,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product a {
    color: var(--wld-text) !important;
}

.woocommerce ul.products li.product .price,
.storefront-product-section ul.products li.product .price,
ul.products li.product .price,
ul.products li.product .price span,
.woocommerce ul.products li.product .price span.woocommerce-Price-amount,
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price del,
li.product .price .woocommerce-Price-amount {
    color: var(--wld-primary) !important;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    font-size: 1.1rem;
}

ul.products li.product .button,
ul.products li.product a.button {
    color: #ffffff !important;
}

/* ==========================================================================
   11. WooCommerce Cart
   ========================================================================== */

.woocommerce-cart table.cart,
.woocommerce-cart table.cart th,
.woocommerce-cart table.cart td {
    background-color: var(--wld-surface);
    color: var(--wld-text);
    border-color: var(--wld-border);
}

.woocommerce-cart table.cart th {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.woocommerce table.cart td.actions .coupon .input-text {
    background-color: var(--wld-bg);
    border-color: var(--wld-border);
    color: var(--wld-text);
}

.woocommerce-cart .cart-collaterals .cart_totals {
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius);
    padding: 1.5rem;
}

.woocommerce-cart .cart-collaterals .cart_totals h2 {
    color: var(--wld-text);
}

.woocommerce-cart .cart-collaterals .cart_totals table th,
.woocommerce-cart .cart-collaterals .cart_totals table td {
    border-color: var(--wld-border);
    color: var(--wld-text);
}

.woocommerce a.remove {
    color: var(--wld-primary) !important;
}

.woocommerce a.remove:hover {
    background-color: var(--wld-primary);
    color: #ffffff !important;
}

/* ==========================================================================
   12. WooCommerce Checkout
   ========================================================================== */

.woocommerce-checkout #payment {
    background-color: var(--wld-surface);
    border-color: var(--wld-border);
    border-radius: var(--wld-radius);
}

.woocommerce-checkout #payment ul.payment_methods {
    border-color: var(--wld-border);
}

.woocommerce-checkout #payment div.payment_box {
    background-color: var(--wld-bg);
    color: var(--wld-text);
}

.woocommerce-checkout #payment div.payment_box::before {
    border-bottom-color: var(--wld-bg);
}

.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register {
    background-color: var(--wld-surface);
    border-color: var(--wld-border);
    border-radius: var(--wld-radius);
    color: var(--wld-text);
}

.woocommerce-checkout .woocommerce-info {
    background-color: var(--wld-surface);
    border-color: var(--wld-primary);
    color: var(--wld-text);
}

.woocommerce-checkout h3 {
    color: var(--wld-text);
}

/* Order review table */
.woocommerce-checkout-review-order-table {
    background-color: var(--wld-surface);
    color: var(--wld-text);
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
    border-color: var(--wld-border);
    color: var(--wld-text);
}

/* ==========================================================================
   13. WooCommerce My Account
   ========================================================================== */

.woocommerce-account .woocommerce-MyAccount-navigation {
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius);
    overflow: hidden;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    border-bottom: 1px solid var(--wld-border);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    color: var(--wld-muted);
    padding: 0.75rem 1.25rem;
    display: block;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 600;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    color: #ffffff;
    background-color: rgba(218, 28, 28, 0.1);
}

.woocommerce-account .woocommerce-MyAccount-content {
    color: var(--wld-text);
}

/* ==========================================================================
   14. WooCommerce Notices
   ========================================================================== */

.woocommerce-message,
.woocommerce-info {
    background-color: var(--wld-surface);
    border-top-color: var(--wld-primary);
    color: var(--wld-text);
}

.woocommerce-message::before {
    color: var(--wld-primary);
}

.woocommerce-error {
    background-color: var(--wld-surface);
    border-top-color: #e74c3c;
    color: var(--wld-text);
}

/* ==========================================================================
   15. Breadcrumbs
   ========================================================================== */

.woocommerce .woocommerce-breadcrumb,
.storefront-breadcrumb {
    background-color: transparent;
    color: var(--wld-muted);
    margin-bottom: 1.5rem;
}

.woocommerce .woocommerce-breadcrumb a,
.storefront-breadcrumb a {
    color: var(--wld-muted);
}

.woocommerce .woocommerce-breadcrumb a:hover,
.storefront-breadcrumb a:hover {
    color: var(--wld-primary);
}

/* ==========================================================================
   16. Star Ratings
   ========================================================================== */

.woocommerce .star-rating span::before,
.woocommerce .star-rating::before {
    color: #F59E0B;
}

.woocommerce p.stars a {
    color: #F59E0B;
}

/* ==========================================================================
   17. Pagination
   ========================================================================== */

.woocommerce nav.woocommerce-pagination ul {
    border-color: var(--wld-border);
}

.woocommerce nav.woocommerce-pagination ul li {
    border-color: var(--wld-border);
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    background-color: var(--wld-surface);
    color: var(--wld-muted);
}

.woocommerce nav.woocommerce-pagination ul li a:hover {
    background-color: var(--wld-primary);
    color: #ffffff;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
    background-color: var(--wld-primary);
    color: #ffffff;
}

.storefront-sorting {
    border-color: var(--wld-border);
}

/* ==========================================================================
   18. WooCommerce Result Count & Ordering
   ========================================================================== */

.woocommerce .woocommerce-result-count {
    color: var(--wld-muted);
}

.woocommerce .woocommerce-ordering select {
    background-color: var(--wld-surface);
    border-color: var(--wld-border);
    color: var(--wld-text);
}

/* ==========================================================================
   19. Quantity Input
   ========================================================================== */

.woocommerce .quantity .qty {
    background-color: var(--wld-surface);
    border-color: var(--wld-border);
    color: var(--wld-text);
}

/* ==========================================================================
   20. Tables (general)
   ========================================================================== */

table,
.woocommerce table.shop_table {
    border-color: var(--wld-border);
}

table th,
table td,
.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
    border-color: var(--wld-border);
    color: var(--wld-text);
}

table thead th,
.woocommerce table.shop_table thead th {
    background-color: var(--wld-surface);
    color: var(--wld-text);
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

table tbody tr:nth-child(even),
.woocommerce table.shop_table tbody tr:nth-child(even) {
    background-color: rgba(38, 38, 38, 0.5);
}

/* ==========================================================================
   21. Storefront Specific Overrides
   ========================================================================== */

.storefront-product-section {
    border-color: var(--wld-border);
}

.storefront-product-section .section-title {
    color: var(--wld-text);
}

p.storefront-handheld-footer-bar {
    background-color: var(--wld-surface);
    border-top: 1px solid var(--wld-border);
}

.storefront-handheld-footer-bar ul li a,
.storefront-handheld-footer-bar ul li a:hover {
    color: var(--wld-text);
}

.storefront-handheld-footer-bar ul li.cart .count {
    background-color: var(--wld-primary);
    color: #ffffff;
}

/* Storefront search */
.site-search .widget_product_search input[type="search"],
.site-header-cart .widget_shopping_cart {
    background-color: var(--wld-surface);
    border-color: var(--wld-border);
    color: var(--wld-text);
}

/* ==========================================================================
   22. WLD Custom Components
   ========================================================================== */

/* Header */
.wld-header {
    position: sticky;
    top: 0;
    z-index: 999;
    background-color: var(--wld-bg);
    border-bottom: 2px solid var(--wld-primary-glow);
    transition: box-shadow 0.3s ease;
}

.wld-header.scrolled {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

.wld-header-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.wld-header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0;
}

.wld-site-branding {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.wld-site-branding .custom-logo {
    max-height: 82px;
    width: auto;
    filter: drop-shadow(0 0 10px rgba(255, 0, 0, 0.2));
}

.wld-site-title {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.35rem;
    letter-spacing: 0.08em;
    color: var(--wld-text);
    text-decoration: none;
    margin: 0;
}

.wld-site-title a {
    color: inherit;
    text-decoration: none;
}

/* Header actions / search */
.wld-header-actions {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.wld-header-search {
    width: min(34vw, 420px);
}

.wld-header-search form,
.wld-hero-search form {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
    margin: 0;
}

.wld-header-search input[type="search"],
.wld-hero-search input[type="search"] {
    width: 100%;
    min-width: 0;
    background-color: var(--wld-panel);
    color: var(--wld-text);
    border-color: var(--wld-border);
    height: 42px;
    box-shadow: none;
}

.wld-header-search button,
.wld-header-search input[type="submit"],
.wld-hero-search button,
.wld-hero-search input[type="submit"] {
    height: 42px;
    padding: 0 1rem;
    white-space: nowrap;
}

/* Cart icon in header */
.wld-header-cart a {
    color: var(--wld-text);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 600;
    font-size: 0.85rem;
}

.wld-header-cart .cart-count {
    background-color: var(--wld-primary);
    color: #ffffff;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
}

/* Navigation */
.wld-nav {
    border-top: 1px solid var(--wld-border);
}

.wld-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    gap: 0;
}

.wld-nav ul li {
    position: relative;
}

.wld-nav ul li a {
    display: block;
    padding: 0.75rem 1.5rem;
    color: var(--wld-muted);
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.84rem;
    text-decoration: none;
    transition: color 0.2s ease;
    position: relative;
}

.wld-nav ul li a:hover,
.wld-nav ul li.current-menu-item > a {
    color: #ffffff;
}

.wld-nav ul ul.sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 50;
    min-width: 190px;
    padding: 0.35rem 0;
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    box-shadow: var(--wld-shadow-lg);
}

.wld-nav ul li:hover > ul.sub-menu,
.wld-nav ul li:focus-within > ul.sub-menu {
    display: flex;
    flex-direction: column;
}

.wld-nav ul ul.sub-menu li a {
    padding: 0.68rem 0.95rem;
    color: var(--wld-muted);
    white-space: nowrap;
    font-size: 0.78rem;
    border-bottom: 0;
}

.wld-nav ul ul.sub-menu li a:hover {
    color: #ffffff;
    background-color: var(--wld-surface-alt);
}

/* Mobile menu toggle */
.wld-menu-toggle {
    display: none;
    background: none;
    border: none;
    color: var(--wld-text);
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0.5rem;
}

.wld-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background-color: var(--wld-text);
    margin: 5px 0;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

/* Footer */
.wld-footer {
    background-color: var(--wld-bg);
    border-top: 2px solid var(--wld-primary-glow);
    padding: 3rem 0 0;
}

.wld-footer-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 3rem;
}

.wld-footer-heading {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--wld-text);
    font-size: 1rem;
    margin-bottom: 1.5rem;
}

.wld-footer-brand-title {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.8rem;
    letter-spacing: 0.25em;
    color: var(--wld-text);
    margin-bottom: 0.75rem;
}

.wld-footer-tagline {
    color: var(--wld-muted);
    font-style: italic;
    font-size: 0.95rem;
}

.wld-footer-links ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.wld-footer-links ul li {
    margin-bottom: 0.5rem;
}

.wld-footer-links ul li a {
    color: var(--wld-muted);
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.2s ease;
}

.wld-footer-links ul li a:hover {
    color: var(--wld-primary);
}

.wld-footer-social a {
    color: var(--wld-muted);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: color 0.2s ease;
}

.wld-footer-social a:hover {
    color: var(--wld-primary);
}

.wld-footer-social svg {
    width: 24px;
    height: 24px;
    stroke: currentColor;
    fill: none;
}

.wld-footer-bottom {
    border-top: 1px solid var(--wld-border);
    margin-top: 3rem;
    padding: 1.5rem;
    text-align: center;
    color: var(--wld-muted);
    font-size: 0.85rem;
}

/* ==========================================================================
   23. Homepage Sections
   ========================================================================== */

/* Hero */
.wld-hero {
    background:
        linear-gradient(135deg, rgba(241, 45, 45, 0.18), transparent 34%),
        linear-gradient(180deg, #171717 0%, var(--wld-bg) 100%);
    text-align: center;
    padding: 2.25rem 1.5rem 2.5rem;
}

.wld-hero__inner {
    max-width: 920px;
    margin: 0 auto;
}

.wld-hero-logo {
    width: min(46vw, 460px);
    max-width: 460px;
    height: auto;
    margin: 0 auto 1.75rem;
    display: block;
    filter: drop-shadow(0 0 10px rgba(255, 0, 0, 0.2));
}

.wld-hero-title {
    font-size: 3rem;
    letter-spacing: 0.08em;
    margin-bottom: 1rem;
}

.wld-hero-kicker {
    color: var(--wld-muted);
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 1.18rem;
    font-weight: 600;
    margin: -0.5rem auto 1.5rem;
    max-width: 620px;
}

.wld-hero-search {
    max-width: 660px;
    margin: 0 auto 1.25rem;
}

.wld-hero-buttons {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 2rem;
}

.wld-hero-buttons .btn {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.875rem 2.5rem;
    font-size: 0.95rem;
    border-radius: var(--wld-radius);
    text-decoration: none;
    transition: all 0.2s ease;
    display: inline-block;
}

.wld-hero-buttons .btn-shop {
    background-color: var(--wld-primary);
    color: #ffffff;
}

.wld-hero-buttons .btn-services {
    background-color: var(--wld-surface);
    border: 2px solid var(--wld-primary);
    color: var(--wld-text);
}

.wld-hero-buttons .btn-services:hover {
    background-color: rgba(241, 45, 45, 0.14);
    color: var(--wld-text);
}

.wld-hero-buttons .btn-shop:hover {
    background-color: var(--wld-primary-hover);
    box-shadow: 0 0 25px var(--wld-primary-glow);
    color: #ffffff;
}

.wld-hero-buttons .btn-find {
    background-color: transparent;
    color: var(--wld-text);
    border: 2px solid var(--wld-border);
}

.wld-hero-buttons .btn-find:hover {
    border-color: var(--wld-primary);
    color: #ffffff;
}

/* Shared homepage section headers */
.wld-section-heading {
    max-width: 1320px;
    margin: 0 auto 1.25rem;
    padding: 0 1.5rem;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.5rem 1.5rem;
    align-items: end;
}

.wld-section-heading h2 {
    margin: 0;
    font-size: 1.9rem;
}

.wld-eyebrow {
    grid-column: 1 / -1;
    color: var(--wld-primary);
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.08em;
    margin: 0;
    text-transform: uppercase;
}

.wld-section-link {
    color: var(--wld-text);
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    font-size: 0.9rem;
    text-transform: uppercase;
    text-decoration: none;
    border-bottom: 2px solid var(--wld-primary);
}

.wld-section-link:hover {
    color: var(--wld-primary);
}

/* Homepage product rail */
.wld-home-products {
    padding: 2.5rem 0 1.5rem;
}

.wld-product-rail {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 1.5rem 0.5rem;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x proximity;
}

.wld-product-tile {
    flex: 0 0 calc((100% - 3rem) / 4);
    max-width: 320px;
    min-width: 230px;
    background-color: var(--wld-panel);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius);
    color: var(--wld-text);
    overflow: hidden;
    scroll-snap-align: start;
    align-self: flex-start;
    height: auto;
    min-height: 0;
    box-shadow: var(--wld-shadow);
}

.wld-product-tile__image-link {
    display: block;
    background-color: #D8D8DA;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    border-bottom: 1px solid var(--wld-border);
}

.wld-product-tile__image,
.wld-product-tile img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 0.8rem;
    margin: 0;
    mix-blend-mode: normal;
    filter: brightness(0.92) contrast(1.04) saturate(0.98);
}

.wld-product-tile__body {
    padding: 0.85rem;
}

.wld-product-tile__title {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.25;
    margin: 0 0 0.35rem;
    text-transform: none;
}

.wld-product-tile__title a,
.wld-product-tile__price {
    color: var(--wld-text);
}

.wld-product-tile__price {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    margin-bottom: 0.6rem;
}

.wld-product-tile__price .woocommerce-Price-amount,
.wld-product-tile__price bdi {
    color: var(--wld-accent);
}

.wld-product-tile__button,
.wld-product-tile .button {
    width: 100%;
    margin: 0;
    padding: 0.58rem 0.75rem;
    text-align: center;
    display: block;
}

.wld-section-heading h2,
.woocommerce-products-header__title.page-title,
.entry-header .entry-title,
.page-title {
    white-space: nowrap;
}

.wld-product-empty {
    max-width: 1320px;
    margin: 0 auto;
    padding: 1.5rem;
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius);
}

/* Homepage services */
.wld-services-preview {
    padding: 2.5rem 0;
}

.wld-services-grid {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.wld-service-card {
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-top: 4px solid var(--wld-primary);
    border-radius: var(--wld-radius);
    padding: 1.25rem;
    min-height: 210px;
}

.wld-service-card__meta {
    color: var(--wld-primary);
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 0.78rem;
    font-weight: 700;
    margin: 0 0 0.75rem;
    text-transform: uppercase;
}

.wld-service-card__title {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: 0;
    margin: 0 0 0.75rem;
    text-transform: none;
}

.wld-service-card__desc {
    color: var(--wld-muted);
    font-size: 0.94rem;
    line-height: 1.5;
    margin: 0;
}

/* Category Grid */
.wld-category-grid {
    padding: 2.5rem 1.5rem 3rem;
    max-width: 1320px;
    margin: 0 auto;
}

.wld-category-grid__inner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2px;
}

.wld-category-card {
    position: relative;
    aspect-ratio: 1;
    overflow: hidden;
    background-color: var(--wld-surface);
    display: block;
    text-decoration: none;
}

.wld-category-card__label {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 2;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.35rem;
    letter-spacing: 0.08em;
    color: var(--wld-text);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.wld-category-card__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.4s ease;
    padding: 1.5rem;
}

.wld-category-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: transparent;
    transition: all 0.3s ease;
}

.wld-category-card:hover .wld-category-card__image {
    transform: scale(1.05);
}

.wld-category-card:hover::after {
    box-shadow: inset 0 0 30px var(--wld-primary-glow);
    background: rgba(0, 0, 0, 0.1);
}

/* Trust / Why Choose Us */
.wld-trust {
    background-color: #151515;
    padding: 3rem 1.5rem;
}

.wld-trust__inner {
    max-width: 1320px;
    margin: 0 auto;
}

.wld-trust__heading {
    text-align: center;
    margin-bottom: 3rem;
}

.wld-trust__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.wld-trust-card {
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius-lg);
    padding: 2rem 1.5rem;
    text-align: center;
    transition: transform 0.2s ease, border-color 0.2s ease;
}

.wld-trust-card:hover {
    transform: translateY(-2px);
    border-color: var(--wld-primary-glow);
}

.wld-trust-card__icon {
    width: 48px;
    height: 48px;
    margin: 0 auto 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.5rem;
}

.wld-trust-card__icon--red { background-color: rgba(218, 28, 28, 0.15); color: #DA1C1C; }
.wld-trust-card__icon--blue { background-color: rgba(59, 130, 246, 0.15); color: #3B82F6; }
.wld-trust-card__icon--amber { background-color: rgba(245, 158, 11, 0.15); color: #F59E0B; }
.wld-trust-card__icon--purple { background-color: rgba(139, 92, 246, 0.15); color: #8B5CF6; }
.wld-trust-card__icon--green { background-color: rgba(34, 197, 94, 0.15); color: #22C55E; }

.wld-trust-card__title {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--wld-text);
    margin-bottom: 0.5rem;
}

.wld-trust-card__desc {
    color: var(--wld-muted);
    font-size: 0.875rem;
    line-height: 1.5;
    margin: 0;
}

/* Blog Section */
.wld-blog {
    padding: 4rem 1.5rem;
    max-width: 1200px;
    margin: 0 auto;
}

.wld-blog__header {
    text-align: center;
    margin-bottom: 3rem;
}

.wld-blog__subtitle {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 600;
    color: var(--wld-muted);
    font-size: 1rem;
    margin-top: 0.5rem;
}

.wld-blog__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.wld-blog-card {
    background-color: var(--wld-surface);
    border: 1px solid var(--wld-border);
    border-radius: var(--wld-radius-lg);
    padding: 2rem 1.5rem;
    transition: transform 0.2s ease, border-color 0.2s ease;
}

.wld-blog-card:hover {
    transform: translateY(-2px);
    border-color: var(--wld-primary-glow);
}

.wld-blog-card__icon {
    font-size: 1.5rem;
    margin-bottom: 1rem;
    color: var(--wld-muted);
}

.wld-blog-card__title {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--wld-text);
    margin-bottom: 1rem;
    line-height: 1.3;
}

.wld-blog-card__link {
    color: var(--wld-primary);
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.wld-blog-card__link:hover {
    color: var(--wld-primary-hover);
    text-decoration: underline;
}

/* ==========================================================================
   24. Responsive
   ========================================================================== */

@media (max-width: 768px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.55rem; }

    .single-product div.product .product_title,
    .woocommerce-products-header__title.page-title,
    .entry-header .entry-title,
    .page-title {
        font-size: 1.65rem;
    }
    h3 { font-size: 1.25rem; }

    .wld-header-inner {
        padding: 0 1rem;
    }

    .wld-header-top {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .wld-header-actions {
        width: 100%;
        justify-content: space-between;
        gap: 0.6rem;
    }

    .wld-header-search {
        flex: 1;
        width: auto;
    }

    .wld-header-search input[type="search"] {
        height: 40px;
        font-size: 0.85rem;
    }

    .wld-header-search button,
    .wld-header-search input[type="submit"] {
        height: 40px;
        padding: 0 0.75rem;
        font-size: 0.75rem;
    }

    .wld-nav {
        display: none;
    }

    .wld-nav.active {
        display: block;
    }

    .wld-nav ul {
        flex-direction: column;
        align-items: stretch;
    }

    .wld-nav ul li a {
        padding: 1rem 1.5rem;
        border-bottom: 1px solid var(--wld-border);
        text-align: center;
    }

    .wld-nav ul ul.sub-menu {
        display: flex;
        position: static;
        min-width: 0;
        padding: 0;
        background-color: var(--wld-surface-alt);
        border: 0;
        box-shadow: none;
    }

    .wld-nav ul ul.sub-menu li a {
        padding: 0.78rem 1.5rem;
        font-size: 0.76rem;
    }

    .wld-menu-toggle {
        display: block;
    }

    .wld-footer-inner {
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
    }

    .wld-category-grid__inner {
        grid-template-columns: repeat(2, 1fr);
    }

    .wld-section-heading {
        grid-template-columns: 1fr;
        padding: 0 1rem;
    }

    .wld-product-rail {
        padding: 0 1rem 0.5rem;
    }

    .wld-product-tile {
        flex-basis: min(76vw, 280px);
        min-width: min(76vw, 280px);
    }

    .wld-services-grid {
        grid-template-columns: 1fr;
        padding: 0 1rem;
    }

    .wld-trust__grid {
        grid-template-columns: 1fr;
    }

    .wld-blog__grid {
        grid-template-columns: 1fr;
    }

    .wld-hero-logo {
        width: min(62vw, 320px);
        max-width: 320px;
    }

    .wld-hero-buttons .btn {
        padding: 0.75rem 2rem;
        font-size: 0.85rem;
    }

    .wld-site-title {
        font-size: 1.15rem;
    }

    .wld-category-card__label {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .wld-header-top {
        padding: 0.75rem 0;
    }

    .wld-site-branding .custom-logo {
        max-height: 62px;
    }

    .wld-site-title {
        font-size: 1rem;
        letter-spacing: 0.06em;
    }

    .wld-hero {
        padding: 2rem 1rem 1.5rem;
    }

    .wld-hero-search form {
        flex-direction: column;
    }

    .wld-hero-buttons {
        gap: 0.6rem;
    }

    .wld-hero-buttons .btn {
        width: 100%;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .wld-trust__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .wld-blog__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .wld-services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ==========================================================================
   WooCommerce Checkout / Cart Block overrides (dark theme)
   ========================================================================== */

.wc-block-checkout,
.wc-block-cart,
.wp-block-woocommerce-checkout,
.wp-block-woocommerce-cart {
    color: var(--wld-text);
}

.wc-block-components-text-input input,
.wc-block-components-select select,
.wc-block-components-combobox input,
.wc-block-components-combobox__input,
.wc-block-components-textarea,
.wc-block-checkout input[type="text"],
.wc-block-checkout input[type="email"],
.wc-block-checkout input[type="tel"],
.wc-block-checkout input[type="number"],
.wc-block-checkout input[type="password"],
.wc-block-checkout select,
.wc-block-checkout textarea,
.wc-block-cart input[type="text"],
.wc-block-cart input[type="email"],
.wc-block-cart select {
    background-color: var(--wld-surface) !important;
    border: 1px solid var(--wld-border) !important;
    color: var(--wld-text) !important;
}

.wc-block-components-text-input label,
.wc-block-components-checkout-step__title,
.wc-block-components-title,
.wc-block-components-totals-item__label,
.wc-block-components-totals-item__value,
.wc-block-components-product-name,
.wc-block-components-product-metadata,
.wc-block-components-radio-control__label,
.wc-block-components-checkbox__label {
    color: var(--wld-text) !important;
}

.wc-block-components-panel,
.wc-block-components-checkout-step,
.wc-block-components-sidebar,
.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-cart__sidebar {
    background-color: var(--wld-bg) !important;
    border-color: var(--wld-border) !important;
}

.wc-block-components-text-input input:focus,
.wc-block-components-select select:focus,
.wc-block-components-combobox__input:focus {
    border-color: var(--wld-primary) !important;
    box-shadow: 0 0 0 2px var(--wld-primary-glow) !important;
    outline: none;
}

.wc-block-components-button,
.wc-block-components-checkout-place-order-button {
    background-color: var(--wld-primary) !important;
    color: #fff !important;
}

/* Notices (classic + block) — coupon-applied, info, error, etc. */

.woocommerce-notices-wrapper,
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner {
    background-color: var(--wld-surface) !important;
    color: var(--wld-text) !important;
    border-radius: var(--wld-radius) !important;
    box-shadow: none !important;
}

.woocommerce-message {
    border-left: 4px solid var(--wld-primary) !important;
    padding: 0.9rem 1.2rem !important;
}

.woocommerce-info {
    border-left: 4px solid #4aa3ff !important;
    padding: 0.9rem 1.2rem !important;
}

.woocommerce-error {
    border-left: 4px solid #ff5252 !important;
    padding: 0.9rem 1.2rem !important;
    list-style: none;
}

.woocommerce-message a,
.woocommerce-info a,
.woocommerce-error a {
    color: var(--wld-primary) !important;
    text-decoration: underline;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
    color: var(--wld-primary) !important;
}

.woocommerce-message .button,
.woocommerce-message a.button,
.woocommerce-info a.button {
    background-color: var(--wld-primary) !important;
    color: #fff !important;
    border: none !important;
}

.wc-block-components-notice-banner {
    border: 1px solid var(--wld-border) !important;
    border-left-width: 4px !important;
}

.wc-block-components-notice-banner.is-success,
.wc-block-components-notice-banner--success {
    border-left-color: var(--wld-primary) !important;
}

.wc-block-components-notice-banner.is-info,
.wc-block-components-notice-banner--info {
    border-left-color: #4aa3ff !important;
}

.wc-block-components-notice-banner.is-error,
.wc-block-components-notice-banner--error {
    border-left-color: #ff5252 !important;
}

.wc-block-components-notice-banner svg {
    fill: currentColor !important;
}

.wc-block-components-notice-banner__content,
.wc-block-components-notice-banner__summary {
    color: var(--wld-text) !important;
}

.wc-block-components-validation-error {
    color: #ff7070 !important;
}

/* ==========================================================================
   Product "Additional information" tab — attribute table
   ========================================================================== */

.woocommerce-Tabs-panel--additional_information,
.woocommerce-product-attributes,
table.shop_attributes {
    background-color: var(--wld-bg) !important;
    color: var(--wld-text) !important;
    border-color: var(--wld-border) !important;
}

.woocommerce-product-attributes tr,
table.shop_attributes tr {
    background-color: transparent !important;
}

.woocommerce-product-attributes th,
table.shop_attributes th,
.woocommerce-product-attributes td,
table.shop_attributes td,
.woocommerce-product-attributes-item__label,
.woocommerce-product-attributes-item__value {
    background-color: var(--wld-surface) !important;
    color: var(--wld-text) !important;
    border-color: var(--wld-border) !important;
}

.woocommerce-product-attributes tr:nth-child(even) th,
.woocommerce-product-attributes tr:nth-child(even) td,
table.shop_attributes tr:nth-child(even) th,
table.shop_attributes tr:nth-child(even) td {
    background-color: var(--wld-bg) !important;
}

.woocommerce-product-attributes th,
table.shop_attributes th {
    font-weight: 600;
}

.woocommerce-product-attributes td p,
table.shop_attributes td p {
    color: var(--wld-text) !important;
    margin: 0;
}

/* ==========================================================================
   Order received / thank-you page (classic + block)
   ========================================================================== */

.woocommerce-order,
.woocommerce-order-received .entry-content,
.wc-block-order-confirmation,
.wp-block-woocommerce-order-confirmation-status,
.wc-block-order-confirmation-summary,
.wc-block-order-confirmation-totals,
.wc-block-order-confirmation-billing-address,
.wc-block-order-confirmation-shipping-address,
.wc-block-order-confirmation-downloads,
.wc-block-order-confirmation-additional-information,
.wc-block-order-confirmation-create-account {
    background-color: var(--wld-bg) !important;
    color: var(--wld-text) !important;
}

/* Headings on the thank-you page */
.woocommerce-order h1,
.woocommerce-order h2,
.woocommerce-order h3,
.wc-block-order-confirmation h1,
.wc-block-order-confirmation h2,
.wc-block-order-confirmation h3 {
    color: var(--wld-text) !important;
}

/* Order overview summary strip (Order number / Date / Email / Total / Payment) */
.woocommerce-order-overview,
ul.order_details,
ul.woocommerce-order-overview,
ul.wc-block-order-confirmation-summary__content {
    background-color: var(--wld-surface) !important;
    color: var(--wld-text) !important;
    border: 1px solid var(--wld-border) !important;
    border-radius: var(--wld-radius) !important;
    padding: 1rem 1.25rem !important;
    list-style: none !important;
}

ul.order_details li,
ul.woocommerce-order-overview li,
ul.wc-block-order-confirmation-summary__content li,
.wc-block-order-confirmation-summary-list-item {
    color: var(--wld-text) !important;
    border-color: var(--wld-border) !important;
}

ul.order_details li strong,
.wc-block-order-confirmation-summary-list-item__value {
    color: var(--wld-text) !important;
}

/* Line-items and totals tables */
.woocommerce-table,
.woocommerce-table--order-details,
.woocommerce-table--customer-details,
.shop_table,
.shop_table.order_details,
.wc-block-order-confirmation-totals__table {
    background-color: var(--wld-surface) !important;
    color: var(--wld-text) !important;
    border: 1px solid var(--wld-border) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

.woocommerce-table th,
.woocommerce-table td,
.shop_table th,
.shop_table td,
.wc-block-order-confirmation-totals__table th,
.wc-block-order-confirmation-totals__table td {
    background-color: var(--wld-surface) !important;
    color: var(--wld-text) !important;
    border-color: var(--wld-border) !important;
}

.woocommerce-table tfoot td,
.shop_table tfoot td,
.wc-block-order-confirmation-totals__table tfoot td {
    background-color: var(--wld-bg) !important;
    color: var(--wld-text) !important;
    font-weight: 600;
}

.woocommerce-table a,
.shop_table a,
.wc-block-order-confirmation a {
    color: var(--wld-primary) !important;
}

/* Customer billing / shipping blocks */
.woocommerce-customer-details address,
.wc-block-order-confirmation-billing-address address,
.wc-block-order-confirmation-shipping-address address {
    background-color: var(--wld-surface) !important;
    color: var(--wld-text) !important;
    border: 1px solid var(--wld-border) !important;
    border-radius: var(--wld-radius) !important;
    padding: 1rem 1.25rem !important;
    font-style: normal;
}

/* Payment method hero / status heading */
.woocommerce-thankyou-order-received,
.wc-block-order-confirmation-status__text,
p.woocommerce-notice {
    color: var(--wld-text) !important;
    background-color: transparent !important;
}

/* Any lingering "card" backgrounds the block template paints white */
.wp-block-woocommerce-order-confirmation *[style*="background-color"] {
    background-color: transparent !important;
}