/* ==========================================================================
   Phoenix BioLabs — Cart Page
   Matches PH-redesign/checkout.html prototype.
   Last modified: 2026-03-03
   ========================================================================== */

/* ---- Main content width: match header ---- */
body.woocommerce-cart #primary,
body.woocommerce-cart main#main {
    max-width: var(--ph-max-width, 1280px) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--ph-gutter, 1.5rem) !important;
    padding-right: var(--ph-gutter, 1.5rem) !important;
}

/* ---- Page header (prototype: CHECKOUT style) ---- */
body.woocommerce-cart .woocommerce {
    padding: 3rem 0 6rem 0 !important;
}

body.woocommerce-cart .entry-title,
body.woocommerce-cart .woocommerce h1 {
    font-family: var(--ph-font-display) !important;
    font-size: 2rem !important;
    letter-spacing: 0.1em !important;
    text-align: center !important;
    margin-bottom: 2rem !important;
    color: var(--ph-text) !important;
}

@media (min-width: 768px) {
    body.woocommerce-cart .entry-title,
    body.woocommerce-cart .woocommerce h1 {
        font-size: 2.25rem !important;
    }
}

/* ---- Empty cart state ---- */
body.woocommerce-cart .cart-empty.woocommerce-info {
    background: transparent !important;
    border: none !important;
    padding: 2rem 0 !important;
    margin-bottom: 0 !important;
}

body.woocommerce-cart .cart-empty {
    display: block !important;
    font-family: var(--ph-font-display) !important;
    font-size: 1.5rem !important;
    letter-spacing: 0.1em !important;
    text-align: center !important;
    margin-bottom: 0 !important;
    color: var(--ph-text) !important;
}

body.woocommerce-cart .return-to-shop {
    text-align: center !important;
    margin-top: 2rem !important;
}

body.woocommerce-cart .return-to-shop .button {
    display: inline-block !important;
    padding: 1rem 2.5rem !important;
    background: #000000 !important;
    color: #ffffff !important;
    font-family: var(--ph-font-sans) !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    text-decoration: none !important;
    border: none !important;
    border-radius: 0 !important;
    transition: all var(--ph-trans-base) !important;
}

body.woocommerce-cart .return-to-shop .button:hover {
    background: var(--ph-primary) !important;
    color: #ffffff !important;
}

html.dark body.woocommerce-cart .return-to-shop .button {
    background: #ffffff !important;
    color: #000000 !important;
}

html.dark body.woocommerce-cart .return-to-shop .button:hover {
    background: var(--ph-primary) !important;
    color: #ffffff !important;
}

/* ---- Cart with items: layout ---- */
body.woocommerce-cart .woocommerce-cart-form {
    margin-bottom: 2rem !important;
}

body.woocommerce-cart .cart-collaterals {
    margin-top: 2rem !important;
}

@media (min-width: 1024px) {
    body.woocommerce-cart .woocommerce:has(.woocommerce-cart-form) {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 2rem !important;
    }

    body.woocommerce-cart .woocommerce-cart-form {
        grid-column: 1 !important;
    }

    body.woocommerce-cart .cart-collaterals {
        grid-column: 2 !important;
        margin-top: 0 !important;
    }
}

/* ---- Cart table ---- */
body.woocommerce-cart .woocommerce-cart-form__contents {
    width: 100% !important;
    border-collapse: collapse !important;
    margin-bottom: 2rem !important;
}

body.woocommerce-cart .woocommerce-cart-form__contents th,
body.woocommerce-cart .woocommerce-cart-form__contents td {
    padding: 1.25rem 1rem !important;
    border-bottom: 1px solid var(--ph-zinc-200) !important;
    font-family: var(--ph-font-sans) !important;
    vertical-align: middle !important;
}

html.dark body.woocommerce-cart .woocommerce-cart-form__contents th,
html.dark body.woocommerce-cart .woocommerce-cart-form__contents td {
    border-bottom-color: var(--ph-zinc-800) !important;
}

body.woocommerce-cart .woocommerce-cart-form__contents thead th {
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    color: var(--ph-zinc-500) !important;
    background: var(--ph-zinc-50) !important;
    border-top: 1px solid var(--ph-zinc-200) !important;
}

html.dark body.woocommerce-cart .woocommerce-cart-form__contents thead th {
    background: var(--ph-zinc-900) !important;
    border-top-color: var(--ph-zinc-800) !important;
}

body.woocommerce-cart .woocommerce-cart-form__contents .product-name a {
    color: var(--ph-text) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    font-size: 0.9375rem !important;
}

body.woocommerce-cart .woocommerce-cart-form__contents .product-name a:hover {
    color: var(--ph-primary) !important;
}

body.woocommerce-cart .woocommerce-cart-form__contents .product-thumbnail img {
    width: 5rem !important;
    height: auto !important;
    border: 1px solid var(--ph-zinc-100) !important;
}

html.dark body.woocommerce-cart .woocommerce-cart-form__contents .product-thumbnail img {
    border-color: var(--ph-zinc-800) !important;
}

body.woocommerce-cart .woocommerce-cart-form__contents .product-remove a {
    color: var(--ph-zinc-400) !important;
    font-size: 1.25rem !important;
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 2rem !important;
    height: 2rem !important;
    border: 1px solid var(--ph-zinc-200) !important;
    transition: all var(--ph-trans-base) !important;
}

html.dark body.woocommerce-cart .woocommerce-cart-form__contents .product-remove a {
    border-color: var(--ph-zinc-800) !important;
}

body.woocommerce-cart .woocommerce-cart-form__contents .product-remove a:hover {
    color: #ffffff !important;
    background: #dc2626 !important;
    border-color: #dc2626 !important;
}

body.woocommerce-cart .woocommerce-cart-form__contents .product-price,
body.woocommerce-cart .woocommerce-cart-form__contents .product-subtotal {
    font-weight: 500 !important;
    color: var(--ph-text) !important;
}

/* ---- Quantity input ---- */
body.woocommerce-cart .woocommerce-cart-form__contents .quantity input.qty {
    width: 4.5rem !important;
    height: 3rem !important;
    padding: 0.5rem !important;
    text-align: center !important;
    font-family: var(--ph-font-sans) !important;
    font-weight: 600 !important;
    background: var(--ph-zinc-50) !important;
    border: 1px solid var(--ph-zinc-200) !important;
    border-radius: 0 !important;
}

html.dark body.woocommerce-cart .woocommerce-cart-form__contents .quantity input.qty {
    background: var(--ph-charcoal) !important;
    border-color: var(--ph-zinc-800) !important;
    color: #ffffff !important;
}

/* ---- Cart actions (Update cart button) ---- */
body.woocommerce-cart .woocommerce-cart-form .actions {
    padding: 2rem 0 !important;
    text-align: right !important;
}

body.woocommerce-cart .woocommerce-cart-form .button {
    padding: 1rem 2.5rem !important;
    background: #000000 !important;
    color: #ffffff !important;
    font-family: var(--ph-font-sans) !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    border: none !important;
    border-radius: 0 !important;
    transition: all var(--ph-trans-base) !important;
}

body.woocommerce-cart .woocommerce-cart-form .button[name="update_cart"] {
    background: var(--ph-zinc-200) !important;
    color: #000000 !important;
}

html.dark body.woocommerce-cart .woocommerce-cart-form .button[name="update_cart"] {
    background: var(--ph-zinc-800) !important;
    color: #ffffff !important;
}

body.woocommerce-cart .woocommerce-cart-form .button:hover {
    background: var(--ph-primary) !important;
    color: #ffffff !important;
}

html.dark body.woocommerce-cart .woocommerce-cart-form .button {
    background: #ffffff !important;
    color: #000000 !important;
}

html.dark body.woocommerce-cart .woocommerce-cart-form .button:hover {
    background: var(--ph-primary) !important;
    color: #ffffff !important;
}

/* Cross-sells (You may be interested in...) */
body.woocommerce-cart .cross-sells {
    margin-top: 4rem !important;
    padding-top: 4rem !important;
    border-top: 1px solid var(--ph-zinc-200) !important;
    grid-column: 1 / -1 !important;
}

html.dark body.woocommerce-cart .cross-sells {
    border-top-color: var(--ph-zinc-800) !important;
}

body.woocommerce-cart .cross-sells h2 {
    font-family: var(--ph-font-display) !important;
    font-size: 1.5rem !important;
    text-align: center !important;
    margin-bottom: 3rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
}

body.woocommerce-cart .cross-sells ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    gap: 2rem !important;
    list-style: none !important;
    padding: 0 !important;
}

body.woocommerce-cart .cross-sells ul.products li.product {
    background: var(--ph-zinc-50) !important;
    border: 1px solid var(--ph-zinc-200) !important;
    padding: 1.5rem !important;
    text-align: center !important;
}

html.dark body.woocommerce-cart .cross-sells ul.products li.product {
    background: var(--ph-charcoal) !important;
    border-color: var(--ph-zinc-800) !important;
}

body.woocommerce-cart .cross-sells ul.products li.product img {
    margin-bottom: 1rem !important;
    border: 1px solid var(--ph-zinc-100) !important;
}

body.woocommerce-cart .cross-sells ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--ph-font-display) !important;
    font-size: 0.875rem !important;
    margin-bottom: 0.5rem !important;
}

body.woocommerce-cart .cross-sells ul.products li.product .price {
    font-size: 0.9375rem !important;
    color: var(--ph-primary) !important;
    margin-bottom: 1rem !important;
    display: block !important;
}

/* Loyalty points message styling */
body.woocommerce-cart .wlr-cart-loyalty-message,
body.woocommerce-cart [class*="wlr-"] {
    background: #ffffff !important;
    border: 1px solid var(--ph-zinc-200) !important;
    padding: 1.25rem !important;
    margin-bottom: 2rem !important;
    font-size: 0.8125rem !important;
    color: var(--ph-zinc-600) !important;
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
}

html.dark body.woocommerce-cart .wlr-cart-loyalty-message,
html.dark body.woocommerce-cart [class*="wlr-"] {
    background: var(--ph-charcoal) !important;
    border-color: var(--ph-zinc-800) !important;
    color: var(--ph-zinc-400) !important;
}

/* ---- Coupon form ---- */
body.woocommerce-cart .coupon {
    display: flex !important;
    gap: 0.75rem !important;
    margin-bottom: 0 !important;
    float: left !important;
}

body.woocommerce-cart .coupon input[type="text"] {
    width: 12rem !important;
    padding: 0.75rem 1rem !important;
    font-family: var(--ph-font-sans) !important;
    font-size: 0.8125rem !important;
    background: var(--ph-zinc-50) !important;
    border: 1px solid var(--ph-zinc-200) !important;
    border-radius: 0 !important;
}

html.dark body.woocommerce-cart .coupon input[type="text"] {
    background: var(--ph-charcoal) !important;
    border-color: var(--ph-zinc-800) !important;
    color: #ffffff !important;
}

body.woocommerce-cart .coupon .button {
    background: #000000 !important;
    color: #ffffff !important;
}

html.dark body.woocommerce-cart .coupon .button {
    background: #ffffff !important;
    color: #000000 !important;
}

/* ---- Cart totals (prototype: Order Summary style) ---- */
body.woocommerce-cart .cart_totals {
    background: var(--ph-zinc-50) !important;
    border: 1px solid var(--ph-zinc-200) !important;
    padding: 2rem !important;
    width: 100% !important;
}

html.dark body.woocommerce-cart .cart_totals {
    background: var(--ph-charcoal) !important;
    border-color: var(--ph-zinc-800) !important;
}

body.woocommerce-cart .cart_totals h2 {
    font-family: var(--ph-font-display) !important;
    font-size: 1.125rem !important;
    letter-spacing: 0.1em !important;
    margin-bottom: 1.5rem !important;
    color: var(--ph-text) !important;
    text-transform: uppercase !important;
}

body.woocommerce-cart .cart_totals table {
    width: 100% !important;
    margin-bottom: 1.5rem !important;
}

body.woocommerce-cart .cart_totals th,
body.woocommerce-cart .cart_totals td {
    padding: 1rem 0 !important;
    font-family: var(--ph-font-sans) !important;
    font-size: 0.8125rem !important;
    border-bottom: 1px solid var(--ph-zinc-200) !important;
    vertical-align: top !important;
}

html.dark body.woocommerce-cart .cart_totals th,
html.dark body.woocommerce-cart .cart_totals td {
    border-bottom-color: var(--ph-zinc-800) !important;
}

body.woocommerce-cart .cart_totals th {
    font-size: 0.625rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    color: var(--ph-zinc-500) !important;
    width: 35% !important;
}

body.woocommerce-cart .cart_totals .order-total th,
body.woocommerce-cart .cart_totals .order-total td {
    font-size: 1rem !important;
    font-weight: 700 !important;
    padding-top: 1.5rem !important;
    border-bottom: none !important;
}

/* Shipping calculator and details styling */
body.woocommerce-cart .woocommerce-shipping-destination,
body.woocommerce-cart .woocommerce-shipping-totals {
    font-size: 0.75rem !important;
    line-height: 1.5 !important;
    color: var(--ph-zinc-500) !important;
}

body.woocommerce-cart .shipping-calculator-button {
    font-size: 0.6875rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: var(--ph-primary) !important;
    text-decoration: none !important;
}

/* Proceed to checkout button */
body.woocommerce-cart .cart_totals .wc-proceed-to-checkout {
    margin-top: 1.5rem !important;
    padding: 0 !important;
}

body.woocommerce-cart .cart_totals .checkout-button {
    display: block !important;
    width: 100% !important;
    padding: 1.25rem 2rem !important;
    background: #000000 !important;
    color: #ffffff !important;
    font-family: var(--ph-font-sans) !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.2em !important;
    text-align: center !important;
    text-decoration: none !important;
    border: none !important;
    border-radius: 0 !important;
    transition: all var(--ph-trans-base) !important;
}

body.woocommerce-cart .cart_totals .checkout-button:hover {
    background: var(--ph-primary) !important;
    color: #ffffff !important;
}

html.dark body.woocommerce-cart .cart_totals .checkout-button {
    background: #ffffff !important;
    color: #000000 !important;
}

html.dark body.woocommerce-cart .cart_totals .checkout-button:hover {
    background: var(--ph-primary) !important;
    color: #ffffff !important;
}

/* Free shipping notice inside totals */
body.woocommerce-cart .cart_totals .free-shipping-notice,
body.woocommerce-cart .cart_totals [class*="free-shipping"] {
    background: var(--ph-zinc-100) !important;
    padding: 1rem !important;
    margin: 1rem 0 !important;
    text-align: center !important;
    font-size: 0.75rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    color: var(--ph-primary) !important;
}

html.dark body.woocommerce-cart .cart_totals .free-shipping-notice,
html.dark body.woocommerce-cart .cart_totals [class*="free-shipping"] {
    background: rgba(255, 255, 255, 0.05) !important;
}

/* ---- Coupon form ---- */
body.woocommerce-cart .coupon {
    display: flex !important;
    gap: 0.5rem !important;
    margin-bottom: 1rem !important;
}

body.woocommerce-cart .coupon input[type="text"] {
    flex: 1 !important;
    padding: 0.75rem 1rem !important;
    font-family: var(--ph-font-sans) !important;
    background: var(--ph-zinc-50) !important;
    border: 1px solid var(--ph-zinc-200) !important;
    border-radius: 0 !important;
}

html.dark body.woocommerce-cart .coupon input[type="text"] {
    background: var(--ph-zinc-900) !important;
    border-color: var(--ph-zinc-800) !important;
    color: #ffffff !important;
}

/* ---- WooCommerce notices on cart ---- */
body.woocommerce-cart .woocommerce-info,
body.woocommerce-cart .woocommerce-message,
body.woocommerce-cart .woocommerce-error {
    background: var(--ph-zinc-100) !important;
    border: 1px solid var(--ph-zinc-200) !important;
    padding: 1rem 1.5rem !important;
    font-family: var(--ph-font-sans) !important;
    font-size: 0.875rem !important;
    margin-bottom: 1.5rem !important;
}

html.dark body.woocommerce-cart .woocommerce-info,
html.dark body.woocommerce-cart .woocommerce-message {
    background: var(--ph-zinc-900) !important;
    border-color: var(--ph-zinc-800) !important;
}
