/**

 * Side Checkout — JS Integration (FASE 5.6.9-B).

 * Modo checkout dentro del panel del Side Cart.

 */



.pgsc-side-cart--checkout .pgsc-side-cart__free-shipping,

.pgsc-side-cart--checkout .pgsc-side-cart__products,

.pgsc-side-cart--checkout .pgsc-side-cart__bottom {

	display: none !important;

}



.pgsc-side-cart--cart-view .pgsc-side-cart__products,

.pgsc-side-cart:not(.pgsc-side-cart--checkout) .pgsc-side-cart__products {

	display: block !important;

	flex: 1 1 auto !important;

	min-height: 0 !important;

}



.pgsc-side-cart--cart-view .pgsc-side-cart__bottom,

.pgsc-side-cart:not(.pgsc-side-cart--checkout) .pgsc-side-cart__bottom {

	display: flex !important;

}



.pgsc-side-cart--cart-view .pgsc-side-cart__free-shipping:not(.pgsc-side-cart__free-shipping--hidden),

.pgsc-side-cart:not(.pgsc-side-cart--checkout) .pgsc-side-cart__free-shipping:not(.pgsc-side-cart__free-shipping--hidden) {

	display: block !important;

}



.pgsc-side-cart--cart-view #pgsc-checkout-root,

.pgsc-side-cart--cart-view .pgsc-checkout__mount,

.pgsc-side-cart:not(.pgsc-side-cart--checkout) #pgsc-checkout-root,

.pgsc-side-cart:not(.pgsc-side-cart--checkout) .pgsc-checkout__mount {

	display: none !important;

}



.pgsc-side-cart--cart-view .pgsc-side-cart__body,

.pgsc-side-cart:not(.pgsc-side-cart--checkout) .pgsc-side-cart__body {

	overflow: hidden;

}



/* El panel conserva position:fixed de frontend.css (top/right/100dvh).
   position:relative rompía el anclaje viewport en modo checkout (QA móvil). */

.pgsc-side-cart__location-backdrop {

	position: absolute;

	inset: 0;

	z-index: 14;

	background: var(--pgsc-color-overlay-backdrop-checkout, rgba(42, 38, 38, 0.48));

	opacity: 1;

	transition: opacity 0.25s var(--pgsc-ease, ease);

}



.pgsc-side-cart__location-backdrop[hidden] {

	display: none !important;

}



.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-side-cart__bottom {

	display: flex !important;

	position: absolute;

	left: 0;

	right: 0;

	bottom: 0;

	z-index: 18;

	flex-direction: column;

	max-height: min(88dvh, 100%);

	padding-top: 0;

	overflow: hidden;

	border-top: 0;

	border-top-left-radius: var(--pgsc-radius-lg, 16px);

	border-top-right-radius: var(--pgsc-radius-lg, 16px);

	background: var(--pgsc-color-surface, var(--pgsc-white, #fff));

	box-shadow: 0 -16px 40px var(--pgsc-shadow-soft, rgba(42, 38, 38, 0.08));

}



.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-side-cart__footer {

	display: none !important;

}



.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-side-cart__shipping {

	flex: 1 1 auto;

	min-height: 0;

	overflow-x: hidden;

	overflow-y: auto;

	-webkit-overflow-scrolling: touch;

	padding: 18px 20px calc(18px + env(safe-area-inset-bottom, 0px));

}



.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-side-cart__shipping-fields,

.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-side-cart__city-autocomplete,

.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-location-field--city {

	overflow: visible;

}



.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-location-field--city:has(#pgsc-city-search:focus),

.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-location-field--city:has(.pgsc-city-results:not([hidden])) {

	z-index: 22;

}



.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-city-results {

	z-index: calc(var(--pgsc-sidecart-z-index, 99999) + 6);

}



.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-checkout__mount {

	opacity: var(--pgsc-opacity-state-dim, 0.32);

	pointer-events: none;

	filter: blur(1px);

}



.pgsc-side-cart--checkout .pgsc-side-cart__body {

	display: flex;

	flex: 1 1 auto;

	flex-direction: column;

	min-height: 0;

	overflow: auto;

}



.pgsc-side-cart--checkout .pgsc-checkout__mount {

	flex: 1 1 auto;

	width: 100%;

	max-width: none;

	margin: 0;

	border: 0;

	border-radius: 0;

}



.pgsc-checkout__nav {

	display: flex;

	flex-wrap: wrap;

	gap: 0.75rem;

	align-items: center;

}



.pgsc-checkout__nav-button--hidden {

	display: none !important;

}



.pgsc-checkout__nav--pay-visible .pgsc-checkout__nav-button--next {

	display: none !important;

}



.pgsc-checkout__nav-button--pay {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	gap: 0.5rem;

	margin-left: auto;

	border-color: var(--pgsc-color-button-primary-border, var(--pgsc-wine, #6b2838));

	background: var(--pgsc-color-button-primary-bg, var(--pgsc-wine, #6b2838));

	color: var(--pgsc-color-on-primary, #fff);

}



.pgsc-checkout__nav-button--pay:hover,

.pgsc-checkout__nav-button--pay:focus {

	border-color: var(--pgsc-color-button-primary-bg-hover, var(--pgsc-wine-dark, #4f1c2a));

	background: var(--pgsc-color-button-primary-bg-hover, var(--pgsc-wine-dark, #4f1c2a));

	color: var(--pgsc-color-on-primary, #fff);

}



.pgsc-checkout__nav-button--processing {

	opacity: var(--pgsc-opacity-state-processing, 0.85);

	cursor: wait;

}



.pgsc-checkout__nav-button-spinner {

	display: none;

	width: 1rem;

	height: 1rem;

	border: 2px solid var(--pgsc-color-state-spinner-track-on-primary, var(--pgsc-color-button-spinner-track, rgba(255, 255, 255, 0.35)));

	border-top-color: var(--pgsc-color-state-spinner-active-on-primary, var(--pgsc-color-on-primary, #fff));

	border-radius: 50%;

	animation: pgsc-checkout-spin 0.7s linear infinite;

}



.pgsc-checkout__nav-button--processing .pgsc-checkout__nav-button-spinner {

	display: inline-block;

}



.pgsc-checkout__shell {

	position: relative;

}



.pgsc-checkout__shell--processing .pgsc-checkout__steps,

.pgsc-checkout__shell--processing .pgsc-checkout__nav,

.pgsc-checkout__shell--processing .pgsc-checkout__progress,

.pgsc-checkout__shell--processing .pgsc-checkout__header {

	pointer-events: none;

}



.pgsc-checkout__processing-overlay {

	position: absolute;

	inset: 0;

	z-index: 5;

	display: flex;

	align-items: center;

	justify-content: center;

	padding: 1.5rem;

	background: var(--pgsc-color-overlay-scrim-medium, rgba(255, 255, 255, 0.82));

	backdrop-filter: blur(2px);

}



.pgsc-checkout__step-transition-overlay[hidden] {

	display: none !important;

}



/* Ancla el loader de transición al panel visible (misma causa raíz que processing overlay).
   Evita que la tarjeta quede centrada en el shell completo cuando el usuario
   llegó al botón Siguiente con scroll. */

.pgsc-checkout__step-transition-overlay.pgsc-checkout__step-transition-overlay--visible {

	position: fixed;

	inset: 0;

	z-index: 24;

}



.pgsc-side-cart--checkout:has( .pgsc-checkout__step-transition-overlay--visible ) .pgsc-side-cart__body {

	overflow: hidden;

	overscroll-behavior: contain;

}



.pgsc-checkout__processing-overlay[hidden] {

	display: none !important;

}



/* Ancla el overlay al panel visible durante procesamiento (Order Pay prep).
   Evita que la tarjeta quede centrada en el shell completo cuando el usuario
   llegó al botón pagar con scroll. Sin cambio de scrollTop ni de DOM. */

.pgsc-checkout__shell--processing .pgsc-checkout__processing-overlay:not( [hidden] ) {

	position: fixed;

	inset: 0;

	z-index: 24;

}



.pgsc-side-cart--checkout:has( .pgsc-checkout__shell--processing ) .pgsc-side-cart__body {

	overflow: hidden;

	overscroll-behavior: contain;

}



.pgsc-checkout__processing-card {

	display: flex;

	flex-direction: column;

	align-items: center;

	gap: 0.75rem;

	padding: 1.25rem 1.5rem;

	border-radius: var(--pgsc-radius-md, 12px);

	background: var(--pgsc-color-surface, var(--pgsc-white, #fff));

	box-shadow: var(--pgsc-shadow-elevated, 0 8px 24px var(--pgsc-shadow-soft, rgba(42, 38, 38, 0.08)));

}



.pgsc-checkout__processing-spinner {

	width: 2rem;

	height: 2rem;

	border: 3px solid var(--pgsc-color-state-spinner-track-brand, var(--pgsc-color-border, var(--pgsc-rose-muted, #f3d9de)));

	border-top-color: var(--pgsc-color-state-spinner-active-brand, var(--pgsc-color-primary, var(--pgsc-wine, #6b2838)));

	border-radius: 50%;

	animation: pgsc-checkout-spin 0.7s linear infinite;

}



.pgsc-checkout__processing-message {

	margin: 0;

	font-size: 0.9375rem;

	font-weight: 600;

	color: var(--pgsc-color-text, var(--pgsc-black-soft, #2a2626));

}



@keyframes pgsc-checkout-spin {

	to {

		transform: rotate(360deg);

	}

}



.pgsc-checkout__process-error {

	display: none;

	width: 100%;

	margin: 0 0 0.75rem;

	padding: 0.75rem 1rem;

	border-radius: 4px;

	background: var(--pgsc-color-state-error-bg, var(--pgsc-color-error-bg, #fdecea));

	color: var(--pgsc-color-state-error-text, var(--pgsc-color-error-text, #611a15));

	font-size: 0.875rem;

	line-height: 1.4;

}



.pgsc-checkout__process-error--visible {

	display: block;

}



/* -------------------------------------------------------------------------
   FASE 5.8.3 — Apertura checkout (feedback visual)
   ------------------------------------------------------------------------- */

.pgsc-side-cart__opening-overlay {

	position: absolute;

	inset: 0;

	z-index: 40;

	display: flex;

	align-items: center;

	justify-content: center;

	padding: 1.5rem;

	background: var(--pgsc-color-overlay-scrim-strong, rgba(255, 255, 255, 0.84));

	backdrop-filter: blur(3px);

	pointer-events: all;

}



.pgsc-side-cart__opening-overlay[hidden] {

	display: none !important;

}



.pgsc-side-cart__opening-card {

	display: flex;

	flex-direction: column;

	align-items: center;

	gap: 0.75rem;

	padding: 1.25rem 1.5rem;

	border-radius: var(--pgsc-radius-md, 12px);

	background: var(--pgsc-color-surface, var(--pgsc-white, #fff));

	box-shadow: var(--pgsc-shadow-elevated, 0 8px 24px var(--pgsc-shadow-soft, rgba(42, 38, 38, 0.08)));

}



.pgsc-side-cart__opening-spinner {

	width: 2rem;

	height: 2rem;

	border: 3px solid var(--pgsc-color-state-spinner-track-brand, var(--pgsc-color-border, var(--pgsc-rose-muted, #f3d9de)));

	border-top-color: var(--pgsc-color-state-spinner-active-brand, var(--pgsc-color-primary, var(--pgsc-wine, #6b2838)));

	border-radius: 50%;

	animation: pgsc-checkout-spin 0.7s linear infinite;

}



.pgsc-side-cart__opening-message {

	margin: 0;

	font-size: 0.9375rem;

	font-weight: 600;

	color: var(--pgsc-color-text, var(--pgsc-black-soft, #2a2626));

	text-align: center;

}



.pgsc-side-cart--opening-checkout .pgsc-side-cart__checkout {

	pointer-events: none;

}



.pgsc-checkout__mount--enter {

	animation: pgsc-checkout-mount-enter 0.38s var(--pgsc-ease, cubic-bezier(0.4, 0, 0.2, 1)) both;

}



@keyframes pgsc-checkout-mount-enter {

	from {

		opacity: 0;

		transform: translateY(12px);

	}

	to {

		opacity: 1;

		transform: translateY(0);

	}

}



/* -------------------------------------------------------------------------
   FASE 5.8.3 — Location picker móvil en modo checkout
   ------------------------------------------------------------------------- */

@media screen and (max-width: 782px) {

	.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-side-cart__location-backdrop {

		z-index: 24;

	}



	.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-side-cart__bottom {

		top: 0;

		bottom: 0;

		left: 0;

		right: 0;

		height: auto;

		max-height: none;

		border-radius: 0;

		z-index: 26;

	}



	.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-side-cart__shipping {

		padding: 20px 16px calc(24px + env(safe-area-inset-bottom, 0px));

	}



	.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-location-layout {

		display: flex !important;

		flex-direction: column;

		gap: 16px;

	}



	.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-location-field--city {

		z-index: 2;

	}



	.pgsc-side-cart--checkout.pgsc-side-cart--location-open .pgsc-city-results:not([hidden]) {

		z-index: calc(var(--pgsc-sidecart-z-index, 99999) + 12);

	}

}