/* Marcas Originales Socios — reglas propias del portal, del pago y del carrito lateral. Los componentes del sistema
   (.mo-btn, .mo-chip, .mo-toast…) están en mo-componentes.css, que se carga antes como dependencia (tienda Fase 2.9). */
/* === Fase 2 · Transversales (B2) === */
/* Reglas que vivían en <style> y style="" de las plantillas transversales (acceso, layout, drawer, filtros, categorías,
   tarjeta de producto, socio suspendido). Solo tokens; foco del sistema (borde dorado 1px + shadow-focus); 44 px en táctiles. */

/* -- Acceso y registro (templates/auth/acceso-dual.php) -- */
.mo.mo-auth-container { max-width: 810px; margin: var(--space-6) auto var(--space-8); background: transparent; display: grid; gap: var(--space-5); }
/* El registro usa el ancho completo (810 px); acceso, recuperar, restablecer, pestañas y avisos quedan en 620 px. */
.mo.mo-auth-container > *:not(#tab-socio-registro) { width: 100%; max-width: 620px; justify-self: center; }
.mo .mo-auth-tabs { gap: var(--space-2); border-bottom: 0; }
/* Pestaña activa: negra con texto blanco. Inactiva: blanca con borde y texto negro. */
.mo .mo-auth-tabs .mo-tab { flex: 1; min-height: 48px; margin: 0; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--surface-raised); color: var(--ink); font-family: var(--font-display); font-size: 15px; font-weight: 600; box-shadow: none; }
.mo .mo-auth-tabs .mo-tab:hover { border-color: var(--ink); }
.mo .mo-auth-tabs .mo-tab.active { background: var(--ink); border-color: var(--ink); color: var(--on-ink); }
.mo .mo-auth-tabs .mo-tab:focus-visible { outline: none; border-color: var(--gold); box-shadow: var(--shadow-focus); }
.mo .mo-tab-content { display: none; }
.mo .mo-tab-content.active { display: block; }
.mo .mo-login-card { display: grid; gap: var(--space-2); }
.mo .mo-auth-sub { margin: 0; }
.mo .mo-form { display: grid; gap: var(--space-5); }
.mo .mo-auth-form { margin-top: var(--space-4); }
.mo .mo-form-actions { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.mo .mo-form-actions--center { justify-content: center; }
/* Ojo de contraseña: objetivo táctil de 44 px dentro del campo. */
.mo .mo-input-has-eye { padding-right: 48px; }
.mo .mo-toggle-password { position: absolute; right: 0; top: 0; display: grid; place-items: center; width: 44px; height: 44px; min-height: 0; padding: 0; border: 1px solid transparent; border-radius: var(--radius-md); background: transparent; color: var(--muted); cursor: pointer; box-shadow: none; }
.mo .mo-toggle-password:hover { color: var(--ink); }
.mo .mo-toggle-password:focus-visible { outline: none; border-color: var(--gold); box-shadow: var(--shadow-focus); }
.mo .mo-toggle-password svg { display: block; pointer-events: none; }
/* Captcha: ancho de una columna del formulario; en móvil, ancho completo. */
.mo .mo-captcha { width: calc(50% - var(--space-4) / 2); min-width: 300px; }
.mo .mo-captcha:empty { display: none; }
.mo .mo-rp-error { display: block; color: var(--danger); }
.mo .mo-rp-error:empty { display: none; }
/* Registro: cabecera, plan e inversión */
.mo .mo-reg-header { display: grid; justify-items: center; gap: var(--space-2); text-align: center; margin: 0 0 var(--space-5); }
.mo .mo-reg-logo { display: block; width: 112px; height: auto; margin-bottom: var(--space-3); }
.mo .mo-reg-title, .mo .mo-reg-subtitle { margin: 0; }
.mo .mo-reg-section-title { margin: var(--space-6) 0 var(--space-4); }
.mo .mo-reg-plan-name, .mo .mo-reg-plan-price, .mo .mo-reg-plan-desc, .mo .mo-reg-plan-perk { margin: 0; }
.mo .mo-reg-investment { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); flex-wrap: wrap; margin-top: var(--space-4); padding: var(--space-4) var(--space-5); }
.mo .mo-reg-investment-label { display: block; }
.mo .mo-reg-investment-name { font-weight: 600; color: var(--ink); }
.mo .mo-reg-investment-amount { display: grid; text-align: right; }
.mo .mo-reg-investment-amount span { font-size: 13px; line-height: 20px; color: var(--muted); }
.mo #mo-form-register-buyer { display: grid; gap: var(--space-5); }
.mo #mo-form-register-buyer .mo-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); align-items: start; }
/* Un error que ocupa dos líneas no mueve ni estira el campo vecino: cada campo queda arriba con su alto natural. */
.mo #mo-form-register-buyer .mo-form-row > .mo-field { display: flex; flex-direction: column; justify-content: flex-start; align-self: start; }
.mo #mo-form-register-buyer .mo-form-row > .mo-field > .mo-input, .mo #mo-form-register-buyer .mo-form-row > .mo-field > .mo-select, .mo #mo-form-register-buyer .mo-form-row > .mo-field > .mo-control { flex: none; }
.mo #mo-form-register-buyer .mo-help { margin: 0; }
.mo #mo-form-register-buyer .mo-field-error { display: none; font-size: 13px; line-height: 20px; color: var(--danger); }
.mo #mo-form-register-buyer .has-error .mo-field-error { display: block; }
.mo #mo-form-register-buyer .has-error .mo-input, .mo #mo-form-register-buyer .has-error .mo-select { border-color: var(--danger); background: var(--danger-soft); }
.mo .mo-reg-login-link { border-top: 1px solid var(--line); padding-top: var(--space-4); text-align: center; }
/* Pago de la membresía y de pedidos: tarjeta, total y pasarelas (D-19: QR y transferencia). */
.mo .mo-card-gateway { display: grid; gap: var(--space-4); }
.mo .mo-gateway-header { display: grid; gap: var(--space-2); }
.mo .mo-gateway-title, .mo .mo-gateway-sub, .mo .mo-checkout-total-row, .mo .mo-reset-checkout-link, .mo .mo-methods-label { margin: 0; }
.mo .mo-reset-checkout-link .mo-link { margin-left: var(--space-1); }
.mo .mo-divider-soft { border: 0; border-top: 1px solid var(--line); margin: 0; }
.mo-pago-membresia { max-width: 640px; margin: var(--space-8, 48px) auto; padding: 0 var(--space-4); }
/* WoodMart decora #order_review de la página de pago con un borde dentado arriba y abajo: la tarjeta va lisa. */
.mo.mo-pago-membresia #order_review.mo-card::before, .mo.mo-pago-membresia #order_review.mo-card::after { display: none; content: none; }
/* Logos: fichas del mismo tamaño, alineadas en un solo eje. */
.mo .mo-pago-logos { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); list-style: none; margin: 0; padding: 0; }
.mo .mo-pago-logos li { display: flex; align-items: center; justify-content: center; flex: none; box-sizing: border-box; width: 80px; height: 44px; margin: 0; padding: 0 var(--space-2); border: 1px solid var(--line); border-radius: var(--radius-md); background: #fff; }
.mo .mo-pago-logos img { display: block; width: auto; height: auto; max-width: 60px; max-height: 24px; object-fit: contain; }
.mo .mo-pago-logos img[alt="Yape"] { max-height: 34px; }
.mo .mo-pago-logos .mo-pago-logos--oscuro { background: var(--ink); border-color: var(--ink); }
/* Pasarelas con el sistema de diseño: tarjetas, tipografía, campos y selects. */
.mo #payment.mo-pago-pasarelas { display: grid; gap: var(--space-4); padding: 0; background: none; border-radius: 0; }
.mo .mo-pago-pasarelas .wc_payment_methods { display: grid; gap: var(--space-3); list-style: none; margin: 0; padding: 0; border: 0; }
.mo .mo-pago-pasarelas .wc_payment_method { margin: 0; padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-raised); }
.mo .mo-pago-pasarelas .wc_payment_method:has(> input:checked) { border-color: var(--ink); }
.mo .mo-pago-pasarelas .wc_payment_method > label { display: inline-flex; align-items: center; gap: var(--space-2); margin: 0; font-family: var(--font-display); font-size: 15px; font-weight: 600; color: var(--ink); }
.mo .mo-pago-pasarelas .wc_payment_method > input[type="radio"] { accent-color: var(--ink); }
.mo .mo-pago-pasarelas .payment_box { margin: var(--space-3) 0 0; padding: 0; background: none; font-family: var(--font-text); }
.mo .mo-pago-pasarelas .payment_box::before { display: none; }
.mo .mo-pago-pasarelas .payment_box { box-shadow: none !important; border: 0 !important; }
/* Radio y nombre de la pasarela en una sola línea; el formulario ocupa todo el ancho debajo. */
.mo .mo-pago-pasarelas .wc_payment_method { display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: var(--space-2); }
.mo .mo-pago-pasarelas .wc_payment_method > input[type="radio"] { margin: 0; }
.mo .mo-pago-pasarelas .wc_payment_method > label { min-width: 0; flex-wrap: nowrap; }
.mo .mo-pago-pasarelas .wc_payment_method > .payment_box { grid-column: 1 / -1; }
/* El aviso de Yape del plugin vive en shadow DOM (no admite estilos): se reemplaza por un mo-alert con su mismo texto (membresia.php). */
.mo .mo-pago-pasarelas checkout-notice { display: none; }
.mo .mo-pago-pasarelas .form-row { margin: 0; padding: 0; }
/* Botón especial (glow) del sistema; el tema estiliza #place_order con más peso. */
.mo #payment #place_order.mo-btn--glow { width: 100%; min-height: 56px; padding: 0 32px; border: 0; border-radius: var(--radius-pill); color: var(--ink); font-family: var(--font-display); font-size: 15px; font-weight: 600; line-height: 20px; text-transform: none; letter-spacing: 0; background: #fff; box-shadow: inset 0 0 0 2px rgb(255 255 255 / .95), inset 0 3px 2px -2px #fff, inset 0 -4px 6px -3px rgb(255 255 255 / .9), inset 0 10px 16px -12px rgb(0 0 0 / .12), 0 0 0 1px rgb(28 28 28 / .1), 0 1px 2px rgb(0 0 0 / .08), 0 12px 24px -14px rgb(0 0 0 / .38); }
.mo #payment #place_order.mo-btn--glow:hover, .mo #payment #place_order.mo-btn--glow:focus-visible { color: var(--ink); box-shadow: inset 0 0 0 2px rgb(255 255 255 / .95), 0 0 28px -6px rgb(203 149 0 / .5), 0 12px 24px -14px rgb(0 0 0 / .38); }
/* Enlace de Términos y Condiciones en negro y subrayado, como en el checkout de la tienda. */
.mo .woocommerce-terms-and-conditions-wrapper a, .mo .woocommerce-terms-and-conditions-wrapper a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
/* Avisos de WooCommerce (pago rechazado, pago aceptado, etc.) en la página de pago y en el portal: se imprimen fuera de
   los componentes .mo, así que toman aquí el estilo de mo-alert (danger, success, info). */
.mo-pago-pagina .woocommerce-notices-wrapper { max-width: 640px; margin: var(--space-6, 32px) auto 0; padding: 0 var(--space-4); }
.mo-pago-pagina .woocommerce-notices-wrapper:empty, .mo-shell-body .woocommerce-notices-wrapper:empty { display: none; }
.mo-shell-body .woocommerce-notices-wrapper { display: grid; gap: var(--space-3); margin: 0 0 var(--space-4); }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 12px; align-items: flex-start; margin: 0; padding: 14px 16px !important; list-style: none; border: 0; border-radius: var(--radius-md); background: var(--info-soft); color: var(--ink-2); font-family: var(--font-text); font-size: 14px; line-height: 20px; font-weight: 400; box-shadow: none; }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) .woocommerce-error { background: var(--danger-soft); }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) .woocommerce-message { background: var(--success-soft); }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info)::before { content: ""; position: static; flex: none; width: 28px; height: 28px; margin: -4px 0 0; border-radius: 999px; font-size: 0; background: var(--ink-2) center / 16px 16px no-repeat url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27white%27%20stroke-width%3D%272.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2011v6%27/%3E%3Cpath%20d%3D%27M12%207h.01%27/%3E%3C/svg%3E"); }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) .woocommerce-error::before { background-color: var(--danger); background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27white%27%20stroke-width%3D%272.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%207v6%27/%3E%3Cpath%20d%3D%27M12%2017h.01%27/%3E%3C/svg%3E"); }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) .woocommerce-message::before { background-color: var(--success); background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27white%27%20stroke-width%3D%272.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M5%2012.5l4.5%204.5L19%207.5%27/%3E%3C/svg%3E"); }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) li { flex: 1 1 auto; min-width: 0; margin: 0; padding: 0; color: var(--ink-2); font-family: var(--font-text); }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) br { display: none; }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) strong { display: block; color: var(--ink); font-weight: 600; }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) a { color: var(--ink); text-decoration: underline; }
:is(.mo-pago-pagina, .mo-shell-body) :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) .button { order: 2; float: none; min-height: 0; margin: 0 0 0 auto; padding: 0; border: 0; background: none; box-shadow: none; color: var(--ink); font-family: var(--font-text); font-size: 14px; line-height: 20px; font-weight: 600; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.mo .mo-field__head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); }
.mo .mo-input-prefix { position: absolute; left: 14px; font-weight: 700; color: var(--muted); pointer-events: none; }
.mo .mo-input--prefixed { padding-left: 50px; }
@media (max-width: 640px) {
	.mo #mo-form-register-buyer .mo-form-row { grid-template-columns: 1fr; gap: var(--space-5); }
	.mo .mo-captcha { width: 100%; min-width: 0; }
	.mo .mo-reg-investment-amount { text-align: left; }
	.mo .mo-login-card, .mo .mo-card-gateway { padding: var(--space-5) var(--space-4); }
}

/* -- Portal: página de ancho completo y vista principal (templates/portal/layout.php) -- */
/* Fuera de .mo: sin barra lateral ni título de WoodMart y a ancho completo solo en la página que contiene el portal. */
body:has(#mo-partner-portal) :is(.sidebar-container, .woodmart-sidebar, aside.sidebar-right, .widget-area, .woodmart-sidebar-content, .area-sidebar-1, .page-title-default, .page-title) { display: none !important; }
body:has(#mo-partner-portal) :is(.content-layout-wrapper, .site-content, .main-page-wrapper, .entry-content),
.mo.mo-partner-portal-wrapper { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; margin-top: 0 !important; margin-bottom: 0 !important; padding-top: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
body:has(#mo-partner-portal) .main-page-wrapper > .container { max-width: 100% !important; width: 100% !important; padding-top: 0 !important; padding-left: 0 !important; padding-right: 0 !important; margin-top: 0 !important; }
.mo.mo-partner-portal-wrapper { background: var(--canvas); }
.mo .mo-portal-statusbar { min-height: 44px; padding: 0 16px; justify-content: center; flex-wrap: wrap; column-gap: var(--space-5); }
.mo .mo-portal-statusbar .mo-statusbar__dot { background: var(--on-ink); box-shadow: none; animation: mo-dot-pulse 1.8s ease-in-out infinite; }
@keyframes mo-dot-pulse { 0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--on-ink) 55%, transparent); } 70% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--on-ink) 0%, transparent); } }
.mo .mo-partner-main-container { max-width: 1320px; margin: 0 auto; padding: var(--space-5) var(--space-5) var(--space-7); display: grid; gap: var(--space-section); }
.mo .mo-partner-main-container > * { min-width: 0; }
/* Barra de progreso por pasos (meta de 3 compras): el ancho sale de data-step, sin style="". */
.mo .mo-progress--steps > span { width: 0; }
.mo .mo-progress--steps[data-step="1"] > span { width: 33.333%; }
.mo .mo-progress--steps[data-step="2"] > span { width: 66.667%; }
.mo .mo-progress--steps[data-step="3"] > span { width: 100%; }
/* Progreso de compras y saldo a favor (solo vista principal) */
.mo .mo-membership-refund-alert { display: flex; align-items: center; gap: var(--space-4); }
.mo .mo-refund-info { padding: var(--space-4) var(--space-5); border-radius: var(--radius-lg); }
.mo .mo-refund-alert-icon { width: 44px; height: 44px; flex: none; border-radius: var(--radius-pill); display: grid; place-items: center; background: var(--gold-soft); color: var(--gold-ink); }
.mo .mo-refund-alert-body { flex: 1; min-width: 0; display: grid; gap: 6px; }
.mo .mo-refund-alert-title, .mo .mo-refund-alert-desc { margin: 0; }
.mo .mo-refund-alert-badge { flex: none; }
/* Catálogo */
.mo .mo-products-catalog-section { display: grid; gap: var(--space-5); }
.mo .mo-products-catalog-section.is-loading { opacity: .5; }
.mo .mo-catalog-heading { display: grid; gap: 4px; }
.mo .mo-btn-filter-submit, .mo .mo-btn-filter-reset { min-height: 44px; }
.mo .mo-no-products-msg { grid-column: 1 / -1; border: 1px dashed var(--line-strong); border-radius: var(--radius-lg); background: var(--surface); }
.mo .mo-catalog-pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: var(--space-2); }
.mo .mo-catalog-pagination .page-numbers { display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--surface-raised); color: var(--ink); font-size: 14px; font-weight: 600; text-decoration: none; }
.mo .mo-catalog-pagination .page-numbers:hover { border-color: var(--ink); }
.mo .mo-catalog-pagination .page-numbers:focus-visible { outline: none; border-color: var(--gold); box-shadow: var(--shadow-focus); }
.mo .mo-catalog-pagination .page-numbers.current { background: var(--ink); border-color: var(--ink); color: var(--on-ink); }
@media (max-width: 640px) {
	.mo .mo-membership-refund-alert { flex-wrap: wrap; }
	.mo .mo-partner-main-container { padding: var(--space-4) var(--space-4) var(--space-6); }
}
@media (prefers-reduced-motion: reduce) { .mo .mo-portal-statusbar .mo-statusbar__dot { animation: none; } }

/* -- Drawer del socio y botón Menú Socio (templates/portal/drawer-offcanvas.php) -- */
/* El botón del header, el fondo y el ítem de la barra móvil viven en el header de WoodMart, fuera de .mo:
   van sin prefijo y con !important para ganarle al tema. mo-portal.css se carga en todo el sitio para socios activos. */
.mo-header-socio-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; height: 44px !important; padding: 0 18px !important; margin-right: 15px !important; border: 1px solid var(--ink) !important; border-radius: var(--radius-md) !important; background: var(--ink) !important; color: var(--on-ink) !important; font-family: var(--font-display) !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0 !important; text-transform: none !important; white-space: nowrap !important; box-shadow: none !important; cursor: pointer !important; align-self: center !important; z-index: 10 !important; transition: background .15s ease !important; }
.mo-header-socio-btn:hover { background: var(--ink-hover) !important; color: var(--on-ink) !important; }
.mo-header-socio-btn:focus-visible { outline: none !important; border-color: var(--gold) !important; box-shadow: var(--shadow-focus) !important; }
.mo-header-socio-btn svg { display: inline-block; vertical-align: middle; }
.mo-sidebar-backdrop { position: fixed; inset: 0; background: color-mix(in srgb, var(--ink) 45%, transparent); z-index: 99998; opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease; }
.mo-sidebar-backdrop.open, .mo-sidebar-backdrop.mo-active { opacity: 1; visibility: visible; }
.mo.mo-offcanvas-sidebar { position: fixed; top: 0; left: 0; width: 320px; max-width: 86vw; height: 100vh; display: flex; flex-direction: column; overflow-x: hidden; overflow-y: auto; scrollbar-width: none; background: var(--surface-raised) !important; border-right: 1px solid var(--line); box-shadow: var(--shadow-pop); z-index: 99999; transform: translateX(-100%); transition: transform .3s cubic-bezier(.22,1,.36,1); }
.mo.mo-offcanvas-sidebar.open, .mo.mo-offcanvas-sidebar.mo-open { transform: translateX(0); }
/* Sin barras de desplazamiento visibles (se sigue pudiendo desplazar con la rueda o el dedo). */
.mo.mo-offcanvas-sidebar::-webkit-scrollbar { display: none; }
.mo .mo-drawer-user-box > * { min-width: 0; }
.mo .mo-drawer-header { display: flex; justify-content: space-between; align-items: center; padding: 18px 20px; border-bottom: 1px solid var(--line); }
.mo .mo-drawer-logo { display: block; width: 56px; height: auto; }
.mo .mo-drawer-close { display: grid; place-items: center; width: 44px; height: 44px; min-height: 0; padding: 0; border: 1px solid transparent; border-radius: var(--radius-pill); background: transparent; color: var(--muted); cursor: pointer; box-shadow: none; }
.mo .mo-drawer-close:hover { background: var(--subtle); color: var(--ink); }
.mo .mo-drawer-close:focus-visible { outline: none; border-color: var(--gold); box-shadow: var(--shadow-focus); }
.mo .mo-drawer-user-box { display: grid; gap: 12px; padding: 20px; border-bottom: 1px solid var(--line); }
.mo .mo-drawer-user-title { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.mo .mo-drawer-name { font-family: var(--font-display); font-size: 16px; line-height: 22px; font-weight: 700; color: var(--ink); }
.mo .mo-drawer-saldo { padding: 12px 14px; font-weight: 600; }
.mo .mo-drawer-progress { display: grid; gap: 8px; padding: 12px; border-radius: var(--radius-lg); font-size: 14px; }
.mo .mo-drawer-progress .mo-badge { font-size: 11px; padding: 2px 8px; }
.mo .mo-drawer-mayorista { display: grid; gap: 4px; margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--line); }
.mo .mo-toggle--mayorista, .mo .mo-toggle--mayorista .mo-badge { text-transform: none; letter-spacing: 0; }
.mo .mo-toggle--mayorista { width: 100%; min-height: 36px; gap: var(--space-2); }
.mo .mo-toggle--mayorista .mo-toggle__track { width: 36px; height: 20px; background: var(--danger); }
.mo .mo-toggle--mayorista .mo-toggle__track::after { top: 3px; left: 3px; width: 14px; height: 14px; }
.mo .mo-toggle--mayorista[aria-checked="true"] .mo-toggle__track { background: var(--success); }
.mo .mo-toggle--mayorista[aria-checked="true"] .mo-toggle__track::after { transform: translateX(16px); }
.mo .mo-toggle-mayorista__label { font-size: 14px; font-weight: 600; text-transform: none; letter-spacing: 0; white-space: nowrap; }
.mo .mo-toggle--mayorista .mo-badge { margin-left: auto; }
.mo .mo-drawer-mayorista__hint { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.4; }
.mo .mo-drawer-refund-stat { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.mo .mo-drawer-stat-label { font-size: 14px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.mo .mo-drawer-body { flex: 1; padding: 12px 0; }
.mo .mo-drawer-group { padding: 8px 0; }
/* Título de grupo: sin MAYÚSCULAS forzadas (OBS-36); el texto ya va en Title Case. */
.mo .mo-group-title { display: block; padding: 4px 20px 6px; font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); } /* Antetítulo de grupo (estilo eyebrow): única excepción de mayúsculas, decisión de Rafael 29/10/2026. */
.mo .mo-drawer-menu { list-style: none; margin: 0; padding: 0 12px; }
.mo .mo-drawer-menu li { margin: 0; }
.mo .mo-drawer-menu li a { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 12px; border: 1px solid transparent; border-radius: var(--radius-md); color: var(--ink-2); font-size: 15px; font-weight: 500; text-decoration: none; transition: background .15s ease, color .15s ease; }
.mo .mo-drawer-menu li a .mo-icon { color: var(--muted); }
.mo .mo-drawer-menu li a:hover { background: var(--canvas); color: var(--ink); }
.mo .mo-drawer-menu li a:hover .mo-icon { color: var(--ink); }
.mo .mo-drawer-menu li a.active { background: var(--ink); color: var(--on-ink); font-weight: 600; }
.mo .mo-drawer-menu li a.active .mo-icon { color: var(--gold); }
.mo .mo-drawer-menu li a:focus-visible { outline: none; border-color: var(--gold); box-shadow: var(--shadow-focus); }
.mo .mo-drawer-menu li a.mo-support-link .mo-icon { color: var(--success); }
.mo .mo-drawer-footer { padding: 16px 20px 20px; border-top: 1px solid var(--line); }
.mo .mo-logout-link { min-height: 44px; font-size: 13px; text-decoration: none; }
.mo .mo-logout-link .mo-icon { width: 16px; height: 16px; }
@media (max-width: 1024px) {
	.mo-header-socio-btn { display: none !important; }
}

/* -- Barra de filtros del catálogo (templates/portal/partials/filtros.php) -- */
.mo .mo-fb { display: grid; gap: var(--space-3); padding: var(--space-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); font-family: var(--font-text); font-size: 14px; }
.mo .mo-fb__form { display: flex; align-items: center; gap: var(--space-3); flex-wrap: nowrap; }
.mo .mo-fb__search { position: relative; flex: 1 1 220px; min-width: 0; height: 44px; margin: 0 !important; background: var(--surface-raised); border: 1px solid var(--line-strong); border-radius: var(--radius-md); transition: border-color .15s; }
/* El foco del buscador lo pinta el contenedor (borde dorado + shadow-focus); el campo interno va sin borde propio. */
.mo .mo-fb__search:focus-within { border-color: var(--gold); box-shadow: var(--shadow-focus); }
.mo .mo-fb__search .mo-fb-ico { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.mo .mo-fb__search .mo-fb__input, .mo .mo-fb__search .mo-fb__input:focus { border: 0 !important; background: transparent !important; box-shadow: none !important; outline: none; border-radius: inherit; }
.mo .mo-fb__input { display: block; width: 100%; min-width: 0; max-width: 100%; margin: 0; height: 42px; min-height: 42px; padding-left: 36px; font-size: 14px; }
.mo .mo-fb__dd { position: relative; flex: 0 0 auto; margin: 0 !important; }
.mo .mo-fb__btn { display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 12px; background: var(--surface-raised); color: var(--ink); border: 1px solid var(--line-strong); border-radius: var(--radius-md); font: 500 13px/1 var(--font-text); text-transform: none; letter-spacing: 0; white-space: nowrap; cursor: pointer; transition: border-color .15s, background .15s; }
.mo .mo-fb__btn:hover { border-color: var(--ink); }
.mo .mo-fb__btn.is-active { border-color: var(--gold); background: var(--gold-soft); color: var(--gold-ink); }
.mo .mo-fb__btn[aria-expanded="true"] .mo-fb-ico:last-child { transform: rotate(180deg); }
.mo .mo-fb__count { font-weight: 600; }
.mo .mo-fb__btn:focus-visible, .mo .mo-fb__submit:focus-visible, .mo .mo-fb__chip:focus-visible, .mo .mo-fb__clear:focus-visible, .mo .mo-fb__check input:focus-visible + .mo-fb__box { outline: none; border-color: var(--gold); box-shadow: var(--shadow-focus); }
.mo .mo-fb__panel { position: absolute; top: calc(100% + 6px); left: 0; z-index: 50; min-width: 220px; max-height: 300px; overflow: auto; padding: var(--space-2); background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-pop); }
.mo .mo-fb__panel--price { min-width: 260px; padding: var(--space-3); }
.mo .mo-fb__list { list-style: none; margin: 0; padding: 0; }
.mo .mo-fb__check { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 8px; border-radius: var(--radius-md); cursor: pointer; font-size: 13px; color: var(--ink); margin: 0; }
.mo .mo-fb__check:hover { background: var(--surface); }
.mo .mo-fb__check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.mo .mo-fb__box { flex: 0 0 18px; width: 18px; height: 18px; border: 1.5px solid var(--line-strong); border-radius: 5px; background: var(--surface-raised); display: grid; place-items: center; transition: background .15s, border-color .15s; }
.mo .mo-fb__check--radio .mo-fb__box { border-radius: var(--radius-pill); }
.mo .mo-fb__check input:checked + .mo-fb__box { background: var(--ink); border-color: var(--ink); }
.mo .mo-fb__check input:checked + .mo-fb__box::after { content: ""; width: 5px; height: 9px; border: solid var(--on-ink); border-width: 0 2px 2px 0; transform: translateY(-1px) rotate(45deg); }
.mo .mo-fb__check--radio input:checked + .mo-fb__box::after { width: 8px; height: 8px; border: 0; border-radius: var(--radius-pill); background: var(--on-ink); transform: none; }
.mo .mo-fb__range { display: flex; align-items: flex-end; gap: var(--space-2); }
.mo .mo-fb__range label { display: grid; gap: 4px; flex: 1; margin: 0; }
.mo .mo-fb__lbl { font-size: 12px; color: var(--muted); }
.mo .mo-fb__num { height: 44px; min-height: 44px; width: 100%; font-size: 14px; }
.mo .mo-fb__dash { padding-bottom: 12px; color: var(--muted); }
.mo .mo-fb__submit { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; padding: 0; background: var(--ink); color: var(--on-ink); border: 1px solid var(--ink); border-radius: var(--radius-md); cursor: pointer; }
.mo .mo-fb__submit:hover { background: var(--ink-hover); border-color: var(--ink-hover); }
.mo .mo-fb__chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.mo .mo-fb__chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px 0 12px; background: var(--gold-soft); color: var(--gold-ink); border: 1px solid var(--gold); border-radius: var(--radius-pill); font-size: 13px; text-decoration: none; }
.mo .mo-fb__chip:hover { background: var(--surface-raised); }
.mo .mo-fb__clear { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 1px solid transparent; border-radius: var(--radius-pill); color: var(--muted); margin-left: var(--space-1); text-decoration: none; }
.mo .mo-fb__clear:hover { background: var(--subtle); color: var(--ink); }
.mo .mo-fb .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 860px) {
	.mo .mo-fb__form { flex-wrap: wrap; }
	.mo .mo-fb__search { flex: 1 1 calc(100% - 56px); }
	.mo .mo-fb__submit { order: 1; }
	.mo .mo-fb__dd { order: 2; }
}
@media (max-width: 480px) {
	.mo .mo-fb__dd { flex: 1 1 calc(50% - var(--space-2)); }
	.mo .mo-fb__btn { width: 100%; justify-content: center; }
	.mo .mo-fb__panel { min-width: 0; width: max(100%, 240px); }
	.mo .mo-fb__dd:nth-of-type(even) .mo-fb__panel { left: auto; right: 0; }
}

/* -- Categorías: dos franjas en movimiento (templates/portal/partials/categorias.php) -- */
html:has(.mo-catstrips), body:has(.mo-catstrips) { overflow-x: clip; } /* 100vw incluye la barra vertical: sin esto la página se desplaza unos píxeles a los lados */
.mo .mo-catstrips { position: relative; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); overflow: hidden; display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-2) 0; }
.mo .mo-catstrip { overflow: hidden; width: 100%; }
.mo .mo-catstrip__track { display: flex; width: max-content; gap: var(--space-4); will-change: transform; }
.mo .mo-catstrip__set { display: flex; gap: var(--space-4); flex-shrink: 0; }
.mo .mo-catcard { position: relative; display: block; flex: 0 0 auto; width: 240px; aspect-ratio: 4 / 5; border-radius: var(--radius-md); overflow: hidden; background: var(--surface); text-decoration: none; color: var(--on-ink); }
.mo .mo-catcard img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; margin: 0; max-width: none; }
.mo .mo-catcard.is-placeholder img { object-fit: contain; padding: var(--space-6); }
.mo .mo-catcard::after { content: ""; position: absolute; inset: auto 0 0 0; height: 45%; background: linear-gradient(to top, color-mix(in srgb, var(--ink) 75%, transparent), transparent); pointer-events: none; }
.mo .mo-catcard__name { position: absolute; left: var(--space-4); right: var(--space-4); bottom: var(--space-4); z-index: 1; font-family: var(--font-display); font-weight: 600; font-size: 18px; line-height: 1.25; color: var(--on-ink); }
.mo .mo-catcard:hover img { transform: scale(1.04); }
.mo .mo-catcard:focus-visible { outline: none; box-shadow: inset 0 0 0 1px var(--gold), var(--shadow-focus); }
@media (max-width: 767px) {
	.mo .mo-catcard { width: 144px; }
	.mo .mo-catcard__name { font-size: 15px; left: var(--space-3); right: var(--space-3); bottom: var(--space-3); }
}
@media (prefers-reduced-motion: reduce) {
	.mo .mo-catstrip { overflow-x: auto; scrollbar-width: thin; }
	.mo .mo-catstrip__track { animation: none; transform: none !important; padding: 0 var(--space-4); }
	.mo .mo-catstrip__set[aria-hidden="true"] { display: none; }
}

/* -- Tarjeta de producto del catálogo (templates/portal/partials/producto-card.php) -- */
/* No usa .mo-product: ese componente lleva un "+" de 36 px sobre la imagen; el catálogo necesita el botón completo
   (Añadir al Carrito / Seleccionar Talla / Sin Existencias) con las clases AJAX de WooCommerce, imagen alterna al
   pasar el cursor y filas de alto fijo. Sí reutiliza .mo-h3, .mo-price, .mo-badge, .mo-btn y .mo-product__retail. */
.mo .mo-partner-products-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-4); }
@media (max-width: 1280px) { .mo .mo-partner-products-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1024px) { .mo .mo-partner-products-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 768px)  { .mo .mo-partner-products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); } }
.mo .mo-pcard { display: flex; flex-direction: column; min-width: 0; background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; transition: border-color .15s ease; }
.mo .mo-pcard:hover { border-color: var(--line-strong); }
.mo .mo-pcard__media { position: relative; display: block; aspect-ratio: 1 / 1; width: 100%; overflow: hidden; background: var(--subtle); }
.mo .mo-pcard__media:focus-visible { outline: none; box-shadow: inset 0 0 0 1px var(--gold), var(--shadow-focus); }
.mo .mo-pcard__img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; margin: 0; transition: opacity .35s ease; }
.mo .mo-pcard__img--hover { opacity: 0; }
.mo .mo-pcard.has-hover:hover .mo-pcard__img--hover, .mo .mo-pcard.has-hover:focus-within .mo-pcard__img--hover { opacity: 1; }
.mo .mo-pcard.has-hover:hover .mo-pcard__img--main, .mo .mo-pcard.has-hover:focus-within .mo-pcard__img--main { opacity: 0; }
.mo .mo-pcard.mo-card-out-of-stock .mo-pcard__img { filter: grayscale(.2); }
.mo .mo-pcard.mo-card-out-of-stock .mo-pcard__media { opacity: .6; }
.mo .mo-pcard .mo-badge-stock-out { position: absolute; top: 10px; left: 10px; z-index: 2; }
/* Etiquetas En Oferta (llama con punto) y Nuevo (destello dorado), como la tarjeta de la tienda (P4, 07/11/2026). */
.mo .mo-pbadge { position: absolute; top: 10px; left: 10px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; max-width: calc(100% - 20px); padding: 5px 9px; border: 1px solid #0000000c; border-radius: 999px; background: #fffffff0; color: #0b0b0b; font: 700 11px/1.2 var(--font-body, 'DM Sans', sans-serif); pointer-events: none; }
.mo .mo-pbadge--oferta i { width: 7px; height: 7px; border-radius: 50%; background: #ff6d00; box-shadow: 0 0 6px #ff9100; animation: mo-titila 1.1s ease-in-out infinite alternate; }
.mo .mo-pbadge--oferta span { background: linear-gradient(0deg, #d50000, #ff6d00 40%, #ffb300 70%, #d50000); background-size: 100% 300%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: mo-llama 1.8s ease-in-out infinite; }
.mo .mo-pbadge--novedad { border-color: #cb950055; }
.mo .mo-pbadge--novedad i { display: grid; width: 10px; height: 10px; }
.mo .mo-pbadge--novedad i svg { width: 10px; height: 10px; fill: #cb9500; filter: drop-shadow(0 0 3px #ffcf4d); animation: mo-destello 1.6s ease-in-out infinite alternate; }
.mo .mo-pbadge--novedad span { background: linear-gradient(90deg, #8a6200, #cb9500, #fff4cf, #cb9500, #8a6200); background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: mo-dorado 2.6s linear infinite; }
@keyframes mo-titila { from { opacity: .55; transform: scale(.8); } to { opacity: 1; transform: scale(1.15); } }
@keyframes mo-llama { 0%, 100% { background-position: 0 0; } 50% { background-position: 0 100%; } }
@keyframes mo-dorado { from { background-position: 150% 0; } to { background-position: -100% 0; } }
@keyframes mo-destello { from { transform: scale(.78) rotate(0); opacity: .75; } to { transform: scale(1.08) rotate(45deg); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .mo .mo-pbadge i, .mo .mo-pbadge span, .mo .mo-pbadge i svg { animation: none; } }
.mo .mo-pcard__body { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 28px 44px; row-gap: var(--space-2); padding: var(--space-3); flex: 1 1 auto; }
/* Nombre siempre a 2 líneas exactas */
.mo .mo-pcard__title { margin: 0; line-height: 1.3; min-height: calc(1.3em * 2); max-height: calc(1.3em * 2); overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.mo .mo-pcard__title a { color: var(--ink); text-decoration: none; }
.mo .mo-pcard__title a:hover, .mo .mo-pcard__title a:focus-visible { color: var(--gold-ink); }
/* Fila de precio fija */
.mo .mo-pcard__price { display: flex; align-items: center; gap: var(--space-2); white-space: nowrap; overflow: hidden; height: 28px; }
/* Botón compacto en una línea, 44 px */
.mo .mo-pcard .mo-pcard__btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%; height: 44px; min-height: 44px; padding: 0 10px; font-size: 13px; line-height: 1; text-transform: none; letter-spacing: 0; white-space: nowrap; overflow: hidden; }
.mo .mo-pcard .mo-pcard__btn svg { width: 16px; height: 16px; flex: 0 0 16px; }
.mo .mo-pcard .mo-pcard__btn span { overflow: hidden; text-overflow: ellipsis; }
.mo .mo-pcard__action { min-width: 0; }
/* Móvil: el texto entra completo en la tarjeta, también si el celular agranda la letra. */
@media (max-width: 480px) {
	.mo .mo-pcard { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
	.mo .mo-pcard .mo-pcard__btn { gap: 4px; padding: 0 6px; font-size: 12px; }
	.mo .mo-pcard .mo-pcard__btn svg { display: none; }
}
/* Sin el enlace "Ver carrito" de WooCommerce: el carrito lateral muestra lo añadido */
.mo .mo-pcard a.added_to_cart { display: none !important; }
/* Hover y foco de Añadir al Carrito: cristal claro y anillo dorado que gira (versión con tokens del botón glow). */
.mo .mo-pcard .mo-btn-add-cart { position: relative; isolation: isolate; overflow: visible; }
.mo .mo-pcard .mo-btn-add-cart::before { content: ""; position: absolute; inset: -2px; padding: 2px; border-radius: inherit; background: conic-gradient(from var(--mo-glow-angle), var(--gold-ink), var(--gold), var(--gold-soft), var(--gold), var(--gold-ink)); -webkit-mask: linear-gradient(var(--ink) 0 0) content-box, linear-gradient(var(--ink) 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: 0; transition: opacity .4s ease; z-index: -1; animation: mo-glow-spin 3s linear infinite; pointer-events: none; }
.mo .mo-pcard .mo-btn-add-cart:hover, .mo .mo-pcard .mo-btn-add-cart:focus-visible { border-color: transparent; color: var(--ink); background: var(--surface-raised); box-shadow: 0 0 28px -6px color-mix(in srgb, var(--gold) 50%, transparent), var(--shadow-card); }
.mo .mo-pcard .mo-btn-add-cart:hover::before, .mo .mo-pcard .mo-btn-add-cart:focus-visible::before { opacity: 1; }
.mo .mo-pcard .mo-btn-add-cart:active { transform: scale(.98); }
.mo .mo-pcard .mo-btn-add-cart.loading { opacity: .7; pointer-events: none; }
.mo .mo-pcard .mo-btn-out-stock { cursor: not-allowed; opacity: .6; }

/* -- Socio suspendido (templates/portal/socio-suspendido.php) -- */
.mo.mo-suspended-wrap { max-width: 560px; margin: var(--space-8) auto; padding: 0 var(--space-4); background: transparent; }
.mo .mo-suspended-card { padding: var(--space-7) var(--space-5) var(--space-6); }
.mo .mo-suspended-icon { background: var(--warning-soft); color: var(--warning); }
.mo .mo-suspended-icon .mo-icon { stroke-width: 1.75; }
.mo .mo-suspended-desc, .mo .mo-suspended-info { max-width: 440px; }

/* Estructura propia del portal (3.2, OBS-53): header y footer de la plataforma, sin los de la tienda B2C. */
.mo-shell-body { margin: 0; background: var(--surface); }
/* WoodMart reserva 55 px abajo para su barra móvil, que el portal no usa. */
body.mo-shell-body { padding-bottom: 0; }
.mo.mo-shell { display: flex; flex-direction: column; min-height: 100vh; }
.mo .mo-skip-link { position: absolute; left: var(--space-4); top: -100px; z-index: 1001; padding: var(--space-2) var(--space-4); border-radius: var(--radius-md); background: var(--ink); color: var(--surface); }
.mo .mo-skip-link:focus { top: var(--space-4); }
.mo .mo-shell__main { flex: 1; outline: none; }
.mo .mo-shell-header { position: sticky; top: 0; z-index: 100; background: rgb(255 255 255 / .72); -webkit-backdrop-filter: blur(18px) saturate(1.6); backdrop-filter: blur(18px) saturate(1.6); border-bottom: 1px solid rgb(0 0 0 / .06); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .mo .mo-shell-header { background: var(--surface-raised); } }
.mo .mo-shell-header__bar { box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); max-width: 1440px; margin: 0 auto; padding: var(--space-3) var(--space-4); }
.mo .mo-shell-header__logo { display: inline-flex; }
.mo .mo-shell-header__logo img { display: block; height: 40px; width: auto; }
.mo .mo-shell-header__menu { gap: var(--space-2); flex: none; }
.mo .mo-shell-header__bar { display: grid; grid-template-columns: auto 1fr minmax(200px, 320px) auto; align-items: center; }
.mo .mo-shell-nav { min-width: 0; }
.mo .mo-shell-nav__list { display: flex; align-items: center; gap: var(--space-1); margin: 0; padding: 0; list-style: none; }
.mo .mo-shell-nav__list li { display: flex; margin: 0; }
.mo .mo-shell-nav__link { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-3); border-radius: var(--radius-pill); color: var(--ink); font-size: 15px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.mo .mo-shell-nav__link:hover { background: var(--subtle); }
.mo .mo-shell-nav__link.is-active { background: var(--ink); color: var(--surface-raised); }
.mo .mo-shell-nav__link:focus-visible, .mo .mo-shell-cart:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.mo .mo-shell-search { position: relative; display: flex; }
.mo .mo-shell-search input { width: 100%; min-height: 44px; padding: 0 44px 0 16px; border: 1px solid var(--line-strong); border-radius: var(--radius-pill); background: var(--surface); color: var(--ink); font: inherit; font-size: 14px; }
.mo .mo-shell-search button { position: absolute; right: 0; top: 0; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; background: none; color: var(--ink); cursor: pointer; }
.mo .mo-shell-header__actions { display: flex; align-items: center; gap: var(--space-2); }
.mo .mo-shell-cart { position: relative; display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-pill); color: var(--ink); }
.mo .mo-shell-cart:hover { background: var(--subtle); }
.mo .mo-shell-cart__count { position: absolute; top: 2px; right: 0; min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--radius-pill); background: var(--ink); color: var(--surface-raised); font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
.mo .mo-shell-cart__count[hidden] { display: none; }
@media (max-width: 1024px) {
	.mo .mo-shell-header__bar { grid-template-columns: auto 1fr auto; grid-template-areas: "logo . actions" "search search search" "nav nav nav"; row-gap: var(--space-2); padding-bottom: var(--space-2); }
	.mo .mo-shell-header__logo { grid-area: logo; }
	.mo .mo-shell-header__actions { grid-area: actions; }
	.mo .mo-shell-search { grid-area: search; }
	.mo .mo-shell-nav { grid-area: nav; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--space-4)); padding: 0 var(--space-4); }
	.mo .mo-shell-nav::-webkit-scrollbar { display: none; }
}
@media (max-width: 480px) {
	.mo .mo-shell-header__menu-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.mo .mo-shell-header__menu { width: 44px; padding: 0; justify-content: center; }
	.mo .mo-shell-nav__link { font-size: 14px; }
}
/* Accesos en icono: solo en celular y tablet vertical, donde el header es una sola fila. */
.mo .mo-shell-acceso { display: none; place-items: center; width: 40px; height: 44px; border-radius: var(--radius-pill); color: var(--ink); }
.mo .mo-shell-acceso:hover { background: var(--subtle); }
.mo .mo-shell-acceso.is-active { background: var(--ink); color: var(--surface-raised); }
.mo .mo-shell-acceso:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
@media (max-width: 768px) {
	.mo .mo-shell-header__bar { grid-template-columns: auto 1fr; grid-template-areas: "logo actions"; padding-bottom: var(--space-3); }
	.mo .mo-shell-header__actions { justify-self: end; gap: var(--space-1); }
	.mo .mo-shell-search, .mo .mo-shell-nav { display: none; }
	.mo .mo-shell-acceso { display: grid; }
}
@media (max-width: 360px) {
	.mo .mo-shell-header__logo img { height: 32px; }
	.mo .mo-shell-acceso { width: 36px; }
	.mo .mo-shell-cart { width: 36px; }
	.mo .mo-shell-header__actions { gap: 0; }
}
.mo .mo-shell-footer { margin-top: var(--space-section); background: var(--ink); color: var(--surface); }
.mo .mo-shell-footer__grid { box-sizing: border-box; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) minmax(0, 1.4fr); gap: var(--space-6); max-width: 1440px; margin: 0 auto; padding: var(--space-8) var(--space-4) var(--space-6); }
.mo .mo-shell-footer__title { margin: 0 0 var(--space-3); color: var(--surface-raised); font-family: var(--font-display, inherit); font-size: 15px; font-weight: 700; line-height: 1.3; }
.mo .mo-shell-footer__list { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.mo .mo-shell-footer__list li { margin: 0; line-height: 1.4; }
.mo .mo-shell-footer__list a { color: var(--surface); opacity: .75; font-size: 14px; line-height: 1.4; text-decoration: none; overflow-wrap: anywhere; }
.mo .mo-shell-footer__list a:hover, .mo .mo-shell-footer__list a:focus-visible { opacity: 1; text-decoration: underline; }
.mo .mo-shell-footer__list a:focus-visible { outline: 2px solid var(--surface); outline-offset: 2px; }
.mo .mo-shell-footer__contact { display: inline-flex; align-items: center; gap: var(--space-2); }
.mo .mo-shell-footer__contact svg { flex: none; }
.mo .mo-shell-footer__legal { box-sizing: border-box; max-width: 1440px; margin: 0 auto; padding: var(--space-4); border-top: 1px solid rgb(255 255 255 / .12); font-size: 13px; opacity: .8; }
.mo .mo-shell-footer__col--doble { grid-column: span 2; }
.mo .mo-shell-footer__split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2) var(--space-6); }
.mo .mo-shell-footer__video { padding: 0; border: 0; background: none; color: var(--surface); opacity: .75; font: inherit; font-size: 14px; line-height: 1.4; text-align: left; text-transform: none; letter-spacing: 0; cursor: pointer; }
.mo .mo-shell-footer__video:hover, .mo .mo-shell-footer__video:focus, .mo .mo-shell-footer__video:active { opacity: 1; border: 0; background: none; box-shadow: none; color: var(--surface); text-decoration: underline; }
.mo .mo-shell-footer__video:focus:not(:focus-visible) { outline: none; }
.mo .mo-shell-footer__video:focus-visible { outline: 2px solid var(--surface); outline-offset: 2px; }
@media (max-width: 1024px) { .mo .mo-shell-footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) { .mo .mo-shell-footer__col--doble { grid-column: 1 / -1; } }

/* Ventana de video de Tutoriales: fondo difuminado y tarjeta con título y Cerrar. */
.mo .mo-video-modal { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: var(--space-4); background: rgb(28 28 28 / .45); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.mo .mo-video-modal[hidden] { display: none; }
.mo .mo-video-modal__card { width: min(960px, 100%); overflow: hidden; border-radius: var(--radius-xl); background: var(--surface-raised); box-shadow: var(--shadow-pop); }
.mo .mo-video-modal__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-3) var(--space-3) var(--space-5); border-bottom: 1px solid var(--line); }
.mo .mo-video-modal__title { margin: 0; font-family: var(--font-display); font-size: 19px; line-height: 26px; font-weight: 700; color: var(--ink); text-transform: none; letter-spacing: 0; }
.mo .mo-video-modal__close { gap: var(--space-2); min-height: 40px; padding: 0 var(--space-4); border: 1px solid var(--line-strong); border-radius: var(--radius-pill); background: var(--surface-raised); color: var(--ink); font-family: var(--font-text); font-size: 14px; font-weight: 600; text-transform: none; letter-spacing: 0; box-shadow: none; }
.mo .mo-video-modal__close:hover { border-color: var(--ink); background: var(--subtle); color: var(--ink); }
.mo .mo-video-modal__frame { aspect-ratio: 16 / 9; background: var(--ink); }
.mo .mo-video-modal__frame iframe, .mo .mo-video-modal__frame video { display: block; width: 100%; height: 100%; border: 0; }
@media (max-width: 600px) { .mo .mo-shell-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) var(--space-4); padding-top: var(--space-6); } }

/* Sección Mayorista (3.2b). */
.mo .mo-mayorista { display: grid; gap: var(--space-6, 24px); max-width: 1200px; margin: 0 auto; padding: var(--space-8, 32px) var(--space-4) 0; }
.mo .mo-mayorista__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: var(--space-4); }
.mo .mo-mayorista__contacto { display: grid; grid-template-rows: auto 1fr auto; gap: var(--space-2); padding: var(--space-4); }
.mo-tramo-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.mo-tramo-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--radius-pill); font-family: var(--font-text); font-size: 12px; line-height: 16px; font-weight: 600; }
.mo-tramo-chip svg { flex: none; }
.mo-mc__item:not(.mo-carrito__item) > .mo-tramo-chips, .mo-co-line > .mo-tramo-chips { grid-column: 1 / -1; }
.mo-mc__item:not(.mo-carrito__item) > .mo-tramo-chips .mo-tramo-chip, .mo-co-line > .mo-tramo-chips .mo-tramo-chip { border-radius: var(--radius-md); }
.mo-tramo-chip--lote { background: var(--gold-soft); color: var(--gold-ink); }
.mo-tramo-chip--siguiente { background: var(--info-soft); color: var(--info); }
.mo .mo-mayorista__head { display: grid; gap: var(--space-2); }
.mo .mo-mayorista__intro { max-width: 720px; margin: 0; color: var(--muted); }
.mo .mo-mayorista__switch { display: grid; gap: var(--space-2); align-content: start; padding: var(--space-4); }
.mo .mo-mayorista__subtitle { margin: 0; }
.mo .mo-mayorista__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--space-4); margin: 0; padding: 0; list-style: none; }
.mo .mo-mayorista__item { display: flex; gap: var(--space-3); align-items: center; padding: var(--space-3); }
.mo .mo-mayorista__img { width: 72px; height: 72px; flex: none; object-fit: cover; border-radius: var(--radius-md); background: var(--subtle); }
.mo .mo-mayorista__info { display: grid; gap: 4px; min-width: 0; }
.mo .mo-mayorista__name { font-size: 14px; line-height: 1.3; }
.mo .mo-mayorista__tiers { display: flex; flex-wrap: wrap; gap: 4px; }

/* Búsqueda instantánea del header (3.2b): panel de resultados con el fondo difuminado. */
.mo .mo-shell-header { position: sticky; }
.mo .mo-search-backdrop { position: fixed; inset: 0; z-index: 99; background: rgb(250 250 249 / .55); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.mo .mo-search-backdrop[hidden], .mo .mo-search-panel[hidden] { display: none; }
.mo .mo-search-panel { position: absolute; top: calc(100% + 8px); right: max(var(--space-4), calc((100vw - 1440px) / 2 + var(--space-4))); z-index: 101; width: min(640px, calc(100vw - 2 * var(--space-4))); max-height: min(70vh, 640px); display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-raised); box-shadow: var(--shadow-pop); }
.mo .mo-search-results { flex: 1; overflow-y: auto; margin: 0; padding: var(--space-1) 0; list-style: none; }
.mo .mo-search-results li { margin: 0; }
.mo .mo-search-item { display: grid; grid-template-columns: 64px 1fr auto; align-items: center; gap: var(--space-4); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.mo .mo-search-results li:last-child .mo-search-item { border-bottom: 0; }
.mo .mo-search-item:hover, .mo .mo-search-results li.is-active .mo-search-item { background: var(--subtle); }
.mo .mo-search-item__img { display: block; width: 64px; height: 64px; overflow: hidden; border-radius: var(--radius-md); background: var(--subtle); }
.mo .mo-search-item__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mo .mo-search-item__info { display: grid; gap: 4px; min-width: 0; }
.mo .mo-search-item__cat { color: var(--muted); font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.mo .mo-search-item__name { font-size: 15px; font-weight: 500; line-height: 1.3; }
.mo .mo-search-item__name mark { padding: 0; background: none; color: inherit; text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }
.mo .mo-search-item__tallas { display: flex; flex-wrap: wrap; gap: 4px; }
.mo .mo-search-item__tallas span { min-width: 28px; padding: 1px 6px; border: 1px solid var(--line-strong); border-radius: var(--radius-pill); font-size: 11px; line-height: 18px; text-align: center; }
.mo .mo-search-item__price { font-size: 15px; font-weight: 600; white-space: nowrap; text-align: right; }
.mo .mo-search-item__price small { color: var(--muted); font-size: 11px; font-weight: 500; }
.mo .mo-search-item__price del { display: block; color: var(--muted); font-size: 12px; font-weight: 400; }
.mo .mo-search-empty { padding: var(--space-6) var(--space-4); color: var(--muted); text-align: center; }
.mo .mo-search-all { display: block; padding: var(--space-3) var(--space-4); border-top: 1px solid var(--line); color: var(--ink); font-size: 14px; font-weight: 600; text-align: center; text-decoration: none; }
.mo .mo-search-all:hover { background: var(--subtle); }
.mo .mo-search-all[hidden] { display: none; }
@media (max-width: 1024px) {
	.mo .mo-search-panel { left: var(--space-4); right: var(--space-4); width: auto; top: calc(100% - 4px); }
	.mo .mo-search-item { grid-template-columns: 52px 1fr auto; gap: var(--space-3); }
	.mo .mo-search-item__img { width: 52px; height: 52px; }
}

/* Ficha de producto del portal (3.3, OBS-45). */
.mo .mo-ficha { box-sizing: border-box; display: grid; gap: var(--space-5); max-width: 1280px; margin: 0 auto; padding: var(--space-6) var(--space-4) 0; }
.mo .mo-ficha__migas { display: flex; flex-wrap: wrap; gap: var(--space-2); color: var(--muted); font-size: 13px; }
.mo .mo-ficha__migas a { color: var(--muted); }
.mo .mo-ficha__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--space-8); align-items: start; }
.mo .mo-ficha__media { display: grid; gap: var(--space-3); position: sticky; top: 96px; }
.mo .mo-ficha__main { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--subtle); aspect-ratio: 1 / 1; }
.mo .mo-ficha__img { display: block; width: 100%; height: 100%; object-fit: contain; }
.mo .mo-ficha__thumbs { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
/* Miniaturas en columna al lado de la foto principal (escritorio y tableta). */
@media (min-width: 768px) {
	.mo .mo-ficha__media--thumbs { grid-template-columns: 72px minmax(0, 1fr); align-items: start; }
	.mo .mo-ficha__media--thumbs .mo-ficha__main { grid-column: 2; grid-row: 1; }
	.mo .mo-ficha__media--thumbs .mo-ficha__thumbs { grid-column: 1; grid-row: 1; flex-direction: column; flex-wrap: nowrap; max-height: 100%; overflow-y: auto; scrollbar-width: none; }
	.mo .mo-ficha__media--thumbs .mo-ficha__thumbs::-webkit-scrollbar { display: none; }
	.mo .mo-ficha__media--thumbs .mo-ficha__video { grid-column: 2; }
}
.mo .mo-ficha__thumbs li { margin: 0; }
.mo .mo-ficha__thumb { display: block; width: 72px; height: 72px; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--subtle); cursor: pointer; }
.mo .mo-ficha__thumb.is-active { border: 2px solid var(--ink); }
.mo .mo-ficha__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mo .mo-ficha__video { gap: var(--space-2); }
.mo .mo-ficha__buy { display: grid; gap: var(--space-5); min-width: 0; }
.mo .mo-ficha__meta { display: flex; flex-wrap: wrap; gap: var(--space-4); margin: 0 0 calc(var(--space-3) * -1); color: var(--muted); font-size: 13px; }
.mo .mo-ficha__meta a { color: var(--ink); font-weight: 600; text-decoration: none; }
.mo .mo-ficha__marca { display: inline-flex; align-items: center; gap: var(--space-2); font-family: var(--font-display); }
.mo .mo-ficha__marca-logo { width: auto; height: 32px; max-width: 96px; object-fit: contain; }
.mo .mo-ficha__name { font-size: 28px; line-height: 1.2; }
.mo .mo-ficha__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--space-2); }
.mo .mo-ficha__price strong { font-family: var(--font-display); font-size: 30px; line-height: 1; }
.mo .mo-ficha__price del { color: var(--muted); font-size: 16px; }
.mo .mo-ficha__desde { color: var(--muted); font-size: 14px; }
.mo .mo-ficha__desde[hidden], .mo .mo-ficha__price del[hidden] { display: none; }
.mo .mo-ficha__ganancia { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3) var(--space-2); padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-raised); text-align: center; }
.mo .mo-ficha__ganancia > div { display: grid; gap: 2px; }
.mo .mo-ficha__ganancia span { color: var(--muted); font-size: 12px; font-weight: 600; }
.mo .mo-ficha__ganancia strong { font-size: 17px; }
.mo .mo-ficha__ganancia .is-ganancia strong { color: var(--success); }
.mo .mo-ficha__ahorro { grid-column: 1 / -1; margin: 0; padding-top: var(--space-3); border-top: 1px solid var(--line); font-size: 13px; }
.mo .mo-ficha__ahorro[hidden] { display: none; }
.mo .mo-ficha__margen { grid-column: 1 / -1; justify-self: center; color: var(--ink-2); font-size: 13px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.mo .mo-ficha__margen:hover { color: var(--ink); }
.mo .mo-ficha__tramos { display: grid; gap: var(--space-2); }
.mo .mo-ficha__label { font-size: 14px; font-weight: 600; }
.mo .mo-ficha__form { display: grid; gap: var(--space-4); }
.mo .mo-ficha__chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.mo .mo-ficha__chips .mo-chip { text-transform: none; letter-spacing: 0; }
.mo .mo-ficha__actions { display: grid; grid-template-columns: auto 1fr; gap: var(--space-3); }
.mo .mo-qty { display: inline-flex; align-items: center; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--surface-raised); }
.mo .mo-qty__btn { width: 44px; height: 48px; padding: 0; border: 0; background: none; color: var(--ink); font-size: 18px; cursor: pointer; }
.mo .mo-qty__input { width: 44px; height: 48px; padding: 0; border: 0; background: none; color: var(--ink); font: inherit; font-weight: 600; text-align: center; -moz-appearance: textfield; }
.mo .mo-qty__input::-webkit-inner-spin-button, .mo .mo-qty__input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.mo .mo-ficha__add { gap: var(--space-2); min-height: 50px; text-transform: none; letter-spacing: 0; }
.mo .mo-ficha__add:disabled { opacity: .45; cursor: not-allowed; }
.mo .mo-ficha__stock { margin: calc(var(--space-2) * -1) 0 0; }
.mo .mo-ficha__stock:empty { display: none; }
.mo .mo-ficha__ok, .mo .mo-ficha__error { justify-content: space-between; }
.mo .mo-ficha__ok[hidden], .mo .mo-ficha__error[hidden] { display: none; }
.mo .mo-ficha__ok a { color: var(--ink); font-weight: 600; }
.mo .mo-ficha__info { display: grid; border-top: 1px solid var(--line); }
.mo .mo-ficha__info details { border-bottom: 1px solid var(--line); }
.mo .mo-ficha__info summary { display: flex; align-items: center; justify-content: space-between; min-height: 52px; font-weight: 600; cursor: pointer; list-style: none; }
.mo .mo-ficha__info summary::-webkit-details-marker { display: none; }
.mo .mo-ficha__info summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s ease; }
.mo .mo-ficha__info details[open] summary::after { transform: rotate(-135deg); }
.mo .mo-ficha__info details > :not(summary) { margin: 0 0 var(--space-4); color: var(--ink-2, var(--ink)); font-size: 14px; line-height: 1.6; }
.mo .mo-ficha__info summary:focus:not(:focus-visible) { outline: 0; }
/* Descripción y Envíos y Entrega con el mismo formato que la ficha de la tienda (tienda-ajustes.css, #tabDescription). */
.mo .mo-ficha__info details :is(p, ul, ol, li, em) { font: inherit; color: inherit; }
.mo .mo-ficha__desc p { margin: 0 0 14px; }
.mo .mo-ficha__desc :is(ul, ol) { margin: 0 0 20px; padding-left: 18px; }
.mo .mo-ficha__desc li { margin: 0 0 6px; }
.mo .mo-ficha__desc li p { margin: 0; }
.mo .mo-ficha__desc strong { font-weight: 500; color: var(--ink); }
.mo .mo-ficha__info details a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.mo .mo-ficha__rel { display: grid; gap: var(--space-5); margin-top: calc(var(--space-section) - var(--space-5)); }
.mo .mo-ficha__mas { margin: 0; text-align: center; }
.mo .mo-ficha--vacia { padding: var(--space-section) var(--space-4); }
@media (max-width: 900px) {
	.mo .mo-ficha__grid { grid-template-columns: 1fr; gap: var(--space-6); }
	.mo .mo-ficha__media { position: static; }
	.mo .mo-ficha__name { font-size: 22px; }
}

/* Bloque Socio / Cliente / Ganancia con ahorro para el cliente: borde dorado en movimiento (componente mo-glow). */
.mo .mo-ficha__ganancia.mo-glow { border-color: transparent; background: radial-gradient(rgb(28 28 28 / .05) .55px, transparent 1px) 0 0 / 4px 4px, linear-gradient(180deg, #ffffff, #fdf8ec 60%, #ffffff); }

/* Carrito lateral del socio (templates/portal/mini-cart.php) con el sistema de diseño (3.3). */
.mo-shell-body .mo-drawer { font-family: var(--font-text); color: var(--ink); background: var(--surface-raised); box-shadow: var(--shadow-pop); }
.mo-shell-body .mo-drawer .wd-heading { padding: 20px 24px; border-bottom: 1px solid var(--line); }
.mo-shell-body .mo-drawer .wd-heading .title { font-family: var(--font-display); font-size: 19px; font-weight: 700; color: var(--ink); text-transform: none; letter-spacing: 0; }
.mo-shell-body .mo-drawer .close-side-widget a { font-family: var(--font-text); font-size: 14px; font-weight: 600; color: var(--ink-2); text-transform: none; }
.mo-mc { margin: 0; padding: 0; list-style: none; }
.mo-mc .mo-mc__item { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 12px; align-items: start; margin: 0; padding: 16px 20px; border-bottom: 1px solid var(--line); transition: opacity .2s; }
.mo-mc .mo-mc__item.is-busy { opacity: .5; pointer-events: none; }
.mo-mc .mo-mc__img { display: block; width: 72px; height: 72px; overflow: hidden; border-radius: var(--radius-md); background: var(--subtle); }
.mo-mc .mo-mc__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mo-mc .mo-mc__info { display: grid; gap: 4px; min-width: 0; justify-items: start; }
.mo-mc .mo-mc__cat { color: var(--muted); font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.mo-mc .mo-mc__name { color: var(--ink); font-size: 14px; font-weight: 600; line-height: 20px; text-decoration: none; }
.mo-mc .mo-mc__tallas { display: flex; flex-wrap: wrap; gap: 4px; }
.mo-mc .mo-mc__talla { display: inline-flex; align-items: center; min-height: 24px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: var(--radius-pill); color: var(--ink); font-size: 12px; font-weight: 500; }
.mo-mc .mo-mc__row { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.mo-mc .mo-mc__qty { display: inline-flex; align-items: center; border: 1px solid var(--line-strong); border-radius: var(--radius-pill); }
.mo-mc .mo-mc__qty button { width: 30px; height: 30px; min-height: 0; padding: 0; border: 0; background: none; color: var(--ink); font-size: 16px; line-height: 1; cursor: pointer; box-shadow: none; }
.mo-mc .mo-mc__qty button:disabled { opacity: .35; cursor: not-allowed; }
.mo-mc .mo-mc__qty span { min-width: 22px; font-size: 14px; font-weight: 600; text-align: center; }
.mo-mc .mo-mc__del { display: grid; place-items: center; width: 32px; height: 32px; min-height: 0; padding: 0; border: 0; border-radius: var(--radius-pill); background: none; color: #a32020; cursor: pointer; box-shadow: none; }
.mo-mc .mo-mc__del:hover { background: var(--danger-soft); color: #8a1616; }
.mo-mc .mo-mc__price { display: grid; justify-items: end; gap: 2px; white-space: nowrap; }
.mo-mc .mo-mc__price strong { font-family: var(--font-display); font-size: 15px; font-weight: 700; color: var(--ink); }
.mo-mc .mo-mc__price del { color: var(--muted); font-size: 12px; }
.mo-shell-body .mo-drawer .shopping-cart-widget-footer { padding: 16px 24px 24px; border-top: 1px solid var(--line); }
.mo-shell-body .mo-drawer .woocommerce-mini-cart__total { font-family: var(--font-text); font-size: 15px; color: var(--ink); border: 0; }
.mo-shell-body .mo-drawer .woocommerce-mini-cart__total strong { font-weight: 600; }
.mo-shell-body .mo-drawer .woocommerce-mini-cart__total .amount { font-family: var(--font-display); font-size: 19px; font-weight: 700; }
.mo-shell-body .mo-drawer .woocommerce-mini-cart__buttons { display: grid; gap: 12px; }
.mo-shell-body .mo-drawer .woocommerce-mini-cart__buttons .button { display: flex; align-items: center; justify-content: center; min-height: 48px; margin: 0; border-radius: var(--radius-pill); font-family: var(--font-text); font-size: 15px; font-weight: 600; text-transform: none; letter-spacing: 0; box-shadow: none; }
.mo-shell-body .mo-drawer .woocommerce-mini-cart__buttons .button:not(.checkout) { border: 1px solid var(--line-strong); background: var(--surface-raised); color: var(--ink); }
.mo-shell-body .mo-drawer .woocommerce-mini-cart__buttons .button:not(.checkout):hover { border-color: var(--ink); background: var(--subtle); }
.mo-shell-body .mo-drawer .woocommerce-mini-cart__buttons .checkout { border: 0; background: var(--ink); color: var(--surface); }
.mo-shell-body .mo-drawer .woocommerce-mini-cart__buttons .checkout:hover { background: var(--ink-2); color: var(--surface); }
/* Panel del carrito lateral (P4, propio del portal): entra desde la derecha sobre un fondo oscuro. */
.mo-drawer { position: fixed; z-index: 1001; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(420px, 100%); transform: translateX(100%); visibility: hidden; transition: transform .35s cubic-bezier(.22, 1, .36, 1), visibility 0s .35s; }
.mo-drawer.is-open { transform: none; visibility: visible; transition: transform .35s cubic-bezier(.22, 1, .36, 1); }
.mo-drawer .widget_shopping_cart, .mo-drawer .widget_shopping_cart_content { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.mo-drawer .shopping-cart-widget-body { flex: 1; min-height: 0; overflow-y: auto; }
.mo-drawer__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.mo-drawer__title { margin: 0; font-family: var(--font-display); font-size: 19px; font-weight: 700; color: var(--ink); }
/* Botón propio: los estilos globales de botones del tema no lo pisan. */
.mo-shell-body .mo-drawer .mo-drawer__close { display: grid; place-items: center; flex: none; width: 44px; height: 44px; min-height: 0; padding: 0; border: 0; border-radius: var(--radius-pill); background: transparent; box-shadow: none; color: var(--ink); line-height: 0; cursor: pointer; }
.mo-shell-body .mo-drawer .mo-drawer__close svg { display: block; width: 20px; height: 20px; flex: none; }
.mo-shell-body .mo-drawer .mo-drawer__close:hover { background: var(--subtle); }
.mo-drawer__close:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
.mo-drawer-fondo { position: fixed; z-index: 1000; inset: 0; background: #0b0b0b66; opacity: 0; visibility: hidden; transition: opacity .3s, visibility 0s .3s; }
.mo-drawer-fondo.is-open { opacity: 1; visibility: visible; transition: opacity .3s; }
html.mo-drawer-abierto { overflow: hidden; }
/* Aviso de talla: en escritorio, a la izquierda del botón flotante de WhatsApp (como la tienda). */
@media (min-width: 768px) { .mo .mo-toasts-talla { right: 104px; bottom: 24px; } }
.mo-confetti { position: fixed; z-index: 1003; inset: 0; pointer-events: none; }
.mo-fly { position: fixed; z-index: 1002; object-fit: cover; border-radius: var(--radius-md); box-shadow: var(--shadow-pop); pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .mo-drawer, .mo-drawer.is-open, .mo-drawer-fondo { transition: none; } }
/* Carrito lateral vacío: centrado en el panel, botón del sistema en Title Case. */
.mo-drawer .widget_shopping_cart_content:has(.wd-empty-mini-cart), .mo-drawer .shopping-cart-widget-body:has(.wd-empty-mini-cart) { display: flex; flex-direction: column; flex: 1; }
.mo-drawer .shopping-cart-widget-body:has(.wd-empty-mini-cart) .wd-scroll-content { display: flex; flex: 1; max-height: none !important; align-items: center; justify-content: center; }
/* Carrito vacío centrado también en el portal: el panel no hereda el flex del tema. */
.mo-shell-body .mo-drawer:has(.wd-empty-mini-cart) { display: flex; flex-direction: column; }
.mo-shell-body .mo-drawer:has(.wd-empty-mini-cart) .widget_shopping_cart { display: flex; flex-direction: column; flex: 1; }
.mo-drawer .shopping-cart-widget-footer.wd-cart-empty { display: none; }
.mo-drawer .wd-empty-mini-cart { display: grid; justify-items: center; gap: var(--space-4); margin: 0; padding: var(--space-6) var(--space-5); text-align: center; }
.mo-drawer .wd-empty-mini-cart::before { margin: 0; }
.mo-drawer .woocommerce-mini-cart__empty-message { margin: 0; padding: 0; font-family: var(--font-display); font-size: 17px; font-weight: 700; color: var(--ink); text-transform: none; }
.mo-drawer .wd-empty-mini-cart .btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px; border-radius: var(--radius-md); background: var(--ink); color: var(--on-ink); font-family: var(--font-display); font-size: 14px; font-weight: 600; text-transform: none; letter-spacing: 0; box-shadow: none; }
.mo-drawer .wd-empty-mini-cart .btn:hover { background: var(--ink-hover); color: var(--on-ink); }

/* Revisión móvil (3.6). */
@media (max-width: 640px) {
	/* Tarjeta del saldo a favor: el texto usa todo el ancho y el contador baja debajo. */
	.mo .mo-membership-refund-alert { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: start; gap: var(--space-2) var(--space-3); }
	.mo .mo-refund-alert-badge { grid-column: 2; justify-self: start; }
	/* Ficha: cantidad más compacta para que el botón entre en una línea. */
	.mo .mo-ficha__actions { gap: var(--space-2); }
	.mo .mo-qty__btn { width: 36px; }
	.mo .mo-qty__input { width: 32px; }
	.mo .mo-ficha__add { padding-inline: var(--space-3); font-size: 15px; white-space: nowrap; }
}
/* Las columnas de la ficha y los relacionados no se estiran más allá de la pantalla. */
.mo .mo-ficha > *, .mo .mo-ficha__rel > *, .mo .mo-ficha__grid > * { min-width: 0; }
@media (max-width: 640px) { .mo-shell-body .mo-drawer .wd-heading .title { font-size: 17px; } .mo-mc .mo-mc__item { padding: 14px 16px; } }

/* 5.3 Mi Carrito del socio (templates/portal/carrito.php): líneas con el lenguaje del carrito lateral (.mo-mc). */
.mo .mo-carrito-avisos { max-width: 1120px; margin: var(--space-5) auto 0; padding: 0 var(--space-4); }
.mo .mo-carrito-avisos:has(.woocommerce-notices-wrapper:empty) { display: none; }
.mo .mo-carrito-avisos .woocommerce-notices-wrapper { margin: 0; }
.mo .mo-carrito { max-width: 1120px; margin: 0 auto; padding: var(--space-6) var(--space-4) var(--space-8); display: grid; gap: var(--space-5); }
.mo .mo-carrito__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--space-5); align-items: start; }
.mo .mo-carrito__lineas { padding: 0; overflow: hidden; }
.mo .mo-carrito__cols { display: grid; grid-template-columns: minmax(0, 1fr) 140px 120px; gap: 12px; padding: 14px 20px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.mo .mo-carrito__cols span:not(:first-child) { text-align: right; }
.mo-mc .mo-mc__item.mo-carrito__item { grid-template-columns: 72px minmax(0, 1fr) 140px 120px; align-items: center; padding: 16px 20px; }
.mo-mc .mo-carrito__item .mo-mc__row { margin: 0; justify-content: flex-end; }
.mo-mc .mo-mc__item.mo-carrito__item:last-child { border-bottom: 0; }
.mo .mo-carrito__resumen { position: sticky; top: var(--space-5); display: grid; gap: var(--space-4); }
.mo .mo-carrito__envio span { display: grid; gap: 2px; }
.mo .mo-carrito__acciones { display: grid; gap: 12px; }
.mo .mo-carrito__vacio { display: grid; justify-items: center; gap: var(--space-3); padding: var(--space-8) var(--space-5); text-align: center; }
@media (max-width: 900px) {
	.mo .mo-carrito__grid { grid-template-columns: minmax(0, 1fr); }
	.mo .mo-carrito__resumen { position: static; }
}
@media (max-width: 640px) {
	.mo .mo-carrito { padding-top: var(--space-4); }
	.mo .mo-carrito__cols { display: none; }
	.mo-mc .mo-mc__item.mo-carrito__item { grid-template-columns: 72px minmax(0, 1fr) auto; align-items: start; padding: 16px; }
	.mo-mc .mo-carrito__item .mo-mc__row { grid-column: 2; grid-row: 2; justify-content: flex-start; }
	.mo-mc .mo-carrito__item .mo-mc__price { grid-column: 3; grid-row: 1; }
}

/* 5.2 Bienvenida del socio recién activado (shell/pagina.php), una sola vez. */
.mo-modal .mo-modal__mark--emoji { background: var(--success-soft); font-size: 34px; line-height: 1; }

/* 5.4 Cotizador de Envíos (templates/portal/cotizador-envios.php, OBS-107) */
.mo .mo-cotizador { max-width: 720px; margin: 0 auto; padding: var(--space-6) var(--space-4) var(--space-8); display: grid; gap: var(--space-5); }
.mo .mo-cotizador__header { display: grid; gap: var(--space-2); }
.mo .mo-cotizador__form { display: grid; gap: var(--space-4); }
.mo .mo-cotizador__form .mo-field { display: grid; gap: 6px; }
.mo .mo-cotizador__form [hidden] { display: none; }
.mo .mo-cotizador__res { display: grid; gap: 10px; }
.mo .mo-cotizador__opt { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px; }
.mo .mo-cotizador__opt > div { display: grid; gap: 2px; }
.mo .mo-cotizador__opt strong { font-family: var(--font-display); color: var(--ink); }

/* Dropdown del sistema de diseño (assets/js/mo-select.js) sobre un <select> nativo */
.mo .mo-sel { position: relative; width: 100%; }
.mo .mo-sel__native { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; border: 0 !important; opacity: 0 !important; pointer-events: none !important; }
.mo .mo-sel__btn { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); width: 100%; min-height: 44px; margin: 0; padding: 0 12px 0 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--surface-raised); color: var(--ink); font: inherit; font-family: var(--font-text); font-size: 15px; font-weight: 400; text-align: left; text-transform: none; letter-spacing: 0; line-height: 1.3; box-shadow: none; cursor: pointer; }
.mo .mo-sel__btn:hover { border-color: var(--ink-2); background: var(--surface-raised); color: var(--ink); }
.mo .mo-sel__btn:focus-visible, .mo .mo-sel.is-open .mo-sel__btn { border-color: var(--gold); outline: none; box-shadow: var(--shadow-focus); }
.mo .mo-sel__btn.is-placeholder .mo-sel__val { color: var(--muted); }
.mo .mo-sel__btn:disabled { background: var(--subtle); color: var(--ink-2); cursor: not-allowed; }
.mo .mo-sel__val { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mo .mo-sel__chev { flex: none; width: 18px; height: 18px; color: var(--muted); transform: none; transition: transform .15s; }
.mo .mo-sel.is-open .mo-sel__chev { transform: rotate(180deg); }
.mo .mo-sel__pop { position: absolute; z-index: 60; top: calc(100% + 4px); left: 0; right: 0; display: grid; gap: var(--space-1); padding: var(--space-1); background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-pop); }
.mo .mo-sel.is-up .mo-sel__pop { top: auto; bottom: calc(100% + 4px); }
.mo .mo-sel__pop[hidden], .mo .mo-sel__search[hidden], .mo .mo-sel__list > [hidden], .mo .mo-sel__empty[hidden] { display: none; }
.mo .mo-sel__search { box-sizing: border-box; width: 100%; min-height: 40px; margin: 0; font-size: 14px; }
.mo .mo-sel__list { position: static; max-height: 260px; overflow-y: auto; margin: 0; padding: 0; list-style: none; border: 0; box-shadow: none; background: none; }
.mo .mo-sel__list .mo-combo__opcion { display: flex; align-items: center; gap: var(--space-3); margin: 0; padding: 10px var(--space-2); border-radius: var(--radius-sm); cursor: pointer; font-size: 14px; color: var(--ink); }
.mo .mo-sel__list .mo-combo__opcion:hover, .mo .mo-sel__list .mo-combo__opcion.is-active { background: var(--subtle); }
.mo .mo-sel__list .mo-combo__nombre { flex: 1; min-width: 0; }
.mo .mo-sel__list .mo-combo__opcion .mo-icon { width: 18px; height: 18px; visibility: hidden; }
.mo .mo-sel__list .mo-combo__opcion[aria-selected="true"] { font-weight: 700; }
.mo .mo-sel__list .mo-combo__opcion[aria-selected="true"] .mo-icon { visibility: visible; }
.mo .mo-sel__list .mo-combo__opcion[aria-disabled="true"] { color: var(--muted); cursor: not-allowed; background: none; }
.mo .mo-sel__empty { margin: 0; padding: var(--space-3); font-size: 14px; color: var(--muted); }
.mo .is-error .mo-sel__btn, .mo .woocommerce-invalid .mo-sel__btn { border-color: var(--danger); background: var(--danger-soft); }
.mo .mo-cotizador__ver { justify-self: start; min-height: 0; margin: 4px 0 0; padding: 0; border: 0; background: none; box-shadow: none; text-transform: none; letter-spacing: 0; line-height: 1.4; font: inherit; font-size: 14px; font-weight: 600; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.mo .mo-cot-agencias { margin: 0; list-style: none; }
.mo .mo-cot-agencia { cursor: default; }


/* Pedidos Activos, Historial, Seguimiento y detalle del pedido (5.6, OBS-70) */
.mo .mo-pedidos { box-sizing: border-box; width: 100%; max-width: 1120px; margin: 0 auto; padding: var(--space-6) var(--space-4) var(--space-8); display: grid; gap: var(--space-5); }
.mo .mo-pedidos__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-3); }
.mo .mo-pedidos__head .mo-h1 { margin: 0 0 6px; }
.mo .mo-pedidos__head .mo-body { margin: 0; }
.mo .mo-pedidos__volver { justify-self: start; font-weight: 600; }
.mo .mo-pedidos__filtros { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.mo .mo-pedidos__filtros .mo-chip { display: inline-flex; align-items: center; text-decoration: none; }
.mo .mo-pedidos__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: var(--space-4); }
.mo .mo-ped { display: grid; gap: var(--space-4); align-content: start; padding: var(--space-5); }
.mo .mo-ped__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.mo .mo-ped__head .mo-h3, .mo .mo-ped__head .mo-small { margin: 0; }
.mo .mo-ped__fotos { display: flex; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.mo .mo-ped__fotos li { width: 56px; height: 56px; margin: 0; border-radius: var(--radius-sm); background: var(--subtle); overflow: hidden; }
.mo .mo-ped__fotos img { width: 100%; height: 100%; object-fit: cover; }
.mo .mo-ped__mas { display: grid; place-items: center; font-weight: 700; color: var(--ink-2); }
.mo .mo-ped__datos { display: grid; gap: 8px; margin: 0; }
.mo .mo-ped__datos > div { display: flex; justify-content: space-between; gap: var(--space-3); }
.mo .mo-ped__datos dt { color: var(--muted); font-size: 14px; }
.mo .mo-ped__datos dd { margin: 0; text-align: right; font-size: 14px; color: var(--ink); }
.mo .mo-ped__acciones { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: var(--space-2); margin-top: auto; }
.mo .mo-ped__acciones .mo-btn { padding-left: 12px; padding-right: 12px; white-space: nowrap; }
.mo .mo-seg { padding: var(--space-5); display: grid; gap: var(--space-4); }
.mo .mo-seg__pasos { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; counter-reset: none; }
.mo .mo-seg__pasos li { position: relative; display: grid; justify-items: center; gap: var(--space-2); margin: 0; text-align: center; }
.mo .mo-seg__pasos li + li::before { content: ""; position: absolute; top: 15px; right: 50%; width: 100%; height: 2px; background: var(--line); z-index: 0; }
.mo .mo-seg__pasos li.is-hecho + li::before, .mo .mo-seg__pasos li.is-hecho + li.is-actual::before { background: var(--ink); }
.mo .mo-seg__punto { position: relative; z-index: 1; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--line-strong); background: var(--surface-raised); font-size: 13px; font-weight: 700; color: var(--muted); }
.mo .mo-seg__punto .mo-icon { width: 16px; height: 16px; stroke-width: 3; }
.mo .mo-seg__pasos .is-hecho .mo-seg__punto { border-color: var(--ink); background: var(--ink); color: var(--on-ink); }
.mo .mo-seg__pasos .is-actual .mo-seg__punto { border-color: var(--gold); color: var(--ink); box-shadow: var(--shadow-focus); }
.mo .mo-seg__titulo { font-size: 13px; line-height: 1.3; color: var(--muted); }
.mo .mo-seg__pasos .is-hecho .mo-seg__titulo, .mo .mo-seg__pasos .is-actual .mo-seg__titulo { color: var(--ink); font-weight: 600; }
.mo .mo-seg__guia { padding-top: var(--space-3); border-top: 1px solid var(--line); }
.mo .mo-seg-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3); padding: var(--space-5); max-width: 640px; }
.mo .mo-seg-form .mo-field { flex: 1 1 240px; display: grid; gap: 6px; }
.mo .mo-seg-recientes { display: grid; gap: var(--space-3); max-width: 640px; }
.mo .mo-seg-recientes .mo-h3 { margin: 0; }
.mo .mo-seg-recientes ul { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.mo .mo-seg-reciente { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); color: var(--ink); text-decoration: none; }
.mo .mo-seg-reciente .mo-small { flex: 1; }
.mo .mo-seg-reciente:hover { border-color: var(--ink); }
.mo .mo-ped-anular { display: grid; gap: var(--space-2); }
.mo .mo-ped-anular__confirmar { display: grid; gap: var(--space-2); padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); }
.mo .mo-ped-anular__confirmar[hidden] { display: none; }
.mo .mo-ped-anular__confirmar .mo-small { margin: 0; }
@media (max-width: 600px) {
	.mo .mo-pedidos__lista { grid-template-columns: 1fr; }
	.mo .mo-seg__pasos { grid-template-columns: 1fr; gap: var(--space-3); }
	.mo .mo-seg__pasos li { grid-template-columns: 32px 1fr; justify-items: start; align-items: center; text-align: left; }
	.mo .mo-seg__pasos li + li::before { top: -14px; left: 15px; right: auto; width: 2px; height: 14px; }
}

/* D-19: pago con QR y comprobante (templates/pago/qr.php, assets/js/mo-qr.js) */
.mo .mo-pago-pasarelas .wc_payment_method:is(.payment_method_mo_qr, .payment_method_mo_transferencia) > label { font-weight: 600; cursor: pointer; }
.mo .mo-pago-pasarelas :is(.payment_method_mo_qr, .payment_method_mo_transferencia) .payment_box { margin: var(--space-3) 0 0; padding: 0; background: none; }
.mo .mo-pago-pasarelas :is(.payment_method_mo_qr, .payment_method_mo_transferencia) .payment_box::before { display: none; }
.mo .mo-qr__pago--banco { grid-template-columns: 1fr; }
.mo .mo-qr__cuentas { display: grid; gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.mo .mo-qr__cuentas li { display: grid; gap: 2px; margin: 0; padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-raised); }
.mo .mo-qr__cuentas strong { color: var(--ink); }
.mo .mo-qr__cuentas .mo-small { color: var(--muted); }
.mo.mo-qr-host { background: transparent; font-size: inherit; }
.mo .mo-qr { display: grid; gap: var(--space-4); }
.mo .mo-qr__pago { display: grid; grid-template-columns: auto 1fr; gap: var(--space-5); align-items: center; padding: var(--space-5); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); color: var(--ink); }
.mo .mo-qr__codigo { display: grid; justify-items: center; gap: var(--space-2); margin: 0; }
.mo .mo-qr__marco { display: block; padding: var(--space-3); border-radius: var(--radius-md); background: #fff; border: 1px solid var(--line); }
.mo .mo-qr .mo-qr__marco img { display: block; width: 168px; height: 168px; max-width: none; max-height: none; margin: 0; float: none; object-fit: contain; }
.mo .mo-qr__codigo .mo-small { color: var(--muted); text-align: center; }
.mo .mo-qr__datos { display: grid; gap: var(--space-3); min-width: 0; }
.mo .mo-qr__datos .mo-eyebrow { margin: 0; color: var(--muted); }
.mo .mo-qr__monto { display: flex; align-items: center; gap: var(--space-2); margin: 0; font-family: var(--font-display); font-size: 32px; line-height: 38px; font-weight: 700; font-variant-numeric: tabular-nums; }
.mo .mo-qr__dl { display: grid; gap: var(--space-1); margin: 0; }
.mo .mo-qr__dl div { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.mo .mo-qr__dl dt { color: var(--muted); font-size: 14px; }
.mo .mo-qr__dl dd { margin: 0; color: var(--ink); font-weight: 600; display: inline-flex; align-items: center; gap: var(--space-1); }
.mo .mo-qr__copiar { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface-raised); color: var(--ink); cursor: pointer; }
.mo .mo-qr__copiar .mo-icon { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
.mo .mo-qr__copiar.is-copiado { border-color: var(--success); color: var(--success); }
.mo .mo-qr__pasos { color: var(--ink); display: grid; gap: var(--space-1); margin: 0; padding-left: var(--space-5); font-size: 14px; line-height: 20px; }
.mo .mo-qr__nota { margin: 0; color: var(--muted); }
.mo .mo-qr__zona { position: relative; display: block; padding: var(--space-5); border: 2px dashed var(--line-strong); border-radius: var(--radius-lg); background: var(--surface-raised); cursor: pointer; transition: border-color .15s, background .15s; }
.mo .mo-qr__zona:hover, .mo .mo-qr__zona.is-encima { border-color: var(--ink); background: var(--surface); }
.mo .mo-qr__zona:focus-within { box-shadow: var(--shadow-focus); }
.mo .mo-qr.is-listo .mo-qr__zona { border-style: solid; border-color: var(--success); background: var(--success-soft); }
.mo .mo-qr__input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.mo .mo-qr__vacio { display: grid; justify-items: center; gap: var(--space-1); text-align: center; color: var(--ink); }
.mo .mo-qr__vacio .mo-icon { width: 32px; height: 32px; fill: none; stroke: currentColor; stroke-width: 1.75; }
.mo .mo-qr__vacio .mo-small { color: var(--muted); }
.mo .mo-qr__listo { display: flex; align-items: center; gap: var(--space-3); }
.mo .mo-qr__listo[hidden], .mo .mo-qr__vacio[hidden] { display: none; }
.mo .mo-qr__vista { flex: none; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; overflow: hidden; border-radius: var(--radius-sm); background: var(--ink); color: var(--on-ink); font-weight: 700; font-size: 13px; }
.mo .mo-qr__vista img { width: 100%; height: 100%; object-fit: cover; }
.mo .mo-qr__archivo { display: grid; min-width: 0; flex: 1; }
.mo .mo-qr__archivo strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mo .mo-qr.is-subiendo .mo-qr__estado { color: var(--muted); }
.mo .mo-qr.is-listo .mo-qr__estado { color: var(--success); font-weight: 600; }
.mo .mo-qr__cambiar { flex: none; position: relative; z-index: 1; pointer-events: none; }
.mo .mo-qr__op { display: grid; gap: var(--space-1); margin: 0; }
/* N.° de Operación con el campo del sistema (en el portal y el pago de la membresía no llegan los estilos del checkout). */
.mo .mo-qr__op .input-text { width: 100%; min-height: 44px; padding: 0 14px; border-radius: var(--radius-md); border: 1px solid var(--line-strong); background: var(--surface-raised); color: var(--ink); font: inherit; font-size: 15px; box-sizing: border-box; }
.mo .mo-qr__op .input-text::placeholder { color: var(--muted); }
.mo .mo-qr__op .input-text:focus { border-color: var(--gold); outline: none; box-shadow: var(--shadow-focus); }
@media (max-width: 600px) {
	.mo .mo-qr__pago { grid-template-columns: 1fr; justify-items: center; text-align: center; padding: var(--space-4); }
	.mo .mo-qr__monto, .mo .mo-qr__dl div { justify-content: center; }
	.mo .mo-qr__pasos { text-align: left; }
}

/* 5.6 ajustes (observaciones de Rafael): chips por estado, tarjetas simétricas, íconos y sin stock */
.mo .mo-badge--muted { background: var(--subtle); color: var(--muted); }
.mo .mo-btn--danger { background: var(--danger); color: #fff; border-color: var(--danger); }
.mo .mo-btn--danger:hover { filter: brightness(.92); }
.mo .mo-btn--danger-soft { border-color: transparent; }
.mo .mo-btn--danger-soft:hover { background: var(--danger); color: #fff; }
.mo .mo-icon--fill { fill: currentColor; stroke: none; }
.mo .mo-pedidos__lista { align-items: stretch; }
@supports (grid-template-rows: subgrid) {
	.mo .mo-pedidos__lista { grid-auto-rows: auto; }
	.mo .mo-pedidos__lista > .mo-ped { grid-row: span 4; grid-template-rows: subgrid; align-content: stretch; }
}
.mo .mo-ped__acciones { align-self: end; }
.mo .mo-ped__fotos { flex-wrap: nowrap; overflow: hidden; }
.mo .mo-ped__fotos li { flex: none; }
.mo .mo-ped__mas { width: auto !important; padding: 0 var(--space-3); font-size: 13px; white-space: nowrap; }
.mo .mo-ped__fotos li.is-agotado img, .mo .mo-ty__items li.is-agotado img { filter: grayscale(1); opacity: .45; }
.mo .mo-ty__items li.is-agotado strong, .mo .mo-ty__items li.is-agotado .mo-ty__price { text-decoration: line-through; color: var(--muted); }
.mo .mo-ty__items li.is-agotado .mo-badge { justify-self: start; margin-top: 4px; }
.mo .mo-badge--azul { background: #e7efff; color: #1e4fd8; }

/* 5.7: recorrido guiado (assets/js/mo-recorrido.js). El foco oscurece todo menos el elemento con una sombra enorme. */
.mo.mo-tour { position: fixed; inset: 0; z-index: 100001; background: transparent !important; min-height: 0; }
.mo .mo-tour__foco { position: fixed; border-radius: var(--radius-md); box-shadow: 0 0 0 9999px rgb(11 11 11 / .6); outline: 2px solid var(--gold); outline-offset: 0; transition: top .25s ease, left .25s ease, width .25s ease, height .25s ease; pointer-events: none; }
.mo .mo-tour__card { position: fixed; display: grid; gap: var(--space-2); padding: var(--space-5); border-radius: var(--radius-lg); background: var(--surface-raised); box-shadow: var(--shadow-pop); color: var(--ink); }
.mo .mo-tour__paso { margin: 0; color: var(--muted); font-size: 13px; line-height: 18px; }
.mo .mo-tour__titulo { margin: 0; font-family: var(--font-display); font-size: 18px; line-height: 24px; font-weight: 700; }
.mo .mo-tour__texto { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 22px; }
.mo .mo-tour__acciones { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); margin-top: var(--space-2); }
.mo .mo-tour__nav { display: flex; gap: var(--space-2); }
.mo .mo-tour__nav .mo-btn { min-height: 44px; padding-inline: var(--space-4); }
.mo .mo-tour__ant[hidden] { display: none; }
.mo .mo-tour__omitir { padding: 0; border: 0; background: none; cursor: pointer; text-transform: none; letter-spacing: 0; font-size: 14px; font-family: var(--font-text); }
@media (prefers-reduced-motion: reduce) { .mo .mo-tour__foco { transition: none; } }

/* OBS-120: indicador de la tienda para la cuenta de socio. */
.mo-modo-barra { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px var(--space-3); padding: 8px var(--space-4); background: var(--ink); color: var(--surface); font-family: var(--font-text); font-size: 14px; line-height: 20px; font-weight: 600; }
.mo-modo-barra a { color: inherit; text-decoration: underline; }