/* ── Variables globales ──────────────────────────────────────────────── */
:root{--c420-font-family:inherit;--c420-base-text-size:14px;--c420-heading-size:18px;--c420-menu-item-color:#45575e;--c420-heading-color:#45575e;--c420-promo-title-color:#45575e;--c420-promo-text-color:#45575e;--c420-blog-title-color:#45575e;--c420-blog-meta-color:#5eb7cc;--c420-blog-excerpt-color:#66757b;--c420-glass-blur:22px;--c420-glass-saturation:160%;--c420-glass-panel-opacity:.5;--c420-glass-border-opacity:.35;--c420-glass-overlay-opacity:.42;--c420-promo-image-fit:contain;--c420-promo-image-width:34%;--c420-promo-button-width:220px;--c420-blog-image-ratio:16/9;--c420-blog-vertical:1}

/* ── Base ────────────────────────────────────────────────────────────── */
.c420-mm{--c420-accent:#5eb7cc;--c420-dark:#1f253a;--c420-border:#d9d9d9;--c420-text:#45575e;--c420-soft:#f7f7f7;--c420-panel-bg:#fff;--c420-panel-text:#45575e;--c420-drawer-width:520px;position:relative;font-family:inherit;color:var(--c420-text)}
.c420-mm *{box-sizing:border-box}
.c420-mm-lock{overflow:hidden}

/* ── Topbar ──────────────────────────────────────────────────────────── */
.c420-mm-topbar{background:#111;color:#fff;padding:8px 12px;font-size:12px;display:flex;justify-content:space-between;gap:16px}

/* ── Header ──────────────────────────────────────────────────────────── */
.c420-mm-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--c420-border);background:#fff}
.c420-mm-burger{width:42px;height:42px;border:1px solid #cfd8dc;border-radius:10px;background:#fff;display:inline-flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer}
.c420-mm-burger span{width:18px;height:2px;background:#74b9c8;border-radius:2px}
.c420-mm-logo img{max-height:42px;width:auto;display:block}
.c420-mm-logo span{font-weight:700;color:#78b9cb}
.c420-mm-actions{display:flex;align-items:center;gap:14px}
.c420-mm-icon{width:28px;height:28px;color:#333;position:relative;background:none;border:0;cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center}
.c420-mm-icon svg{width:100%;height:100%}
.c420-mm-cart-count{position:absolute;right:-6px;top:-6px;min-width:16px;height:16px;border-radius:999px;background:#ff554f;color:#fff;font-size:10px;display:flex;align-items:center;justify-content:center;padding:0 4px;transition:transform .2s}
.c420-mm-cart-count.c420-pulse{animation:c420-pulse .35s ease}
@keyframes c420-pulse{0%{transform:scale(1)}50%{transform:scale(1.45)}100%{transform:scale(1)}}

/* ── Buscador ────────────────────────────────────────────────────────── */
.c420-mm-search-wrap{position:relative}
.c420-mm-search{display:flex;align-items:stretch;padding:12px 14px;background:#fff;border-bottom:1px solid var(--c420-border)}
.c420-mm-search input[type=search]{flex:1;border:1px solid #c8c8c8;border-right:0;padding:12px 14px;font-size:14px;outline:none}
.c420-mm-search input[type=search]:focus{border-color:var(--c420-accent)}
.c420-mm-search button{width:54px;border:0;background:var(--c420-accent);color:#fff;cursor:pointer}
.c420-mm-search button svg{width:22px;height:22px}

/* ── Autocompletado ──────────────────────────────────────────────────── */
.c420-mm-autocomplete{position:absolute;top:100%;left:0;right:0;z-index:100001;background:#fff;border:1px solid var(--c420-border);border-top:0;box-shadow:0 12px 32px rgba(0,0,0,.12);max-height:420px;overflow-y:auto}
.c420-mm-ac-list{list-style:none;margin:0;padding:0}
.c420-mm-ac-item{display:flex;align-items:center;gap:12px;padding:10px 14px;cursor:pointer;border-bottom:1px solid #f0f0f0;transition:background .15s}
.c420-mm-ac-item:hover,.c420-mm-ac-item.is-selected{background:#f4fbfd}
.c420-mm-ac-img{width:44px;height:44px;object-fit:contain;border-radius:8px;border:1px solid #eee;flex-shrink:0}
.c420-mm-ac-info{display:flex;flex-direction:column;gap:3px;min-width:0}
.c420-mm-ac-name{font-size:13px;font-weight:600;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c420-mm-ac-name mark{background:rgba(94,183,204,.25);color:inherit;border-radius:2px}
.c420-mm-ac-price{font-size:12px;color:var(--c420-accent);font-weight:700}
.c420-mm-ac-badge{font-size:10px;background:#ff554f;color:#fff;border-radius:4px;padding:1px 5px;font-weight:700;align-self:flex-start}
.c420-mm-ac-nostk{font-size:10px;color:#999}
.c420-mm-ac-empty,.c420-mm-ac-loading{padding:16px 14px;color:#999;font-size:13px;text-align:center}
.c420-mm-ac-seeall{display:block;padding:12px 14px;text-align:center;font-size:13px;font-weight:700;color:var(--c420-accent);border-top:1px solid var(--c420-border);text-decoration:none}
.c420-mm-ac-seeall:hover{background:#f4fbfd}

/* ── Overlay + Drawer ────────────────────────────────────────────────── */
.c420-mm-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);opacity:0;visibility:hidden;transition:.25s;z-index:99998}
.c420-mm-drawer{position:fixed;left:0;top:0;bottom:0;width:min(86vw,var(--c420-drawer-width));background:var(--c420-panel-bg);color:var(--c420-panel-text);transform:translateX(-100%);transition:.28s;z-index:99999;overflow:auto;box-shadow:10px 0 35px rgba(0,0,0,.15)}
.c420-mm.is-open .c420-mm-overlay{opacity:1;visibility:visible}
.c420-mm.is-open .c420-mm-drawer{transform:none}

/* Glass */
.c420-mm.is-glass .c420-mm-drawer{background:linear-gradient(180deg,rgba(255,255,255,var(--c420-glass-panel-opacity)),rgba(255,255,255,calc(var(--c420-glass-panel-opacity)*.45)));backdrop-filter:blur(var(--c420-glass-blur)) saturate(var(--c420-glass-saturation));-webkit-backdrop-filter:blur(var(--c420-glass-blur)) saturate(var(--c420-glass-saturation));border-right:1px solid rgba(255,255,255,var(--c420-glass-border-opacity));box-shadow:0 20px 60px rgba(0,0,0,.22)}
.c420-mm.is-glass .c420-mm-overlay{background:rgba(10,18,33,var(--c420-glass-overlay-opacity));backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.c420-mm.is-glass .c420-mm-root-btn,.c420-mm.is-glass .c420-mm-cat-item,.c420-mm.is-glass .c420-mm-inline-children a,.c420-mm.is-glass .c420-mm-links.is-bottom li a{background:rgba(255,255,255,.18)}

/* ── Panel cabeceras ─────────────────────────────────────────────────── */
.c420-mm-drawer-head,.c420-mm-subhead{position:sticky;top:0;z-index:3;display:grid;grid-template-columns:40px 1fr 40px;align-items:center;background:#1e2240;color:#fff;min-height:56px;padding:0 12px}
.c420-mm-drawer-head span,.c420-mm-subtitle{text-align:center;font-size:18px;font-weight:500}
.c420-mm-close,.c420-mm-back{background:none;border:0;color:inherit;font-size:18px;padding:0;line-height:1;cursor:pointer}
.c420-mm-drawer-head .c420-mm-close,.c420-mm-subhead .c420-mm-close{grid-column:3}
.c420-mm-drawer-head span:nth-child(2){grid-column:2}

/* ── Menús de links ──────────────────────────────────────────────────── */
.c420-mm-account-row{padding:10px 12px;border-bottom:1px solid var(--c420-border)}
.c420-mm-links{list-style:none;margin:0;padding:0}
.c420-mm-links.is-secondary-top{padding:10px 12px;border-bottom:1px solid var(--c420-border)}
.c420-mm-links.is-secondary-top li a{display:block;padding:10px 12px;background:#1e2240;color:#fff;border-radius:3px;text-decoration:none;font-size:13px;font-weight:600;text-align:center;margin-bottom:8px}
.c420-mm-links.is-bottom li a{display:block;padding:14px 12px;border-top:1px solid var(--c420-border);text-decoration:none;color:var(--c420-menu-item-color);text-transform:uppercase;font-weight:600;font-size:14px}

/* ── Categorías ──────────────────────────────────────────────────────── */
.c420-mm-panel{display:none}.c420-mm-panel.is-active{display:block}
.c420-mm-root-list,.c420-mm-cat-list{list-style:none;margin:0;padding:0}
.c420-mm-root-btn{display:flex;justify-content:space-between;align-items:center;width:100%;border:0;background:transparent;padding:14px 12px;border-top:1px solid var(--c420-border);font-size:14px;font-weight:700;color:var(--c420-menu-item-color);text-transform:uppercase;cursor:pointer;gap:6px}
.c420-mm-root-btn span:first-child{flex:1;text-align:left}
.c420-mm-plus{font-size:18px;color:#7b7b7b;flex-shrink:0}
.c420-mm-inline-children a,.c420-mm-cat-item{display:flex;justify-content:space-between;align-items:center;padding:14px 12px;border-top:1px solid var(--c420-border);text-decoration:none;color:var(--c420-menu-item-color);font-size:13px}
.c420-mm-cat-item.is-all{font-weight:500}
.c420-mm-inline-children a{font-size:12px;text-transform:uppercase;color:#666}
.c420-mm-root-item.is-expanded>.c420-mm-root-btn .c420-mm-plus{transform:rotate(45deg)}

/* ── Badges de categoría ─────────────────────────────────────────────── */
.c420-mm-cat-badges{display:inline-flex;gap:4px;align-items:center}
.c420-mm-badge{font-size:10px;font-weight:800;padding:2px 6px;border-radius:6px;letter-spacing:.02em;line-height:1.3;flex-shrink:0}
.c420-mm-badge--sale{background:#ff554f;color:#fff}
.c420-mm-badge--new{background:#27ae60;color:#fff}

/* ── Promos mini ─────────────────────────────────────────────────────── */
.c420-mm-root-promos{display:grid;gap:0}
.c420-mm-promo-mini{padding:0;border-top:1px solid var(--c420-border)}
.c420-mm-promo-mini-top{background:#ebd7aa;color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;padding:10px 12px}
.c420-mm-promo-mini-bottom{background:#eca1c4;color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;padding:10px 12px 20px}

/* ── Tarjetas promo ──────────────────────────────────────────────────── */
.c420-mm-promos-grid{display:grid;gap:12px;padding:16px 12px 24px}
.c420-mm-promo-card{display:flex;flex-direction:column;gap:0;padding:12px;border:1px solid var(--c420-border);border-radius:24px;background:#fff;text-decoration:none;color:inherit;overflow:hidden;min-height:auto}
.c420-mm.is-glass .c420-mm-promo-card{background:linear-gradient(180deg,rgba(255,255,255,.44),rgba(255,255,255,.24));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.3);border-radius:24px;box-shadow:0 18px 40px rgba(0,0,0,.14)}
.c420-mm-promo-img{width:100%;aspect-ratio:var(--c420-promo-image-ratio,16/9);border-radius:16px;overflow:hidden;margin-bottom:14px;background:rgba(255,255,255,.18)}
.c420-mm-promo-img img{width:100%;height:100%;object-fit:var(--c420-promo-image-fit);display:block}
.c420-mm-promo-copy{padding:0;display:flex;flex-direction:column;justify-content:flex-start;gap:10px;min-width:0}
.c420-mm-promo-discount{font-size:clamp(18px,2.2vw,20px);line-height:1.25;font-weight:700;margin-bottom:2px;color:var(--c420-promo-title-color)}
.c420-mm-promo-brand{font-size:15px;line-height:1.45;margin-bottom:8px;color:var(--c420-promo-text-color)}
.c420-mm-promo-btn{display:inline-flex;align-items:center;justify-content:center;background:#6ed39f;color:#275142;padding:12px 20px;border-radius:10px;font-weight:700;width:min(100%,var(--c420-promo-button-width));margin-top:auto}

/* ── Tarjetas de producto ────────────────────────────────────────────── */
.c420-mm-products-section{padding:16px 12px 24px}
.c420-mm-products-title{font-size:var(--c420-heading-size);font-weight:700;color:var(--c420-heading-color);margin:0 0 12px}
.c420-mm-products-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.c420-mm-product-card{position:relative;background:#fff;border:1px solid var(--c420-border);border-radius:18px;padding:12px;display:flex;flex-direction:column;gap:8px;transition:box-shadow .2s}
.c420-mm-product-card:hover{box-shadow:0 6px 20px rgba(0,0,0,.1)}
.c420-mm-product-link{text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:8px;flex:1}
.c420-mm-product-thumb{aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:#f7f7f7}
.c420-mm-product-thumb img{width:100%;height:100%;object-fit:contain;display:block}
.c420-mm-product-name{font-size:13px;line-height:1.3;font-weight:700;color:var(--c420-panel-text,var(--c420-text))}
.c420-mm-product-price{font-size:13px;color:#66757b}
.c420-mm-product-price del{opacity:.6;margin-right:4px}
.c420-mm-product-price ins{color:#e74c3c;text-decoration:none;font-weight:700}
/* Badge descuento */
.c420-mm-product-badge{position:absolute;top:8px;right:8px;background:#ff554f;color:#fff;font-size:10px;font-weight:800;padding:2px 7px;border-radius:8px;z-index:1}
/* Botón añadir al carrito */
.c420-mm-atc-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:9px 10px;background:var(--c420-accent);color:#fff;border:0;border-radius:10px;font-size:12px;font-weight:700;cursor:pointer;transition:background .2s,transform .15s;margin-top:auto}
.c420-mm-atc-btn:hover{background:color-mix(in srgb,var(--c420-accent) 85%,#000)}
.c420-mm-atc-btn svg{width:14px;height:14px;flex-shrink:0}
.c420-mm-atc-btn.is-loading{opacity:.7;pointer-events:none}
.c420-mm-atc-btn.is-added{background:#27ae60;transform:scale(1.03)}
.c420-mm-out-of-stock{font-size:11px;color:#999;text-align:center;padding:6px 0}

/* ── Blog ────────────────────────────────────────────────────────────── */
.c420-mm-blog-section{padding:16px 12px 24px}
.c420-mm-blog-title{font-size:var(--c420-heading-size);font-weight:700;color:var(--c420-heading-color);margin:0 0 12px}
.c420-mm-blog-grid{display:grid;gap:12px}
.c420-mm-blog-card{display:flex;flex-direction:column;gap:0;padding:12px;border:1px solid var(--c420-border);border-radius:24px;background:#fff;text-decoration:none;color:inherit;overflow:hidden}
.c420-mm-blog-thumb{width:100%;aspect-ratio:var(--c420-blog-image-ratio);border-radius:16px;overflow:hidden;margin-bottom:14px}
.c420-mm-blog-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.c420-mm-blog-copy{min-width:0}
.c420-mm-blog-cat{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--c420-blog-meta-color);font-weight:700;margin-bottom:8px}
.c420-mm-blog-card-title{font-size:clamp(18px,2.2vw,20px);line-height:1.25;font-weight:700;color:var(--c420-blog-title-color);margin-bottom:8px}
.c420-mm-blog-excerpt{font-size:15px;line-height:1.45;color:var(--c420-blog-excerpt-color)}

/* ── Sliders ─────────────────────────────────────────────────────────── */
.c420-mm-promos-grid.is-slider,.c420-mm-blog-grid.is-slider,.c420-mm-products-grid.is-slider{display:flex;gap:14px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.c420-mm-promos-grid.is-slider>*,.c420-mm-blog-grid.is-slider>*,.c420-mm-products-grid.is-slider>*{flex:0 0 82%;scroll-snap-align:start}
.c420-mm-promos-grid.is-slider .c420-mm-promo-card{flex:0 0 92%}
.c420-mm-blog-grid.is-slider .c420-mm-blog-card{flex:0 0 88%}
.c420-mm-products-grid.is-slider .c420-mm-product-card{flex:0 0 58%}

/* ── MINICARRITO ─────────────────────────────────────────────────────── */
.c420-mm-minicart{position:absolute;top:calc(100% + 6px);right:14px;width:min(92vw,380px);background:#fff;border:1px solid var(--c420-border);border-radius:20px;box-shadow:0 16px 48px rgba(0,0,0,.14);z-index:100002;overflow:hidden;transform:translateY(-8px) scale(.97);opacity:0;pointer-events:none;transition:transform .22s ease,opacity .22s ease}
.c420-mm-minicart.is-open{transform:translateY(0) scale(1);opacity:1;pointer-events:auto}
.c420-mm-minicart-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--c420-border);background:#fafafa}
.c420-mm-minicart-title{font-weight:700;font-size:15px;color:#333}
.c420-mm-minicart-count{font-size:13px;color:#999}
.c420-mm-minicart-items{max-height:280px;overflow-y:auto;padding:8px 0}
.c420-mm-minicart-item{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid #f5f5f5}
.c420-mm-minicart-img{width:52px;height:52px;flex-shrink:0;border-radius:10px;overflow:hidden;border:1px solid #eee}
.c420-mm-minicart-img img{width:100%;height:100%;object-fit:contain;display:block}
.c420-mm-minicart-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.c420-mm-minicart-name{font-size:12px;font-weight:600;color:#333;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.c420-mm-minicart-name:hover{color:var(--c420-accent)}
.c420-mm-minicart-qty-price{display:flex;gap:6px;align-items:center}
.c420-mm-minicart-item-qty{font-size:12px;color:#999}
.c420-mm-minicart-item-price{font-size:12px;font-weight:700;color:var(--c420-accent)}
.c420-mm-minicart-remove{width:22px;height:22px;border:0;background:none;color:#bbb;font-size:18px;cursor:pointer;flex-shrink:0;line-height:1;padding:0;transition:color .15s}
.c420-mm-minicart-remove:hover{color:#e74c3c}
.c420-mm-minicart-empty,.c420-mm-minicart-loading{padding:24px;text-align:center;color:#bbb;font-size:13px}
.c420-mm-minicart-footer{padding:14px 16px;border-top:1px solid var(--c420-border);background:#fafafa;display:flex;flex-direction:column;gap:8px}
.c420-mm-minicart-subtotal{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:700;color:#333;margin-bottom:4px}
.c420-minicart-subtotal-val{color:var(--c420-accent)}
.c420-mm-btn-cart,.c420-mm-btn-checkout{display:block;text-align:center;text-decoration:none;padding:11px;border-radius:12px;font-size:13px;font-weight:700;transition:opacity .2s}
.c420-mm-btn-cart{border:2px solid var(--c420-accent);color:var(--c420-accent)}
.c420-mm-btn-cart:hover{opacity:.8}
.c420-mm-btn-checkout{background:var(--c420-accent);color:#fff}
.c420-mm-btn-checkout:hover{opacity:.88}

/* ── Sticky / smart scroll ───────────────────────────────────────────── */
.c420-mm-sticky-wrap{position:relative;z-index:30}
.c420-mm.has-sticky .c420-mm-sticky-wrap{position:sticky;top:0}
.c420-mm.sticky-part-main .c420-mm-topbar,.c420-mm.sticky-part-search .c420-mm-topbar,.c420-mm.sticky-part-search .c420-mm-header,.c420-mm.sticky-part-main .c420-mm-search,.c420-mm.sticky-part-top-main .c420-mm-search{position:relative}
.c420-mm.sticky-part-main .c420-mm-header{position:sticky;top:0;z-index:32;background:#fff}
.c420-mm.sticky-part-search .c420-mm-search{position:sticky;top:0;z-index:32;background:#fff}
.c420-mm.has-sticky.non-sticky-topbar .c420-mm-topbar,.c420-mm.has-sticky.non-sticky-main .c420-mm-header,.c420-mm.has-sticky.non-sticky-search .c420-mm-search{position:relative!important;top:auto!important}
.c420-mm.sticky-smart .c420-mm-sticky-wrap{transition:transform .28s ease,opacity .28s ease;will-change:transform}
.c420-mm.sticky-smart.is-scrolled-down .c420-mm-sticky-wrap{transform:translateY(-100%);opacity:.98}
.c420-mm.sticky-smart.is-scrolled-up .c420-mm-sticky-wrap{transform:translateY(0)}
.c420-mm.sticky-fixed .c420-mm-sticky-wrap{box-shadow:0 10px 24px rgba(0,0,0,.08)}

/* ── Desktop (≥1025px) ───────────────────────────────────────────────── */
@media (min-width:1025px){
  .c420-mm-drawer{width:min(38vw,420px)}
  .c420-mm-drawer-head,.c420-mm-subhead{background:#fff;color:#333;border-bottom:1px solid var(--c420-border)}
  .c420-mm-drawer-head span,.c420-mm-subtitle{font-size:20px;font-weight:400}
  .c420-mm-subhead{background:#efebb8}
  .c420-mm-promos-grid{grid-template-columns:1fr 1fr}
  .c420-mm-blog-grid{grid-template-columns:1fr 1fr}
  .c420-mm-products-grid{grid-template-columns:repeat(3,1fr)}
  .c420-mm-promos-grid.is-slider .c420-mm-promo-card{flex-basis:44%}
  .c420-mm-blog-grid.is-slider .c420-mm-blog-card{flex-basis:44%}
  .c420-mm-products-grid.is-slider .c420-mm-product-card{flex-basis:32%}
  .c420-mm.is-glass .c420-mm-drawer-head,.c420-mm.is-glass .c420-mm-subhead{background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.28));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
}

/* ══════════════════════════════════════════════════════════════════
   v3.6 — IDENTIDAD DE USUARIO
══════════════════════════════════════════════════════════════════ */
.c420-mm-user-identity{padding:14px 16px;border-bottom:1px solid var(--c420-border)}

/* --- Logueado --- */
.c420-mm-user-identity.is-logged{display:flex;flex-direction:column;gap:12px;background:linear-gradient(135deg,#f0fafd 0%,#eaf6f9 100%)}
.c420-mm-user-avatar-row{display:flex;align-items:center;gap:12px}
.c420-mm-user-avatar{flex-shrink:0}
.c420-mm-avatar-img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--c420-accent)}
.c420-mm-user-info{flex:1;min-width:0}
.c420-mm-user-hello{font-size:13px;color:#666;margin-bottom:4px}
.c420-mm-user-name{font-size:15px;font-weight:700;color:#1e2240;display:block}
.c420-mm-user-loyalty{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:4px}
.c420-mm-loyalty-badge{font-size:10px;font-weight:800;padding:3px 8px;border-radius:20px;letter-spacing:.04em;text-transform:uppercase}
.c420-mm-loyalty-starter,.c420-mm-loyalty-nuevo    {background:#e8f5e9;color:#2e7d32}
.c420-mm-loyalty-bronze,.c420-mm-loyalty-regular   {background:#fff3e0;color:#e65100}
.c420-mm-loyalty-silver,.c420-mm-loyalty-frecuente {background:#e3f2fd;color:#1565c0}
.c420-mm-loyalty-gold,.c420-mm-loyalty-vip         {background:linear-gradient(135deg,#fff8e1,#fffde7);color:#f57f17;border:1px solid #ffe082}
.c420-mm-loyalty-discount{font-size:12px;color:#555}
.c420-mm-loyalty-discount strong{color:#e53935}
.c420-mm-user-links{display:flex;gap:8px}
.c420-mm-user-link{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--c420-accent);text-decoration:none;padding:6px 10px;border:1px solid rgba(94,183,204,.3);border-radius:20px;transition:background .15s}
.c420-mm-user-link:hover{background:rgba(94,183,204,.1)}
.c420-mm-user-link svg{width:14px;height:14px;flex-shrink:0}

/* --- Visitante (CTA registro) --- */
.c420-mm-user-identity.is-guest{display:flex;flex-direction:column;gap:12px;background:linear-gradient(135deg,#fff8e1 0%,#fffde7 100%)}
.c420-mm-guest-cta{display:flex;align-items:center;gap:12px}
.c420-mm-guest-icon{font-size:28px;flex-shrink:0}
.c420-mm-guest-text{display:flex;flex-direction:column;gap:2px}
.c420-mm-guest-text strong{font-size:14px;font-weight:700;color:#1e2240}
.c420-mm-guest-text span{font-size:12px;color:#888}
.c420-mm-guest-actions{display:flex;gap:8px}
.c420-mm-btn-register{flex:1;text-align:center;padding:10px 12px;background:var(--c420-accent);color:#fff;border-radius:12px;font-size:12px;font-weight:700;text-decoration:none;transition:opacity .2s}
.c420-mm-btn-register:hover{opacity:.88}
.c420-mm-btn-login{flex:1;text-align:center;padding:10px 12px;border:1.5px solid var(--c420-accent);color:var(--c420-accent);border-radius:12px;font-size:12px;font-weight:700;text-decoration:none;transition:opacity .2s}
.c420-mm-btn-login:hover{opacity:.8}

/* ══════════════════════════════════════════════════════════════════
   v3.6 — HISTORIAL DE CATEGORÍAS
══════════════════════════════════════════════════════════════════ */
.c420-mm-recent-cats{padding:10px 14px;border-bottom:1px solid var(--c420-border);background:#fafafa}
.c420-mm-recent-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.c420-mm-recent-head span{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#999}
.c420-mm-recent-clear{background:none;border:0;font-size:16px;color:#ccc;cursor:pointer;padding:0;line-height:1;transition:color .15s}
.c420-mm-recent-clear:hover{color:#e74c3c}
.c420-mm-recent-list{display:flex;gap:6px;flex-wrap:wrap}
.c420-mm-recent-item{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;background:#fff;border:1px solid var(--c420-border);border-radius:20px;font-size:12px;font-weight:600;color:var(--c420-menu-item-color);text-decoration:none;transition:background .15s,border-color .15s;white-space:nowrap}
.c420-mm-recent-item:hover{background:#f0fafd;border-color:var(--c420-accent);color:var(--c420-accent)}
.c420-mm-recent-item svg{width:12px;height:12px;flex-shrink:0;opacity:.5}

/* ══════════════════════════════════════════════════════════════════
   v3.6 — WISHLIST (icono en header + botón en tarjeta)
══════════════════════════════════════════════════════════════════ */
/* Icono en la barra de acciones */
.c420-mm-wl-icon{position:relative}
.c420-mm-wl-count{position:absolute;right:-6px;top:-6px;min-width:16px;height:16px;border-radius:999px;background:var(--c420-accent);color:#fff;font-size:10px;display:flex;align-items:center;justify-content:center;padding:0 4px;transition:transform .2s}
.c420-mm-wl-count.c420-pulse{animation:c420-pulse .35s ease}

/* Botón corazón en tarjeta de producto */
.c420-mm-wl-btn{position:absolute;top:8px;left:8px;z-index:2;width:28px;height:28px;border-radius:50%;background:#fff;border:1px solid #ddd;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:background .15s,border-color .15s,transform .2s;box-shadow:0 2px 6px rgba(0,0,0,.08)}
.c420-mm-wl-btn svg{width:14px;height:14px;color:#bbb;transition:color .15s}
.c420-mm-wl-btn:hover{background:#fff5f5;border-color:#ffb3b3;transform:scale(1.12)}
.c420-mm-wl-btn:hover svg{color:#e74c3c}
.c420-mm-wl-btn.is-active{background:#fff0f0;border-color:#e74c3c}
.c420-mm-wl-btn.is-active svg{color:#e74c3c}
/* Reubicar el badge de descuento para que no solape con el corazón */
.c420-mm-product-badge{top:8px;right:8px;left:auto}

/* ══════════════════════════════════════════════════════════════════
   v3.6 — TOAST DE FEEDBACK
══════════════════════════════════════════════════════════════════ */
.c420-mm-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(16px);background:#1e2240;color:#fff;font-size:13px;font-weight:600;padding:10px 20px;border-radius:24px;white-space:nowrap;z-index:100010;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.c420-mm-toast.is-visible{opacity:1;transform:translateX(-50%) translateY(0)}

/* ══════════════════════════════════════════════════════════════════
   v3.6 — AJUSTE: posición relativa en tarjeta para wl-btn + badge
══════════════════════════════════════════════════════════════════ */
.c420-mm-product-card{position:relative}

/* ══════════════════════════════════════════════════════════════════
   v3.7 — SKELETON LOADER (carga diferida)
══════════════════════════════════════════════════════════════════ */
@keyframes c420-shimmer {
  0%   { background-position: -600px 0; }
  100% { background-position:  600px 0; }
}
.c420-mm-skeleton-wrap{padding:16px 12px;display:flex;flex-direction:column;gap:12px}
.c420-mm-skeleton{border-radius:18px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e8ea 50%,#f0f0f0 75%);background-size:600px 100%;animation:c420-shimmer 1.4s infinite linear}
.c420-mm-skeleton--card{height:120px}
.c420-mm-skeleton--blog{height:90px}

/* ══════════════════════════════════════════════════════════════════
   v3.7 — SWIPE FEEDBACK VISUAL
   El drawer sigue el dedo durante el gesto con transform
══════════════════════════════════════════════════════════════════ */
.c420-mm-drawer.is-swiping{
  transform:translateX(var(--c420-swipe-x,0)) !important;
  transition:none !important;
}

/* ══════════════════════════════════════════════════════════════════
   v3.7 — MODO OSCURO AUTOMÁTICO
   Aprovecha las CSS custom properties ya existentes para recolorear
   todos los componentes con un único bloque @media.
══════════════════════════════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {

  /* ── Tokens globales ─────────────────────────────────────────── */
  .c420-mm {
    --c420-panel-bg:    #1a1f2e;
    --c420-panel-text:  #d6e4ea;
    --c420-border:      #2e3650;
    --c420-text:        #d6e4ea;
    --c420-soft:        #222840;
    --c420-accent:      #6ec8dc;
    --c420-dark:        #0d1017;
  }

  /* ── Header / Topbar ─────────────────────────────────────────── */
  .c420-mm-header               { background:#1a1f2e; border-bottom-color:#2e3650; }
  .c420-mm-topbar               { background:#0d1017; }
  .c420-mm-burger               { background:#1e2545; border-color:#2e3650; }
  .c420-mm-burger span          { background:#6ec8dc; }
  .c420-mm-icon                 { color:#c8dde5; }
  .c420-mm-logo span            { color:#6ec8dc; }

  /* ── Buscador ────────────────────────────────────────────────── */
  .c420-mm-search               { background:#1a1f2e; border-bottom-color:#2e3650; }
  .c420-mm-search input[type=search] { background:#111627; border-color:#2e3650; color:#d6e4ea; }
  .c420-mm-search input[type=search]::placeholder { color:#5a7080; }

  /* ── Autocompletado ──────────────────────────────────────────── */
  .c420-mm-autocomplete         { background:#1a1f2e; border-color:#2e3650; }
  .c420-mm-ac-item              { border-bottom-color:#2a3148; }
  .c420-mm-ac-item:hover,.c420-mm-ac-item.is-selected { background:#1e2b38; }
  .c420-mm-ac-name              { color:#d6e4ea; }
  .c420-mm-ac-seeall            { border-top-color:#2e3650; }
  .c420-mm-ac-seeall:hover      { background:#1e2b38; }

  /* ── Overlay + Drawer ────────────────────────────────────────── */
  .c420-mm-drawer               { background:var(--c420-panel-bg); color:var(--c420-panel-text); box-shadow:10px 0 35px rgba(0,0,0,.5); }
  .c420-mm-overlay              { background:rgba(0,0,0,.65); }

  /* ── Cabeceras de panel ──────────────────────────────────────── */
  .c420-mm-drawer-head,
  .c420-mm-subhead              { background:#111627; color:#d6e4ea; }
  @media (min-width:1025px) {
    .c420-mm-drawer-head,
    .c420-mm-subhead            { background:#1a1f2e; border-bottom-color:#2e3650; }
    .c420-mm-subhead            { background:#252b42; }
  }

  /* ── Listas y categorías ─────────────────────────────────────── */
  .c420-mm-root-btn,
  .c420-mm-cat-item,
  .c420-mm-inline-children a    { border-top-color:#2e3650; color:#c5d8e0; }
  .c420-mm-root-btn:hover,
  .c420-mm-cat-item:hover       { background:#1e2b38; }
  .c420-mm-links.is-secondary-top li a { background:#111627; }
  .c420-mm-links.is-bottom li a { border-top-color:#2e3650; color:#c5d8e0; }

  /* ── Historial ───────────────────────────────────────────────── */
  .c420-mm-recent-cats          { background:#141927; border-bottom-color:#2e3650; }
  .c420-mm-recent-item          { background:#1e2540; border-color:#2e3650; color:#b8cdd6; }
  .c420-mm-recent-item:hover    { background:#1e3040; border-color:#6ec8dc; color:#6ec8dc; }

  /* ── Identidad de usuario ────────────────────────────────────── */
  .c420-mm-user-identity.is-logged { background:linear-gradient(135deg,#1a2a35,#1e2d38); }
  .c420-mm-user-identity.is-guest  { background:linear-gradient(135deg,#1e2820,#1a2417); }
  .c420-mm-user-name            { color:#e8f4f8; }
  .c420-mm-user-hello           { color:#8aa8b5; }
  .c420-mm-user-link            { color:#6ec8dc; border-color:rgba(110,200,220,.25); }
  .c420-mm-user-link:hover      { background:rgba(110,200,220,.12); }
  .c420-mm-guest-text strong    { color:#e8f4f8; }
  .c420-mm-guest-text span      { color:#8aa8b5; }
  .c420-mm-loyalty-discount     { color:#a0b8c0; }

  /* ── Tarjetas promo ──────────────────────────────────────────── */
  .c420-mm-promo-card           { background:#1e2540; border-color:#2e3650; }
  .c420-mm-promo-mini-top       { background:#b08840; }
  .c420-mm-promo-mini-bottom    { background:#994070; }

  /* ── Tarjetas de producto ────────────────────────────────────── */
  .c420-mm-product-card         { background:#1e2540; border-color:#2e3650; }
  .c420-mm-product-link         { color:#d6e4ea; }
  .c420-mm-product-name         { color:#d6e4ea; }
  .c420-mm-product-price        { color:#8aa8b5; }
  .c420-mm-product-thumb        { background:#131926; }
  .c420-mm-wl-btn               { background:#1e2540; border-color:#2e3650; }
  .c420-mm-wl-btn svg           { color:#5a7080; }
  .c420-mm-wl-btn:hover         { background:#2a1f1f; border-color:#cc4444; }
  .c420-mm-wl-btn.is-active     { background:#2a1f1f; border-color:#e74c3c; }

  /* ── Blog ────────────────────────────────────────────────────── */
  .c420-mm-blog-card            { background:#1e2540; border-color:#2e3650; color:#d6e4ea; }
  .c420-mm-blog-card-title      { color:#d6e4ea; }
  .c420-mm-blog-excerpt         { color:#8aa8b5; }

  /* ── Minicarrito ─────────────────────────────────────────────── */
  .c420-mm-minicart             { background:#1a1f2e; border-color:#2e3650; }
  .c420-mm-minicart-head,
  .c420-mm-minicart-footer      { background:#141927; }
  .c420-mm-minicart-title       { color:#d6e4ea; }
  .c420-mm-minicart-name        { color:#c5d8e0; }
  .c420-mm-minicart-item        { border-bottom-color:#252b42; }
  .c420-mm-minicart-item-qty    { color:#8aa8b5; }
  .c420-mm-minicart-subtotal    { color:#d6e4ea; }
  .c420-mm-btn-cart             { border-color:#6ec8dc; color:#6ec8dc; }
  .c420-mm-btn-cart:hover,
  .c420-mm-btn-checkout:hover   { opacity:.85; }

  /* ── Skeleton ────────────────────────────────────────────────── */
  .c420-mm-skeleton             { background:linear-gradient(90deg,#1e2540 25%,#252d46 50%,#1e2540 75%); background-size:600px 100%; }

  /* ── Toast ───────────────────────────────────────────────────── */
  .c420-mm-toast                { background:#0d1017; }

  /* ── Glass en modo oscuro ────────────────────────────────────── */
  .c420-mm.is-glass .c420-mm-drawer {
    background:linear-gradient(180deg,
      rgba(20,26,46,var(--c420-glass-panel-opacity)),
      rgba(15,20,38,calc(var(--c420-glass-panel-opacity)*.55))
    );
    border-right:1px solid rgba(80,120,160,var(--c420-glass-border-opacity));
  }
  .c420-mm.is-glass .c420-mm-overlay {
    background:rgba(0,5,18,var(--c420-glass-overlay-opacity));
  }
  .c420-mm.is-glass .c420-mm-root-btn,
  .c420-mm.is-glass .c420-mm-cat-item,
  .c420-mm.is-glass .c420-mm-inline-children a,
  .c420-mm.is-glass .c420-mm-links.is-bottom li a { background:rgba(255,255,255,.06); }
  .c420-mm.is-glass .c420-mm-promo-card { background:linear-gradient(180deg,rgba(30,40,60,.7),rgba(20,30,50,.5)); }
}