/* MTG Shared Render Matrix: mtg-mobile-hamburger-menu-css */ /* * Base desktop: hamburger apagado. */ .mtg-mhm-toggle, .mtg-mhm-overlay, .mtg-mhm-panel{ display:none !important; } @media (min-width: 781px){ .mtg-mhm-toggle, .mtg-mhm-overlay, .mtg-mhm-panel{ display:none !important; visibility:hidden !important; pointer-events:none !important; } } @media (max-width: 780px){ body.mtg-mhm-open{ overflow:hidden !important; } /* * REGLA CENTRAL: * En móvil se oculta SOLO el menú central. * NO se toca logo ni acciones. */ .mtg-header-center, .mtg-header-nav{ display:none !important; visibility:hidden !important; pointer-events:none !important; height:0 !important; max-height:0 !important; overflow:hidden !important; } /* * Restaurar explícitamente logo y acciones del header. */ .mtg-header-main, .mtg-header-main__inner, .mtg-header-brand, .mtg-header-brand *, .custom-logo-link, .custom-logo-link *, .mtg-store-logo-link, .mtg-store-logo-link *, .mtg-store-logo, .mtg-header-actions, .mtg-header-actions *, .mtg-header-action, .mtg-header-action *, .mtg-usf-hcart, .mtg-usf-hcart *, .mtg-header-btn, .mtg-header-btn *{ visibility:visible !important; opacity:1 !important; pointer-events:auto !important; height:auto !important; max-height:none !important; overflow:visible !important; } .mtg-header-main__inner{ position:relative !important; } .mtg-header-brand{ display:flex !important; align-items:center !important; } .mtg-header-actions{ display:flex !important; align-items:center !important; justify-content:flex-end !important; gap:8px !important; margin-right:58px !important; } /* * Botón hamburger. * Queda fijo a la derecha para que sirva en todos los themes. */ .mtg-mhm-toggle{ position:fixed !important; top:16px !important; right:14px !important; z-index:999999 !important; width:44px !important; height:44px !important; border:1px solid rgba(23,105,255,.22) !important; border-radius:15px !important; background:#ffffff !important; box-shadow:0 14px 30px rgba(7,24,50,.14) !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; gap:5px !important; padding:0 !important; cursor:pointer !important; visibility:visible !important; pointer-events:auto !important; } .mtg-mhm-toggle span{ display:block !important; width:20px !important; height:2px !important; border-radius:99px !important; background:#071832 !important; } .mtg-mhm-overlay{ position:fixed !important; inset:0 !important; z-index:999997 !important; background:rgba(7,24,50,.38) !important; backdrop-filter:blur(4px) !important; opacity:0 !important; pointer-events:none !important; transition:opacity .22s ease !important; display:block !important; } .mtg-mhm-panel{ position:fixed !important; top:0 !important; right:0 !important; z-index:999998 !important; width:min(86vw, 340px) !important; height:100vh !important; display:flex !important; flex-direction:column !important; background:#ffffff !important; box-shadow:-24px 0 60px rgba(7,24,50,.20) !important; transform:translateX(104%) !important; transition:transform .24s ease !important; padding:18px !important; box-sizing:border-box !important; visibility:visible !important; } body.mtg-mhm-open .mtg-mhm-overlay{ opacity:1 !important; pointer-events:auto !important; } body.mtg-mhm-open .mtg-mhm-panel{ transform:translateX(0) !important; } .mtg-mhm-panel-head{ display:flex !important; align-items:center !important; justify-content:space-between !important; gap:12px !important; padding-bottom:14px !important; border-bottom:1px solid #e2ebf8 !important; } .mtg-mhm-logo{ min-width:0 !important; display:flex !important; align-items:center !important; } .mtg-mhm-logo img{ max-width:170px !important; max-height:44px !important; object-fit:contain !important; display:block !important; } .mtg-mhm-brand-text{ display:block !important; font-size:18px !important; line-height:1 !important; font-weight:950 !important; letter-spacing:-.04em !important; color:#1769ff !important; } .mtg-mhm-close{ width:38px !important; height:38px !important; border:1px solid #d7e5f8 !important; border-radius:13px !important; background:#f6f9ff !important; color:#071832 !important; font-size:26px !important; line-height:1 !important; font-weight:700 !important; cursor:pointer !important; } .mtg-mhm-nav{ display:grid !important; gap:10px !important; padding:18px 0 !important; } .mtg-mhm-nav a{ display:flex !important; align-items:center !important; justify-content:space-between !important; min-height:50px !important; padding:0 14px !important; border-radius:15px !important; background:#f7fbff !important; border:1px solid #deebfb !important; color:#071832 !important; text-decoration:none !important; font-size:16px !important; font-weight:900 !important; } .mtg-mhm-nav a:after{ content:"›" !important; color:#1769ff !important; font-size:24px !important; line-height:1 !important; } } @media (max-width: 430px){ .mtg-header-actions{ gap:6px !important; margin-right:54px !important; } .mtg-mhm-toggle{ top:14px !important; right:10px !important; width:42px !important; height:42px !important; } } /* MTG TM1 HEADER MOBILE POLISH V1 - START */ @media (max-width: 780px){ /* * TM1: logo más chico y header más ordenado. * No toca PC ni otros templates. */ body.mtg-template-tm1 .mtg-header-main{ background:#ffffff !important; border-bottom:1px solid #eef2f7 !important; box-shadow:0 10px 24px rgba(15,23,42,.04) !important; } body.mtg-template-tm1 .mtg-header-main__inner{ width:94% !important; min-height:76px !important; padding:10px 58px 10px 10px !important; display:grid !important; grid-template-columns:auto 1fr !important; align-items:center !important; gap:10px !important; } body.mtg-template-tm1 .mtg-header-brand{ display:flex !important; align-items:center !important; justify-content:flex-start !important; min-width:0 !important; } body.mtg-template-tm1 .mtg-header-brand img, body.mtg-template-tm1 .mtg-store-logo, body.mtg-template-tm1 .custom-logo{ max-width:132px !important; width:auto !important; max-height:34px !important; height:auto !important; object-fit:contain !important; display:block !important; } body.mtg-template-tm1 .mtg-header-center, body.mtg-template-tm1 .mtg-header-nav{ display:none !important; visibility:hidden !important; pointer-events:none !important; height:0 !important; max-height:0 !important; overflow:hidden !important; } body.mtg-template-tm1 .mtg-header-actions{ display:flex !important; align-items:center !important; justify-content:flex-end !important; gap:7px !important; margin:0 !important; min-width:0 !important; flex-wrap:nowrap !important; } body.mtg-template-tm1 .mtg-header-actions .mtg-header-action, body.mtg-template-tm1 .mtg-header-actions .mtg-header-btn, body.mtg-template-tm1 .mtg-header-actions .mtg-usf-hcart{ flex:0 0 auto !important; } body.mtg-template-tm1 .mtg-usf-hcart, body.mtg-template-tm1 .mtg-hcart{ width:42px !important; height:42px !important; min-width:42px !important; border-radius:14px !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; } body.mtg-template-tm1 .mtg-header-btn{ min-height:42px !important; height:42px !important; padding:0 12px !important; border-radius:14px !important; font-size:12px !important; font-weight:950 !important; white-space:nowrap !important; display:flex !important; align-items:center !important; justify-content:center !important; } body.mtg-template-tm1 .mtg-header-btn--wa{ background:#16a34a !important; color:#fff !important; } body.mtg-template-tm1 .mtg-header-btn--offers{ background:#0f172a !important; color:#fff !important; } /* * Si aparecen demasiados botones en móvil, dejamos visible carrito + WhatsApp. * Ofertas se puede seguir controlando desde Header Presets, pero aquí evitamos saturación. */ body.mtg-template-tm1 .mtg-header-btn--offers{ display:none !important; } body.mtg-template-tm1 .mtg-mhm-toggle{ top:17px !important; right:10px !important; width:42px !important; height:42px !important; border-radius:14px !important; } } @media (max-width: 390px){ body.mtg-template-tm1 .mtg-header-main__inner{ width:96% !important; padding-left:8px !important; padding-right:54px !important; gap:8px !important; } body.mtg-template-tm1 .mtg-header-brand img, body.mtg-template-tm1 .mtg-store-logo, body.mtg-template-tm1 .custom-logo{ max-width:116px !important; max-height:31px !important; } body.mtg-template-tm1 .mtg-header-actions{ gap:5px !important; } body.mtg-template-tm1 .mtg-usf-hcart, body.mtg-template-tm1 .mtg-hcart{ width:38px !important; height:38px !important; min-width:38px !important; } body.mtg-template-tm1 .mtg-header-btn{ height:38px !important; min-height:38px !important; padding:0 10px !important; font-size:11px !important; } } /* MTG TM1 HEADER MOBILE POLISH V1 - END */ /* MTG TM1 OFFERS MOBILE FIX V1 - START */ @media (max-width: 780px){ /* * TM1: * Header superior mantiene logo + carrito + WhatsApp + hamburguesa. * Botón Ofertas activo se coloca abajo, centrado. */ body.mtg-template-tm1 .mtg-header-main__inner{ min-height:112px !important; padding-bottom:52px !important; position:relative !important; } body.mtg-template-tm1 .mtg-header-btn--offers{ display:flex !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; position:absolute !important; left:50% !important; bottom:10px !important; transform:translateX(-50%) !important; z-index:20 !important; width:auto !important; min-width:150px !important; height:38px !important; min-height:38px !important; padding:0 18px !important; border-radius:999px !important; background:#0f172a !important; color:#ffffff !important; font-size:12px !important; font-weight:950 !important; text-align:center !important; align-items:center !important; justify-content:center !important; box-shadow:0 12px 26px rgba(15,23,42,.18) !important; white-space:nowrap !important; } body.mtg-template-tm1 .mtg-header-btn--offers, body.mtg-template-tm1 .mtg-header-btn--offers *{ color:#ffffff !important; } } @media (max-width: 390px){ body.mtg-template-tm1 .mtg-header-main__inner{ min-height:106px !important; padding-bottom:48px !important; } body.mtg-template-tm1 .mtg-header-btn--offers{ min-width:138px !important; height:36px !important; min-height:36px !important; font-size:11px !important; bottom:8px !important; padding:0 15px !important; } } /* MTG TM1 OFFERS MOBILE FIX V1 - END */ /* MTG TM1 HEADER ACTION ROW FIX V2 - START */ @media (max-width: 780px){ /* * TM1 header mobile: * Logo arriba. * Carrito + WhatsApp + Ofertas en una sola fila centrada. * Hamburguesa queda a la derecha. */ body.mtg-template-tm1 .mtg-header-main__inner{ min-height:112px !important; padding:12px 58px 12px 12px !important; display:grid !important; grid-template-columns:1fr auto !important; grid-template-rows:auto auto !important; align-items:center !important; gap:10px !important; position:relative !important; } body.mtg-template-tm1 .mtg-header-brand{ grid-column:1 / 2 !important; grid-row:1 !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; min-width:0 !important; } body.mtg-template-tm1 .mtg-header-brand img, body.mtg-template-tm1 .mtg-store-logo, body.mtg-template-tm1 .custom-logo{ max-width:124px !important; max-height:32px !important; width:auto !important; height:auto !important; object-fit:contain !important; } body.mtg-template-tm1 .mtg-header-actions{ grid-column:1 / 3 !important; grid-row:2 !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:9px !important; width:100% !important; margin:0 !important; padding:0 48px 0 0 !important; position:static !important; flex-wrap:nowrap !important; } body.mtg-template-tm1 .mtg-header-actions .mtg-header-action, body.mtg-template-tm1 .mtg-header-actions .mtg-header-btn, body.mtg-template-tm1 .mtg-header-actions .mtg-usf-hcart{ position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; margin:0 !important; flex:0 0 auto !important; } body.mtg-template-tm1 .mtg-usf-hcart, body.mtg-template-tm1 .mtg-hcart{ width:42px !important; height:42px !important; min-width:42px !important; border-radius:14px !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; } body.mtg-template-tm1 .mtg-header-btn{ height:42px !important; min-height:42px !important; border-radius:14px !important; padding:0 14px !important; font-size:12px !important; font-weight:950 !important; display:flex !important; align-items:center !important; justify-content:center !important; white-space:nowrap !important; box-shadow:0 10px 22px rgba(15,23,42,.12) !important; } body.mtg-template-tm1 .mtg-header-btn--wa{ background:#16a34a !important; color:#ffffff !important; } body.mtg-template-tm1 .mtg-header-btn--offers{ display:flex !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; min-width:auto !important; width:auto !important; background:#0f172a !important; color:#ffffff !important; border-radius:14px !important; position:relative !important; left:auto !important; bottom:auto !important; transform:none !important; z-index:auto !important; } body.mtg-template-tm1 .mtg-header-btn--wa *, body.mtg-template-tm1 .mtg-header-btn--offers *{ color:#ffffff !important; } body.mtg-template-tm1 .mtg-mhm-toggle{ top:13px !important; right:12px !important; width:42px !important; height:42px !important; border-radius:14px !important; } } @media (max-width: 390px){ body.mtg-template-tm1 .mtg-header-main__inner{ min-height:108px !important; padding:10px 54px 10px 10px !important; gap:9px !important; } body.mtg-template-tm1 .mtg-header-brand img, body.mtg-template-tm1 .mtg-store-logo, body.mtg-template-tm1 .custom-logo{ max-width:112px !important; max-height:30px !important; } body.mtg-template-tm1 .mtg-header-actions{ gap:7px !important; padding-right:44px !important; } body.mtg-template-tm1 .mtg-usf-hcart, body.mtg-template-tm1 .mtg-hcart{ width:38px !important; height:38px !important; min-width:38px !important; } body.mtg-template-tm1 .mtg-header-btn{ height:38px !important; min-height:38px !important; padding:0 11px !important; font-size:11px !important; } } /* MTG TM1 HEADER ACTION ROW FIX V2 - END */ /* MTG TM1 HEADER CENTER FINAL V3 - START */ @media (max-width: 780px){ /* * Logo un poco más grande. */ body.mtg-template-tm1 .mtg-header-brand img, body.mtg-template-tm1 .mtg-store-logo, body.mtg-template-tm1 .custom-logo{ max-width:148px !important; max-height:38px !important; width:auto !important; height:auto !important; object-fit:contain !important; } /* * Header inner más limpio. */ body.mtg-template-tm1 .mtg-header-main__inner{ min-height:112px !important; padding:12px 56px 12px 12px !important; display:grid !important; grid-template-columns:1fr auto !important; grid-template-rows:auto auto !important; align-items:center !important; gap:10px !important; } body.mtg-template-tm1 .mtg-header-brand{ grid-column:1 / 2 !important; grid-row:1 !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; min-width:0 !important; } /* * Carrito + WhatsApp + Ofertas centrados de verdad. */ body.mtg-template-tm1 .mtg-header-actions{ grid-column:1 / -1 !important; grid-row:2 !important; width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:10px !important; margin:0 !important; padding:0 !important; position:static !important; flex-wrap:nowrap !important; } body.mtg-template-tm1 .mtg-header-actions .mtg-header-action, body.mtg-template-tm1 .mtg-header-actions .mtg-header-btn, body.mtg-template-tm1 .mtg-header-actions .mtg-usf-hcart{ position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; margin:0 !important; flex:0 0 auto !important; } body.mtg-template-tm1 .mtg-usf-hcart, body.mtg-template-tm1 .mtg-hcart{ width:42px !important; height:42px !important; min-width:42px !important; border-radius:14px !important; display:flex !important; align-items:center !important; justify-content:center !important; padding:0 !important; } body.mtg-template-tm1 .mtg-header-btn{ height:42px !important; min-height:42px !important; padding:0 14px !important; border-radius:14px !important; display:flex !important; align-items:center !important; justify-content:center !important; font-size:12px !important; font-weight:950 !important; white-space:nowrap !important; } body.mtg-template-tm1 .mtg-header-btn--wa{ background:#16a34a !important; color:#fff !important; } body.mtg-template-tm1 .mtg-header-btn--offers{ display:flex !important; background:#0f172a !important; color:#fff !important; } body.mtg-template-tm1 .mtg-header-btn--wa *, body.mtg-template-tm1 .mtg-header-btn--offers *{ color:#fff !important; } /* * Hamburguesa arriba a la derecha sin molestar. */ body.mtg-template-tm1 .mtg-mhm-toggle{ top:13px !important; right:12px !important; width:42px !important; height:42px !important; border-radius:14px !important; } } @media (max-width: 390px){ body.mtg-template-tm1 .mtg-header-main__inner{ min-height:108px !important; padding:10px 52px 10px 10px !important; gap:9px !important; } body.mtg-template-tm1 .mtg-header-brand img, body.mtg-template-tm1 .mtg-store-logo, body.mtg-template-tm1 .custom-logo{ max-width:132px !important; max-height:34px !important; } body.mtg-template-tm1 .mtg-header-actions{ gap:8px !important; } body.mtg-template-tm1 .mtg-usf-hcart, body.mtg-template-tm1 .mtg-hcart{ width:38px !important; height:38px !important; min-width:38px !important; } body.mtg-template-tm1 .mtg-header-btn{ height:38px !important; min-height:38px !important; padding:0 11px !important; font-size:11px !important; } } /* MTG TM1 HEADER CENTER FINAL V3 - END */ /* MTG TM2 HEADER ACTIONS CENTER V1 - START */ @media (max-width: 780px){ /* * TM2: * Logo grande queda como está. * Hamburguesa queda como está. * Solo centramos carrito + WhatsApp + Ofertas. */ body.mtg-template-tm2 .mtg-header-main__inner{ display:grid !important; grid-template-columns:1fr auto !important; grid-template-rows:auto auto !important; align-items:center !important; gap:10px !important; padding:16px 56px 16px 12px !important; min-height:164px !important; position:relative !important; } body.mtg-template-tm2 .mtg-header-brand{ grid-column:1 / -1 !important; grid-row:1 !important; display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; min-width:0 !important; } body.mtg-template-tm2 .mtg-header-brand img, body.mtg-template-tm2 .mtg-store-logo, body.mtg-template-tm2 .custom-logo{ width:auto !important; height:auto !important; max-width:min(270px,78vw) !important; max-height:86px !important; object-fit:contain !important; display:block !important; } body.mtg-template-tm2 .mtg-header-center, body.mtg-template-tm2 .mtg-header-nav{ display:none !important; visibility:hidden !important; pointer-events:none !important; height:0 !important; max-height:0 !important; overflow:hidden !important; } body.mtg-template-tm2 .mtg-header-actions{ grid-column:1 / -1 !important; grid-row:2 !important; width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:9px !important; margin:0 !important; padding:0 !important; position:static !important; flex-wrap:nowrap !important; } body.mtg-template-tm2 .mtg-header-actions .mtg-header-action, body.mtg-template-tm2 .mtg-header-actions .mtg-header-btn, body.mtg-template-tm2 .mtg-header-actions .mtg-usf-hcart{ position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; margin:0 !important; flex:0 0 auto !important; } body.mtg-template-tm2 .mtg-usf-hcart, body.mtg-template-tm2 .mtg-hcart{ width:42px !important; height:42px !important; min-width:42px !important; border-radius:14px !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; } body.mtg-template-tm2 .mtg-header-btn{ height:42px !important; min-height:42px !important; padding:0 14px !important; border-radius:14px !important; display:flex !important; align-items:center !important; justify-content:center !important; font-size:12px !important; font-weight:950 !important; white-space:nowrap !important; box-shadow:0 10px 22px rgba(15,23,42,.12) !important; } body.mtg-template-tm2 .mtg-header-btn--wa{ background:#16a34a !important; color:#ffffff !important; } body.mtg-template-tm2 .mtg-header-btn--offers{ display:flex !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; background:#0f172a !important; color:#ffffff !important; } body.mtg-template-tm2 .mtg-header-btn--wa *, body.mtg-template-tm2 .mtg-header-btn--offers *{ color:#ffffff !important; } body.mtg-template-tm2 .mtg-mhm-toggle{ top:48px !important; right:12px !important; width:42px !important; height:42px !important; border-radius:14px !important; } } @media (max-width: 390px){ body.mtg-template-tm2 .mtg-header-main__inner{ min-height:156px !important; padding:14px 52px 14px 10px !important; gap:9px !important; } body.mtg-template-tm2 .mtg-header-brand img, body.mtg-template-tm2 .mtg-store-logo, body.mtg-template-tm2 .custom-logo{ max-width:min(245px,76vw) !important; max-height:78px !important; } body.mtg-template-tm2 .mtg-header-actions{ gap:8px !important; } body.mtg-template-tm2 .mtg-usf-hcart, body.mtg-template-tm2 .mtg-hcart{ width:38px !important; height:38px !important; min-width:38px !important; } body.mtg-template-tm2 .mtg-header-btn{ height:38px !important; min-height:38px !important; padding:0 11px !important; font-size:11px !important; } body.mtg-template-tm2 .mtg-mhm-toggle{ top:46px !important; right:10px !important; width:40px !important; height:40px !important; } } /* MTG TM2 HEADER ACTIONS CENTER V1 - END */ /* MTG TM2 HEADER SAFE FIX V2 - START */ @media (max-width: 780px){ /* * TM2 topbar mobile centrado. */ body.mtg-template-tm2 .mtg-header-topbar--mobile{ width:100% !important; display:block !important; } body.mtg-template-tm2 .mtg-header-topbar--mobile .mtg-header-topbar__inner{ width:100% !important; max-width:none !important; min-height:34px !important; display:flex !important; align-items:center !important; justify-content:center !important; text-align:center !important; padding:0 46px !important; box-sizing:border-box !important; overflow:hidden !important; white-space:nowrap !important; } body.mtg-template-tm2 .mtg-header-topbar--mobile .mtg-header-topbar__main{ width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:6px !important; min-width:0 !important; overflow:hidden !important; white-space:nowrap !important; text-overflow:ellipsis !important; text-align:center !important; } body.mtg-template-tm2 .mtg-header-topbar--mobile .mtg-header-topbar__text{ display:block !important; min-width:0 !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; text-align:center !important; font-weight:900 !important; } body.mtg-template-tm2 .mtg-header-topbar--mobile .mtg-header-topbar__items{ display:none !important; } /* * TM2 header mobile: logo grande arriba, acciones centradas debajo. */ body.mtg-template-tm2 .mtg-header-main__inner{ display:grid !important; grid-template-columns:1fr auto !important; grid-template-rows:auto auto !important; align-items:center !important; gap:10px !important; padding:16px 56px 16px 12px !important; min-height:164px !important; position:relative !important; } body.mtg-template-tm2 .mtg-header-brand{ grid-column:1 / -1 !important; grid-row:1 !important; display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; min-width:0 !important; } body.mtg-template-tm2 .mtg-header-brand img, body.mtg-template-tm2 .mtg-store-logo, body.mtg-template-tm2 .custom-logo{ width:auto !important; height:auto !important; max-width:min(270px,78vw) !important; max-height:86px !important; object-fit:contain !important; display:block !important; } body.mtg-template-tm2 .mtg-header-center, body.mtg-template-tm2 .mtg-header-nav{ display:none !important; visibility:hidden !important; pointer-events:none !important; height:0 !important; max-height:0 !important; overflow:hidden !important; } body.mtg-template-tm2 .mtg-header-actions{ grid-column:1 / -1 !important; grid-row:2 !important; width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:9px !important; margin:0 !important; padding:0 !important; position:static !important; flex-wrap:nowrap !important; } body.mtg-template-tm2 .mtg-header-actions .mtg-header-action, body.mtg-template-tm2 .mtg-header-actions .mtg-header-btn, body.mtg-template-tm2 .mtg-header-actions .mtg-usf-hcart{ position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; margin:0 !important; flex:0 0 auto !important; } body.mtg-template-tm2 .mtg-usf-hcart, body.mtg-template-tm2 .mtg-hcart{ width:42px !important; height:42px !important; min-width:42px !important; border-radius:14px !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; } body.mtg-template-tm2 .mtg-header-btn{ height:42px !important; min-height:42px !important; padding:0 14px !important; border-radius:14px !important; display:flex !important; align-items:center !important; justify-content:center !important; font-size:12px !important; font-weight:950 !important; white-space:nowrap !important; box-shadow:0 10px 22px rgba(15,23,42,.12) !important; } body.mtg-template-tm2 .mtg-header-btn--wa{ background:#16a34a !important; color:#ffffff !important; } body.mtg-template-tm2 .mtg-header-btn--offers{ display:flex !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; background:#0f172a !important; color:#ffffff !important; } body.mtg-template-tm2 .mtg-header-btn--wa *, body.mtg-template-tm2 .mtg-header-btn--offers *{ color:#ffffff !important; } body.mtg-template-tm2 .mtg-mhm-toggle{ top:48px !important; right:12px !important; width:42px !important; height:42px !important; border-radius:14px !important; } } @media (max-width: 390px){ body.mtg-template-tm2 .mtg-header-main__inner{ min-height:156px !important; padding:14px 52px 14px 10px !important; gap:9px !important; } body.mtg-template-tm2 .mtg-header-brand img, body.mtg-template-tm2 .mtg-store-logo, body.mtg-template-tm2 .custom-logo{ max-width:min(245px,76vw) !important; max-height:78px !important; } body.mtg-template-tm2 .mtg-header-actions{ gap:8px !important; } body.mtg-template-tm2 .mtg-usf-hcart, body.mtg-template-tm2 .mtg-hcart{ width:38px !important; height:38px !important; min-width:38px !important; } body.mtg-template-tm2 .mtg-header-btn{ height:38px !important; min-height:38px !important; padding:0 11px !important; font-size:11px !important; } body.mtg-template-tm2 .mtg-mhm-toggle{ top:46px !important; right:10px !important; width:40px !important; height:40px !important; } } /* MTG TM2 HEADER SAFE FIX V2 - END */ /* MTG TM1 TOPBAR MOBILE VISIBILITY FIX V1 - START */ @media (max-width: 780px){ /* * TM1: el topbar responsive sí existe en HTML, * pero lo forzamos visible porque TM1 fue rearmado y algunas reglas lo pisan. */ body.mtg-template-tm1 .mtg-header-topbar--desktop{ display:none !important; visibility:hidden !important; height:0 !important; max-height:0 !important; overflow:hidden !important; pointer-events:none !important; } body.mtg-template-tm1 .mtg-header-topbar--mobile{ display:block !important; visibility:visible !important; opacity:1 !important; width:100% !important; height:auto !important; max-height:none !important; overflow:visible !important; position:relative !important; z-index:99998 !important; } body.mtg-template-tm1 .mtg-header-topbar--mobile .mtg-header-topbar__inner{ width:100% !important; max-width:none !important; min-height:34px !important; height:34px !important; display:flex !important; align-items:center !important; justify-content:center !important; text-align:center !important; padding:0 46px !important; box-sizing:border-box !important; overflow:hidden !important; white-space:nowrap !important; } body.mtg-template-tm1 .mtg-header-topbar--mobile .mtg-header-topbar__main{ width:100% !important; max-width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:6px !important; min-width:0 !important; overflow:hidden !important; white-space:nowrap !important; text-overflow:ellipsis !important; text-align:center !important; font-size:13px !important; font-weight:900 !important; } body.mtg-template-tm1 .mtg-header-topbar--mobile .mtg-header-topbar__text{ display:block !important; min-width:0 !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; text-align:center !important; font-weight:900 !important; } body.mtg-template-tm1 .mtg-header-topbar--mobile .mtg-header-topbar__icon{ display:inline-flex !important; align-items:center !important; justify-content:center !important; flex:0 0 auto !important; } body.mtg-template-tm1 .mtg-header-topbar--mobile .mtg-header-topbar__items{ display:none !important; } /* * El header principal debe quedar debajo del topbar, no taparlo. */ body.mtg-template-tm1 .mtg-header-main{ position:relative !important; z-index:99990 !important; } } @media (min-width: 781px){ body.mtg-template-tm1 .mtg-header-topbar--mobile{ display:none !important; visibility:hidden !important; } body.mtg-template-tm1 .mtg-header-topbar--desktop{ display:block !important; visibility:visible !important; } } /* MTG TM1 TOPBAR MOBILE VISIBILITY FIX V1 - END */ /* MTG TM1 HEADER CENTER LIKE TM2 V1 - START */ @media (max-width: 780px){ /* * TM1 mobile: * igualado visualmente a TM2: * topbar arriba, logo centrado protagonista y acciones abajo. */ body.mtg-template-tm1 .mtg-header-main__inner{ display:grid !important; grid-template-columns:1fr auto !important; grid-template-rows:auto auto !important; align-items:center !important; gap:12px !important; padding:16px 56px 16px 12px !important; min-height:136px !important; position:relative !important; } body.mtg-template-tm1 .mtg-header-brand{ grid-column:1 / -1 !important; grid-row:1 !important; display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; min-width:0 !important; text-align:center !important; padding-top:2px !important; } body.mtg-template-tm1 .mtg-header-brand a, body.mtg-template-tm1 .mtg-store-logo-link, body.mtg-template-tm1 .custom-logo-link{ display:flex !important; align-items:center !important; justify-content:center !important; width:auto !important; max-width:100% !important; } body.mtg-template-tm1 .mtg-header-brand img, body.mtg-template-tm1 .mtg-store-logo, body.mtg-template-tm1 .custom-logo{ width:auto !important; height:auto !important; max-width:min(230px, 80vw) !important; max-height:58px !important; object-fit:contain !important; display:block !important; margin:0 auto !important; } body.mtg-template-tm1 .mtg-header-center, body.mtg-template-tm1 .mtg-header-nav{ display:none !important; visibility:hidden !important; pointer-events:none !important; height:0 !important; max-height:0 !important; overflow:hidden !important; } body.mtg-template-tm1 .mtg-header-actions{ grid-column:1 / -1 !important; grid-row:2 !important; width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:10px !important; margin:0 !important; padding:0 !important; position:static !important; flex-wrap:nowrap !important; } body.mtg-template-tm1 .mtg-header-actions .mtg-header-action, body.mtg-template-tm1 .mtg-header-actions .mtg-header-btn, body.mtg-template-tm1 .mtg-header-actions .mtg-usf-hcart{ position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; margin:0 !important; flex:0 0 auto !important; } body.mtg-template-tm1 .mtg-usf-hcart, body.mtg-template-tm1 .mtg-hcart{ width:42px !important; height:42px !important; min-width:42px !important; border-radius:14px !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; } body.mtg-template-tm1 .mtg-header-btn{ height:42px !important; min-height:42px !important; padding:0 14px !important; border-radius:14px !important; display:flex !important; align-items:center !important; justify-content:center !important; font-size:12px !important; font-weight:950 !important; white-space:nowrap !important; box-shadow:0 10px 22px rgba(15,23,42,.12) !important; } body.mtg-template-tm1 .mtg-header-btn--wa{ background:#16a34a !important; color:#ffffff !important; } body.mtg-template-tm1 .mtg-header-btn--offers{ display:flex !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; background:#0f172a !important; color:#ffffff !important; } body.mtg-template-tm1 .mtg-header-btn--wa *, body.mtg-template-tm1 .mtg-header-btn--offers *{ color:#ffffff !important; } body.mtg-template-tm1 .mtg-mhm-toggle{ top:50px !important; right:12px !important; width:42px !important; height:42px !important; border-radius:14px !important; } } @media (max-width: 390px){ body.mtg-template-tm1 .mtg-header-main__inner{ min-height:128px !important; padding:14px 52px 14px 10px !important; gap:10px !important; } body.mtg-template-tm1 .mtg-header-brand img, body.mtg-template-tm1 .mtg-store-logo, body.mtg-template-tm1 .custom-logo{ max-width:min(210px, 78vw) !important; max-height:52px !important; } body.mtg-template-tm1 .mtg-header-actions{ gap:8px !important; } body.mtg-template-tm1 .mtg-usf-hcart, body.mtg-template-tm1 .mtg-hcart{ width:38px !important; height:38px !important; min-width:38px !important; } body.mtg-template-tm1 .mtg-header-btn{ height:38px !important; min-height:38px !important; padding:0 11px !important; font-size:11px !important; } body.mtg-template-tm1 .mtg-mhm-toggle{ top:47px !important; right:10px !important; width:40px !important; height:40px !important; } } /* MTG TM1 HEADER CENTER LIKE TM2 V1 - END */ /* MTG TM3 HEADER CENTER ACTIONS V1 - START */ @media (max-width: 780px){ body.mtg-template-tm3 .mtg-header-main__inner{ display:grid !important; grid-template-columns:1fr auto !important; grid-template-rows:auto auto !important; align-items:center !important; gap:12px !important; padding:16px 56px 16px 12px !important; min-height:132px !important; position:relative !important; } body.mtg-template-tm3 .mtg-header-brand{ grid-column:1 / -1 !important; grid-row:1 !important; width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; text-align:center !important; min-width:0 !important; } body.mtg-template-tm3 .mtg-header-brand a, body.mtg-template-tm3 .mtg-store-logo-link, body.mtg-template-tm3 .custom-logo-link{ display:flex !important; align-items:center !important; justify-content:center !important; width:auto !important; max-width:100% !important; } body.mtg-template-tm3 .mtg-header-brand img, body.mtg-template-tm3 .mtg-store-logo, body.mtg-template-tm3 .custom-logo{ width:auto !important; height:auto !important; max-width:min(210px,78vw) !important; max-height:56px !important; object-fit:contain !important; display:block !important; margin:0 auto !important; } body.mtg-template-tm3 .mtg-header-center, body.mtg-template-tm3 .mtg-header-nav{ display:none !important; visibility:hidden !important; pointer-events:none !important; height:0 !important; max-height:0 !important; overflow:hidden !important; } body.mtg-template-tm3 .mtg-header-actions{ grid-column:1 / -1 !important; grid-row:2 !important; width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:10px !important; margin:0 !important; padding:0 !important; position:static !important; flex-wrap:nowrap !important; } body.mtg-template-tm3 .mtg-header-actions .mtg-header-action, body.mtg-template-tm3 .mtg-header-actions .mtg-header-btn, body.mtg-template-tm3 .mtg-header-actions .mtg-usf-hcart{ position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; margin:0 !important; flex:0 0 auto !important; } body.mtg-template-tm3 .mtg-usf-hcart, body.mtg-template-tm3 .mtg-hcart{ width:42px !important; height:42px !important; min-width:42px !important; border-radius:14px !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; } body.mtg-template-tm3 .mtg-header-btn{ height:42px !important; min-height:42px !important; padding:0 14px !important; border-radius:14px !important; display:flex !important; align-items:center !important; justify-content:center !important; font-size:12px !important; font-weight:950 !important; white-space:nowrap !important; box-shadow:0 10px 22px rgba(15,23,42,.12) !important; } body.mtg-template-tm3 .mtg-header-btn--wa{ background:#16a34a !important; color:#ffffff !important; } body.mtg-template-tm3 .mtg-header-btn--offers{ display:flex !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; background:#0f172a !important; color:#ffffff !important; } body.mtg-template-tm3 .mtg-header-btn--wa *, body.mtg-template-tm3 .mtg-header-btn--offers *{ color:#ffffff !important; } body.mtg-template-tm3 .mtg-mhm-toggle{ top:48px !important; right:12px !important; width:42px !important; height:42px !important; border-radius:14px !important; } } @media (max-width: 390px){ body.mtg-template-tm3 .mtg-header-main__inner{ min-height:124px !important; padding:14px 52px 14px 10px !important; gap:10px !important; } body.mtg-template-tm3 .mtg-header-brand img, body.mtg-template-tm3 .mtg-store-logo, body.mtg-template-tm3 .custom-logo{ max-width:min(190px,76vw) !important; max-height:50px !important; } body.mtg-template-tm3 .mtg-header-actions{ gap:8px !important; } body.mtg-template-tm3 .mtg-usf-hcart, body.mtg-template-tm3 .mtg-hcart{ width:38px !important; height:38px !important; min-width:38px !important; } body.mtg-template-tm3 .mtg-header-btn{ height:38px !important; min-height:38px !important; padding:0 11px !important; font-size:11px !important; } body.mtg-template-tm3 .mtg-mhm-toggle{ top:45px !important; right:10px !important; width:40px !important; height:40px !important; } } /* MTG TM3 HEADER CENTER ACTIONS V1 - END */ /* MTG TM4 HEADER CENTER ACTIONS V1 - START */ @media (max-width: 780px){ body.mtg-template-tm4 .mtg-header-main__inner{ display:grid !important; grid-template-columns:1fr auto !important; grid-template-rows:auto auto !important; align-items:center !important; gap:12px !important; padding:16px 56px 16px 12px !important; min-height:132px !important; position:relative !important; } body.mtg-template-tm4 .mtg-header-brand{ grid-column:1 / -1 !important; grid-row:1 !important; width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; text-align:center !important; min-width:0 !important; } body.mtg-template-tm4 .mtg-header-brand a, body.mtg-template-tm4 .mtg-store-logo-link, body.mtg-template-tm4 .custom-logo-link{ display:flex !important; align-items:center !important; justify-content:center !important; width:auto !important; max-width:100% !important; } body.mtg-template-tm4 .mtg-header-brand img, body.mtg-template-tm4 .mtg-store-logo, body.mtg-template-tm4 .custom-logo{ width:auto !important; height:auto !important; max-width:min(220px,78vw) !important; max-height:58px !important; object-fit:contain !important; display:block !important; margin:0 auto !important; } body.mtg-template-tm4 .mtg-header-center, body.mtg-template-tm4 .mtg-header-nav{ display:none !important; visibility:hidden !important; pointer-events:none !important; height:0 !important; max-height:0 !important; overflow:hidden !important; } body.mtg-template-tm4 .mtg-header-actions{ grid-column:1 / -1 !important; grid-row:2 !important; width:100% !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:10px !important; margin:0 !important; padding:0 !important; position:static !important; flex-wrap:nowrap !important; } body.mtg-template-tm4 .mtg-header-actions .mtg-header-action, body.mtg-template-tm4 .mtg-header-actions .mtg-header-btn, body.mtg-template-tm4 .mtg-header-actions .mtg-usf-hcart{ position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; margin:0 !important; flex:0 0 auto !important; } body.mtg-template-tm4 .mtg-usf-hcart, body.mtg-template-tm4 .mtg-hcart{ width:42px !important; height:42px !important; min-width:42px !important; border-radius:14px !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; } body.mtg-template-tm4 .mtg-header-btn{ height:42px !important; min-height:42px !important; padding:0 14px !important; border-radius:14px !important; display:flex !important; align-items:center !important; justify-content:center !important; font-size:12px !important; font-weight:950 !important; white-space:nowrap !important; box-shadow:0 10px 22px rgba(15,23,42,.12) !important; } body.mtg-template-tm4 .mtg-header-btn--wa{ background:#16a34a !important; color:#ffffff !important; } body.mtg-template-tm4 .mtg-header-btn--offers{ display:flex !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; background:#0f172a !important; color:#ffffff !important; } body.mtg-template-tm4 .mtg-header-btn--wa *, body.mtg-template-tm4 .mtg-header-btn--offers *{ color:#ffffff !important; } body.mtg-template-tm4 .mtg-mhm-toggle{ top:48px !important; right:12px !important; width:42px !important; height:42px !important; border-radius:14px !important; } } @media (max-width: 390px){ body.mtg-template-tm4 .mtg-header-main__inner{ min-height:124px !important; padding:14px 52px 14px 10px !important; gap:10px !important; } body.mtg-template-tm4 .mtg-header-brand img, body.mtg-template-tm4 .mtg-store-logo, body.mtg-template-tm4 .custom-logo{ max-width:min(198px,76vw) !important; max-height:52px !important; } body.mtg-template-tm4 .mtg-header-actions{ gap:8px !important; } body.mtg-template-tm4 .mtg-usf-hcart, body.mtg-template-tm4 .mtg-hcart{ width:38px !important; height:38px !important; min-width:38px !important; } body.mtg-template-tm4 .mtg-header-btn{ height:38px !important; min-height:38px !important; padding:0 11px !important; font-size:11px !important; } body.mtg-template-tm4 .mtg-mhm-toggle{ top:45px !important; right:10px !important; width:40px !important; height:40px !important; } } /* MTG TM4 HEADER CENTER ACTIONS V1 - END */ /* MTG TM3 TM4 TOPBAR MOBILE CENTER FIX V1 - START */ @media (max-width: 780px){ /* * TM3/TM4: * Igualar topbar responsive a TM1/TM2. * Texto e ícono centrados en una sola línea. */ body.mtg-template-tm3 .mtg-header-topbar--mobile, body.mtg-template-tm4 .mtg-header-topbar--mobile{ display:block !important; visibility:visible !important; opacity:1 !important; width:100% !important; height:auto !important; max-height:none !important; overflow:visible !important; position:relative !important; z-index:99998 !important; text-align:center !important; } body.mtg-template-tm3 .mtg-header-topbar--desktop, body.mtg-template-tm4 .mtg-header-topbar--desktop{ display:none !important; visibility:hidden !important; height:0 !important; max-height:0 !important; overflow:hidden !important; pointer-events:none !important; } body.mtg-template-tm3 .mtg-header-topbar--mobile .mtg-header-topbar__inner, body.mtg-template-tm4 .mtg-header-topbar--mobile .mtg-header-topbar__inner{ width:100% !important; max-width:none !important; min-height:34px !important; height:34px !important; display:flex !important; align-items:center !important; justify-content:center !important; text-align:center !important; padding:0 48px !important; box-sizing:border-box !important; overflow:hidden !important; white-space:nowrap !important; } body.mtg-template-tm3 .mtg-header-topbar--mobile .mtg-header-topbar__main, body.mtg-template-tm4 .mtg-header-topbar--mobile .mtg-header-topbar__main{ width:100% !important; max-width:100% !important; min-width:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:6px !important; margin:0 auto !important; overflow:hidden !important; white-space:nowrap !important; text-overflow:ellipsis !important; text-align:center !important; font-size:13px !important; font-weight:900 !important; line-height:1 !important; } body.mtg-template-tm3 .mtg-header-topbar--mobile .mtg-header-topbar__icon, body.mtg-template-tm4 .mtg-header-topbar--mobile .mtg-header-topbar__icon{ display:inline-flex !important; align-items:center !important; justify-content:center !important; flex:0 0 auto !important; margin:0 !important; line-height:1 !important; } body.mtg-template-tm3 .mtg-header-topbar--mobile .mtg-header-topbar__icon img, body.mtg-template-tm4 .mtg-header-topbar--mobile .mtg-header-topbar__icon img{ width:15px !important; height:15px !important; object-fit:contain !important; display:block !important; margin:0 !important; } body.mtg-template-tm3 .mtg-header-topbar--mobile .mtg-header-topbar__text, body.mtg-template-tm4 .mtg-header-topbar--mobile .mtg-header-topbar__text{ display:block !important; min-width:0 !important; max-width:100% !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; text-align:center !important; font-weight:900 !important; line-height:1.1 !important; } body.mtg-template-tm3 .mtg-header-topbar--mobile .mtg-header-topbar__items, body.mtg-template-tm4 .mtg-header-topbar--mobile .mtg-header-topbar__items{ display:none !important; } } @media (min-width: 781px){ body.mtg-template-tm3 .mtg-header-topbar--mobile, body.mtg-template-tm4 .mtg-header-topbar--mobile{ display:none !important; visibility:hidden !important; } body.mtg-template-tm3 .mtg-header-topbar--desktop, body.mtg-template-tm4 .mtg-header-topbar--desktop{ display:block !important; visibility:visible !important; } } /* MTG TM3 TM4 TOPBAR MOBILE CENTER FIX V1 - END */