/* H5 Mall WooCommerce Integration CSS
 * Scoped strictly to h5wc-account, h5wc-cart, h5wc-checkout, h5wc-shop
 * NO styles targeting single product pages or global button overrides
 */

:root {
  --h5wc-bg: #fff6f3;
  --h5wc-surface: rgba(255,255,255,.97);
  --h5wc-surface-soft: #fff0ea;
  --h5wc-border: rgba(255,74,67,.14);
  --h5wc-border-strong: rgba(255,74,67,.22);
  --h5wc-text: #2a2326;
  --h5wc-muted: #8c8791;
  --h5wc-accent: #ff4a43;
  --h5wc-accent-2: #f58a36;
  --h5wc-success: #83d442;
  --h5wc-radius: 22px;
  --h5wc-radius-sm: 14px;
  --h5wc-shadow: 0 1px 2px rgba(255,74,67,.03), 0 18px 45px rgba(255,74,67,.10);
}

/* ── Page backgrounds ──────────────────────── */
body.h5wc-account,
body.h5wc-cart,
body.h5wc-checkout,
body.h5wc-shop {
  background: radial-gradient(circle at top, rgba(255,74,67,.10), transparent 28%), radial-gradient(circle at right, rgba(245,138,54,.08), transparent 30%), var(--h5wc-bg);
  color: var(--h5wc-text);
}

/* ── Heading font ──────────────────────────── */
body.h5wc-account h1, body.h5wc-account h2, body.h5wc-account h3,
body.h5wc-cart h1,    body.h5wc-cart h2,    body.h5wc-cart h3,
body.h5wc-checkout h1,body.h5wc-checkout h2,body.h5wc-checkout h3,
body.h5wc-shop h1,    body.h5wc-shop h2,    body.h5wc-shop h3 {
  letter-spacing: -.02em;
  color: var(--h5wc-text);
}

/* ── Notices ───────────────────────────────── */
body.h5wc-account .woocommerce-notices-wrapper > *,
body.h5wc-account .woocommerce-message,
body.h5wc-account .woocommerce-info,
body.h5wc-account .woocommerce-error,
body.h5wc-cart    .woocommerce-notices-wrapper > *,
body.h5wc-cart    .woocommerce-message,
body.h5wc-cart    .woocommerce-info,
body.h5wc-cart    .woocommerce-error,
body.h5wc-checkout .woocommerce-notices-wrapper > *,
body.h5wc-checkout .woocommerce-message,
body.h5wc-checkout .woocommerce-info,
body.h5wc-checkout .woocommerce-error,
body.h5wc-shop    .woocommerce-notices-wrapper > *,
body.h5wc-shop    .woocommerce-message,
body.h5wc-shop    .woocommerce-info,
body.h5wc-shop    .woocommerce-error {
  background: #fff;
  border: 1px solid rgba(255,74,67,.18);
  border-top: 4px solid var(--h5wc-accent);
  box-shadow: var(--h5wc-shadow);
  border-radius: 16px;
  color: var(--h5wc-text);
}

/* ── Buttons — scoped ONLY to account/cart/checkout/shop, NOT product pages ── */
body.h5wc-account .button,
body.h5wc-account button.button,
body.h5wc-account input.button,
body.h5wc-account .added_to_cart,
body.h5wc-cart    .button,
body.h5wc-cart    button.button,
body.h5wc-cart    input.button,
body.h5wc-checkout .button,
body.h5wc-checkout button.button,
body.h5wc-checkout input.button,
body.h5wc-shop    .button,
body.h5wc-shop    button.button,
body.h5wc-shop    input.button,
body.h5wc-shop    .added_to_cart {
  background: linear-gradient(135deg, var(--h5wc-accent), var(--h5wc-accent-2)) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  min-height: 44px;
  padding: 12px 18px !important;
  box-shadow: 0 12px 24px rgba(255,74,67,.20);
}

body.h5wc-account .button.alt,
body.h5wc-cart    .button.alt,
body.h5wc-checkout .button.alt,
body.h5wc-shop    .button.alt {
  background: linear-gradient(135deg, var(--h5wc-accent), var(--h5wc-accent-2)) !important;
}

/* ── Inputs ────────────────────────────────── */
body.h5wc-account input.input-text,
body.h5wc-account textarea,
body.h5wc-account select,
body.h5wc-cart    input.input-text,
body.h5wc-cart    textarea,
body.h5wc-cart    select,
body.h5wc-checkout input.input-text,
body.h5wc-checkout textarea,
body.h5wc-checkout select,
body.h5wc-shop    input.input-text,
body.h5wc-shop    textarea,
body.h5wc-shop    select,
body.h5wc-checkout .select2-container--default .select2-selection--single,
body.h5wc-checkout .select2-container--default .select2-selection--multiple {
  background: #fff;
  border: 1px solid var(--h5wc-border-strong);
  border-radius: 14px;
  color: var(--h5wc-text);
  min-height: 48px;
}

/* ── My Account layout ─────────────────────── */
body.h5wc-account .woocommerce-MyAccount-navigation,
body.h5wc-account .woocommerce-MyAccount-content {
  background: var(--h5wc-surface);
  border: 1px solid var(--h5wc-border);
  border-radius: var(--h5wc-radius);
  box-shadow: var(--h5wc-shadow);
  padding: 22px;
}

body.h5wc-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

body.h5wc-account .woocommerce-MyAccount-navigation a {
  display: block;
  padding: 12px 14px;
  border-radius: 14px;
  text-decoration: none;
  color: var(--h5wc-text);
  background: linear-gradient(180deg, #ffffff, #fff6f3);
}

body.h5wc-account .woocommerce-MyAccount-navigation .is-active a,
body.h5wc-account .woocommerce-MyAccount-navigation a:hover {
  background: linear-gradient(135deg, var(--h5wc-accent), var(--h5wc-accent-2));
  color: rgba(255,255,255,.92);
}

body.h5wc-account .woocommerce-account .woocommerce-MyAccount-content > p:first-child,
body.h5wc-account .woocommerce-account .woocommerce-MyAccount-content > p:nth-child(2) {
  display: none;
}

body.h5wc-account .h5wc-dashboard-shell .h5p-container {
  max-width: none;
  padding: 0;
}

/* ── Tables ────────────────────────────────── */
body.h5wc-account table.shop_table,
body.h5wc-account table.woocommerce-MyAccount-orders,
body.h5wc-cart    table.shop_table,
body.h5wc-checkout table.shop_table {
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid var(--h5wc-border);
  background: #fff;
}

body.h5wc-account table.shop_table th,
body.h5wc-account table.shop_table td,
body.h5wc-account table.woocommerce-MyAccount-orders th,
body.h5wc-account table.woocommerce-MyAccount-orders td,
body.h5wc-cart    table.shop_table th,
body.h5wc-cart    table.shop_table td,
body.h5wc-checkout table.shop_table th,
body.h5wc-checkout table.shop_table td {
  border-color: var(--h5wc-border);
  color: var(--h5wc-text);
}

/* ── Cart ──────────────────────────────────── */
body.h5wc-cart .woocommerce-cart-form,
body.h5wc-cart .cart-collaterals,
body.h5wc-cart .cart_totals {
  background: var(--h5wc-surface);
  border: 1px solid var(--h5wc-border);
  border-radius: var(--h5wc-radius);
  box-shadow: var(--h5wc-shadow);
  padding: 22px;
}

body.h5wc-cart  .cart-collaterals { position: sticky; top: 24px; }

body.h5wc-cart .quantity .qty {
  min-height: 44px;
  border-radius: 999px;
  border: 1px solid var(--h5wc-border-strong);
}

/* ── Checkout ──────────────────────────────── */
/* Use float layout (theme-compatible) instead of grid */
body.h5wc-checkout form.checkout {
  display: block !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Clearfix */
body.h5wc-checkout form.checkout::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}

/* Left column: billing + additional info */
body.h5wc-checkout form.checkout > .col2-set,
body.h5wc-checkout form.checkout > .woocommerce-additional-fields {
  float: left !important;
  width: 56% !important;
  clear: left !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Right column: order review heading + order review */
body.h5wc-checkout form.checkout > #order_review_heading,
body.h5wc-checkout form.checkout > #order_review {
  float: right !important;
  width: 40% !important;
  clear: right !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Heading sits above the order review card */
body.h5wc-checkout form.checkout > #order_review_heading {
  margin: 0 0 22px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  font-size: 1.6rem !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  white-space: normal !important;
  width: 40% !important;
  float: right !important;
  clear: right !important;
}

/* Sticky order review on desktop */
body.h5wc-checkout form.checkout > #order_review {
  position: sticky;
  top: 24px;
}

/* Card styles */
body.h5wc-checkout .woocommerce-billing-fields,
body.h5wc-checkout .woocommerce-additional-fields,
body.h5wc-checkout #order_review {
  background: var(--h5wc-surface);
  border: 1px solid var(--h5wc-border);
  border-radius: var(--h5wc-radius);
  box-shadow: var(--h5wc-shadow);
  padding: 22px;
}

body.h5wc-checkout .woocommerce-billing-fields,
body.h5wc-checkout .woocommerce-additional-fields {
  margin-bottom: 22px;
}

body.h5wc-checkout .woocommerce-billing-fields:last-child,
body.h5wc-checkout .woocommerce-additional-fields:last-child {
  margin-bottom: 0;
}

/* Hide empty shipping containers to prevent blank cards */
body.h5wc-checkout .woocommerce-shipping-fields:empty,
body.h5wc-checkout .woocommerce-shipping-fields > .shipping_address:empty,
body.h5wc-checkout .woocommerce-shipping-fields[class*="hidden"],
body.h5wc-checkout .woocommerce-shipping-fields[style*="display: none"] {
  display: none !important;
}

/* If shipping fields exist inside .col2-set, style them */
body.h5wc-checkout .woocommerce-shipping-fields {
  margin-top: 22px;
}

body.h5wc-checkout .woocommerce-checkout-review-order-table tbody td,
body.h5wc-checkout .woocommerce-checkout-review-order-table tfoot td,
body.h5wc-checkout .woocommerce-checkout-review-order-table tfoot th {
  padding: 12px 0;
}

body.h5wc-checkout .woocommerce-checkout-payment {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--h5wc-border);
}

body.h5wc-checkout #place_order {
  width: 100%;
  margin-top: 12px;
  font-size: 1.05rem;
  letter-spacing: 0.01em;
}

body.h5wc-checkout .woocommerce-form-coupon-toggle {
  background: var(--h5wc-surface);
  border: 1px solid var(--h5wc-border);
  border-radius: var(--h5wc-radius);
  box-shadow: var(--h5wc-shadow);
  padding: 14px 18px;
  margin-bottom: 22px;
}

body.h5wc-checkout .woocommerce-form-coupon-toggle a {
  color: var(--h5wc-accent);
  text-decoration: none;
  font-weight: 600;
}

body.h5wc-checkout .woocommerce-form-coupon {
  background: var(--h5wc-surface-soft);
  border: 1px dashed var(--h5wc-border-strong);
  border-radius: var(--h5wc-radius-sm);
  padding: 18px;
  margin-bottom: 22px;
}

body.h5wc-checkout .woocommerce-form-coupon .form-row {
  margin-bottom: 0;
  padding: 0;
}

body.h5wc-checkout .woocommerce-form-coupon input.input-text {
  min-height: 44px;
}

/* ── Shop ──────────────────────────────────── */
body.h5wc-shop .woocommerce-result-count,
body.h5wc-shop .woocommerce-ordering {
  background: var(--h5wc-surface);
  border: 1px solid var(--h5wc-border);
  border-radius: var(--h5wc-radius);
  box-shadow: var(--h5wc-shadow);
  padding: 14px 18px;
}

body.h5wc-shop .woocommerce-ordering select { min-height: 42px; }

body.h5wc-shop ul.products {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
  margin: 0;
}

body.h5wc-shop ul.products.columns-2,
body.h5wc-shop ul.products.columns-3,
body.h5wc-shop ul.products.columns-4,
body.h5wc-shop ul.products.columns-5,
body.h5wc-shop ul.products.columns-6 {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

body.h5wc-shop ul.products li.product {
  margin: 0 !important;
  padding: 16px 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: var(--h5wc-surface);
  border: 1px solid var(--h5wc-border);
  border-radius: var(--h5wc-radius);
  box-shadow: var(--h5wc-shadow);
  transition: transform .18s ease, box-shadow .18s ease;
}

body.h5wc-shop ul.products li.product:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 42px rgba(15,23,42,.10);
}

body.h5wc-shop ul.products li.product .woocommerce-loop-product__title {
  font-size: 1.1rem;
  line-height: 1.25;
  color: var(--h5wc-text);
}

body.h5wc-shop ul.products li.product .price {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--h5wc-accent);
}

body.h5wc-shop ul.products li.product .button {
  margin-top: auto;
  width: 100%;
  text-align: center;
  justify-content: center;
}

body.h5wc-shop ul.products li.product a img {
  border-radius: 18px;
}

body.h5wc-shop .woocommerce-pagination ul.page-numbers,
body.h5wc-shop .woocommerce-pagination ul.page-numbers li {
  border-color: var(--h5wc-border);
}

body.h5wc-shop .woocommerce-pagination ul.page-numbers li .page-numbers {
  min-width: 42px;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.h5wc-shop .widget {
  background: var(--h5wc-surface);
  border: 1px solid var(--h5wc-border);
  border-radius: var(--h5wc-radius);
  box-shadow: var(--h5wc-shadow);
  padding: 22px;
}

/* ── Product share button (all pages) ──────── */
.h5-product-share .h5-product-share-popup a,
.h5-product-share .h5-product-share-popup button {
  /* Prevent WC button styles from leaking into the share popup */
  min-height: unset !important;
  border-radius: 8px !important;
  padding: unset !important;
  box-shadow: none !important;
}

/* ── Responsive ────────────────────────────── */
@media (max-width: 1100px) {
  body.h5wc-checkout form.checkout > .col2-set,
  body.h5wc-checkout form.checkout > .woocommerce-additional-fields,
  body.h5wc-checkout form.checkout > #order_review_heading,
  body.h5wc-checkout form.checkout > #order_review {
    width: 100% !important;
    float: none !important;
    clear: both !important;
  }
  body.h5wc-cart    .cart-collaterals,
  body.h5wc-checkout #order_review {
    position: static;
  }
}

@media (max-width: 980px) {
  body.h5wc-account .woocommerce { display: block; }
  body.h5wc-account .woocommerce-MyAccount-navigation,
  body.h5wc-account .woocommerce-MyAccount-content {
    width: 100%;
    float: none;
  }
  body.h5wc-shop ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  body.h5wc-account .woocommerce-MyAccount-navigation,
  body.h5wc-account .woocommerce-MyAccount-content,
  body.h5wc-cart    .woocommerce-cart-form,
  body.h5wc-cart    .cart-collaterals,
  body.h5wc-checkout form.checkout,
  body.h5wc-checkout #order_review,
  body.h5wc-shop    ul.products li.product {
    padding: 16px;
    border-radius: 18px;
  }
  body.h5wc-shop ul.products {
    grid-template-columns: 1fr;
  }
}


/* H5 Mall coral/orange palette refinements */
body.h5wc-account a,
body.h5wc-cart a,
body.h5wc-checkout a,
body.h5wc-shop a { color: var(--h5wc-accent); }
body.h5wc-account a:hover,
body.h5wc-cart a:hover,
body.h5wc-checkout a:hover,
body.h5wc-shop a:hover { color: rgba(255,255,255,.86); }
body.h5wc-account .button:hover,
body.h5wc-account button.button:hover,
body.h5wc-account input.button:hover,
body.h5wc-cart .button:hover,
body.h5wc-cart button.button:hover,
body.h5wc-cart input.button:hover,
body.h5wc-checkout .button:hover,
body.h5wc-checkout button.button:hover,
body.h5wc-checkout input.button:hover,
body.h5wc-shop .button:hover,
body.h5wc-shop button.button:hover,
body.h5wc-shop input.button:hover,
body.h5wc-shop .added_to_cart:hover { color: rgba(255,255,255,.86) !important; filter: brightness(.98); }
body.h5wc-account input.input-text:focus,
body.h5wc-account textarea:focus,
body.h5wc-account select:focus,
body.h5wc-cart input.input-text:focus,
body.h5wc-cart textarea:focus,
body.h5wc-cart select:focus,
body.h5wc-checkout input.input-text:focus,
body.h5wc-checkout textarea:focus,
body.h5wc-checkout select:focus,
body.h5wc-shop input.input-text:focus,
body.h5wc-shop textarea:focus,
body.h5wc-shop select:focus { border-color: rgba(255,74,67,.38); box-shadow: 0 0 0 4px rgba(255,74,67,.10); outline: none; }
body.h5wc-shop .woocommerce-pagination ul.page-numbers li .page-numbers.current,
body.h5wc-shop .woocommerce-pagination ul.page-numbers li .page-numbers:hover { background: linear-gradient(135deg, var(--h5wc-accent), var(--h5wc-accent-2)); color: rgba(255,255,255,.92); }
body.h5wc-shop ul.products li.product:hover { box-shadow: 0 18px 42px rgba(255,74,67,.14); }