/* Módulo Carrito B2B (Ecomm): botones de compra, selector de cantidad, modal y avisos */
:root {
    --ecomm-primary: var(--b2b-primary, #1B5585);
    --ecomm-line: var(--b2b-line, #E3E9EE);
    --ecomm-soft: var(--b2b-soft, #F4F7F9);
    --ecomm-muted: var(--b2b-muted, #6B7A88);
}

.ecomm-buy { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; white-space: nowrap; }
.ecomm-buy--full { width: 100%; margin-top: .6rem; padding: .55rem; font-size: .88rem; }
.ecomm-buy.is-busy { pointer-events: none; }
.ecomm-buy.is-busy .icon { animation: ecomm-spin .8s linear infinite; }
@keyframes ecomm-spin { to { transform: rotate(360deg); } }
/* Confirmación "Añadido" sobre el propio botón */
.ecomm-buy.is-done, #add-to-cart-button.is-done { color: transparent !important; background-color: var(--b2b-ok, #12A150) !important; border-color: var(--b2b-ok, #12A150) !important; box-shadow: 0 8px 18px -8px rgba(18, 161, 80, .8) !important; }
.ecomm-buy.is-done > *, #add-to-cart-button.is-done > * { opacity: 0; }
.ecomm-buy.is-done::after, #add-to-cart-button.is-done::after { content: '✓ Añadido'; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-weight: 600; animation: ecomm-done .45s cubic-bezier(.34, 1.56, .64, 1); }
#add-to-cart-button { position: relative; }
@keyframes ecomm-done { from { opacity: 0; transform: scale(.7); } }
.ecomm-buy-row { display: flex; gap: .4rem; margin-top: .6rem; }
.ecomm-buy-row .ecomm-buy { flex: 1; padding: .45rem .6rem; font-size: .88rem; }
.ecomm-buy-row--compact { margin-top: 0; justify-content: flex-end; }
.ecomm-buy-row--compact .ecomm-buy { flex: none; }

.ecomm-qty { display: inline-flex; align-items: stretch; border-radius: 10px; background: var(--ecomm-soft); overflow: hidden; height: 38px; box-shadow: inset 0 0 0 1px var(--ecomm-line); transition: box-shadow .2s; }
.ecomm-qty:focus-within { box-shadow: inset 0 0 0 1px var(--ecomm-primary), 0 0 0 4px rgba(27, 85, 133, .1); }
.ecomm-qty button { width: 30px; border: 0; background: transparent; color: #0F1B2A; font-size: 1rem; line-height: 1; transition: background .2s, color .2s; }
.ecomm-qty button:hover:not([disabled]) { background: rgba(15, 27, 42, .06); color: var(--ecomm-primary); }
.ecomm-qty button[disabled] { opacity: .4; }
.ecomm-qty input { width: 38px; border: 0; background: transparent; text-align: center; font-weight: 600; font-size: .9rem; -moz-appearance: textfield; outline: none; font-variant-numeric: tabular-nums; }
.ecomm-qty input::-webkit-outer-spin-button, .ecomm-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ecomm-qty--sm { height: 34px; }

/* Modal */
body.ecomm-modal-open { overflow: hidden; }
.ecomm-modal { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; padding: 1rem; background: rgba(9, 18, 30, 0); transition: background .3s, backdrop-filter .3s; }
.ecomm-modal.is-open { background: rgba(9, 18, 30, .5); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.ecomm-modal__dialog { width: min(820px, 100%); max-height: calc(100vh - 2rem); display: flex; flex-direction: column; background: #fff; border-radius: 22px; box-shadow: 0 40px 90px -20px rgba(0, 0, 0, .45); overflow: hidden; transform: translateY(16px) scale(.97); opacity: 0; transition: transform .45s cubic-bezier(.34, 1.56, .64, 1), opacity .25s; }
.ecomm-modal.is-open .ecomm-modal__dialog { transform: none; opacity: 1; }
.ecomm-modal__loading { padding: 3rem; text-align: center; color: var(--ecomm-muted); }
.ecomm-qb { display: flex; flex-direction: column; min-height: 0; }
.ecomm-qb__head { display: flex; gap: 1rem; align-items: center; padding: 1.1rem 1.25rem; border-bottom: 1px solid var(--ecomm-line); }
.ecomm-qb__img img { width: 72px; height: 72px; object-fit: contain; border-radius: 10px; background: var(--ecomm-soft); mix-blend-mode: multiply; }
.ecomm-qb__title { flex: 1; min-width: 0; }
.ecomm-qb__title h2 { font-size: 1.1rem !important; margin: .1rem 0 .2rem; }
.ecomm-qb__title a { font-size: .8rem; font-weight: 600; text-decoration: none; }
.ecomm-qb__ref { font-size: .72rem; color: var(--ecomm-muted); font-weight: 600; letter-spacing: .02em; }
.ecomm-qb__close { width: 38px; height: 38px; border: 0; border-radius: 50%; background: var(--ecomm-soft); font-size: 1.4rem; line-height: 1; color: #1D1D1F; flex: none; }
.ecomm-qb__close:hover { background: #E4EBF0; }
.ecomm-qb__table { overflow: auto; min-height: 0; }
.ecomm-qb__table table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.ecomm-qb__table th { position: sticky; top: 0; z-index: 1; background: #fff; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ecomm-muted); padding: .7rem 1.25rem; border-bottom: 1px solid var(--ecomm-line); }
.ecomm-qb__table td { padding: .55rem 1.25rem; border-bottom: 1px solid var(--ecomm-line); vertical-align: middle; }
.ecomm-qb__table tr.is-selected td { background: var(--b2b-primary-50, #E9F1F8); }
.ecomm-qb__code { font-family: var(--b2b-mono, ui-monospace, monospace); font-weight: 600; white-space: nowrap; }
.ecomm-qb__opts { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .2rem; }
.ecomm-qb__opts span { font-size: .72rem; padding: .05rem .4rem; border-radius: 5px; border: 1px solid var(--ecomm-line); white-space: nowrap; }
.ecomm-qb__price { white-space: nowrap; }
.ecomm-qb__price del { color: #8C98A4; font-size: .78rem; margin-right: .3rem; }
.ecomm-qb__foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1.25rem; border-top: 1px solid var(--ecomm-line); background: var(--ecomm-soft); }
.ecomm-qb__summary { font-size: .85rem; color: var(--ecomm-muted); font-weight: 600; }
.ecomm-stock { font-size: .78rem; font-weight: 600; white-space: nowrap; }
.ecomm-stock--ok { color: var(--b2b-ok, #18A957); }
.ecomm-stock--low { color: var(--b2b-low, #E39300); }
.ecomm-stock--out { color: var(--b2b-out, #E5484D); }

/* Avisos */
.ecomm-toasts { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 2100; display: flex; flex-direction: column; gap: .6rem; max-width: min(380px, calc(100vw - 2rem)); }
.ecomm-toast { position: relative; padding: .85rem 1.1rem .85rem 2.6rem; border-radius: 14px; background: rgba(11, 22, 34, .92); color: #fff; font-size: .86rem; line-height: 1.45; box-shadow: 0 20px 44px -12px rgba(0, 0, 0, .45), 0 0 0 1px rgba(255, 255, 255, .06); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); animation: ecomm-in .5s cubic-bezier(.34, 1.56, .64, 1); transition: opacity .35s, transform .35s; }
.ecomm-toast::before { content: 'i'; position: absolute; left: .9rem; top: .85rem; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: var(--b2b-accent, #2FA6CB); font-size: .72rem; font-weight: 700; }
.ecomm-toast--success::before { content: '✓'; background: #12A150; }
.ecomm-toast--error::before { content: '!'; background: #E5484D; }
.ecomm-toast.is-out { opacity: 0; transform: translateX(16px) scale(.98); }
@keyframes ecomm-in { from { opacity: 0; transform: translateY(14px) scale(.96); } }
@media (max-width: 575px) {
    .ecomm-qb__table th:nth-child(2), .ecomm-qb__table td:nth-child(2) { display: none; }
    .ecomm-qb__table td, .ecomm-qb__table th { padding-left: .75rem; padding-right: .75rem; }
}