/**
 * Cart + Checkout blocks (and My account) in the Phonehub design system.
 * The pages keep WooCommerce's Cart/Checkout blocks (single-page checkout, payment
 * gateway compatibility); this file only restyles their markup.
 */

.woocommerce-cart .site-main > article > h1,
.woocommerce-checkout .site-main > article > h1,
.woocommerce-account .site-main > article > h1 {
	margin-bottom: var(--sp-6);
	font-size: var(--fs-h2);
	line-height: 1.1;
	letter-spacing: -0.03em;
}

.wc-block-cart,
.wc-block-checkout {
	font-family: var(--fb);
	color: var(--c-text);
}

/* Headings */

.wc-block-components-checkout-step__title,
.wc-block-components-title.wc-block-components-title,
.wc-block-components-checkout-order-summary__title-text {
	font-family: var(--fd);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.wc-block-cart__totals-title.wc-block-cart__totals-title,
.wc-block-cart-items__header {
	color: var(--c-muted);
	font-size: var(--fs-caption);
	font-weight: 600;
	letter-spacing: 0.06em;
}

/* Text inputs and selects */

.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-textarea {
	border: 1.5px solid var(--c-input-line) !important;
	border-radius: var(--r-sm) !important;
	background: var(--c-surface) !important;
	color: var(--c-text) !important;
	box-shadow: none;
	font-family: var(--fb) !important;
}

.wc-block-components-text-input input:focus,
.wc-block-components-text-input textarea:focus,
.wc-blocks-components-select .wc-blocks-components-select__select:focus,
.wc-block-components-textarea:focus {
	border-color: var(--c-text) !important;
	outline: none !important;
	box-shadow: 0 0 0 3px var(--c-focus-ring) !important;
}

.wc-block-components-text-input.has-error input,
.wc-blocks-components-select.has-error .wc-blocks-components-select__select {
	border-color: var(--c-danger) !important;
}

.wc-block-components-validation-error {
	color: var(--c-danger-ink);
	font-size: 13px;
}

.wc-block-components-text-input label,
.wc-blocks-components-select__label {
	color: var(--c-muted) !important;
}

/* Checkbox + radio cards (shipping, payment) */

.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
	border: 1.5px solid var(--c-input-line);
	border-radius: var(--r-xs);
}

.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
	border-color: var(--c-text);
	background: var(--c-text);
}

.wc-block-components-checkbox .wc-block-components-checkbox__mark {
	fill: var(--c-on-ink);
}

.wc-block-components-radio-control--highlight-checked,
.wc-block-checkout__payment-method .wc-block-components-radio-control {
	border-radius: var(--r-sm);
}

.wc-block-components-radio-control--highlight-checked::after,
.wc-block-components-radio-control__option--checked-option-highlighted,
.wc-block-components-radio-control-accordion-option--checked-option-highlighted {
	border-color: var(--c-text) !important;
	border-radius: var(--r-sm) !important;
	box-shadow: inset 0 0 0 1.5px var(--c-text) !important;
}

.wc-block-components-radio-control__input:checked {
	border-color: var(--c-text);
}

.wc-block-components-radio-control__input:checked::before {
	background: var(--c-text);
}

.wc-block-components-radio-control__label,
.wc-block-components-payment-method-label {
	font-weight: 600;
}

/* Buttons: primary = orange fill, black text */

.wc-block-components-button:not(.is-link) {
	min-height: var(--btn-h-lg);
	padding: 0 28px;
	border: 0 !important;
	border-radius: var(--r-pill) !important;
	background: var(--c-primary) !important;
	color: var(--c-on-primary) !important;
	font-family: var(--fb);
	font-size: var(--fs-body);
	font-weight: 700;
	transition: transform var(--dur-btn) var(--ease), box-shadow var(--dur-btn), background var(--dur-fast);
}

.wc-block-components-button:not(.is-link):hover {
	background: var(--c-primary-hover) !important;
	box-shadow: var(--sh-btn-primary);
	transform: translateY(-2px);
}

.wc-block-components-button:not(.is-link):active {
	background: var(--c-primary-press) !important;
	box-shadow: none;
	transform: translateY(1px);
}

.wc-block-components-button:not(.is-link):focus-visible {
	outline: 2px solid var(--c-text) !important;
	outline-offset: 3px;
}

.wc-block-components-button:not(.is-link):disabled {
	opacity: .6;
	transform: none;
	box-shadow: none;
}

/* Coupon "Apply" is secondary (ink) */
.wc-block-components-totals-coupon__button.wc-block-components-button {
	min-height: 48px;
	background: var(--c-text) !important;
	color: var(--c-on-ink) !important;
}

.wc-block-components-totals-coupon__button.wc-block-components-button:hover {
	background: var(--c-ink-hover) !important;
	box-shadow: var(--sh-btn-ink);
}

/* Cart line items */

.wc-block-cart-items {
	border-bottom-color: var(--c-line) !important;
}

.wc-block-cart-items__row {
	border-top-color: var(--c-line) !important;
}

.wc-block-cart-item__image img,
.wc-block-components-order-summary-item__image img {
	border-radius: var(--r-sm);
	background: var(--c-surface-2);
}

.wc-block-components-product-name {
	color: var(--c-text) !important;
	font-weight: 600;
	text-decoration: none !important;
}

a.wc-block-components-product-name:hover {
	color: var(--c-primary-ink) !important;
}

.wc-block-components-product-price,
.wc-block-cart-item__total,
.wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item-tax-value {
	font-family: var(--fd);
	font-weight: 700;
}

.wc-block-components-product-price del {
	color: var(--c-muted);
	font-family: var(--fb);
	font-weight: 500;
}

.wc-block-components-sale-badge {
	border: 0 !important;
	border-radius: var(--r-pill) !important;
	background: var(--c-primary) !important;
	color: var(--c-on-primary) !important;
	font-weight: 700;
}

.wc-block-components-quantity-selector {
	height: 40px;
	border: 1.5px solid var(--c-line) !important;
	border-radius: var(--r-pill) !important;
	overflow: hidden;
}

.wc-block-components-quantity-selector::after {
	display: none !important;
}

.wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
	height: 100%;
	padding: 0;
	border: 0;
	box-shadow: none;
	font-weight: 700;
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	min-width: 40px;
	color: var(--c-text);
	font-size: 18px;
	opacity: 1;
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:hover {
	background: var(--c-surface-2);
}

.wc-block-cart-item__remove-link {
	color: var(--c-muted) !important;
}

.wc-block-cart-item__remove-link:hover {
	color: var(--c-danger) !important;
}

/* Totals / order summary panel */

.wc-block-cart__sidebar .wc-block-components-sidebar,
.wc-block-cart .wc-block-cart__sidebar > *,
.wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block {
	border: 0 !important;
	border-radius: var(--r-lg);
	background: var(--c-surface-2);
}

.wc-block-cart .wc-block-cart__sidebar > * {
	padding: var(--sp-5);
}

.wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block {
	overflow: hidden;
}

.wc-block-components-totals-wrapper {
	border-top-color: var(--c-line) !important;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	font-family: var(--fd);
	font-size: 22px;
	font-weight: 700;
}

.wc-block-components-order-summary-item__quantity {
	border-color: var(--c-surface) !important;
	background: var(--c-text) !important;
	color: var(--c-on-ink) !important;
	box-shadow: none !important;
}

.wc-block-components-panel__button {
	font-weight: 600;
}

/* Notices */

.wc-block-components-notice-banner {
	border-radius: var(--r-sm) !important;
	font-size: var(--fs-small);
}

/* Order received (thank you) page */

.woocommerce-order {
	display: flex;
	flex-direction: column;
	gap: var(--sp-6);
}

.woocommerce-thankyou-order-received {
	padding: var(--sp-5);
	border-radius: var(--r-lg);
	background: var(--c-success-soft);
	color: var(--c-success);
	font-family: var(--fd);
	font-size: 20px;
	font-weight: 700;
}

.woocommerce-order-overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: var(--sp-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce-order-overview li {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: var(--sp-4);
	border: 1px solid var(--c-line);
	border-radius: var(--r-sm);
	color: var(--c-muted);
	font-size: 13px;
}

.woocommerce-order-overview li strong {
	color: var(--c-text);
	font-size: var(--fs-body);
}

.woocommerce-order-details h2,
.woocommerce-customer-details h2 {
	margin-bottom: var(--sp-3);
	font-size: 20px;
}

.woocommerce-table--order-details {
	width: 100%;
	border-collapse: collapse;
}

.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
	padding: var(--sp-3) 0;
	border-bottom: 1px solid var(--c-line);
	text-align: left;
}

.woocommerce-table--order-details td:last-child,
.woocommerce-table--order-details th:last-child {
	text-align: right;
}

.woocommerce-customer-details address {
	padding: var(--sp-4);
	border-radius: var(--r-sm);
	background: var(--c-surface-2);
	font-style: normal;
}

.woocommerce-table--order-details a {
	color: var(--c-text);
	font-weight: 600;
	text-decoration: none;
}

.woocommerce-table--order-details a:hover {
	color: var(--c-primary-ink);
}

/* ---------- Empty cart (Cart block's "empty cart" inner blocks) ----------
 * Matches the cart drawer's empty state: soft-orange icon circle, display title. */

.wp-block-woocommerce-empty-cart-block {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--sp-4);
	padding: var(--sp-7) 0;
	text-align: center;
}

.wc-block-cart__empty-cart__title.with-empty-cart-icon {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	font-size: var(--fs-h3);
	letter-spacing: -0.02em;
}

.wc-block-cart__empty-cart__title.with-empty-cart-icon::before {
	content: "";
	width: 88px;
	height: 88px;
	margin: 0;
	border-radius: 50%;
	background: var(--c-primary-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 24 24' fill='none' stroke='%230E0E0E' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E") center no-repeat;
	-webkit-mask: none;
	mask: none;
}

.wp-block-woocommerce-empty-cart-block > p {
	max-width: 32em;
	color: var(--c-muted);
}

.wp-block-woocommerce-empty-cart-block .wp-block-separator {
	width: 100%;
	max-width: 120px;
	margin: var(--sp-5) auto;
	border: 0;
	border-top: 1px solid var(--c-line);
}

.wp-block-woocommerce-empty-cart-block .wp-block-separator.is-style-dots::before {
	display: none;
}

.wp-block-woocommerce-empty-cart-block > h2:not(.wc-block-cart__empty-cart__title) {
	align-self: flex-start;
	font-size: var(--fs-h3);
	letter-spacing: -0.02em;
}

/* "New in store" grid styled like the theme's product cards */
.wc-block-grid {
	width: 100%;
}

.wc-block-grid__products {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--sp-6) var(--sp-3);
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: left;
}

@media (min-width: 900px) {
	.wc-block-grid__products {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: var(--sp-8) var(--sp-5);
	}
}

.wc-block-grid__product {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--sp-2);
	min-width: 0;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.wc-block-grid__product-link {
	display: flex;
	flex-direction: column;
	gap: var(--sp-2);
	color: var(--c-text);
	text-decoration: none;
}

.wc-block-grid__product-image {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: var(--r-md);
	background: repeating-linear-gradient(135deg, var(--c-ph-1) 0 12px, var(--c-ph-2) 12px 24px);
}

.wc-block-grid__product-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wc-block-grid__product-title {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
}

.wc-block-grid__product-link:hover .wc-block-grid__product-title {
	color: var(--c-primary-ink);
}

.wc-block-grid__product-price {
	font-family: var(--fd);
	font-size: var(--fs-price);
	font-weight: 700;
}

.wc-block-grid__product-price del {
	color: var(--c-muted);
	font-family: var(--fb);
	font-size: 13px;
	font-weight: 500;
}

.wc-block-grid__product-price ins {
	text-decoration: none;
}

.wc-block-grid .wc-block-grid__product .wc-block-grid__product-onsale {
	position: absolute;
	top: 10px;
	right: auto;
	left: 10px;
	z-index: 1;
	margin: 0;
	border: 0;
	text-transform: none;
	display: inline-flex;
	align-items: center;
	height: 24px;
	padding: 0 9px;
	border-radius: var(--r-pill);
	background: var(--c-primary);
	color: var(--c-on-primary);
	font-size: var(--fs-caption);
	font-weight: 700;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 44px;
	border-radius: var(--r-pill);
	background: var(--c-text);
	color: var(--c-on-ink);
	font-size: var(--fs-small);
	font-weight: 700;
	text-decoration: none;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link:hover {
	background: var(--c-primary);
	color: var(--c-on-primary);
}

.wc-block-grid__product-add-to-cart .added_to_cart {
	display: none;
}

/* ---------- Accessibility: 44px targets in the blocks ---------- */

.wc-block-components-quantity-selector {
	height: 47px; /* 44px buttons inside the 1.5px border */
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	min-width: 44px;
}

.wc-block-cart-item__remove-link {
	position: relative;
}

.wc-block-cart-item__remove-link::after {
	content: "";
	position: absolute;
	inset: -10px;
}

.wc-block-components-panel__button {
	padding-block: 13px !important;
}

.wc-block-components-address-form__address_2-toggle {
	display: inline-block;
	padding: 13px 0;
}

.wc-block-components-checkbox label {
	min-height: 44px;
	align-items: center;
}

.wc-block-cart-item__product .wc-block-components-product-name {
	position: relative;
}

.wc-block-cart-item__product .wc-block-components-product-name::after {
	content: "";
	position: absolute;
	inset: -13px 0;
}