/*
Cart page (cart-2 / cart-3) styling.

This site's cart page uses the WooCommerce Cart *block* (Gutenberg /
Store API), not the classic [woocommerce_cart] shortcode — so the
standard woocommerce/cart/cart.php template override has no effect
here and is intentionally not used. Real markup uses .wc-block-cart-*
classes, confirmed against the live cart.css asset (wc-10.9.4).

NOTE: this file intentionally lives under /assets/css/, not
/woocommerce/ — this host's security rules block direct HTTP access
to any file under a theme's "woocommerce" folder (verified: even a
plain .txt there gets its connection reset), so a stylesheet placed
there would never load. The theme's /woocommerce/ folder is still the
right place for any future PHP *template* overrides, since those are
included by PHP and never requested directly by URL.

NOTE 2: this is cart-v2.css, not cart.css — shop.sunrise-divers.com
sits behind Cloudflare, and cart.css was somehow being served stale
(Cache-Control: public, max-age=31536000) even for requests carrying a
brand-new, never-before-seen query string, which should have forced a
cache miss. Renaming to a path nobody has ever cached sidesteps that
without needing dashboard access to purge Cloudflare. cart.css itself
is left in place, unreferenced, rather than deleted.

Loaded only on the cart page via functions.php (sd_shop_enqueue_cart_assets).
*/

.sd-shop-content-card .wp-block-woocommerce-cart {
  margin: 0 0 1rem;
}

.sd-shop-content-card .wc-block-cart .wc-block-components-sidebar-layout {
  gap: 1.75rem;
}

/* Cart items table */
.sd-shop-content-card .wc-block-cart-items {
  border-bottom-color: #e4eaf2 !important;
}

.sd-shop-content-card .wc-block-cart-items th,
.sd-shop-content-card .wc-block-cart-items td {
  border-top-color: #e4eaf2 !important;
}

.sd-shop-content-card .wc-block-cart-items__header th {
  color: var(--sd-blue-dark);
  font-weight: 700;
}

.sd-shop-content-card .wc-block-cart-items__row:hover {
  background: rgba(67, 117, 195, 0.04);
}

.sd-shop-content-card .wc-block-cart-item__image a {
  border-radius: 8px;
  overflow: hidden;
}

.sd-shop-content-card .wc-block-cart-item__image img {
  border: 1px solid #e4eaf2;
  border-radius: 8px;
}

.sd-shop-content-card .wc-block-components-product-name {
  color: var(--sd-blue-dark);
  font-weight: 700;
}

.sd-shop-content-card a.wc-block-components-product-name:hover {
  color: var(--sd-red);
}

.sd-shop-content-card .wc-block-components-product-metadata {
  color: var(--sd-gray);
}

.sd-shop-content-card .wc-block-components-product-price,
.sd-shop-content-card .wc-block-cart-item__total {
  color: var(--sd-blue-dark);
  font-weight: 700;
}

/* Quantity stepper */
.sd-shop-content-card .wc-block-components-quantity-selector {
  border-color: #d8e0ea;
  border-radius: 6px;
}

.sd-shop-content-card .wc-block-components-quantity-selector__button {
  color: var(--sd-blue-dark);
}

.sd-shop-content-card .wc-block-components-quantity-selector__input:focus {
  box-shadow: inset 0 0 0 2px var(--sd-blue);
}

/* Remove link */
.sd-shop-content-card .wc-block-cart-item__remove-link {
  color: var(--sd-gray) !important;
  font-weight: 600;
}

.sd-shop-content-card .wc-block-cart-item__remove-link:hover {
  color: var(--sd-red) !important;
}

/* Totals sidebar */
.sd-shop-content-card .wc-block-cart .wc-block-components-sidebar {
  background: #fff;
  border: 1px solid #e4eaf2;
  border-radius: 12px;
  box-shadow: 0 4px 18px rgba(0, 52, 154, 0.06);
  padding: 1.5rem !important;
}

.sd-shop-content-card .wc-block-cart__totals-title {
  color: var(--sd-blue-dark) !important;
  font-size: 1rem !important;
}

.sd-shop-content-card .wc-block-components-totals-item__value {
  color: var(--sd-blue-dark);
}

.sd-shop-content-card .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  color: var(--sd-blue-dark);
  font-weight: 800;
}

/* Coupon */
.sd-shop-content-card .wc-block-components-totals-coupon__input input {
  border-radius: 6px;
}

.sd-shop-content-card .wc-block-components-totals-coupon__button {
  background: #fff !important;
  border: 1px solid var(--sd-blue-dark) !important;
  color: var(--sd-blue-dark) !important;
}

.sd-shop-content-card .wc-block-components-totals-coupon__button:hover {
  background: var(--sd-blue-dark) !important;
  color: #fff !important;
}

/* Checkout button */
.sd-shop-content-card .wc-block-cart__submit-button {
  background: var(--sd-blue-dark) !important;
  border-color: var(--sd-blue-dark) !important;
  border-radius: 6px;
  font-weight: 700;
  letter-spacing: 0.03em;
  min-height: 3.2em !important;
  text-transform: uppercase;
}

.sd-shop-content-card .wc-block-cart__submit-button:hover {
  background: #002a7a !important;
  border-color: #002a7a !important;
}

/* Cross-sells */
.sd-shop-content-card .wp-block-woocommerce-cart-cross-sells-block .wp-block-heading {
  color: var(--sd-blue-dark);
}

.sd-shop-content-card .wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-price {
  color: var(--sd-blue-dark);
}

/* Empty cart state */
.sd-shop-content-card .wp-block-woocommerce-empty-cart-block {
  background: var(--sd-light);
  border-radius: 12px;
  padding: 2.5rem 1.5rem;
  text-align: center;
}

.sd-shop-content-card .wc-block-cart__empty-cart__title {
  color: var(--sd-blue-dark);
}

@media (min-width: 992px) {
  .sd-shop-content-card .wc-block-cart .wc-block-components-sidebar {
    position: sticky;
    top: 100px;
  }
}

/* Fix: WooCommerce's Cart block forces the product name link to
   max-width:max-content, so long titles refuse to wrap and stretch the
   row past the viewport, pushing the price off-screen on mobile. Let
   the name wrap normally and give grid items room to shrink. */
.sd-shop-content-card .wc-block-components-product-name {
  max-width: 100% !important;
  white-space: normal !important;
}

.sd-shop-content-card .wc-block-cart-items__row,
.sd-shop-content-card .wc-block-cart-item__product,
.sd-shop-content-card .wc-block-cart-item__total {
  min-width: 0 !important;
}

@media (max-width: 767.98px) {
  /* WooCommerce's own row layout relies on implicit/overlapping grid
     columns (a wide "product" column stretching underneath an overlaid
     "total" column) to pack image + name + price + remove-link into a
     compact desktop row. That trick falls apart on a narrow
     single-column layout: remove-link and the row total end up sharing
     a row with a large empty gap between them, reading as a
     disconnected, floating price. Replace it with an explicit layout
     instead of nudging the implicit one. */
  .sd-shop-content-card.sd-shop-content-card .wc-block-cart .wc-block-cart-items .wc-block-cart-items__row {
    column-gap: 0.85rem !important;
    display: grid !important;
    grid-template-areas: "image product" "image total" "image remove" !important;
    grid-template-columns: 72px 1fr !important;
    row-gap: 0.35rem !important;
  }

  .sd-shop-content-card .wc-block-cart-item__image {
    grid-area: image !important;
  }

  .sd-shop-content-card .wc-block-cart-item__image img {
    max-width: 72px;
  }

  .sd-shop-content-card.sd-shop-content-card .wc-block-cart .wc-block-cart-items .wc-block-cart-item__product {
    grid-area: product !important;
    min-width: 0 !important;
  }

  .sd-shop-content-card.sd-shop-content-card .wc-block-cart .wc-block-cart-items .wc-block-cart-item__quantity {
    grid-area: remove !important;
  }

  .sd-shop-content-card.sd-shop-content-card .wc-block-cart .wc-block-cart-items .wc-block-cart-item__total {
    grid-area: total !important;
    justify-content: flex-start !important;
    padding-top: 0 !important;
    text-align: left !important;
  }

  /* These are one-per-booking line items with no quantity stepper, so
     the price already shown next to the title is the row total —
     showing the dedicated total column too is a plain duplicate. Only
     drop it when there's genuinely no quantity selector to justify a
     separate total. */
  .sd-shop-content-card.sd-shop-content-card .wc-block-cart .wc-block-cart-items .wc-block-cart-items__row:not(:has(.wc-block-components-quantity-selector)) .wc-block-cart-item__total {
    display: none !important;
  }

  /* Icon-only remove control is a ~16px hit target by default — too
     small to tap reliably. Give it real touch-target size without
     changing its visual size. */
  .sd-shop-content-card .wc-block-cart-item__remove-link {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    margin: 0.35rem -0.5rem -0.5rem;
    min-height: 44px;
    min-width: 44px;
    padding: 0.5rem;
  }

  /* The items list and totals sidebar stack into a single column here,
     so the big desktop gap just reads as dead space; tighten it and
     let a top border carry the section break instead. */
  .sd-shop-content-card .wc-block-cart .wc-block-components-sidebar-layout {
    gap: 1.25rem;
  }

  .sd-shop-content-card .wc-block-cart .wc-block-components-sidebar {
    border-top: 3px solid var(--sd-blue-dark);
    padding: 1.25rem !important;
  }

  .sd-shop-content-card .wc-block-cart__totals-title {
    margin-bottom: 0.75rem !important;
  }
}
