/**
 * ═══════════════════════════════════════════════════════════════════════════
 * SHARPI - WooCommerce Cart & Checkout Styling - PRODUCTION-READY v5.0
 * ═══════════════════════════════════════════════════════════════════════════
 * 
 * COMPATIBLE WITH: WooCommerce Cart/Checkout Blocks
 * BRAND COLOR: Orange #ff8c00
 * SCOPE: Cart and Checkout pages ONLY (body.woocommerce-cart, body.woocommerce-checkout)
 * 
 * FEATURES:
 * ✓ Defensive CSS resets to prevent theme conflicts
 * ✓ Beautiful 2-column layout with proper constraints
 * ✓ Orange brand accent color throughout
 * ✓ Card-based design with shadows and rounded corners
 * ✓ Fully responsive (desktop, tablet, mobile)
 * ✓ High specificity to override theme styles
 * ✓ Production-tested and battle-hardened
 * 
 * @package SHARPI_Theme
 * @author SHARPI Development Team
 * @version 5.0.0
 * @license GPL-2.0+
 */


/* ═══════════════════════════════════════════════════════════════════════════
   1. CSS VARIABLES - SHARPI BRAND COLORS & DESIGN TOKENS
   ═══════════════════════════════════════════════════════════════════════════ */

body.woocommerce-cart,
body.woocommerce-checkout,
.woocommerce-cart,
.woocommerce-checkout {
    /* Primary brand colors */
    --sharpi-orange: #ff8c00;
    --sharpi-orange-hover: #e67e00;
    --sharpi-orange-light: rgba(255, 140, 0, 0.1);
    --sharpi-orange-soft: #fff4e5;
    
    /* Text colors */
    --sharpi-dark: #1a1a1a;
    --sharpi-text: #333333;
    --sharpi-text-light: #666666;
    --sharpi-text-muted: #999999;
    
    /* Background colors */
    --sharpi-gray-bg: #f5f5f5;
    --sharpi-white: #ffffff;
    --sharpi-card-bg: #ffffff;
    
    /* Border colors */
    --sharpi-gray-border: #e0e0e0;
    --sharpi-border-strong: #d1d5db;
    
    /* Status colors */
    --sharpi-green: #28a745;
    --sharpi-red: #dc3545;
    
    /* Design tokens */
    --sharpi-shadow-card: 0 4px 12px rgba(0, 0, 0, 0.08);
    --sharpi-shadow-soft: 0 2px 6px rgba(0, 0, 0, 0.06);
    --sharpi-shadow-button: 0 8px 20px rgba(255, 140, 0, 0.25);
    --sharpi-radius: 8px;
    --sharpi-radius-lg: 12px;
    --sharpi-radius-xl: 16px;
    --sharpi-radius-pill: 999px;
    
    /* Layout constraints */
    --sharpi-max-width: 1400px;
    --sharpi-content-padding: 40px;
}


/* ═══════════════════════════════════════════════════════════════════════════
   2. DEFENSIVE RESETS - PREVENT THEME CONFLICTS
   ═══════════════════════════════════════════════════════════════════════════ */

/**
 * CRITICAL: These resets prevent common theme issues that break WooCommerce layouts
 * Priority: !important is used strategically to override theme styles
 */

/* Page background */
body.woocommerce-cart,
body.woocommerce-checkout {
    background-color: var(--sharpi-gray-bg) !important;
}

/* Reset all parent containers to allow full-width usage */
body.woocommerce-cart .site-content,
body.woocommerce-checkout .site-content,
body.woocommerce-cart .entry-content,
body.woocommerce-checkout .entry-content,
body.woocommerce-cart .page-content,
body.woocommerce-checkout .page-content,
body.woocommerce-cart main,
body.woocommerce-checkout main,
body.woocommerce-cart article,
body.woocommerce-checkout article,
body.woocommerce-cart .content-area,
body.woocommerce-checkout .content-area,
body.woocommerce-cart .site-main,
body.woocommerce-checkout .site-main {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Reset container classes that themes commonly use */
body.woocommerce-cart .container,
body.woocommerce-checkout .container,
body.woocommerce-cart .container-fluid,
body.woocommerce-checkout .container-fluid {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Override common Gutenberg/Astra "constrained" content widths (often the real reason it stays narrow) */
body.woocommerce-cart .entry-content > *,
body.woocommerce-checkout .entry-content > *,
body.woocommerce-cart .site-content > *,
body.woocommerce-checkout .site-content > * ,
body.woocommerce-cart .is-layout-constrained > *,
body.woocommerce-checkout .is-layout-constrained > * ,
body.woocommerce-cart .wp-site-blocks > *,
body.woocommerce-checkout .wp-site-blocks > * {
    max-width: none !important;
    width: 100% !important;
}

/* Astra container specifics (if present) */
body.woocommerce-cart .ast-container,
body.woocommerce-checkout .ast-container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Prevent column wrapper interference */
body.woocommerce-cart .wp-block-columns,
body.woocommerce-checkout .wp-block-columns,
body.woocommerce-cart .wp-block-group,
body.woocommerce-checkout .wp-block-group {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.woocommerce-cart .wp-block-column,
body.woocommerce-checkout .wp-block-column {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Reset page title styling */
body.woocommerce-cart .entry-title,
body.woocommerce-checkout .entry-title,
body.woocommerce-cart .page-title,
body.woocommerce-checkout .page-title {
    font-size: 32px !important;
    font-weight: 700 !important;
    color: var(--sharpi-dark) !important;
    margin: 0 auto 30px !important;
    padding: 30px var(--sharpi-content-padding) 0 !important;
    max-width: var(--sharpi-max-width) !important;
    box-sizing: border-box !important;
}

/* Text wrapping: allow long names/addresses to wrap gracefully */
body.woocommerce-cart .wc-block-components-product-name,
body.woocommerce-checkout .wc-block-components-product-name,
body.woocommerce-cart .wc-block-cart-item__product,
body.woocommerce-checkout .wc-block-components-address-form,
body.woocommerce-checkout .wc-block-components-text-input,
body.woocommerce-checkout .wc-block-components-combobox {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   3. CART PAGE - MAIN CONTAINER & 2-COLUMN LAYOUT
   ═══════════════════════════════════════════════════════════════════════════ */

/**
 * Cart Block Structure:
 * - Main container: .wp-block-woocommerce-cart
 * - Filled cart: .wp-block-woocommerce-filled-cart-block
 * - Left column: .wp-block-woocommerce-cart-items-block
 * - Right column: .wp-block-woocommerce-cart-totals-block
 */

/* Main cart container - centered with max-width */
body.woocommerce-cart .wp-block-woocommerce-cart {
    max-width: var(--sharpi-max-width) !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 var(--sharpi-content-padding) 60px !important;
    box-sizing: border-box !important;
}

/* Filled cart block - 2-column grid layout */
body.woocommerce-cart .wp-block-woocommerce-filled-cart-block {
    display: grid !important;
    grid-template-columns: minmax(0, 2fr) minmax(320px, 400px) !important;
    gap: 30px !important;
    align-items: flex-start !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* Alternative selector for cart block */
body.woocommerce-cart .wc-block-cart {
    display: grid !important;
    grid-template-columns: minmax(0, 2fr) minmax(320px, 400px) !important;
    gap: 30px !important;
    align-items: flex-start !important;
}

/* Make sure main & sidebar aren't artificially constrained by theme styles */
body.woocommerce-cart .wc-block-cart__main,
body.woocommerce-cart .wc-block-cart__sidebar {
    max-width: none !important;
    width: auto !important;
    min-width: 0 !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   4. CART - LEFT COLUMN (CART ITEMS)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Cart items container - beautiful card */
body.woocommerce-cart .wp-block-woocommerce-cart-items-block {
    background: var(--sharpi-white) !important;
    border: 1px solid var(--sharpi-gray-border) !important;
    border-radius: var(--sharpi-radius-xl) !important;
    box-shadow: var(--sharpi-shadow-card) !important;
    overflow: hidden !important;
    min-width: 0 !important;
}

/* Section header */
body.woocommerce-cart .wp-block-woocommerce-cart-items-block::before {
    content: "Produkty w koszyku" !important;
    display: block !important;
    background: var(--sharpi-gray-bg) !important;
    color: var(--sharpi-dark) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 18px 24px !important;
    border-bottom: 1px solid var(--sharpi-gray-border) !important;
}

/* Cart line items list */
body.woocommerce-cart .wc-block-cart-items {
    padding: 0 !important;
    margin: 0 !important;
}

/* Individual cart item row */
body.woocommerce-cart .wc-block-cart-items__row {
    display: grid !important;
    grid-template-columns: 90px minmax(200px, 1fr) auto auto auto !important;
    align-items: center !important;
    gap: 20px !important;
    padding: 20px 24px !important;
    border-bottom: 1px solid var(--sharpi-gray-border) !important;
    background: var(--sharpi-white) !important;
    transition: background-color 0.2s ease !important;
}

body.woocommerce-cart .wc-block-cart-items__row:last-child {
    border-bottom: none !important;
}

body.woocommerce-cart .wc-block-cart-items__row:hover {
    background: var(--sharpi-gray-bg) !important;
}

/* Product image */
body.woocommerce-cart .wc-block-cart-item__image {
    width: 90px !important;
    height: 90px !important;
    border-radius: var(--sharpi-radius) !important;
    overflow: hidden !important;
    background: var(--sharpi-white) !important;
    border: 1px solid var(--sharpi-gray-border) !important;
    box-shadow: var(--sharpi-shadow-soft) !important;
    flex-shrink: 0 !important;
}

body.woocommerce-cart .wc-block-cart-item__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    padding: 8px !important;
}

/* Product name and details */
body.woocommerce-cart .wc-block-cart-item__product {
    min-width: 200px !important;
    max-width: 100% !important;
}

body.woocommerce-cart .wc-block-cart-item__product .wc-block-components-product-name {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--sharpi-dark) !important;
    text-decoration: none !important;
    display: block !important;
    line-height: 1.4 !important;
    margin-bottom: 6px !important;
    word-break: break-word !important;
}

body.woocommerce-cart .wc-block-cart-item__product .wc-block-components-product-name:hover {
    color: var(--sharpi-orange) !important;
}

/* HIDE product metadata/descriptions to prevent layout issues */
body.woocommerce-cart .wc-block-components-product-metadata,
body.woocommerce-cart .wc-block-components-product-details,
body.woocommerce-cart .wc-block-cart-item__product .wc-block-components-product-metadata {
    display: none !important;
}

/* Unit price */
body.woocommerce-cart .wc-block-cart-item__prices {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--sharpi-orange) !important;
    text-align: center !important;
    min-width: 80px !important;
    white-space: nowrap !important;
}

/* Quantity selector */
body.woocommerce-cart .wc-block-cart-item__quantity {
    display: flex !important;
    justify-content: center !important;
    min-width: 120px !important;
}

body.woocommerce-cart .wc-block-components-quantity-selector {
    display: inline-flex !important;
    align-items: center !important;
    border: 1px solid var(--sharpi-gray-border) !important;
    border-radius: var(--sharpi-radius-pill) !important;
    overflow: hidden !important;
    background: var(--sharpi-white) !important;
    box-shadow: var(--sharpi-shadow-soft) !important;
}

body.woocommerce-cart .wc-block-components-quantity-selector__button {
    width: 36px !important;
    height: 36px !important;
    border: none !important;
    background: var(--sharpi-gray-bg) !important;
    color: var(--sharpi-text) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    transition: all 0.2s ease !important;
}

body.woocommerce-cart .wc-block-components-quantity-selector__button:hover {
    background: var(--sharpi-orange) !important;
    color: var(--sharpi-white) !important;
}

body.woocommerce-cart .wc-block-components-quantity-selector__input {
    width: 50px !important;
    height: 36px !important;
    border: none !important;
    border-left: 1px solid var(--sharpi-gray-border) !important;
    border-right: 1px solid var(--sharpi-gray-border) !important;
    text-align: center !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--sharpi-dark) !important;
    background: var(--sharpi-white) !important;
    -moz-appearance: textfield !important;
}

body.woocommerce-cart .wc-block-components-quantity-selector__input::-webkit-outer-spin-button,
body.woocommerce-cart .wc-block-components-quantity-selector__input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

/* Total price per item */
body.woocommerce-cart .wc-block-cart-item__total {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: var(--sharpi-dark) !important;
    text-align: right !important;
    min-width: 100px !important;
    white-space: nowrap !important;
}

/* Remove button */
body.woocommerce-cart .wc-block-cart-item__remove-link {
    color: var(--sharpi-text-light) !important;
    font-size: 13px !important;
    padding: 8px 12px !important;
    border-radius: var(--sharpi-radius) !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

body.woocommerce-cart .wc-block-cart-item__remove-link:hover {
    color: var(--sharpi-red) !important;
    background: rgba(220, 53, 69, 0.1) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   5. CART - RIGHT COLUMN (CART TOTALS / ORDER SUMMARY)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Cart totals block - sticky sidebar */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block {
    background: var(--sharpi-white) !important;
    border: 1px solid var(--sharpi-gray-border) !important;
    border-radius: var(--sharpi-radius-xl) !important;
    box-shadow: var(--sharpi-shadow-card) !important;
    overflow: hidden !important;
    position: sticky !important;
    top: 100px !important;
    min-width: 0 !important;
}

/* Orange header for cart summary */
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-heading-block {
    background: var(--sharpi-orange) !important;
    color: var(--sharpi-white) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 18px 24px !important;
    margin: 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-heading-block > * {
    margin: 0 !important;
    color: var(--sharpi-white) !important;
}

/* Order summary block padding */
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-block {
    padding: 20px 24px !important;
}

/* Totals items (subtotal, shipping, etc.) */
body.woocommerce-cart .wc-block-components-totals-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 12px 0 !important;
    font-size: 14px !important;
    border-bottom: 1px solid var(--sharpi-gray-border) !important;
}

body.woocommerce-cart .wc-block-components-totals-item:last-of-type {
    border-bottom: none !important;
}

body.woocommerce-cart .wc-block-components-totals-item__label {
    color: var(--sharpi-text-light) !important;
    font-weight: 400 !important;
}

body.woocommerce-cart .wc-block-components-totals-item__value {
    font-weight: 600 !important;
    color: var(--sharpi-dark) !important;
}

/* Free shipping message */
body.woocommerce-cart .wc-block-components-totals-shipping__via {
    color: var(--sharpi-green) !important;
    font-weight: 600 !important;
}

/* Total footer item */
body.woocommerce-cart .wc-block-components-totals-footer-item {
    background: var(--sharpi-orange-soft) !important;
    margin: 20px -24px 0 !important;
    padding: 20px 24px !important;
    border-top: 2px solid var(--sharpi-orange) !important;
}

body.woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--sharpi-dark) !important;
}

body.woocommerce-cart .wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
    font-size: 28px !important;
    font-weight: 800 !important;
    color: var(--sharpi-orange) !important;
}

/* Coupon form */
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-coupon-form-block {
    padding: 16px 0 !important;
    border-top: 1px solid var(--sharpi-gray-border) !important;
    margin-top: 16px !important;
}

/* Proceed to checkout button */
body.woocommerce-cart .wp-block-woocommerce-proceed-to-checkout-block {
    padding: 24px 24px 20px !important;
    margin: 0 -24px -20px !important;
    background: var(--sharpi-white) !important;
}

body.woocommerce-cart .wp-block-woocommerce-proceed-to-checkout-block .wc-block-components-button,
body.woocommerce-cart .wc-block-cart__submit-button {
    display: block !important;
    width: 100% !important;
    padding: 16px 32px !important;
    background: linear-gradient(135deg, var(--sharpi-orange), var(--sharpi-orange-hover)) !important;
    color: var(--sharpi-white) !important;
    border: none !important;
    border-radius: var(--sharpi-radius-pill) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    box-shadow: var(--sharpi-shadow-button) !important;
}

body.woocommerce-cart .wp-block-woocommerce-proceed-to-checkout-block .wc-block-components-button:hover,
body.woocommerce-cart .wc-block-cart__submit-button:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 28px rgba(255, 140, 0, 0.35) !important;
}

/* Accepted payment methods */
body.woocommerce-cart .wp-block-woocommerce-cart-accepted-payment-methods-block {
    margin-top: 16px !important;
    font-size: 12px !important;
    color: var(--sharpi-text-muted) !important;
    text-align: center !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   6. CHECKOUT PAGE - MAIN CONTAINER & 2-COLUMN LAYOUT
   ═══════════════════════════════════════════════════════════════════════════ */

/**
 * Checkout Block Structure:
 * - Main container: .wp-block-woocommerce-checkout
 * - Left column: .wp-block-woocommerce-checkout-fields-block
 * - Right column: .wp-block-woocommerce-checkout-totals-block
 */

/* Main checkout container - centered with max-width */
body.woocommerce-checkout .wp-block-woocommerce-checkout {
    max-width: var(--sharpi-max-width) !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 var(--sharpi-content-padding) 60px !important;
    box-sizing: border-box !important;
}

/* Checkout block - 2-column grid layout */
body.woocommerce-checkout .wc-block-checkout {
    display: grid !important;
    grid-template-columns: minmax(0, 2fr) minmax(320px, 420px) !important;
    gap: 30px !important;
    align-items: flex-start !important;
    max-width: 100% !important;
    width: 100% !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   7. CHECKOUT - LEFT COLUMN (CHECKOUT FIELDS)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Checkout fields container */
body.woocommerce-checkout .wp-block-woocommerce-checkout-fields-block {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    min-width: 0 !important;
}

/* Each checkout section as a card */
body.woocommerce-checkout .wp-block-woocommerce-checkout-contact-information-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-shipping-address-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-billing-address-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-shipping-method-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-shipping-methods-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-payment-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-note-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-additional-information-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-terms-block {
    background: var(--sharpi-white) !important;
    border: 1px solid var(--sharpi-gray-border) !important;
    border-radius: var(--sharpi-radius-xl) !important;
    box-shadow: var(--sharpi-shadow-card) !important;
    padding: 24px !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
}

/* Section headings */
body.woocommerce-checkout .wp-block-woocommerce-checkout-fields-block h2,
body.woocommerce-checkout .wp-block-woocommerce-checkout-fields-block h3,
body.woocommerce-checkout .wc-block-components-checkout-step__heading {
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--sharpi-dark) !important;
}

/* Form fields styling */
body.woocommerce-checkout .wc-block-components-text-input,
body.woocommerce-checkout .wc-block-components-combobox,
body.woocommerce-checkout .wc-block-components-country-input,
body.woocommerce-checkout .wc-block-components-state-input {
    margin-bottom: 16px !important;
}

body.woocommerce-checkout .wc-block-components-text-input label,
body.woocommerce-checkout .wc-block-components-combobox label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--sharpi-text-light) !important;
    margin-bottom: 6px !important;
    display: block !important;
}

body.woocommerce-checkout .wc-block-components-text-input input,
body.woocommerce-checkout .wc-block-components-text-input textarea,
body.woocommerce-checkout .wc-block-components-combobox input,
body.woocommerce-checkout .wc-block-components-combobox select,
body.woocommerce-checkout .wc-block-components-select-input select,
body.woocommerce-checkout .wc-block-components-textarea textarea,
body.woocommerce-checkout form.woocommerce-checkout input[type="text"],
body.woocommerce-checkout form.woocommerce-checkout input[type="email"],
body.woocommerce-checkout form.woocommerce-checkout input[type="tel"],
body.woocommerce-checkout form.woocommerce-checkout select,
body.woocommerce-checkout form.woocommerce-checkout textarea {
    width: 100% !important;
    padding: 12px 16px !important;
    border: 1px solid var(--sharpi-gray-border) !important;
    border-radius: var(--sharpi-radius) !important;
    font-size: 15px !important;
    color: var(--sharpi-dark) !important;
    background: var(--sharpi-white) !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout .wc-block-components-text-input input:focus,
body.woocommerce-checkout .wc-block-components-text-input textarea:focus,
body.woocommerce-checkout .wc-block-components-combobox input:focus,
body.woocommerce-checkout .wc-block-components-combobox select:focus,
body.woocommerce-checkout form.woocommerce-checkout input:focus,
body.woocommerce-checkout form.woocommerce-checkout select:focus,
body.woocommerce-checkout form.woocommerce-checkout textarea:focus {
    outline: none !important;
    border-color: var(--sharpi-orange) !important;
    box-shadow: 0 0 0 3px var(--sharpi-orange-light) !important;
}

/* Shipping/Payment method radio options */
body.woocommerce-checkout .wc-block-components-radio-control {
    margin: 0 !important;
}

body.woocommerce-checkout .wc-block-components-radio-control__option {
    display: flex !important;
    align-items: flex-start !important;
    padding: 16px !important;
    border: 1px solid var(--sharpi-gray-border) !important;
    border-radius: var(--sharpi-radius) !important;
    margin-bottom: 12px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    gap: 12px !important;
    background: var(--sharpi-white) !important;
}

body.woocommerce-checkout .wc-block-components-radio-control__option:hover {
    background: var(--sharpi-gray-bg) !important;
    border-color: var(--sharpi-orange) !important;
}

body.woocommerce-checkout .wc-block-components-radio-control__option--checked {
    background: var(--sharpi-orange-soft) !important;
    border-color: var(--sharpi-orange) !important;
    border-width: 2px !important;
}

body.woocommerce-checkout .wc-block-components-radio-control__input {
    accent-color: var(--sharpi-orange) !important;
    width: 20px !important;
    height: 20px !important;
    margin-top: 2px !important;
    flex-shrink: 0 !important;
}

body.woocommerce-checkout .wc-block-components-radio-control__label {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--sharpi-dark) !important;
    display: block !important;
    margin-bottom: 4px !important;
}

body.woocommerce-checkout .wc-block-components-radio-control__description {
    font-size: 13px !important;
    color: var(--sharpi-text-light) !important;
    line-height: 1.5 !important;
}

body.woocommerce-checkout .wc-block-components-radio-control__secondary-label {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--sharpi-orange) !important;
    white-space: nowrap !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   8. CHECKOUT - RIGHT COLUMN (ORDER SUMMARY)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Checkout totals block - sticky sidebar */
body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block {
    background: var(--sharpi-white) !important;
    border: 1px solid var(--sharpi-gray-border) !important;
    border-radius: var(--sharpi-radius-xl) !important;
    box-shadow: var(--sharpi-shadow-card) !important;
    overflow: hidden !important;
    position: sticky !important;
    top: 100px !important;
    min-width: 0 !important;
}

/* Orange header for order summary */
body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block::before {
    content: "Podsumowanie zamówienia" !important;
    display: block !important;
    background: var(--sharpi-orange) !important;
    color: var(--sharpi-white) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 18px 24px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* Hide duplicate title */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block > h2,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block > h3 {
    display: none !important;
}

/* Order summary padding */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block {
    padding: 20px 24px !important;
}

/* Order summary items */
body.woocommerce-checkout .wc-block-components-order-summary-item {
    display: flex !important;
    gap: 16px !important;
    padding: 16px 0 !important;
    border-bottom: 1px solid var(--sharpi-gray-border) !important;
    align-items: flex-start !important;
}

body.woocommerce-checkout .wc-block-components-order-summary-item:last-child {
    border-bottom: none !important;
}

body.woocommerce-checkout .wc-block-components-order-summary-item__image {
    width: 70px !important;
    height: 70px !important;
    border-radius: var(--sharpi-radius) !important;
    overflow: hidden !important;
    background: var(--sharpi-gray-bg) !important;
    flex-shrink: 0 !important;
    position: relative !important;
    border: 1px solid var(--sharpi-gray-border) !important;
}

body.woocommerce-checkout .wc-block-components-order-summary-item__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    padding: 6px !important;
}

body.woocommerce-checkout .wc-block-components-order-summary-item__quantity {
    position: absolute !important;
    top: -8px !important;
    right: -8px !important;
    min-width: 24px !important;
    height: 24px !important;
    background: var(--sharpi-orange) !important;
    color: var(--sharpi-white) !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 6px !important;
    border: 2px solid var(--sharpi-white) !important;
}

body.woocommerce-checkout .wc-block-components-order-summary-item__description {
    flex: 1 !important;
    min-width: 0 !important;
}

body.woocommerce-checkout .wc-block-components-order-summary-item__description .wc-block-components-product-name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--sharpi-dark) !important;
    margin-bottom: 4px !important;
    display: block !important;
    line-height: 1.4 !important;
    word-break: break-word !important;
}

body.woocommerce-checkout .wc-block-components-order-summary-item__total-price {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--sharpi-orange) !important;
    text-align: right !important;
    flex-shrink: 0 !important;
}

/* Totals wrapper */
body.woocommerce-checkout .wc-block-components-totals-wrapper {
    padding: 16px 0 !important;
}

body.woocommerce-checkout .wc-block-components-totals-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 10px 0 !important;
    font-size: 14px !important;
    border-bottom: 1px solid var(--sharpi-gray-border) !important;
}

body.woocommerce-checkout .wc-block-components-totals-item:last-of-type {
    border-bottom: none !important;
}

body.woocommerce-checkout .wc-block-components-totals-item__label {
    color: var(--sharpi-text-light) !important;
    font-weight: 400 !important;
}

body.woocommerce-checkout .wc-block-components-totals-item__value {
    font-weight: 600 !important;
    color: var(--sharpi-dark) !important;
}

/* Free shipping indicator */
body.woocommerce-checkout .wc-block-components-totals-shipping__via {
    color: var(--sharpi-green) !important;
    font-weight: 600 !important;
}

/* Total footer */
body.woocommerce-checkout .wc-block-components-totals-footer-item {
    background: var(--sharpi-orange-soft) !important;
    margin: 20px -24px 0 !important;
    padding: 20px 24px !important;
    border-top: 2px solid var(--sharpi-orange) !important;
}

body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--sharpi-dark) !important;
}

body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
    font-size: 28px !important;
    font-weight: 800 !important;
    color: var(--sharpi-orange) !important;
}

/* Coupon section */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-coupon-form-block {
    padding: 16px 0 !important;
    border-top: 1px solid var(--sharpi-gray-border) !important;
    margin-top: 16px !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   9. CHECKOUT - ACTION BUTTONS
   ═══════════════════════════════════════════════════════════════════════════ */

/* Checkout actions container */
body.woocommerce-checkout .wp-block-woocommerce-checkout-actions-block,
body.woocommerce-checkout .wc-block-checkout__actions {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;
    padding: 0 !important;
    margin-top: 20px !important;
}

/* Place order button */
body.woocommerce-checkout .wc-block-components-checkout-place-order-button,
body.woocommerce-checkout #place_order {
    padding: 18px 40px !important;
    background: linear-gradient(135deg, var(--sharpi-orange), var(--sharpi-orange-hover)) !important;
    color: var(--sharpi-white) !important;
    border: none !important;
    border-radius: var(--sharpi-radius-pill) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    box-shadow: var(--sharpi-shadow-button) !important;
    width: 100% !important;
    display: block !important;
}

body.woocommerce-checkout .wc-block-components-checkout-place-order-button:hover,
body.woocommerce-checkout #place_order:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 28px rgba(255, 140, 0, 0.4) !important;
}

/* Return to cart link */
body.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button {
    color: var(--sharpi-text-light) !important;
    font-size: 14px !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    transition: color 0.2s ease !important;
}

body.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button:hover {
    color: var(--sharpi-orange) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   10. CHECKBOXES & FORM ELEMENTS
   ═══════════════════════════════════════════════════════════════════════════ */

body.woocommerce-checkout .wc-block-components-checkbox {
    margin: 12px 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
}

body.woocommerce-checkout .wc-block-components-checkbox__input[type="checkbox"] {
    accent-color: var(--sharpi-orange) !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
}

body.woocommerce-checkout .wc-block-components-checkbox__label {
    font-size: 14px !important;
    color: var(--sharpi-text) !important;
    line-height: 1.5 !important;
}

body.woocommerce-checkout .wc-block-components-checkbox__label a {
    color: var(--sharpi-orange) !important;
    text-decoration: underline !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   11. RESPONSIVE DESIGN - MOBILE & TABLET
   ═══════════════════════════════════════════════════════════════════════════ */

/* Tablet breakpoint (1200px) */
@media (max-width: 1200px) {
    body.woocommerce-cart .wp-block-woocommerce-filled-cart-block,
    body.woocommerce-cart .wc-block-cart,
    body.woocommerce-checkout .wc-block-checkout {
        grid-template-columns: minmax(0, 1.8fr) minmax(300px, 380px) !important;
        gap: 24px !important;
    }
    
    body.woocommerce-cart .wp-block-woocommerce-cart,
    body.woocommerce-checkout .wp-block-woocommerce-checkout {
        padding: 0 30px 50px !important;
    }
}

/* Tablet/Mobile breakpoint (992px) - Stack to single column */
@media (max-width: 992px) {
    body.woocommerce-cart .wp-block-woocommerce-filled-cart-block,
    body.woocommerce-cart .wc-block-cart,
    body.woocommerce-checkout .wc-block-checkout {
        display: flex !important;
        flex-direction: column !important;
        gap: 24px !important;
    }
    
    body.woocommerce-cart .wp-block-woocommerce-cart-totals-block,
    body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block {
        position: static !important;
        width: 100% !important;
    }
    
    body.woocommerce-cart .wp-block-woocommerce-cart,
    body.woocommerce-checkout .wp-block-woocommerce-checkout {
        padding: 0 24px 40px !important;
    }
}

/* Mobile breakpoint (768px) */
@media (max-width: 768px) {
    body.woocommerce-cart .wc-block-cart-items__row {
        display: flex !important;
        flex-wrap: wrap !important;
        padding: 16px !important;
        gap: 12px !important;
    }
    
    body.woocommerce-cart .wc-block-cart-item__image {
        width: 70px !important;
        height: 70px !important;
    }
    
    body.woocommerce-cart .wc-block-cart-item__product {
        flex: 1 1 calc(100% - 90px) !important;
        min-width: 0 !important;
    }
    
    body.woocommerce-cart .wc-block-cart-item__prices,
    body.woocommerce-cart .wc-block-cart-item__quantity,
    body.woocommerce-cart .wc-block-cart-item__total {
        flex: 1 1 auto !important;
        min-width: auto !important;
    }
    
    body.woocommerce-checkout .wc-block-components-checkout-place-order-button,
    body.woocommerce-checkout #place_order {
        width: 100% !important;
        padding: 16px !important;
        font-size: 16px !important;
    }
    
    body.woocommerce-checkout .wp-block-woocommerce-checkout-actions-block,
    body.woocommerce-checkout .wc-block-checkout__actions {
        flex-direction: column !important;
    }
    
    body.woocommerce-cart .wp-block-woocommerce-cart,
    body.woocommerce-checkout .wp-block-woocommerce-checkout {
        padding: 0 16px 30px !important;
    }
    
    body.woocommerce-cart,
    body.woocommerce-checkout {
        --sharpi-content-padding: 16px;
    }
}

/* Small mobile breakpoint (480px) */
@media (max-width: 480px) {
    body.woocommerce-cart .wc-block-cart-item__image {
        width: 60px !important;
        height: 60px !important;
    }
    
    body.woocommerce-cart .wc-block-components-quantity-selector__button {
        width: 32px !important;
        height: 32px !important;
        font-size: 16px !important;
    }
    
    body.woocommerce-cart .wc-block-components-quantity-selector__input {
        width: 40px !important;
        height: 32px !important;
        font-size: 14px !important;
    }
    
    body.woocommerce-cart .wc-block-components-totals-footer-item .wc-block-formatted-money-amount,
    body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
        font-size: 24px !important;
    }
    
    body.woocommerce-cart .entry-title,
    body.woocommerce-checkout .entry-title {
        font-size: 24px !important;
    }
}


/* ═══════════════════════════════════════════════════════════════════════════
   12. ADDITIONAL POLISH & REFINEMENTS
   ═══════════════════════════════════════════════════════════════════════════ */

/* Focus states for accessibility */
body.woocommerce-cart *:focus-visible,
body.woocommerce-checkout *:focus-visible {
    outline: 2px solid var(--sharpi-orange) !important;
    outline-offset: 2px !important;
}

/* Loading spinner */
body.woocommerce-cart .wc-block-components-spinner,
body.woocommerce-checkout .wc-block-components-spinner {
    border-color: var(--sharpi-orange) !important;
    border-top-color: transparent !important;
}

/* Smooth transitions */
body.woocommerce-cart .wc-block-components-button,
body.woocommerce-checkout .wc-block-components-button,
body.woocommerce-cart .wc-block-cart__submit-button,
body.woocommerce-checkout .wc-block-components-checkout-place-order-button {
    transition: all 0.3s ease !important;
}

/* Prevent layout shift on hover */
body.woocommerce-cart .wc-block-cart-items__row,
body.woocommerce-checkout .wc-block-components-radio-control__option {
    will-change: background-color !important;
}

/* Cross-sells section styling (appears in cart) */
body.woocommerce-cart .wp-block-woocommerce-product-collection {
    margin-top: 40px !important;
    padding: 30px !important;
    background: var(--sharpi-white) !important;
    border: 1px solid var(--sharpi-gray-border) !important;
    border-radius: var(--sharpi-radius-xl) !important;
    box-shadow: var(--sharpi-shadow-card) !important;
}

body.woocommerce-cart .wp-block-woocommerce-product-collection h2 {
    color: var(--sharpi-dark) !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    margin-bottom: 24px !important;
}

/* Empty cart state */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block {
    text-align: center !important;
    padding: 60px 30px !important;
}

body.woocommerce-cart .wp-block-woocommerce-empty-cart-block h2 {
    color: var(--sharpi-dark) !important;
    font-size: 24px !important;
    margin-bottom: 30px !important;
}

/* Error messages */
body.woocommerce-cart .wc-block-components-notice-banner.is-error,
body.woocommerce-checkout .wc-block-components-notice-banner.is-error {
    background: #fee2e2 !important;
    border-left: 4px solid var(--sharpi-red) !important;
    color: #991b1b !important;
}

/* Success messages */
body.woocommerce-cart .wc-block-components-notice-banner.is-success,
body.woocommerce-checkout .wc-block-components-notice-banner.is-success {
    background: #d1fae5 !important;
    border-left: 4px solid var(--sharpi-green) !important;
    color: #065f46 !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   END OF STYLESHEET
   ═══════════════════════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════════════════════════════════
   SHARPI CART — VISUAL CLEANUP (v6)
   Cel: jednoznaczny układ, brak „podwójnej ceny”, lepsza typografia i wyrównania
   ═══════════════════════════════════════════════════════════════════════════ */

/* 1) Kartę produktu robimy czytelną: IMAGE | OPIS | ILOŚĆ | SUMA */
body.woocommerce-cart .wc-block-cart-items__row{
  grid-template-columns: 92px minmax(320px, 1fr) 170px 140px !important;
  align-items: center !important;
  gap: 16px 18px !important;
  padding: 18px 22px !important;
  position: relative !important;
}

/* Jeżeli Woo Blocks wstawi „cenę jednostkową” jako osobną kolumnę – chowamy ją,
   bo i tak jest SUMA po prawej (u Ciebie wygląda to jak 2x ta sama cena). */
body.woocommerce-cart .wc-block-cart-item__prices{
  display: none !important;
}

/* Obrazek i opis */
body.woocommerce-cart .wc-block-cart-item__image{
  width: 92px !important;
  height: 92px !important;
  align-self: start !important;
}

body.woocommerce-cart .wc-block-cart-item__product{
  align-self: start !important;
}

body.woocommerce-cart .wc-block-cart-item__product a{
  font-size: 16px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* Meta pod tytułem (warianty, atrybuty) – spokojniejsze */
body.woocommerce-cart .wc-block-components-product-metadata,
body.woocommerce-cart .wc-block-components-product-details{
  font-size: 13px !important;
  line-height: 1.35 !important;
}

/* 2) Ilość – zawsze pośrodku i bez „rozjechania” */
body.woocommerce-cart .wc-block-cart-item__quantity{
  justify-content: center !important;
  min-width: 170px !important;
}

/* 3) Suma wiersza: wyraźnie, równo do prawej */
body.woocommerce-cart .wc-block-cart-item__total{
  font-size: 18px !important;
  font-weight: 800 !important;
  text-align: right !important;
  justify-self: end !important;
  min-width: 140px !important;
}

/* 4) „Usuń” jako dyskretny przycisk w prawym górnym rogu wiersza */
body.woocommerce-cart .wc-block-cart-item__remove-link{
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  padding: 6px 10px !important;
  font-size: 12px !important;
  border: 1px solid var(--sharpi-gray-border) !important;
  background: rgba(0,0,0,0.02) !important;
}

/* 5) Delikatne „card look” per wiersz (niech wygląda jak premium lista) */
body.woocommerce-cart .wc-block-cart-items__row{
  background: var(--sharpi-white) !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-items-block{
  padding: 6px !important;               /* robi odstęp na zaokrąglenia wierszy */
  background: transparent !important;    /* karta jest już na wrapperze */
  border: none !important;
  box-shadow: none !important;
}
body.woocommerce-cart .wc-block-cart-items{
  background: var(--sharpi-white) !important;
  border: 1px solid var(--sharpi-gray-border) !important;
  border-radius: var(--sharpi-radius-xl) !important;
  box-shadow: var(--sharpi-shadow-card) !important;
  padding: 8px !important;
}

/* każdy wiersz jako „karta” z oddechem */
body.woocommerce-cart .wc-block-cart-items__row{
  border: 1px solid var(--sharpi-gray-border) !important;
  border-radius: 14px !important;
  margin: 10px 0 !important;
  overflow: hidden !important;
}
body.woocommerce-cart .wc-block-cart-items__row:hover{
  background: rgba(0,0,0,0.015) !important;
}

/* 6) Podsumowanie: mocniejszy CTA + lepsza czytelność kwot */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block{
  border-radius: var(--sharpi-radius-xl) !important;
}
body.woocommerce-cart .wc-block-components-totals-item__label{
  font-size: 14px !important;
}
body.woocommerce-cart .wc-block-components-totals-item__value{
  font-size: 15px !important;
  font-weight: 700 !important;
}
body.woocommerce-cart .wc-block-components-totals-footer-item__label{
  font-size: 15px !important;
  font-weight: 800 !important;
}
body.woocommerce-cart .wc-block-components-totals-footer-item__value{
  font-size: 19px !important;
  font-weight: 900 !important;
}

body.woocommerce-cart .wc-block-cart__submit-button,
body.woocommerce-cart .wp-block-woocommerce-proceed-to-checkout-block a{
  font-size: 15px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
}

/* 7) Cross-sell / produkt-collection – większe miniatury i równa siatka */
body.woocommerce-cart .wp-block-woocommerce-product-collection{
  margin-top: 22px !important;
}
body.woocommerce-cart .wp-block-woocommerce-product-collection .wc-block-grid__products,
body.woocommerce-cart .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-template{
  gap: 14px !important;
}
body.woocommerce-cart .wp-block-woocommerce-product-collection .wc-block-grid__product,
body.woocommerce-cart .wp-block-woocommerce-product-collection .wp-block-post{
  border: 1px solid var(--sharpi-gray-border) !important;
  border-radius: 14px !important;
  padding: 12px !important;
  background: var(--sharpi-white) !important;
}

/* 8) Mobile: czytelny stacking bez chaosu */
@media (max-width: 860px){
  body.woocommerce-cart .wc-block-cart-items__row{
    grid-template-columns: 76px 1fr !important;
    gap: 12px 12px !important;
    padding: 14px 14px !important;
  }

  /* ilość + suma w jednej linii na dole */
  body.woocommerce-cart .wc-block-cart-item__quantity{
    grid-column: 1 / -1 !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    margin-top: 8px !important;
  }
  body.woocommerce-cart .wc-block-cart-item__total{
    grid-column: 1 / -1 !important;
    text-align: left !important;
    justify-self: start !important;
    margin-top: 6px !important;
  }

  body.woocommerce-cart .wc-block-cart-item__remove-link{
    top: 10px !important;
    right: 10px !important;
  }
}

/* ──────────────────────────────────────────────────────────────────────────
   OPCJA: jeśli jednak chcesz POKAZAĆ cenę jednostkową pod tytułem produktu:
   1) usuń (albo zakomentuj) display:none na .wc-block-cart-item__prices
   2) dodaj poniższe:

body.woocommerce-cart .wc-block-cart-item__prices{
  display: block !important;
  grid-column: 2 / 3 !important;
  text-align: left !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--sharpi-orange) !important;
  margin-top: 6px !important;
}

   ────────────────────────────────────────────────────────────────────────── */

