/**
 * WooCommerce Styles for The Mana Reserve
 *
 * @package TheManaReserve
 */

/* Shop Page */
.woocommerce-page .site-main {
    padding: var(--mr-spacing-2xl) 0;
}

/* Product Grid - Compact Tile View */
ul.products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: var(--mr-spacing-md);
    list-style: none;
    padding: 0;
    margin: 0;
}

ul.products li.product {
    background: var(--mr-soft-white);
    border-radius: var(--mr-radius-frame, 2px);
    overflow: hidden;
    box-shadow:
        var(--mr-shadow-sm, 0 1px 3px rgba(45, 20, 50, 0.06)),
        inset 0 0 0 1px rgba(var(--mr-gold-rgb), 0.12);
    transition: box-shadow var(--mr-transition-normal), transform var(--mr-transition-normal);
    margin: 0;
    padding: 0;
}

ul.products li.product:hover {
    transform: translateY(-2px);
    box-shadow:
        var(--mr-shadow-md, 0 4px 14px rgba(45, 20, 50, 0.1)),
        inset 0 0 0 1px rgba(var(--mr-gold-rgb), 0.35);
}

ul.products li.product a img,
ul.products li.product .woocommerce-product-gallery img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 488 / 680;
    object-fit: contain;
}

ul.products li.product .woocommerce-loop-product__title {
    font-size: 0.85rem;
    font-weight: 600;
    padding: var(--mr-spacing-xs) var(--mr-spacing-sm) 0;
    margin: 0;
    color: var(--mr-charcoal);
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

ul.products li.product .price {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--mr-royal-purple);
    padding: var(--mr-spacing-xs) var(--mr-spacing-sm) var(--mr-spacing-sm);
    margin: 0;
}

ul.products li.product .button {
    display: block;
    width: calc(100% - var(--mr-spacing-md));
    margin: 0 var(--mr-spacing-sm) var(--mr-spacing-sm);
    padding: var(--mr-spacing-xs);
    font-size: 0.7rem;
    text-align: center;
    background: var(--mr-gold-accent);
    color: var(--mr-deep-purple);
    border-radius: var(--mr-radius-frame, 2px);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 2px solid var(--mr-gold-accent);
    transition: all var(--mr-transition-normal);
}

ul.products li.product .button:hover {
    background: transparent;
    color: var(--mr-gold-accent);
}

ul.products li.product .onsale {
    position: absolute;
    top: var(--mr-spacing-xs);
    left: var(--mr-spacing-xs);
    background: var(--mr-error);
    color: white;
    font-size: 0.7rem;
    padding: 2px 6px;
    border-radius: var(--mr-radius-sm);
    font-weight: 600;
}

/* Larger screens - 5-6 columns */
@media (min-width: 1200px) {
    ul.products {
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    }
}

/* Medium screens - 4 columns */
@media (max-width: 1199px) and (min-width: 768px) {
    ul.products {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }
}

/* Small screens - 2-3 columns */
@media (max-width: 767px) {
    ul.products {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        gap: var(--mr-spacing-sm);
    }
    
    ul.products li.product .woocommerce-loop-product__title {
        font-size: 0.8rem;
    }
    
    ul.products li.product .price {
        font-size: 0.85rem;
    }
}

.woocommerce-products-header {
    margin-bottom: var(--mr-spacing-xl);
}

.woocommerce-products-header__title {
    margin: 0;
}

/* Breadcrumbs */
.woocommerce-breadcrumb {
    font-size: 0.875rem;
    color: var(--mr-medium-gray);
    margin-bottom: var(--mr-spacing-lg);
}

.woocommerce-breadcrumb a {
    color: var(--mr-soft-purple);
}

.breadcrumb-sep {
    margin: 0 0.5rem;
    color: var(--mr-warm-gray);
}

/* Shop Controls */
.woocommerce-notices-wrapper {
    margin-bottom: var(--mr-spacing-lg);
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    padding: var(--mr-spacing-md) var(--mr-spacing-lg);
    border-radius: var(--mr-radius-md);
    margin-bottom: var(--mr-spacing-md);
}

.woocommerce-message {
    background: var(--mr-success-light);
    border-left: 4px solid var(--mr-success);
    color: var(--mr-charcoal);
}

.woocommerce-info {
    background: var(--mr-info-light);
    border-left: 4px solid var(--mr-info);
    color: var(--mr-charcoal);
}

.woocommerce-error {
    background: var(--mr-error-light);
    border-left: 4px solid var(--mr-error);
    color: var(--mr-charcoal);
}

.woocommerce-message a,
.woocommerce-info a {
    color: var(--mr-royal-purple);
    font-weight: 600;
}

/* Result Count & Ordering */
.woocommerce-result-count {
    font-size: 0.875rem;
    color: var(--mr-medium-gray);
}

.woocommerce-ordering select {
    padding: var(--mr-spacing-sm) var(--mr-spacing-md);
    border: 2px solid var(--mr-warm-gray);
    border-radius: var(--mr-radius-md);
    background: var(--mr-soft-white);
    font-size: 0.875rem;
    cursor: pointer;
}

.woocommerce-ordering select:focus {
    outline: none;
    border-color: var(--mr-soft-purple);
}

/* Single Product */
.single-product .product {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--mr-spacing-2xl);
    margin-bottom: var(--mr-spacing-2xl);
}

@media (max-width: 768px) {
    .single-product .product {
        grid-template-columns: 1fr;
    }
}

/* Product Gallery */
.woocommerce-product-gallery {
    position: relative;
}

.woocommerce-product-gallery__wrapper {
    border-radius: var(--mr-radius-lg);
    overflow: hidden;
    box-shadow: var(--mr-shadow-lg);
}

.woocommerce-product-gallery__image img {
    width: 100%;
    height: auto;
    display: block;
}

.woocommerce-product-gallery__trigger {
    position: absolute;
    top: var(--mr-spacing-md);
    right: var(--mr-spacing-md);
    background: var(--mr-soft-white);
    border-radius: var(--mr-radius-full);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--mr-shadow-md);
    z-index: 10;
}

/* Product Summary */
.summary.entry-summary {
    padding: var(--mr-spacing-lg);
    background: var(--mr-soft-white);
    border-radius: var(--mr-radius-lg);
    box-shadow: var(--mr-shadow-sm);
}

.product_title {
    font-size: 2rem;
    margin-bottom: var(--mr-spacing-md);
}

.price {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--mr-royal-purple);
    margin-bottom: var(--mr-spacing-md);
}

.price del {
    font-size: 1.25rem;
    color: var(--mr-medium-gray);
    font-weight: 400;
}

.price ins {
    text-decoration: none;
}

/* Stock Status */
.stock {
    display: inline-block;
    padding: var(--mr-spacing-xs) var(--mr-spacing-sm);
    border-radius: var(--mr-radius-sm);
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: var(--mr-spacing-md);
}

.in-stock {
    background: var(--mr-success-light);
    color: var(--mr-success);
}

.out-of-stock {
    background: var(--mr-error-light);
    color: var(--mr-error);
}

/* Variations */
.variations {
    width: 100%;
    margin-bottom: var(--mr-spacing-lg);
}

.variations tr {
    display: flex;
    flex-direction: column;
    margin-bottom: var(--mr-spacing-md);
}

.variations .label {
    font-weight: 600;
    margin-bottom: var(--mr-spacing-xs);
}

.variations select {
    width: 100%;
    padding: var(--mr-spacing-sm) var(--mr-spacing-md);
    border: 2px solid var(--mr-warm-gray);
    border-radius: var(--mr-radius-md);
    font-size: 1rem;
    background: var(--mr-soft-white);
}

.variations select:focus {
    outline: none;
    border-color: var(--mr-soft-purple);
}

.reset_variations {
    font-size: 0.875rem;
    color: var(--mr-soft-purple);
    margin-top: var(--mr-spacing-sm);
    display: inline-block;
}

/* Quantity */
.quantity {
    display: flex;
    align-items: center;
    gap: var(--mr-spacing-xs);
    margin-right: var(--mr-spacing-md);
}

.quantity input[type="number"] {
    width: 70px;
    padding: var(--mr-spacing-sm);
    border: 2px solid var(--mr-warm-gray);
    border-radius: var(--mr-radius-md);
    text-align: center;
    font-size: 1rem;
    -moz-appearance: textfield;
}

.quantity input[type="number"]::-webkit-outer-spin-button,
.quantity input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Add to Cart Button */
.single_add_to_cart_button {
    background: var(--mr-gold-accent);
    color: var(--mr-deep-purple);
    border: none;
    padding: var(--mr-spacing-md) var(--mr-spacing-2xl);
    font-size: 1rem;
    font-weight: 600;
    border-radius: var(--mr-radius-md);
    cursor: pointer;
    transition: all var(--mr-transition-fast);
}

.single_add_to_cart_button:hover {
    background: var(--mr-soft-gold);
    transform: translateY(-2px);
    box-shadow: var(--mr-shadow-md);
}

.single_add_to_cart_button:disabled {
    background: var(--mr-warm-gray);
    color: var(--mr-medium-gray);
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Product Meta */
.product_meta {
    margin-top: var(--mr-spacing-lg);
    padding-top: var(--mr-spacing-lg);
    border-top: 1px solid var(--mr-warm-gray);
    font-size: 0.875rem;
    color: var(--mr-medium-gray);
}

.product_meta > span {
    display: block;
    margin-bottom: var(--mr-spacing-xs);
}

.product_meta a {
    color: var(--mr-soft-purple);
}

/* Product Tabs */
.woocommerce-tabs {
    margin-top: var(--mr-spacing-2xl);
    clear: both;
}

.woocommerce-tabs ul.tabs {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--mr-spacing-lg);
    display: flex;
    gap: var(--mr-spacing-sm);
    border-bottom: 2px solid var(--mr-warm-gray);
}

.woocommerce-tabs ul.tabs li {
    margin: 0;
}

.woocommerce-tabs ul.tabs li a {
    display: block;
    padding: var(--mr-spacing-sm) var(--mr-spacing-lg);
    color: var(--mr-medium-gray);
    font-weight: 500;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all var(--mr-transition-fast);
}

.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li a:hover {
    color: var(--mr-royal-purple);
    border-bottom-color: var(--mr-royal-purple);
}

.woocommerce-tabs .panel {
    background: var(--mr-soft-white);
    padding: var(--mr-spacing-xl);
    border-radius: var(--mr-radius-lg);
}

.woocommerce-tabs .panel h2 {
    font-size: 1.5rem;
    margin-bottom: var(--mr-spacing-md);
}

/* Related Products */
.related.products,
.upsells.products {
    margin-top: var(--mr-spacing-3xl);
}

.related.products > h2,
.upsells.products > h2 {
    font-size: 1.5rem;
    margin-bottom: var(--mr-spacing-lg);
}

/* Cart Page */
.woocommerce-cart-form {
    margin-bottom: var(--mr-spacing-2xl);
}

.shop_table {
    width: 100%;
    border-collapse: collapse;
    background: var(--mr-soft-white);
    border-radius: var(--mr-radius-lg);
    overflow: hidden;
    box-shadow: var(--mr-shadow-sm);
}

.shop_table thead {
    background: var(--mr-royal-purple);
    color: var(--mr-soft-white);
}

.shop_table th,
.shop_table td {
    padding: var(--mr-spacing-md);
    text-align: left;
}

.shop_table tbody tr {
    border-bottom: 1px solid var(--mr-warm-gray);
}

.shop_table tbody tr:last-child {
    border-bottom: none;
}

.shop_table .product-thumbnail img {
    width: 80px;
    height: auto;
    border-radius: var(--mr-radius-sm);
}

.shop_table .product-name a {
    color: var(--mr-charcoal);
    font-weight: 500;
}

.shop_table .product-name a:hover {
    color: var(--mr-royal-purple);
}

.shop_table .product-remove a {
    color: var(--mr-error);
    font-size: 1.25rem;
}

/* Cart Totals */
.cart_totals {
    background: var(--mr-soft-white);
    padding: var(--mr-spacing-xl);
    border-radius: var(--mr-radius-lg);
    box-shadow: var(--mr-shadow-sm);
}

.cart_totals h2 {
    font-size: 1.25rem;
    margin-bottom: var(--mr-spacing-lg);
}

.cart_totals table {
    width: 100%;
}

.cart_totals th,
.cart_totals td {
    padding: var(--mr-spacing-sm) 0;
    border-bottom: 1px solid var(--mr-warm-gray);
}

.cart_totals .order-total th,
.cart_totals .order-total td {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--mr-royal-purple);
    border-bottom: none;
    padding-top: var(--mr-spacing-md);
}

.wc-proceed-to-checkout .checkout-button {
    display: block;
    width: 100%;
    background: var(--mr-gold-accent);
    color: var(--mr-deep-purple);
    padding: var(--mr-spacing-md);
    text-align: center;
    font-weight: 600;
    font-size: 1.125rem;
    border-radius: var(--mr-radius-md);
    margin-top: var(--mr-spacing-lg);
    transition: all var(--mr-transition-fast);
}

.wc-proceed-to-checkout .checkout-button:hover {
    background: var(--mr-soft-gold);
}

/* Checkout - full page width (header + content)
   Root cause: Body can be constrained to ~748px (WordPress default content width),
   which breaks the two-column layout and creates a large gap. Force html, body,
   and all wrappers to full width so checkout uses the full viewport. */

html:has(body.woocommerce-checkout) {
    width: 100% !important;
    max-width: 100% !important;
}

/* Override any grid on body/#page that constrains layout above breakpoint */
body.woocommerce-checkout,
body.woocommerce-checkout #page {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
}

body.woocommerce-checkout .site-header,
body.woocommerce-checkout #content,
body.woocommerce-checkout .site-main {
    width: 100% !important;
    max-width: 100% !important;
}

/* Header .mr-container: remove default max-width on checkout so it doesn't snap narrow after breakpoint */
html body.woocommerce-checkout .site-header .mr-container {
    max-width: none !important;
    width: 100% !important;
}

/* Checkout container: full width (no 2xl limit) so the page isn't constrained */
body.woocommerce-checkout .site-main .mr-container,
body.woocommerce-checkout .mr-checkout-container {
    max-width: 100%;
    width: 100%;
}

body.woocommerce-checkout .entry-content,
body.woocommerce-checkout .entry-content .woocommerce {
    width: 100% !important;
    max-width: 100% !important;
}

body.woocommerce-checkout .woocommerce,
body.woocommerce-checkout .woocommerce form.woocommerce-checkout,
body.woocommerce-checkout .woocommerce-notices-wrapper {
    width: 100%;
    max-width: 100%;
}

/* Above 992px another stylesheet (WooCommerce blocks, plugin, or core) applies
   a max-width and the layout snaps narrow. Override with higher specificity
   so checkout stays full width at all viewport sizes. */
@media (min-width: 993px) {
    html body.woocommerce-checkout,
    html body.woocommerce-checkout #page,
    html body.woocommerce-checkout .site-header,
    html body.woocommerce-checkout #content,
    html body.woocommerce-checkout .site-main,
    html body.woocommerce-checkout .entry-content,
    html body.woocommerce-checkout .entry-content .woocommerce,
    html body.woocommerce-checkout .woocommerce,
    html body.woocommerce-checkout .woocommerce-notices-wrapper,
    html body.woocommerce-checkout form.woocommerce-checkout,
    html body.woocommerce-checkout .wp-block-group,
    html body.woocommerce-checkout [class*="wp-block-"] {
        width: 100% !important;
        max-width: 100% !important;
    }

    html body.woocommerce-checkout .site-header .mr-container {
        max-width: none !important;
        width: 100% !important;
    }

    html body.woocommerce-checkout .site-main .mr-container,
    html body.woocommerce-checkout .mr-checkout-container {
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* Checkout form: two columns – left: billing/shipping, right: Your order */
.woocommerce-checkout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--mr-spacing-2xl);
    width: 100%;
    max-width: 100%;
    min-width: 0;
    align-items: start; /* keep both columns aligned to top, don't stretch right column down */
}

/* Two-column layout: left = billing/shipping, right = Your order (heading + #order_review together) */
@media (min-width: 993px) {
    /* Default: all direct children of the form go to column 2 so order_review_heading + any hook content + order_review stay in same column */
    .woocommerce-checkout > * {
        grid-column: 2;
    }
    /* Left column: only notices (row 1) and customer_details (row 2 to end) */
    .woocommerce-checkout > .woocommerce-notices-wrapper {
        grid-column: 1;
        grid-row: 1;
    }
    .woocommerce-checkout > .woocommerce-notices-wrapper:empty {
        min-height: 0;
    }
    .woocommerce-checkout > #customer_details {
        grid-column: 1;
        grid-row: 2 / -1;
    }
    /* Keep billing/shipping from expanding past their column (stops layout breaking) */
    .woocommerce-checkout #customer_details,
    .woocommerce-checkout .woocommerce-billing-fields {
        min-width: 0;
        max-width: 100%;
    }
    /* When no notices wrapper, customer_details starts at row 1 */
    .woocommerce-checkout:not(:has(.woocommerce-notices-wrapper)) > #customer_details {
        grid-row: 1 / -1;
    }
}

@media (max-width: 992px) {
    .woocommerce-checkout {
        grid-template-columns: 1fr;
    }
    .woocommerce-checkout > * {
        grid-column: auto;
        grid-row: auto;
    }
}

/* Above breakpoint: ensure no grid on body/#page overrides our layout */
@media (min-width: 993px) {
    html body.woocommerce-checkout,
    html body.woocommerce-checkout #page {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
    }
}

@media (max-width: 768px) {
    body.woocommerce-checkout .site-main .mr-container {
        padding-left: var(--mr-spacing-md);
        padding-right: var(--mr-spacing-md);
    }
}

.woocommerce-billing-fields,
.woocommerce-shipping-fields,
.woocommerce-additional-fields {
    background: var(--mr-soft-white);
    padding: var(--mr-spacing-xl);
    border-radius: var(--mr-radius-lg);
    margin-bottom: var(--mr-spacing-lg);
}

.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3 {
    font-size: 1.25rem;
    margin-bottom: var(--mr-spacing-lg);
}

.form-row {
    margin-bottom: var(--mr-spacing-md);
}

.form-row label {
    display: block;
    margin-bottom: var(--mr-spacing-xs);
    font-weight: 500;
}

.form-row .required {
    color: var(--mr-error);
}

.form-row input,
.form-row select,
.form-row textarea {
    width: 100%;
    padding: var(--mr-spacing-sm) var(--mr-spacing-md);
    border: 2px solid var(--mr-warm-gray);
    border-radius: var(--mr-radius-md);
    font-size: 1rem;
}

.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus {
    outline: none;
    border-color: var(--mr-soft-purple);
}

/* Order Review */
#order_review_heading {
    font-size: 1.5rem;
    margin-bottom: var(--mr-spacing-lg);
}

#order_review {
    background: var(--mr-soft-white);
    padding: var(--mr-spacing-xl);
    border-radius: var(--mr-radius-lg);
}

.woocommerce-checkout-review-order-table {
    width: 100%;
    margin-bottom: var(--mr-spacing-lg);
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
    padding: var(--mr-spacing-sm) 0;
    border-bottom: 1px solid var(--mr-warm-gray);
}

/* Payment Methods */
.woocommerce-checkout-payment {
    background: var(--mr-warm-cream);
    padding: var(--mr-spacing-lg);
    border-radius: var(--mr-radius-md);
    margin-bottom: var(--mr-spacing-lg);
}

.wc_payment_methods {
    list-style: none;
    padding: 0;
    margin: 0;
}

.wc_payment_method {
    margin-bottom: var(--mr-spacing-md);
    padding: var(--mr-spacing-md);
    background: var(--mr-soft-white);
    border-radius: var(--mr-radius-md);
    border: 2px solid transparent;
}

.wc_payment_method.payment_method_active {
    border-color: var(--mr-soft-purple);
}

.wc_payment_method label {
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: var(--mr-spacing-sm);
}

.wc_payment_method .payment_box {
    margin-top: var(--mr-spacing-md);
    padding: var(--mr-spacing-md);
    background: var(--mr-warm-cream);
    border-radius: var(--mr-radius-sm);
    font-size: 0.875rem;
    color: var(--mr-dark-gray);
}

/* Place Order Button */
#place_order {
    width: 100%;
    background: var(--mr-gold-accent);
    color: var(--mr-deep-purple);
    border: none;
    padding: var(--mr-spacing-md) var(--mr-spacing-xl);
    font-size: 1.125rem;
    font-weight: 600;
    border-radius: var(--mr-radius-md);
    cursor: pointer;
    transition: all var(--mr-transition-fast);
}

#place_order:hover {
    background: var(--mr-soft-gold);
}

/* My Account */
.woocommerce-MyAccount-navigation {
    background: var(--mr-soft-white);
    border-radius: var(--mr-radius-lg);
    overflow: hidden;
    margin-bottom: var(--mr-spacing-xl);
}

.woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.woocommerce-MyAccount-navigation li {
    border-bottom: 1px solid var(--mr-warm-gray);
}

.woocommerce-MyAccount-navigation li:last-child {
    border-bottom: none;
}

.woocommerce-MyAccount-navigation li a {
    display: block;
    padding: var(--mr-spacing-md) var(--mr-spacing-lg);
    color: var(--mr-charcoal);
    transition: all var(--mr-transition-fast);
}

.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li a:hover {
    background: var(--mr-royal-purple);
    color: var(--mr-soft-white);
}

.woocommerce-MyAccount-content {
    background: var(--mr-soft-white);
    padding: var(--mr-spacing-xl);
    border-radius: var(--mr-radius-lg);
}

/* Pagination */
.woocommerce-pagination {
    margin-top: var(--mr-spacing-2xl);
    text-align: center;
}

.woocommerce-pagination ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: inline-flex;
    gap: var(--mr-spacing-xs);
}

.woocommerce-pagination li {
    margin: 0;
}

.woocommerce-pagination li a,
.woocommerce-pagination li span {
    display: block;
    padding: var(--mr-spacing-sm) var(--mr-spacing-md);
    background: var(--mr-soft-white);
    border-radius: var(--mr-radius-md);
    color: var(--mr-charcoal);
    transition: all var(--mr-transition-fast);
}

.woocommerce-pagination li a:hover,
.woocommerce-pagination li span.current {
    background: var(--mr-royal-purple);
    color: var(--mr-soft-white);
}

/* Loading */
.woocommerce .blockUI.blockOverlay {
    background: rgba(255, 255, 255, 0.7) !important;
}

.woocommerce .loader {
    border-color: var(--mr-royal-purple) !important;
}

/* Mobile Fixes */
@media (max-width: 768px) {
    /* Prevent product grid from overflowing */
    .shop-products,
    .woocommerce-shop,
    .woocommerce-page {
        max-width: 100vw;
        overflow-x: hidden;
    }
    
    ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: var(--mr-spacing-sm);
        max-width: 100%;
        padding: 0;
        margin: 0;
    }
    
    ul.products li.product {
        min-width: 0;
        max-width: 100%;
    }
    
    ul.products li.product a img {
        width: 100%;
        max-width: 100%;
    }
    
    ul.products li.product .woocommerce-loop-product__title {
        font-size: 0.75rem;
        padding: var(--mr-spacing-xs);
    }
    
    ul.products li.product .price {
        font-size: 0.85rem;
        padding: var(--mr-spacing-xs);
    }
    
    ul.products li.product .button {
        font-size: 0.7rem;
        padding: 6px;
        margin: 0 var(--mr-spacing-xs) var(--mr-spacing-xs);
        width: calc(100% - var(--mr-spacing-sm));
    }
    
    /* Shop layout single column on mobile */
    .shop-layout {
        display: block !important;
    }
    
    .shop-filters {
        display: none;
    }
    
    /* Single product mobile */
    .single-product .product {
        grid-template-columns: 1fr !important;
    }
    
    .summary.entry-summary {
        padding: var(--mr-spacing-md);
    }
    
    .product_title {
        font-size: 1.5rem;
    }
    
    /* Cart table mobile */
    .shop_table {
        font-size: 0.875rem;
    }
    
    .shop_table .product-thumbnail img {
        width: 60px;
    }
}

/* ==========================================================================
   WOOCOMMERCE BLOCKS OVERRIDE
   Ensures product images in WooCommerce blocks display properly
   ========================================================================== */

/* WooCommerce Block Product Image Containers - remove cropping */
.wc-block-grid__product-image,
.wc-block-components-product-image,
[class*="wp-block-woocommerce"] .wc-block-grid__product-image {
    aspect-ratio: auto !important;
    overflow: visible !important;
    height: auto !important;
}

/* WooCommerce Block Product Grid Images */
.wc-block-grid__product-image img,
.wc-block-components-product-image img,
.wp-block-woocommerce-product-image img,
.wc-block-grid__product img,
.wp-block-woocommerce-newest-products img,
.wp-block-woocommerce-product-new img,
.wp-block-woocommerce-handpicked-products img,
.wp-block-woocommerce-product-best-sellers img,
.wp-block-woocommerce-product-top-rated img,
.wp-block-woocommerce-product-on-sale img,
.wp-block-woocommerce-products img,
.wp-block-woocommerce-all-products img {
    object-fit: contain !important;
    object-position: center !important;
    aspect-ratio: auto !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
}

/* Fallback for any WooCommerce product image container */
[class*="wc-block"] .wc-block-grid__product-image img,
[class*="wp-block-woocommerce"] img {
    object-fit: contain !important;
    aspect-ratio: auto !important;
    height: auto !important;
}

/* WooCommerce Blocks Grid Alignment Fix */
.wc-block-grid__products {
    align-items: start !important;
}

.wc-block-grid__product {
    vertical-align: top;
}

.wc-block-grid__product-add-to-cart {
    margin-top: auto;
}

/* ==========================================================================
   WOOCOMMERCE BLOCKS — museum / brand alignment (cart, checkout, components)
   ========================================================================== */

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout,
.wc-block-cart,
.wc-block-checkout {
    font-family: var(--mr-font-secondary);
    color: var(--mr-ink);
}

.wc-block-cart__submit-container .wc-block-components-button,
.wc-block-checkout__actions_row .wc-block-components-button,
.wc-block-components-button:not(.is-link) {
    background-color: var(--mr-gold-accent) !important;
    color: var(--mr-deep-purple) !important;
    border: 2px solid var(--mr-gold-accent) !important;
    border-radius: var(--mr-radius-frame) !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    transition: background-color var(--mr-transition-normal), color var(--mr-transition-normal), border-color var(--mr-transition-normal) !important;
}

.wc-block-cart__submit-container .wc-block-components-button:hover,
.wc-block-checkout__actions_row .wc-block-components-button:hover,
.wc-block-components-button:not(.is-link):hover {
    background-color: transparent !important;
    color: var(--mr-gold-accent) !important;
    border-color: var(--mr-gold-accent) !important;
}

.wc-block-components-button.is-link {
    color: var(--mr-soft-purple) !important;
}

.wc-block-components-button.is-link:hover {
    color: var(--mr-royal-purple) !important;
}

.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-select select,
.wc-block-components-combobox input,
.wc-blocks-components-select__container {
    border-radius: var(--mr-radius-md) !important;
    border-color: var(--mr-warm-gray) !important;
}

.wc-block-components-text-input input:focus,
.wc-block-components-text-input textarea:focus,
.wc-block-components-select select:focus {
    border-color: var(--mr-soft-purple) !important;
    box-shadow: 0 0 0 3px rgba(63, 36, 107, 0.12) !important;
    outline: none !important;
}

.wc-block-components-product-metadata,
.wc-block-components-order-summary-item,
.wc-block-cart-items__row,
.wc-block-cart__main table,
.wc-block-components-totals-item {
    font-family: var(--mr-font-secondary);
}

.wc-block-cart__main,
.wc-block-checkout__main,
.wc-block-components-sidebar-layout .wc-block-components-sidebar {
    background-color: transparent;
}

.wc-block-components-panel,
.wc-block-cart__totals-title,
.wc-block-components-totals-wrapper {
    border-color: var(--mr-warm-gray) !important;
}

.wc-block-grid__product {
    border-radius: var(--mr-radius-frame);
    box-shadow: var(--mr-shadow-sm), inset 0 0 0 1px rgba(var(--mr-gold-rgb), 0.1);
    overflow: hidden;
    transition: box-shadow var(--mr-transition-normal), transform var(--mr-transition-normal);
}

.wc-block-grid__product:hover {
    box-shadow: var(--mr-shadow-md), inset 0 0 0 1px rgba(var(--mr-gold-rgb), 0.3);
    transform: translateY(-2px);
}

.wc-block-components-button:focus-visible,
.wc-block-cart__submit-container .wc-block-components-button:focus-visible {
    outline: 2px solid var(--mr-gold-accent) !important;
    outline-offset: 2px !important;
}

h1.wp-block-heading.wc-block-cart__empty-cart__title,
.wc-block-cart h2,
.wc-block-checkout h2,
.wp-block-woocommerce-cart-heading h1,
.wp-block-woocommerce-checkout-order-summary-block h2 {
    font-family: var(--mr-font-primary) !important;
    color: var(--mr-deep-purple) !important;
    font-weight: 500 !important;
}

@media (prefers-reduced-motion: reduce) {
    ul.products li.product:hover,
    .wc-block-grid__product:hover {
        transform: none;
    }
}