/* ==========================================================================
   Cart and checkout -- CSS only, no template overrides.
   Both pages are classic shortcode pages, so the classic markup applies.
   ========================================================================== */

.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content { background: var(--millet-cream); }

/* Tables */
.woocommerce table.shop_table {
  border: 1px solid var(--millet-border);
  border-radius: var(--millet-radius);
  border-collapse: separate;
  background: var(--millet-card);
}
.woocommerce table.shop_table th { color: var(--millet-ink); font-weight: 700; }
.woocommerce table.shop_table td { border-top: 1px solid var(--millet-border); padding: 16px 12px; color: var(--millet-body); }
.woocommerce table.shop_table img { border-radius: 8px; }

/* Totals card */
.woocommerce .cart_totals,
.woocommerce-checkout #order_review {
  background: var(--millet-card);
  border: 1px solid var(--millet-border);
  border-radius: var(--millet-radius);
  box-shadow: var(--millet-shadow);
  padding: 22px;
}
@media (min-width: 981px) {
  .woocommerce .cart-collaterals .cart_totals { position: sticky; top: 110px; }
}

/* Buttons */
.woocommerce .checkout-button,
.woocommerce #place_order,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background: var(--millet-green);
  color: var(--millet-cream);
  border: 0;
  padding: 14px 22px;
}
.woocommerce .checkout-button:hover,
.woocommerce #place_order:hover,
.woocommerce button.button.alt:hover { background: var(--millet-green-dark); color: var(--millet-cream); }

/* Form fields */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container--default .select2-selection--single {
  background: var(--millet-card);
  border: 1px solid var(--millet-border);
  border-radius: 8px;
  padding: 12px 14px;
  color: var(--millet-ink);
  height: auto;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus { outline: 2px solid var(--millet-green); outline-offset: 1px; }
.woocommerce form .form-row label { color: var(--millet-ink); font-weight: 600; }

/* Notices */
.woocommerce-message,
.woocommerce-info { border-top-color: var(--millet-green); background: var(--millet-cream-deep); color: var(--millet-ink); }
.woocommerce-message::before,
.woocommerce-info::before { color: var(--millet-green); }
.woocommerce-error { border-top-color: #B3261E; background: var(--millet-cream-deep); }

/* --------------------------------------------------------------------------
   Mobile: collapse the cart table into stacked cards.
   WooCommerce already emits data-title on every <td>, so the row labels come
   from markup rather than being duplicated here.
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .woocommerce table.shop_table_responsive thead { display: none; }
  .woocommerce table.shop_table_responsive tr {
    display: block;
    margin-bottom: 14px;
    border: 1px solid var(--millet-border);
    border-radius: var(--millet-radius);
    background: var(--millet-card);
  }
  .woocommerce table.shop_table_responsive tr td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    text-align: right;
    border-top: 0;
    border-bottom: 1px solid var(--millet-border);
  }
  .woocommerce table.shop_table_responsive tr td:last-child { border-bottom: 0; }
  .woocommerce table.shop_table_responsive tr td::before {
    content: attr(data-title);
    font-weight: 700;
    color: var(--millet-ink);
    text-align: left;
  }
}

/* ==========================================================================
   Slide-in cart drawer.
   Colours come from the Astra options set in inc/palette.php. Only the two things
   Astra exposes no option for are handled here.
   ========================================================================== */

/* ASTRA-DEP: the close icon's colour is hard-coded to var(--ast-global-color-2) in
   Astra's dynamic CSS with no Customizer option behind it, so on the dark panel it
   sat at 1.59:1. The SVG uses fill="currentColor", so setting color is enough. */
.astra-cart-drawer .astra-cart-drawer-close {
  color: #fff;
}
.astra-cart-drawer .astra-cart-drawer-close:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
  border-radius: 4px;
}

/* ASTRA-DEP: Astra sets the drawer header's rule to
   `1px solid var(--ast-border-color)` -- and that custom property is never defined
   anywhere on the page, so it resolved to currentColor and the divider vanished. */
.astra-cart-drawer .astra-cart-drawer-header {
  border-bottom-color: rgba(255, 255, 255, .18);
}

/* ASTRA-DEP: on DESKTOP, Astra's header-woo-cart-text-color option only targets
   .ast-site-header-cart-data -- the header flyout widget. The drawer's own text is
   styled solely inside Astra's mobile and tablet blocks, which are wrapped in
   max-width media queries (dynamic.css.php:499-500). So above the tablet breakpoint no
   Customizer option reaches this panel at all and it has to be done here.

   Everything below is text sitting on the dark green drawer, so it all goes light. */
.astra-cart-drawer .astra-cart-drawer-header .astra-cart-drawer-title,
.astra-cart-drawer .widget_shopping_cart_content,
.astra-cart-drawer .widget_shopping_cart_content span,
.astra-cart-drawer .widget_shopping_cart_content strong,
.astra-cart-drawer .woocommerce-mini-cart__empty-message,
.astra-cart-drawer .woocommerce-mini-cart-item .quantity,
.astra-cart-drawer .woocommerce-Price-amount,
.astra-cart-drawer .woocommerce-Price-currencySymbol,
.astra-cart-drawer .woocommerce-mini-cart__total,
.astra-cart-drawer .woocommerce-mini-cart__total strong,
.astra-cart-drawer .woocommerce-mini-cart__total .woocommerce-Price-amount,
.astra-cart-drawer p.total,
.astra-cart-drawer p.total strong,
.woocommerce-js .astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__total,
.woocommerce-js .astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__total strong,
.astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart-item .variation dt,
.astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart-item .variation dd {
  color: #fff;
}

/* The remove link inherits nothing useful and its border was invisible. */
.astra-cart-drawer .woocommerce-mini-cart a.remove,
.astra-cart-drawer .widget_shopping_cart .mini_cart_item a.remove {
  color: #fff;
  border-color: rgba(255, 255, 255, .5);
}
.astra-cart-drawer .widget_shopping_cart .mini_cart_item a.remove:hover,
.astra-cart-drawer .widget_shopping_cart .mini_cart_item:hover > a.remove {
  color: var(--millet-green);
  background-color: #fff;
  border-color: #fff;
}

/* Item dividers and the subtotal rule fell back to currentColor. */
.astra-cart-drawer .astra-cart-drawer-content .widget_shopping_cart_content ul li,
.astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__total {
  border-color: rgba(255, 255, 255, .18);
}

/* Checkout is the primary action: inverted to a light fill so it has a visible edge
   against the dark panel, which a green-on-green button never had. */
.woocommerce-js .astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__buttons a.checkout,
.astra-cart-drawer .widget_shopping_cart_content a.button.checkout.wc-forward,
.woocommerce-js .astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__buttons a.button.ast-continue-shopping,
.astra-cart-drawer-content .ast-mini-cart-empty .woocommerce-mini-cart__buttons a.button {
  background-color: #fff;
  border-color: #fff;
  color: var(--millet-green);
}
.woocommerce-js .astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__buttons a.checkout:hover,
.woocommerce-js .astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__buttons a.button.ast-continue-shopping:hover,
.astra-cart-drawer-content .ast-mini-cart-empty .woocommerce-mini-cart__buttons a.button:hover {
  background-color: var(--millet-gold);
  border-color: var(--millet-gold);
  color: var(--millet-ink);
}

/* Product thumbnails need an edge of their own against a dark panel. */
.astra-cart-drawer .woocommerce-mini-cart-item img {
  border-radius: 6px;
}
