/*
 * Skruffy Records — WooCommerce Stylesheet
 * Loaded only on WooCommerce pages
 *
 * v1.0.4 — Removed layout rules now handled by Elementor:
 *   - .single-product .product grid (handled by Elementor Single Product template)
 *   - .woocommerce-page ul.products grid (handled by Elementor Loop Grid widget)
 *   - .woocommerce-checkout #customer_details grid (handled by Elementor Checkout widget)
 */

/* -----------------------------------------------------------------------
   SINGLE PRODUCT — FORMAT VARIATION PILLS
   ----------------------------------------------------------------------- */

/* Format variation pills (replaces default WC dropdown) */
.variations_form .value {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* -----------------------------------------------------------------------
   PRODUCT ARCHIVE / SHOP
   Note: Grid layout is now handled by Elementor Loop Grid widget.
   Keeping only non-layout styles here.
   ----------------------------------------------------------------------- */

.woocommerce-page ul.products li.product {
    margin: 0;
}

/* -----------------------------------------------------------------------
   CHECKOUT
   Note: Column layout is now handled by Elementor Checkout widget.
   ----------------------------------------------------------------------- */

.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout #order_review_heading {
    font-size: var(--sr-text-xl);
    font-weight: 500;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--sr-yellow);
    margin-bottom: 1.5rem;
}

/* Stripe card element container */
#wc-stripe-card-element,
#wc-stripe-payment-element {
    padding: 0.75rem;
    border: 1px solid var(--sr-border-grey);
    border-radius: var(--sr-radius-md);
    background: var(--sr-white);
}

/* -----------------------------------------------------------------------
   MY ACCOUNT — DOWNLOAD LINKS
   ----------------------------------------------------------------------- */

.woocommerce-account .woocommerce-MyAccount-downloads table .download-product {
    font-weight: 500;
}

.woocommerce-account .woocommerce-MyAccount-downloads .button {
    background: var(--sr-yellow);
    color: var(--sr-dark);
    border-color: var(--sr-yellow);
    font-size: var(--sr-text-xs);
    padding: 0.4rem 0.875rem;
}

.woocommerce-account .woocommerce-MyAccount-downloads .button:hover {
    background: var(--sr-dark);
    color: var(--sr-white);
    border-color: var(--sr-dark);
}

/* Download expiry notice */
.sr-download-expiry {
    font-size: var(--sr-text-xs);
    color: var(--sr-mid-grey);
    margin-top: 0.25rem;
}

/* -----------------------------------------------------------------------
   CART
   ----------------------------------------------------------------------- */

.woocommerce-cart .woocommerce-cart-form__cart-item td {
    vertical-align: middle;
    padding: 1rem;
}

.woocommerce-cart td.product-thumbnail img {
    border-radius: var(--sr-radius-md);
    width: 80px;
    height: 80px;
    object-fit: cover;
}

.woocommerce .cart_totals h2,
.woocommerce-page .cart_totals h2 {
    font-size: var(--sr-text-xl);
    font-weight: 500;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--sr-yellow);
    margin-bottom: 1.5rem;
}

/* -----------------------------------------------------------------------
   ORDER CONFIRMATION — DIGITAL DOWNLOAD SECTION
   ----------------------------------------------------------------------- */

.woocommerce-order .woocommerce-order-downloads {
    background: var(--sr-yellow-20);
    border: 1px solid var(--sr-yellow);
    border-radius: var(--sr-radius-lg);
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.woocommerce-order .woocommerce-order-downloads h2 {
    font-size: var(--sr-text-lg);
    font-weight: 500;
    margin-bottom: 1rem;
}

.woocommerce-order .woocommerce-order-downloads p {
    font-size: var(--sr-text-sm);
    color: var(--sr-mid-grey);
}