/*
 * HighHippy - WooCommerce Cart/Checkout Blocks styling
 *
 * Safe, theme-friendly enhancements:
 * - Consistent spacing and card surfaces
 * - Better input focus + label spacing
 * - More readable order summary
 * - Mobile submit container background alignment
 */

/* Layout container polish */
.wc-block-cart,
.wc-block-checkout {
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 16px;
	padding-right: 16px;
}

/* Reduce “wall of content” feeling */
.wc-block-checkout__main,
.wc-block-checkout__sidebar {
	gap: 16px;
}

/* Card-like panels */
.wc-block-components-panel,
.wc-block-components-checkout-step,
.wc-block-components-order-summary,
.wc-block-components-totals-wrapper,
.wc-block-components-notice-banner {
	border-radius: 14px;
}

/* Inputs */
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-select__control,
.wc-block-components-combobox-control__control {
	border-radius: 12px;
	min-height: 44px;
}

.wc-block-components-text-input label {
	font-weight: 600;
}

/* Make placeholder and helper text easier to read without forcing colors */
.wc-block-components-text-input__helper-text,
.wc-block-components-validation-error {
	font-size: 0.9em;
}

/* Buttons: align with theme buttons even if theme relies on .button */
.wc-block-components-button {
	border-radius: 999px;
	min-height: 44px;
	padding: 10px 18px;
	font-weight: 700;
}

/* Primary CTA row spacing */
.wc-block-checkout__actions_row,
.wc-block-cart__submit-container {
	margin-top: 16px;
}

/* Mobile sticky submit container background should follow page */
.wc-block-cart__submit-container {
	background: transparent;
}

/* Order summary: improve spacing and dividers */
.wc-block-components-order-summary-item {
	padding-top: 12px;
	padding-bottom: 12px;
}

.wc-block-components-order-summary-item__description {
	gap: 4px;
}

/* Quantity badge readability */
.wc-block-components-order-summary-item__quantity {
	border-radius: 999px;
	min-width: 22px;
	min-height: 22px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
}

/* Notices */
.wc-block-components-notice-banner {
	padding: 12px 14px;
}

/* Payment methods spacing */
.wc-block-checkout__payment-method {
	margin-top: 10px;
}
.wc-block-components-checkbox{margin-top:15px;}
/* Tighten up section headings */
.wc-block-components-checkout-step__title,
.wc-block-components-panel__button {
	letter-spacing: -0.01em;
}
/* Checkout Blocks: style "Place order" like the Cart "Proceed to Checkout" button */
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:hover,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:focus,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:active,
.wp-block-woocommerce-checkout button.wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-checkout button.wc-block-components-checkout-place-order-button:hover,
.wp-block-woocommerce-checkout button.wc-block-components-checkout-place-order-button:focus,
.wp-block-woocommerce-checkout button.wc-block-components-checkout-place-order-button:active {
  background: #212529 !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  border-radius: 0 !important;
  padding: 16px 22px !important;
}

/* Ensure inner text inherits the button color */
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button *,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button__text {
  color: inherit !important;
}

/* Optional: subtle hover */
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:hover {
  background: #111316 !important;
}
/* Make Place Order button wider */
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button {
  width: 100% !important;
  max-width: 520px; /* adjust up/down */
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Desktop: gently separate main + sidebar */
@media (min-width: 1000px) {
	.wc-block-checkout__main {
		padding-right: 8px;
	}
	.wc-block-checkout__sidebar {
		padding-left: 8px;
	}
}