/* --------------------------------------------------------------------------
 * GRZ Gaming — unified compact mobile purchase card (v1.7.5)
 *
 * Presentation only. This layer never changes the WooCommerce quantity input,
 * variation fields, account-validator controls, submit names/values or hooks.
 * It corrects the visual grid introduced by v1.7.4 and keeps every real control
 * in its original DOM position.
 * ----------------------------------------------------------------------- */

.single-product .grz-tp-add-cart-secondary__icon svg {
	display: block;
	width: 100%;
	height: 100%;
	fill: currentColor;
	stroke: none;
}

@media (max-width: 620px) {
	.single-product {
		--grz-mobile-summary-border: color-mix(in srgb, var(--grz-tp-page-color, #0762e6) 16%, #ced8e6);
		--grz-mobile-summary-divider: rgba(124, 147, 177, 0.22);
		--grz-mobile-cart-track: clamp(80px, 28%, 142px);
		--grz-mobile-qty-track: 108px;
		--grz-mobile-card-inset: 12px;
		--grz-mobile-action-gap: 8px;
	}

	/* Both native and validator-backed summaries use the same three visual
	 * tracks: cart action, quantity, and price/primary action. No control is
	 * cloned or moved. */
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) > .grz-tp-card__body,
	.single-product .grz-tp-card--summary:has(.grz-caller-box) {
		grid-template-columns: var(--grz-mobile-cart-track) var(--grz-mobile-qty-track) minmax(0, 1fr);
		grid-auto-flow: row;
		column-gap: 0;
		row-gap: 0;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)):not(:has(.grz-tp-qty--action)) > .grz-tp-card__body,
	.single-product .grz-tp-card--summary:has(.grz-caller-box):not(:has(.grz-tp-qty--action)) {
		grid-template-columns: var(--grz-mobile-cart-track) minmax(0, 1fr);
	}

	/* Common total row. Adjacent cells share one surface instead of looking
	 * like three unrelated boxes. */
	.single-product .grz-tp-card--summary .grz-tp-total__label,
	.single-product .grz-tp-card--summary .grz-tp-qty--action,
	.single-product .grz-tp-card--summary .grz-tp-total__prices {
		box-sizing: border-box;
		align-self: stretch;
		margin: 0;
		padding-block: 9px;
		border-top: 1px solid var(--grz-mobile-summary-divider);
		background: transparent;
	}

	.single-product .grz-tp-card--summary .grz-tp-total__label {
		display: flex;
		align-items: center;
		padding-inline-start: var(--grz-mobile-card-inset);
		color: #53627a;
		font-weight: 650;
	}

	.single-product .grz-tp-card--summary .grz-tp-qty--action {
		display: flex;
		align-items: center;
		justify-content: center;
		padding-inline: 4px;
	}

	.single-product .grz-tp-card--summary .grz-tp-total__prices {
		display: flex;
		min-width: 0;
		align-items: flex-end;
		justify-content: center;
		padding-inline: 6px var(--grz-mobile-card-inset);
		overflow: hidden;
		text-align: end;
	}

	.single-product .grz-tp-card--summary .grz-tp-total__now {
		max-width: 100%;
		font-size: clamp(18px, 5.3vw, 24px);
		line-height: 1.05;
		white-space: nowrap;
	}

	.single-product .grz-tp-card--summary .grz-tp-total__was {
		max-width: 100%;
		font-size: 10.5px;
		line-height: 1.15;
		white-space: nowrap;
	}

	.single-product .grz-tp-card--summary .grz-tp-qty--action .quantity {
		width: 100px;
		height: 44px;
		grid-template-columns: 30px 40px 30px;
	}

	.single-product .grz-tp-card--summary .grz-tp-qty--action .grz-tp-qty__btn {
		width: 30px;
		height: 42px;
		min-height: 42px;
	}

	.single-product .grz-tp-card--summary .grz-tp-qty--action .quantity .qty {
		height: 42px;
		min-height: 42px;
		line-height: 42px;
	}

	/* The two actions are inset from the card edge and separated by a real gap.
	 * The amber cart treatment follows the supplied SEAGM reference while the
	 * GRZ-blue Buy Now button remains the primary conversion action. */
	.single-product .grz-tp-card--summary button.grz-tp-add-cart-secondary,
	.single-product .grz-tp-card--summary .single_add_to_cart_button {
		box-sizing: border-box;
		align-self: center;
		width: auto;
		min-width: 0;
		min-height: 48px;
		margin-block: 6px;
		border-radius: var(--grz-product-control-radius, 6px);
	}

	.single-product .grz-tp-card--summary button.grz-tp-add-cart-secondary {
		justify-self: stretch;
		margin-inline: var(--grz-mobile-card-inset) calc(var(--grz-mobile-action-gap) / 2);
		padding: 0;
		border-color: #e18a00;
		background: #ff9f0a;
		color: #111827;
		box-shadow: 0 6px 14px rgba(225, 138, 0, 0.16);
	}

	.single-product .grz-tp-card--summary button.grz-tp-add-cart-secondary:hover:not(:disabled),
	.single-product .grz-tp-card--summary button.grz-tp-add-cart-secondary:focus-visible {
		border-color: #c97800;
		background: #f29400;
		color: #111827;
	}

	.single-product .grz-tp-card--summary .grz-tp-add-cart-secondary__label {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.single-product .grz-tp-card--summary .grz-tp-add-cart-secondary__icon {
		width: 21px;
		height: 21px;
	}

	.single-product .grz-tp-card--summary .single_add_to_cart_button {
		justify-self: stretch;
		margin-inline: calc(var(--grz-mobile-action-gap) / 2) var(--grz-mobile-card-inset);
	}

	/* Repeat the spacing with the state gate so it wins over v1.7.4's older,
	 * more-specific zero-margin rules. */
	.single-product .grz-tp-card--summary:has(.grz-caller-box) button.grz-tp-add-cart-secondary,
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) button.grz-tp-add-cart-secondary {
		height: 48px;
		margin-block: 6px;
		margin-inline: var(--grz-mobile-card-inset) calc(var(--grz-mobile-action-gap) / 2);
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) button.single_add_to_cart_button.button.alt,
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) button.single_add_to_cart_button.button.alt {
		width: auto;
		height: 48px;
		margin-block: 6px;
		margin-inline: calc(var(--grz-mobile-action-gap) / 2) var(--grz-mobile-card-inset);
		padding-block: 0;
	}

	/* Native/theme-owned account layouts already have separate cards. Keep the
	 * order-summary wrapper intact and only tighten its internal rows. */
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) > .grz-tp-card__body {
		display: grid;
		padding-block: 10px 6px;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .single_variation_wrap,
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .woocommerce-variation-add-to-cart,
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-cart-actions,
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-action-row,
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-total {
		display: contents !important;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-summary-list {
		grid-column: 1 / -1;
		grid-row: 1;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-total__label,
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-qty--action,
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-total__prices {
		grid-row: 2;
		order: initial;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-total__label {
		grid-column: 1;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-qty--action {
		grid-column: 2;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-total__prices {
		grid-column: 3;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)):not(:has(.grz-tp-qty--action)) .grz-tp-total__prices {
		grid-column: 2;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) button.grz-tp-add-cart-secondary,
	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .single_add_to_cart_button {
		grid-row: 3;
		order: initial;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) button.grz-tp-add-cart-secondary {
		grid-column: 1;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .single_add_to_cart_button {
		grid-column: 2 / -1;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-express-slot {
		grid-column: 1 / -1;
		grid-row: 4;
		order: initial;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-express-slot:empty {
		display: none;
	}

	.single-product .grz-tp-card--summary:not(:has(.grz-caller-box)) .grz-tp-secure {
		grid-column: 1 / -1;
		grid-row: 5;
		order: initial;
		margin: 0;
		padding: 7px var(--grz-mobile-card-inset) 5px;
	}

	/* Validator-backed layout. The validator remains inside the plugin hook;
	 * CSS grid ordering only presents it as step 2 and the summary as step 3. */
	.single-product .grz-tp-card--summary:has(.grz-caller-box) {
		isolation: isolate;
		display: grid;
		grid-template-rows: repeat(7, auto);
		height: auto;
		overflow: visible;
		border: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box)::before,
	.single-product .grz-tp-card--summary:has(.grz-caller-box)::after {
		z-index: 0;
		grid-column: 1 / -1;
		align-self: stretch;
		border-inline: 1px solid var(--grz-mobile-summary-border);
		background: #fff;
		content: "";
		pointer-events: none;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box)::before {
		grid-row: 4;
		border-top: 1px solid var(--grz-mobile-summary-divider);
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box)::after {
		grid-row: 5;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) > .grz-tp-card__body,
	.single-product .grz-tp-card--summary:has(.grz-caller-box) .single_variation_wrap,
	.single-product .grz-tp-card--summary:has(.grz-caller-box) .woocommerce-variation-add-to-cart,
	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-cart-actions,
	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-action-row,
	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-total {
		display: contents !important;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-caller-box.grz-caller-box {
		z-index: 1;
		grid-column: 1 / -1;
		grid-row: 1;
		order: initial;
		width: 100%;
		margin: 0 0 10px;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) > .grz-tp-card__head {
		z-index: 1;
		grid-column: 1 / -1;
		grid-row: 2;
		order: initial;
		margin: 0;
		padding: 11px var(--grz-mobile-card-inset) 8px;
		border: 1px solid var(--grz-mobile-summary-border);
		border-bottom: 0;
		border-radius: var(--grz-product-card-radius, 8px) var(--grz-product-card-radius, 8px) 0 0;
		background: #fff;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-summary-list {
		z-index: 1;
		grid-column: 1 / -1;
		grid-row: 3;
		order: initial;
		margin: 0;
		padding: 0 var(--grz-mobile-card-inset) 8px;
		border-inline: 1px solid var(--grz-mobile-summary-border);
		background: #fff;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-total__label,
	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-qty--action,
	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-total__prices {
		z-index: 1;
		grid-row: 4;
		order: initial;
		border-top: 0;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-total__label {
		grid-column: 1;
		border-inline-start: 0;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-qty--action {
		grid-column: 2;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-total__prices {
		grid-column: 3;
		border-inline-end: 0;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box):not(:has(.grz-tp-qty--action)) .grz-tp-total__prices {
		grid-column: 2;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) button.grz-tp-add-cart-secondary,
	.single-product .grz-tp-card--summary:has(.grz-caller-box) .single_add_to_cart_button {
		z-index: 1;
		grid-row: 5;
		order: initial;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) button.grz-tp-add-cart-secondary {
		grid-column: 1;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .single_add_to_cart_button {
		grid-column: 2 / -1;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-express-slot {
		z-index: 1;
		grid-column: 1 / -1;
		grid-row: 6;
		order: initial;
		margin: 0;
		padding: 8px var(--grz-mobile-card-inset) 0;
		border-inline: 1px solid var(--grz-mobile-summary-border);
		background: #fff;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-express-slot:empty {
		display: none;
	}

	.single-product .grz-tp-card--summary:has(.grz-caller-box) .grz-tp-secure {
		z-index: 1;
		grid-column: 1 / -1;
		grid-row: 7;
		order: initial;
		margin: 0;
		padding: 8px var(--grz-mobile-card-inset) 10px;
		border: 1px solid var(--grz-mobile-summary-border);
		border-top: 0;
		border-radius: 0 0 var(--grz-product-card-radius, 8px) var(--grz-product-card-radius, 8px);
		background: #fff;
	}
}

@media (max-width: 350px) {
	.single-product {
		--grz-mobile-cart-track: clamp(72px, 28%, 96px);
		--grz-mobile-qty-track: 94px;
		--grz-mobile-card-inset: 10px;
		--grz-mobile-action-gap: 6px;
	}

	.single-product .grz-tp-card--summary .grz-tp-qty--action .quantity {
		width: 90px;
		grid-template-columns: 25px 40px 25px;
	}

	.single-product .grz-tp-card--summary .grz-tp-qty--action .grz-tp-qty__btn {
		width: 25px;
	}

	.single-product .grz-tp-card--summary .grz-tp-total__now {
		font-size: clamp(17px, 5.7vw, 20px);
	}

	.single-product .grz-tp-card--summary .grz-tp-add-cart-secondary__icon {
		width: 19px;
		height: 19px;
	}

	.single-product .grz-tp-card--summary .single_add_to_cart_button {
		padding-inline: 10px;
		font-size: 11px;
	}

	.single-product .grz-tp-card--summary .grz-tp-secure {
		font-size: 9.5px;
	}
}

@media (max-width: 290px) {
	.single-product {
		--grz-mobile-cart-track: 70px;
		--grz-mobile-qty-track: 88px;
		--grz-mobile-card-inset: 8px;
	}

	.single-product .grz-tp-card--summary .grz-tp-qty--action .quantity {
		width: 84px;
		grid-template-columns: 22px 40px 22px;
	}

	.single-product .grz-tp-card--summary .grz-tp-qty--action .grz-tp-qty__btn {
		width: 22px;
	}

	.single-product .grz-tp-card--summary .grz-tp-total__now {
		font-size: 16px;
	}
}