/**
 * WooCommerce Custom Styles - UISS42 Theme
 * Comprehensive dark-mode makeover for all WooCommerce pages.
 * Updated: 2026
 */

/* ============================================================
   0. GLOBAL RESET & BACKGROUND
   ============================================================ */
.woocommerce-page body,
body.woocommerce { background: #0b1120 !important; }

.woocommerce-page #content,
.woocommerce #content,
.woocommerce div.product,
.woocommerce-page div.product {
    background: transparent;
}

/* Remove WC default sidebar on all shop pages */
#secondary, .widget-area, .sidebar,
aside[role="complementary"],
.woocommerce-sidebar { display: none !important; }

.woocommerce .container,
.woocommerce-page .container { max-width: 1240px; }

/* ============================================================
   1. TYPOGRAPHY
   ============================================================ */
.woocommerce,
.woocommerce-page {
    font-family: 'Source Sans 3', sans-serif;
    color: #e0e0e0;
}

.woocommerce-products-header__title,
.woocommerce div.product .product_title,
.woocommerce-Tabs-panel--description h2,
.woocommerce-loop-product__title {
    font-family: 'Rajdhani', sans-serif !important;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: 0.03em;
}

/* ============================================================
   2. BUTTONS — Premium Red
   ============================================================ */
.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: #cc0000 !important;
    color: #ffffff !important;
    font-family: 'Rajdhani', sans-serif !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border-radius: 6px;
    padding: 0.75rem 1.5rem !important;
    border: none !important;
    transition: background 0.25s, transform 0.2s, box-shadow 0.25s !important;
    box-shadow: none;
    cursor: pointer;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
    background: #991a1a !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(204, 0, 0, 0.35) !important;
}

.woocommerce a.button.disabled,
.woocommerce button.button:disabled {
    background: rgba(255,255,255,0.08) !important;
    color: rgba(255,255,255,0.35) !important;
    cursor: not-allowed;
    transform: none !important;
}

/* ============================================================
   3. NOTICES (Success / Error / Info)
   ============================================================ */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notice {
    background: rgba(15, 26, 48, 0.97) !important;
    border-top: 3px solid #cc0000 !important;
    color: #e0e0e0 !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important;
    border-radius: 0 0 8px 8px !important;
    padding: 1rem 1.5rem !important;
    font-family: 'Source Sans 3', sans-serif;
    font-size: 0.9rem;
}

.woocommerce-message { border-top-color: #22c55e !important; }
.woocommerce-error   { border-top-color: #cc0000 !important; }
.woocommerce-info    { border-top-color: #d4a830 !important; }

.woocommerce-message a.button,
.woocommerce-info a.button {
    background: transparent !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    color: #fff !important;
    font-size: 0.8rem !important;
    padding: 0.4rem 1rem !important;
}

/* ============================================================
   4. CART PAGE — shop_table
   ============================================================ */
.woocommerce table.shop_table {
    background: rgba(15, 26, 48, 0.8) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    border-radius: 10px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    overflow: hidden;
    color: #e0e0e0;
    width: 100%;
}

.woocommerce table.shop_table thead,
.woocommerce table.shop_table th {
    background: rgba(204, 0, 0, 0.08) !important;
    font-family: 'Bebas Neue', sans-serif !important;
    color: rgba(255,255,255,0.5) !important;
    letter-spacing: 0.15em !important;
    font-size: 0.85rem !important;
    font-weight: 400 !important;
    padding: 1rem 1.25rem !important;
    border-bottom: 1px solid rgba(255,255,255,0.07) !important;
    text-transform: uppercase;
}

.woocommerce table.shop_table td {
    padding: 1.1rem 1.25rem !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
    vertical-align: middle;
    background: transparent;
}

.woocommerce table.shop_table tbody tr:hover td {
    background: rgba(255,255,255,0.02) !important;
}

/* Cart product name */
.woocommerce-cart-form .product-name a {
    font-family: 'Rajdhani', sans-serif;
    font-weight: 700;
    color: #fff;
    font-size: 1rem;
    transition: color 0.2s;
}
.woocommerce-cart-form .product-name a:hover { color: #cc0000; }

/* Cart quantity input */
.woocommerce .quantity .qty {
    background: #142040 !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    color: #fff !important;
    border-radius: 6px !important;
    padding: 0.5rem !important;
    text-align: center;
    width: 70px;
}

/* Cart subtotals */
.woocommerce-cart-form .product-subtotal .woocommerce-Price-amount,
.cart-subtotal .woocommerce-Price-amount,
.order-total .woocommerce-Price-amount {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.3rem;
    color: #d4a830;
}

/* Remove link */
.woocommerce-cart-form a.remove {
    color: rgba(255,255,255,0.25) !important;
    transition: color 0.2s;
    font-size: 1.3rem !important;
}
.woocommerce-cart-form a.remove:hover { color: #cc0000 !important; }

/* Cart totals box */
.woocommerce .cart_totals,
.woocommerce-page .cart_totals {
    background: rgba(15, 26, 48, 0.95);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 12px;
    padding: 1.5rem;
}

.woocommerce .cart_totals h2 {
    font-family: 'Bebas Neue', sans-serif;
    color: #fff;
    font-size: 1.4rem;
    letter-spacing: 1px;
    margin-bottom: 1rem;
}

.woocommerce-shipping-calculator .shipping-calculator-button {
    color: #cc0000 !important;
    font-weight: 700;
}

/* Coupon field */
.woocommerce .coupon input.input-text {
    background: #142040 !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    color: #fff !important;
    border-radius: 6px !important;
    padding: 0.65rem 1rem !important;
}
.woocommerce .coupon input.input-text::placeholder { color: rgba(255,255,255,0.25); }

/* ============================================================
   5. CHECKOUT PAGE
   ============================================================ */
.woocommerce-checkout h3 {
    font-family: 'Bebas Neue', sans-serif;
    color: #fff;
    font-size: 1.5rem;
    letter-spacing: 1px;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255,255,255,0.07);
    margin-bottom: 1.5rem;
}

/* All text inputs */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout select,
.woocommerce-checkout textarea,
.woocommerce form .input-text {
    background: #0f1a30 !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    color: #e0e0e0 !important;
    padding: 0.75rem 1rem !important;
    border-radius: 6px !important;
    font-family: 'Source Sans 3', sans-serif !important;
    font-size: 0.9rem !important;
    transition: border-color 0.25s !important;
    width: 100% !important;
}

.woocommerce-checkout input:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
    border-color: #cc0000 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(204,0,0,0.15) !important;
}

.woocommerce-checkout label {
    color: rgba(255,255,255,0.6) !important;
    font-size: 0.8rem !important;
    font-family: 'Rajdhani', sans-serif !important;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 0.35rem !important;
    display: block;
}

.woocommerce-checkout select option {
    background: #0f1a30;
    color: #e0e0e0;
}

/* Order review box */
#order_review_heading {
    font-family: 'Bebas Neue', sans-serif;
    color: #fff;
    font-size: 1.5rem;
    letter-spacing: 1px;
}

#order_review {
    background: rgba(15, 26, 48, 0.8);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 12px;
    padding: 1.5rem;
}

.woocommerce-checkout-review-order-table th {
    font-family: 'Rajdhani', sans-serif;
    font-weight: 700;
    color: rgba(255,255,255,0.5);
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
    color: #d4a830;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.3rem;
}

/* Payment methods */
.woocommerce-checkout .payment_methods {
    border: 1px solid rgba(255,255,255,0.07) !important;
    background: rgba(11,17,32,0.6) !important;
    border-radius: 8px !important;
    padding: 1.25rem !important;
    list-style: none !important;
}

.woocommerce-checkout .payment_methods li label {
    color: #e0e0e0 !important;
    text-transform: none !important;
    font-size: 0.95rem !important;
    font-weight: 600;
    letter-spacing: 0;
}

.woocommerce-checkout .payment_box {
    background: rgba(20, 32, 64, 0.6) !important;
    border-radius: 6px !important;
    color: rgba(255,255,255,0.6) !important;
    font-size: 0.85rem !important;
}

/* Place order button */
#place_order {
    width: 100% !important;
    padding: 1rem 2rem !important;
    font-size: 1.1rem !important;
    letter-spacing: 0.15em !important;
    background: #cc0000 !important;
    border-radius: 8px !important;
    margin-top: 1rem;
}

#place_order:hover {
    background: #991a1a !important;
    box-shadow: 0 8px 24px rgba(204,0,0,0.4) !important;
}

/* ============================================================
   6. SINGLE PRODUCT PAGE
   ============================================================ */
.woocommerce div.product {
    color: #e0e0e0;
}

/* Product title */
.woocommerce div.product .product_title {
    font-size: clamp(2rem, 4vw, 2.8rem) !important;
    color: #ffffff !important;
    margin-bottom: 0.5rem !important;
}

/* Product price */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    font-family: 'Bebas Neue', sans-serif !important;
    font-size: 2rem !important;
    color: #d4a830 !important;
}

.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
    color: rgba(255,255,255,0.3) !important;
    font-size: 1.3rem !important;
}

/* Short description */
.woocommerce div.product .woocommerce-product-details__short-description {
    color: rgba(255,255,255,0.7);
    font-size: 0.95rem;
    line-height: 1.7;
    border-left: 2px solid #cc0000;
    padding-left: 1rem;
    margin: 1.25rem 0;
}

/* Quantity + add to cart row */
.woocommerce div.product form.cart {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
    margin: 1.5rem 0;
}

.woocommerce div.product form.cart .quantity input.qty {
    background: #142040 !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    color: #fff !important;
    border-radius: 6px !important;
    height: 46px;
    width: 72px;
    text-align: center;
    font-size: 1rem;
}

/* Product tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
    padding: 0 !important;
    margin: 0 0 -1px !important;
    display: flex;
    gap: 4px;
    border-bottom: none !important;
    background: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 6px 6px 0 0 !important;
    margin: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: rgba(255,255,255,0.6) !important;
    font-family: 'Rajdhani', sans-serif !important;
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.65rem 1.25rem !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background: #cc0000 !important;
    border-color: #cc0000 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: #fff !important; }

.woocommerce div.product .woocommerce-tabs .panel {
    background: rgba(15, 26, 48, 0.6) !important;
    border: 1px solid rgba(255,255,255,0.07) !important;
    border-radius: 0 6px 6px 6px !important;
    padding: 2rem !important;
    color: rgba(255,255,255,0.75);
    line-height: 1.8;
}

.woocommerce div.product .woocommerce-tabs .panel h2,
.woocommerce div.product .woocommerce-tabs .panel h3 {
    font-family: 'Rajdhani', sans-serif;
    color: #fff;
    font-weight: 700;
}

/* Related products */
.woocommerce .related > h2,
.woocommerce .upsells > h2 {
    font-family: 'Bebas Neue', sans-serif;
    color: #fff;
    font-size: 1.8rem;
    letter-spacing: 1px;
    margin-bottom: 1.5rem;
}

/* ============================================================
   7. PRODUCT GRID (Default WC pages)
   ============================================================ */
.woocommerce ul.products.columns-3,
.woocommerce ul.products.columns-4 {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important;
    gap: 24px !important;
}

.woocommerce ul.products li.product {
    background: rgba(15, 26, 48, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 12px !important;
    padding: 0 !important;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s !important;
    margin: 0 !important;
    float: none !important;
    width: auto !important;
}

.woocommerce ul.products li.product:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(204, 0, 0, 0.3) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5) !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: 'Rajdhani', sans-serif;
    font-size: 1.05rem;
    font-weight: 700;
    color: #fff !important;
    padding: 0.75rem 1rem 0.25rem !important;
}

.woocommerce ul.products li.product .price {
    color: #d4a830 !important;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.3rem;
    padding: 0 1rem !important;
}

.woocommerce ul.products li.product .button {
    margin: 0 1rem 1rem !important;
    display: block;
    text-align: center;
}

/* ============================================================
   8. ORDER CONFIRMATION / MY ACCOUNT
   ============================================================ */
.woocommerce-order-received h2,
.woocommerce-account h2 {
    font-family: 'Bebas Neue', sans-serif;
    color: #fff;
    font-size: 1.6rem;
    letter-spacing: 1px;
    margin-bottom: 1rem;
}

.woocommerce-thankyou-order-details {
    background: rgba(15,26,48,0.8);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 8px;
    padding: 1.25rem;
}

/* ============================================================
   9. RESPONSIVE TWEAKS
   ============================================================ */
@media (max-width: 768px) {
    .woocommerce #customer_details,
    .woocommerce #order_review {
        float: none !important;
        width: 100% !important;
    }

    .woocommerce div.product form.cart {
        flex-direction: column;
        align-items: stretch;
    }

    .woocommerce .cart-collaterals {
        float: none !important;
        width: 100% !important;
    }
}
