/**
 * WapuOS — Ventas al mayoreo · composición storefront.
 * WTDS conserva ProductCard, media y QuantityStepper. Este archivo sólo
 * pinta la tabla de precios propia del dominio y su reflow contextual.
 */

.wapu-b2b-front-table {
	--wapu-b2b-border: var(--wtds-separator-soft, rgba(17, 24, 39, .09));
	--wapu-b2b-border-soft: var(--wtds-fill-4, rgba(17, 24, 39, .07));
	--wapu-b2b-muted: var(--wtds-ink-3, rgba(60, 60, 67, .64));
	--wapu-b2b-ok: var(--wtds-success, #148c43);
	--wapu-b2b-warn: var(--wtds-warning, #b94716);
	color: var(--ds-ink, #111827);
	container-name: wapu-b2b-pricing;
	container-type: inline-size;
	font-family: var(--ds-font-text, inherit);
	margin-block-end: .75rem;
}

.wapu-b2b-product-active .wapu-single__price {
	display: none !important;
}

.wapu-b2b-front-table__head {
	align-items: center;
	display: flex;
	gap: .625rem;
	justify-content: space-between;
	padding-block-end: .75rem;
}

.wapu-b2b-front-table__title {
	display: flex;
	flex-direction: column;
	gap: .1875rem;
	min-width: 0;
}

.wapu-b2b-front-table__title span {
	color: var(--wapu-b2b-muted);
	display: block;
	font-size: .75rem;
	font-weight: 600;
	line-height: 1.2;
}

.wapu-b2b-front-table__title strong {
	color: var(--ds-ink, #111827);
	font-family: var(--ds-font-display, inherit);
	font-size: clamp(.9375rem, .9rem + .2cqi, 1rem);
	font-weight: 700;
	line-height: 1.2;
}


.wapu-b2b-front-table__tiers {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	position: relative;
}

#wapu-single .wapu-b2b-front-table__tiers {
	border-radius: 8px;
}

.wapu-b2b-tier {
	align-items: center;
	background: var(--wtds-surface-subtle, rgba(250, 250, 251, .92));
	border: var(--wtds-border-thin, 1px) solid var(--wapu-b2b-border);
	border-radius: var(--wtds-r-md, .5rem);
	display: grid;
	gap: .875rem;
	grid-template-columns: minmax(0, 1fr) auto;
	min-height: 3.875rem;
	overflow: hidden;
	padding: .8125rem .9375rem .8125rem 1rem;
	position: relative;
	transition: background-color .28s ease, border-color .28s ease, color .28s ease, opacity .22s ease, transform .28s cubic-bezier(.2, .78, .24, 1);
}

.wapu-b2b-tier[role="radio"] {
	cursor: pointer;
}

.wapu-b2b-tier[role="radio"]:focus-visible {
	box-shadow: 0 0 0 .1875rem var(--wtds-focus-ring, rgba(20, 140, 67, .18));
	outline: .125rem solid var(--wtds-focus, rgba(20, 140, 67, .7));
	outline-offset: .125rem;
}

@media (hover: hover) {
	.wapu-b2b-tier[role="radio"]:hover {
		background: var(--wtds-surface, #fff);
		border-color: var(--wtds-separator, rgba(17, 24, 39, .14));
	}
}

.wapu-b2b-tier.is-base {
	border-color: var(--wapu-b2b-border-soft);
}

.wapu-b2b-tier.is-current {
	background: linear-gradient(90deg, var(--wtds-success-soft, rgba(20, 140, 67, .115)), var(--wtds-surface, rgba(255, 255, 255, .98)));
	border-color: var(--wtds-success-border, rgba(20, 140, 67, .58));
}

.wapu-b2b-tier.is-switching::after {
	animation: wapu-b2b-tier-sweep .52s cubic-bezier(.22, .72, .2, 1) both;
	background: linear-gradient(90deg, transparent, var(--wtds-success-soft, rgba(20, 140, 67, .14)), transparent);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	transform: translateX(-115%);
}

.wapu-b2b-tier > * {
	position: relative;
	z-index: 1;
}


.wapu-b2b-tier__qty,
.wapu-b2b-tier__price {
	align-items: baseline;
	display: inline-flex;
	gap: .25rem;
	min-width: 0;
}

.wapu-b2b-tier__price span,
.wapu-b2b-tier__note,
.wapu-b2b-card-min {
	font-size: .75rem;
}

.wapu-b2b-tier__price span,
.wapu-b2b-tier__note {
	color: var(--wapu-b2b-muted);
	font-weight: 600;
	line-height: 1.15;
}

.wapu-b2b-tier__qty strong,
.wapu-b2b-tier__price strong {
	color: var(--ds-ink, #111827);
	font-family: var(--ds-font-display, inherit);
	font-weight: 700;
	line-height: 1.1;
}

.wapu-b2b-tier__qty strong {
	font-size: .9375rem;
}
.wapu-b2b-tier__qty .wapu-b2b-tier__pieces {
 color:var(--wapu-b2b-muted);font-weight:400;font-size:.8125rem;white-space:nowrap;
}

.wapu-b2b-tier__price strong {
	font-size: clamp(.90625rem, .88rem + .16cqi, .96875rem);
	white-space: nowrap;
}

.wapu-b2b-tier__note--saving {
	color: var(--wapu-b2b-ok);
}

.wapu-b2b-tier__main,
.wapu-b2b-tier__side {
	display: flex;
	flex-direction: column;
	gap: .3125rem;
	min-width: 0;
}

.wapu-b2b-tier__side {
	align-items: flex-end;
	justify-content: center;
	min-width: 9.25rem;
	text-align: end;
}

.wapu-b2b-tier__note {
	font-weight: 700;
	max-width: 11.25rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wapu-b2b-tier.is-stock-limited {
	color: var(--wtds-ink-disabled, rgba(17, 24, 39, .42));
	cursor: not-allowed;
	opacity: .72;
}

.wapu-b2b-tier.is-stock-limited .wapu-b2b-tier__qty strong,
.wapu-b2b-tier.is-stock-limited .wapu-b2b-tier__price strong,
.wapu-b2b-tier.is-stock-limited .wapu-b2b-tier__price span {
	color: var(--wtds-ink-disabled, rgba(17, 24, 39, .42));
}

.wapu-b2b-tier__note--stock {
	color: var(--wapu-b2b-warn);
	max-width: none;
}

/* El stepper dinámico consume la familia WTDS .wapu-quantity*. B2B sólo
 * resuelve su encaje dentro del selector de cantidad del producto. */
.wapu-single__qty-select-wrap:has(.wapu-b2b-qty-stepper) {
	padding: 0;
}

.wapu-single__qty-select-wrap:has(.wapu-b2b-qty-stepper) .wapu-single__qty-chevron {
	display: none;
}

.wapu-b2b-qty-stepper {
	width: 100%;
}

.wapu-b2b-card-min {
	color: var(--wtds-ink-3, rgba(17, 24, 39, .55));
	display: block;
	font-weight: 700;
	letter-spacing: .06em;
	line-height: 1;
	margin-block: 0 .25rem;
	text-transform: uppercase;
}

@container wapu-b2b-pricing (max-width: 40rem) {
	.wapu-b2b-front-table__head {
		align-items: flex-start;
		flex-direction: column;
	}

	.wapu-b2b-tier {
		grid-template-columns: minmax(0, 1fr);
		padding: .75rem;
	}

	.wapu-b2b-tier__side {
		align-items: flex-start;
		grid-column: 1;
		min-width: 0;
		text-align: start;
	}

	.wapu-b2b-tier__note {
		max-width: 100%;
	}
}

@media (pointer: coarse) {
	.wapu-b2b-tier[role="radio"] {
		min-height: max(3.875rem, var(--wtds-touch-target, 2.75rem));
	}
}

@media (prefers-reduced-motion: reduce) {
	.wapu-b2b-tier,
	.wapu-b2b-tier.is-switching,
	.wapu-b2b-tier.is-switching::after,
	.wapu-b2b-tier > * {
		animation: none !important;
		transition: none !important;
	}
}

@keyframes wapu-b2b-tier-sweep {
	0% { opacity: 0; transform: translateX(-115%); }
	24% { opacity: 1; }
	100% { opacity: 0; transform: translateX(115%); }
}

@keyframes wapu-b2b-content-enter-down {
	0% { opacity: .58; transform: translateY(-.625rem); }
	100% { opacity: 1; transform: translateY(0); }
}

@keyframes wapu-b2b-content-enter-up {
	0% { opacity: .58; transform: translateY(.625rem); }
	100% { opacity: 1; transform: translateY(0); }
}

@keyframes wapu-b2b-content-leave-down {
	0% { opacity: 1; transform: translateY(0); }
	100% { opacity: .7; transform: translateY(.5rem); }
}

@keyframes wapu-b2b-content-leave-up {
	0% { opacity: 1; transform: translateY(0); }
	100% { opacity: .7; transform: translateY(-.5rem); }
}

/* V13 selectable pricing table — same tier logic, denser table presentation. */
.wapu-b2b-front-table .wapu-b2b-tier__qty strong { color: var(--ds-ink, #111827); }
.wapu-b2b-front-table .wapu-b2b-tier__price,
.wapu-b2b-front-table .wapu-b2b-tier__price * { color: var(--wapu-b2b-muted); }
.wapu-b2b-front-table .wapu-b2b-tier__note--saving { color: var(--wapu-b2b-ok); font-weight: 500; }
.wapu-b2b-tier__radio { display: inline-flex; flex: 0 0 16px; width: 16px; height: 16px; box-sizing: border-box; border: 1px solid var(--wapu-b2b-muted); border-radius: 50%; align-items: center; justify-content: center; }
.wapu-b2b-tier[aria-checked="true"] .wapu-b2b-tier__radio::after { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--ds-ink, #111827); }
.wapu-b2b-tier__qty { gap: 8px; }
/* Independent choice cards, with a full-card interaction target. */
.wapu-b2b-front-table__tiers { gap: 10px; border: 0; overflow: visible; }
.wapu-b2b-tier {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 16px 44px 16px 16px;
    border: 1px solid var(--wapu-b2b-border);
    border-radius: 8px;
    background: var(--wtds-surface, #fff);
    cursor: pointer;
}
.wapu-b2b-tier.is-current,
.wapu-b2b-tier[data-state="selected"] {
    border-color: var(--ds-primary, #3064ff);
    background: var(--wtds-surface, #fff);
}
.wapu-b2b-tier .wapu-b2b-tier__radio { position: absolute; top: 16px; right: 16px; }
.wapu-b2b-tier[aria-checked="true"] .wapu-b2b-tier__radio { border-color: var(--ds-primary, #3064ff); }
.wapu-b2b-tier[aria-checked="true"] .wapu-b2b-tier__radio::after { background: var(--ds-primary, #3064ff); }
.wapu-b2b-tier__side { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; text-align: left; }
.wapu-b2b-tier__price { flex-wrap: wrap; justify-content: flex-start; text-align: left; }
.wapu-b2b-tier__note { max-width: none; text-align: left; }

/* Same receipt layout as the extras breakdown, without requiring Extras assets. */
.wapu-b2b-totals[hidden] { display: none !important; }
.wapu-b2b-totals { margin-top: 16px; padding: 0; background: #fff; color: #171717; }
.wapu-b2b-totals > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 10px 0; border-bottom: 1px solid #e5e7eb; }
.wapu-b2b-totals > div > :first-child { font-size: .875rem; font-weight: 400; line-height: 1.4; }
.wapu-b2b-totals > div > :last-child { font-size: .9375rem; font-weight: 500; line-height: 1.4; text-align: right; font-variant-numeric: tabular-nums; }
.wapu-b2b-totals .amount, .wapu-b2b-totals bdi { font-weight: 500; }
#wapu-single:has([data-wapu-extras-extra-summary]) .wapu-b2b-totals { display: none; }

/* Sin cantidades comprables en ningún tier: no mostrar un total de compra ficticio.
 * Las tarjetas y sus avisos de inventario permanecen visibles.
 * El selector ARIA se actualiza con la disponibilidad, así que los totales
 * reaparecen automáticamente si vuelve a existir una opción comprable.
 */
.wapu-b2b-front-table:has(.wapu-b2b-tier[aria-disabled="true"]):not(:has(.wapu-b2b-tier[aria-disabled="false"])) > .wapu-b2b-totals {
    display: none !important;
}

/* Compact wholesale bars, matching the cart item editor. */
#wapu-single .wapu-b2b-front-table__tiers { gap: 0; border: 1px solid var(--wapu-b2b-border); border-radius: 8px; overflow: hidden; }
#wapu-single .wapu-b2b-tier { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, auto) 16px; grid-template-rows: auto auto; column-gap: 12px; row-gap: 1px; min-height: 49px; padding: 8px; border: 0; border-bottom: 1px solid var(--wapu-b2b-border); border-radius: 0; }
#wapu-single .wapu-b2b-tier:last-child { border-bottom: 0; }
#wapu-single .wapu-b2b-tier__main { grid-column: 1; grid-row: 1; }
#wapu-single .wapu-b2b-tier__side { display: contents; }
#wapu-single .wapu-b2b-tier__price { grid-column: 1; grid-row: 2; gap: 4px; }
/* Oferta del tier: mostrar el precio normal tachado junto al precio de oferta. */
#wapu-single .wapu-b2b-tier__price del {
    display: inline;
    font-size: var(--wtds-fs-caption-2, 12px);
    font-weight: 400;
    line-height: 1.1;
    text-decoration: line-through;
}
#wapu-single .wapu-b2b-tier__price strong, #wapu-single .wapu-b2b-tier__price span { font-size: var(--wtds-fs-caption-2, 12px); font-weight: 500; line-height: 1.1; }
#wapu-single .wapu-b2b-tier__qty strong { font-size: var(--wtds-fs-ui, 14px); font-weight: 500; line-height: var(--wtds-lh-base, 1.4); }
#wapu-single .wapu-b2b-tier__note { grid-column: 2; grid-row: 1 / 3; align-self: center; max-width: 11rem; white-space: normal; text-align: right; font-size: var(--wtds-fs-caption-2, 12px); }
/* Solo aviso de stock: debajo del rango y del precio por pieza, sin columna lateral. */
#wapu-single .wapu-b2b-tier__note--stock {
    grid-column: 1;
    grid-row: 3;
    align-self: start;
    justify-self: start;
    max-width: 100%;
    white-space: normal;
    text-align: left;
}
#wapu-single .wapu-b2b-tier:has(.wapu-b2b-tier__note--stock) .wapu-b2b-tier__radio {
    grid-row: 1 / 4;
}
#wapu-single .wapu-b2b-tier .wapu-b2b-tier__radio { position: static; grid-column: 3; grid-row: 1 / 3; align-self: center; }
#wapu-single .wapu-b2b-tier.is-current { background: var(--wtds-fill-2, #f3f4f6); }
#wapu-single .wapu-b2b-tier[role="radio"]:hover { background: var(--wtds-surface-container-low, #f7f7f8); }

/* Each compact choice is its own card. */
#wapu-single .wapu-b2b-front-table__tiers { gap: 8px; border: 0; overflow: visible; }
#wapu-single .wapu-b2b-tier,
#wapu-single .wapu-b2b-tier:last-child { border: 1px solid var(--wapu-b2b-border); border-radius: 8px; }

#wapu-single .wapu-b2b-tier__note--saving { color: #166534; font-weight: 500; }
#wapu-single .wapu-b2b-tier.is-current,
#wapu-single .wapu-b2b-tier[aria-checked="true"] { border-color: #3064ff; background: #fff; }
#wapu-single .wapu-b2b-tier.is-switching::after { display: none; }
#wapu-single .wapu-b2b-tier[aria-checked="true"] .wapu-b2b-tier__radio { border-color: #3064ff; }
#wapu-single .wapu-b2b-tier[aria-checked="true"] .wapu-b2b-tier__radio::after { background: #3064ff; }

/* Check indicator like Extras; the tier remains a single-choice control. */
#wapu-single .wapu-b2b-tier[aria-checked="true"] .wapu-b2b-tier__radio::after {
    width: 7px; height: 4px; border: 0; border-left: 2px solid #3064ff; border-bottom: 2px solid #3064ff;
    border-radius: 0; background: transparent; transform: translateY(-1px) rotate(-45deg);
}

#wapu-single .wapu-b2b-totals > div > :last-child,
#wapu-single .wapu-b2b-totals > div > :last-child * { font-weight: 500 !important; }

#wapu-single .wapu-b2b-totals > div > :last-child * {
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    color: inherit !important;
    display: inline;
}

/* Same SVG check geometry as extra options, retaining single-choice behavior. */
.wapu-b2b-tier .wapu-b2b-tier__radio svg { display:block; width:14px; height:14px; visibility:hidden; }
.wapu-b2b-tier[aria-checked="true"] .wapu-b2b-tier__radio svg { visibility:visible; }
.wapu-b2b-tier .wapu-b2b-tier__radio::after { display:none!important; }

/* 7.7.29 — Choicebox canonical single layout. This block wins over historical tier layouts. */
#wapu-single .wapu-b2b-front-table__tiers {display:flex;flex-direction:column;gap:8px;border:0;overflow:visible}
#wapu-single .wapu-b2b-tier,
#wapu-single .wapu-b2b-tier:last-child {
 display:grid;grid-template-columns:18px minmax(0,1fr) minmax(0,max-content);grid-template-rows:auto;
 gap:4px 12px;align-items:center;min-height:68px;padding:12px 14px;
 border:1px solid var(--wapu-b2b-border);border-radius:var(--wtds-r-md,10px);
 background:var(--wtds-surface-2,#f7f7f8);cursor:pointer;
 transition:background-color .18s ease,border-color .18s ease;
}
#wapu-single .wapu-b2b-tier.is-current,
#wapu-single .wapu-b2b-tier[aria-checked="true"] {background:var(--wtds-fill-2,#f2f3f7);border-color:var(--wtds-primary,#3064ff)}
#wapu-single .wapu-b2b-tier[aria-disabled="true"] {cursor:not-allowed;opacity:.65}
#wapu-single .wapu-b2b-tier .wapu-b2b-tier__radio,
#wapu-single .wapu-b2b-tier:has(.wapu-b2b-tier__note--stock) .wapu-b2b-tier__radio {
 display:flex;position:static;grid-column:1;grid-row:1;align-self:center;justify-self:center;
 width:16px;height:16px;border:1.5px solid var(--wtds-ink-3,#858585);border-radius:50%;
 align-items:center;justify-content:center;box-sizing:border-box;background:transparent;
}
#wapu-single .wapu-b2b-tier__radio svg {display:none!important}
#wapu-single .wapu-b2b-tier[aria-checked="true"] .wapu-b2b-tier__radio {border-color:var(--wtds-primary,#3064ff);background:var(--wtds-primary,#3064ff)}
#wapu-single .wapu-b2b-tier[aria-checked="true"] .wapu-b2b-tier__radio::before {content:"";width:6px;height:6px;border-radius:50%;background:#fff}
#wapu-single .wapu-b2b-tier__main {display:flex;flex-direction:column;grid-column:2;grid-row:1;gap:2px;min-width:0}
#wapu-single .wapu-b2b-tier__qty strong {font-size:var(--wtds-fs-ui,14px);font-weight:600}
#wapu-single .wapu-b2b-tier__side {display:flex;flex-direction:column;grid-column:3;grid-row:1;align-items:flex-end;justify-content:center;gap:2px;min-width:0;text-align:right}
#wapu-single .wapu-b2b-tier__price {display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:2px;text-align:right}
#wapu-single .wapu-b2b-tier__price strong {font-size:var(--wtds-fs-ui,14px);font-weight:650;color:var(--wtds-ink,#111)}
#wapu-single .wapu-b2b-tier__price span {font-size:var(--wtds-fs-caption-2,12px);font-weight:400}
#wapu-single .wapu-b2b-tier__note--stock {display:block;grid-column:2/4;grid-row:2;max-width:none;margin:0;justify-self:start;text-align:left;white-space:normal}
@media(max-width:430px) {
 #wapu-single .wapu-b2b-tier,#wapu-single .wapu-b2b-tier:last-child {grid-template-columns:18px minmax(0,1fr) minmax(0,max-content);gap:4px 8px;padding:11px 10px}
 #wapu-single .wapu-b2b-tier__price strong {font-size:var(--wtds-fs-caption-1,13px)}
}

/* A single tier keeps its quantity contract while its choice card stays hidden. */
.wapu-b2b-front-table__tiers[hidden] { display:none!important; }