/* CODIFICANDO tienda: piezas que aparecen en todo el sitio (boton del carrito, aviso de carrito, confirmacion) */
:root { --cdt-naranja: #FF7900; --cdt-naranja-osc: #C25400; --cdt-noche: #1a1b2e; --cdt-borde: #e3e5ea; }

.cdt-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

/* Carrito en la cabecera del sitio */
.cod-actions .cdt-cab-carrito, .cdt-cab-carrito { position: relative; display: inline-flex !important; visibility: visible !important; opacity: 1 !important; align-items: center; justify-content: center; width: 40px !important; height: 40px !important; min-width: 40px !important; max-width: none !important; padding: 0 !important; margin: 0 4px 0 0 !important; overflow: visible !important; border-radius: 10px; background: #f5f5f5; color: var(--cdt-noche) !important; text-decoration: none !important; flex-shrink: 0; }
.cod-actions .cdt-cab-carrito, .cod-nav .cdt-cab-carrito, .cdt-cab-carrito, .cdt-cab-carrito * { pointer-events: auto !important; cursor: pointer; }
.cdt-cab-carrito svg, .cdt-cab-carrito b { pointer-events: none !important; }
.cdt-cab-carrito:hover { background: #ffe9d2; }
.cdt-cab-carrito svg { width: 20px !important; height: 20px !important; display: block !important; }
.cdt-cab-carrito b { position: absolute; top: -5px; right: -5px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 10px; background: #FF7900; color: #fff !important; font: 700 11px/19px Inter, Arial, sans-serif; text-align: center; }
.cdt-cab-carrito b[hidden] { display: none; }

/* Aviso «Tienes productos en tu carrito» */
.cdt-retomar { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 9990; margin: 0 auto; max-width: 520px; display: flex; align-items: center; gap: 12px; padding: 12px 12px 12px 16px; background: var(--cdt-noche); color: #fff !important; border-radius: 12px; box-shadow: 0 10px 30px rgba(10, 12, 30, .28); font: 500 15px/1.35 Inter, Arial, sans-serif; opacity: 0; transform: translateY(12px); transition: opacity .25s ease, transform .25s ease; }
.cdt-retomar.cdt-visible { opacity: 1; transform: none; }
.cdt-retomar p { margin: 0; flex: 1; color: #fff !important; }
.cdt-retomar a { flex-shrink: 0; display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 8px; background: #FF7900; color: #fff !important; font-weight: 700; text-decoration: none !important; }
.cdt-retomar a:hover { background: #E86C00; }
.cdt-retomar button { flex-shrink: 0; width: 40px; height: 40px; border: 0; border-radius: 8px; background: transparent; color: #fff !important; font-size: 22px; line-height: 1; cursor: pointer; }
.cdt-retomar button:hover { background: rgba(255, 255, 255, .12); }
.cdt-retomar :focus-visible, .cdt-cab-carrito:focus-visible { outline: 3px solid #ffd08a; outline-offset: 2px; }

/* Confirmacion al agregar */
.cdt-dialogo { border: 0; padding: 0; border-radius: 14px; width: min(440px, calc(100vw - 32px)); box-shadow: 0 24px 60px rgba(10, 12, 30, .3); font-family: Inter, Arial, sans-serif; }
.cdt-dialogo::backdrop { background: rgba(16, 18, 36, .55); }
.cdt-dialogo[open] { animation: cdt-entra .22s ease; }
.cdt-dialogo__in { padding: 22px; }
.cdt-dialogo__cab { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.cdt-dialogo__ok { width: 32px; height: 32px; border-radius: 50%; background: #e7f6ec; color: #1e7a3c; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cdt-dialogo h2 { margin: 0; font: 700 18px/1.3 Inter, Arial, sans-serif; color: var(--cdt-noche) !important; }
.cdt-dialogo p { margin: 0 0 18px; font-size: 15px; line-height: 1.45; color: #4a4d5e !important; }
.cdt-dialogo__acciones { display: flex; flex-wrap: wrap; gap: 10px; }
.cdt-dialogo__acciones > * { flex: 1 1 160px; display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 16px; border-radius: 10px; font: 700 15px/1 Inter, Arial, sans-serif; cursor: pointer; text-decoration: none !important; }
.cdt-dialogo__seguir { background: #fff; border: 1.5px solid var(--cdt-borde); color: var(--cdt-noche) !important; }
.cdt-dialogo__seguir:hover { border-color: var(--cdt-noche); }
.cdt-dialogo__ver { background: #FF7900; border: 1.5px solid #FF7900; color: #fff !important; }
.cdt-dialogo__ver:hover { background: #E86C00; }
.cdt-dialogo--error .cdt-dialogo__ok { background: #fdecea; color: #b3261e; }
.cdt-dialogo :focus-visible { outline: 3px solid #1a73e8; outline-offset: 2px; }
@keyframes cdt-entra { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .cdt-retomar { transition: none; }
  .cdt-dialogo[open] { animation: none; }
}
@media print { .cdt-retomar { display: none !important; } }

/* celular: el aviso va encima del boton flotante de WhatsApp y en dos lineas como mucho */
@media (max-width: 600px) {
  .cdt-retomar { left: 10px; right: 10px; bottom: 88px; gap: 8px; padding: 10px 6px 10px 14px; font-size: 14px; }
  .cdt-retomar a { padding: 0 12px; min-height: 44px; font-size: 14px; }
  .cdt-retomar button { width: 44px; height: 44px; }
}
/* menu del celular: el panel va por encima de la cabecera, para que su logo y su boton de cerrar no queden debajo del boton de menu */
body #codMobileMenu.cod-mobile-menu { z-index: 10010 !important; max-width: 86vw !important; overflow-y: auto; overscroll-behavior: contain; }
body #codMobileOverlay.cod-mobile-overlay { z-index: 10005 !important; }
body #codMobileMenu.cod-mobile-menu .cod-mobile-header { gap: 8px; }
body #codMobileMenu.cod-mobile-menu .cod-mobile-header .cod-logo { min-width: 0; flex: 1 1 0; }
body #codMobileMenu.cod-mobile-menu .cod-mobile-header .cod-logo-img { width: 48px !important; height: auto !important; flex: 0 0 48px; }
body #codMobileMenu.cod-mobile-menu .cod-mobile-header .cod-logo-text { display: inline !important; font-size: 16px !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body #codMobileMenu.cod-mobile-menu .cod-mobile-close { flex: 0 0 44px; width: 44px !important; height: 44px !important; }
body #codMobileMenu.cod-mobile-menu .cod-mobile-nav a { overflow-wrap: anywhere; white-space: normal; min-height: 44px; }
body #codMobileMenu.cod-mobile-menu a, body #codMobileMenu.cod-mobile-menu button { max-width: 100%; }

/* La cabecera gana «Tienda» y el carrito: en pantallas medianas se compacta para que todo quepa */
@media (min-width: 992px) and (max-width: 1399px) {
  .cod-nav .cod-menu-desktop { gap: 2px !important; }
  .cod-nav .cod-menu-desktop a { padding-left: 9px !important; padding-right: 9px !important; font-size: 14px !important; }
  .cod-nav .cod-btn-cta, .cod-nav .cod-btn-dir { padding-left: 12px !important; padding-right: 12px !important; font-size: 13px !important; }
  .cod-nav .cod-actions { gap: 6px !important; }
}
@media (min-width: 992px) and (max-width: 1099px) { .cod-nav .cod-btn-dir { display: none !important; } }
/* celulares: el logo cede espacio para que quepan carrito, cuenta y menu */
@media (max-width: 430px) {
  .cod-nav { padding-left: 12px !important; padding-right: 12px !important; }
  .cod-nav .cod-logo-img { width: 50px !important; height: auto !important; }
  .cod-nav .cod-logo-text { font-size: 15px !important; }
  .cod-nav .cod-logo { gap: 6px !important; }
  .cod-nav .cod-actions { gap: 6px !important; }
  .cod-actions .cdt-cab-carrito { margin: 0 !important; }
}
@media (max-width: 359px) { .cod-nav .cod-logo-text { display: none !important; } }

/* ================= 2.1: nada de la pagina puede quedar encima del menu del celular */
header:has(#codMobileMenu.cod-menu-open), #wrapwrap > header:has(.cod-menu-open) { z-index: 100000 !important; }
#wrapwrap #wrap .alert, #wrapwrap #wrap .js_cart_lines { z-index: auto !important; }
html:has(#codMobileMenu.cod-menu-open) #wrapwrap #wrap .alert { position: static !important; }

/* 2.3.5 PayPal: el tema fuerza iframe { height: auto !important } (fixes-urgent.css) y el marco queda en 150 px;
   PayPal le da el alto a su contenedor y el marco debe llenarlo, si no el formulario de tarjeta se corta. */
html body div[id^="zoid-paypal"] > iframe, html body div[id^="zoid-paypal"] iframe[name^="__zoid__paypal"] { height: 100% !important; overflow: visible !important; }

/* 2.5.0 Descuento de temporada y ventajas (toda la tienda) */
#wrapwrap .cdt-promo { background: #16172b; color: #fff; }
#wrapwrap .cdt-promo__in { display: flex; align-items: center; gap: 16px; padding-top: 12px; padding-bottom: 12px; }
#wrapwrap .cdt-promo__pct { flex: none; display: inline-flex; align-items: center; justify-content: center; min-width: 76px; height: 52px; padding: 0 12px; border-radius: 12px; background: #FF7900; color: #fff; font: 800 22px/1 Inter, Arial, sans-serif; letter-spacing: -.01em; }
#wrapwrap .cdt-promo__texto { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#wrapwrap .cdt-promo__texto strong { font: 700 17px/1.25 Inter, Arial, sans-serif; color: #fff; }
#wrapwrap .cdt-promo__texto span { font: 400 14px/1.35 Inter, Arial, sans-serif; color: #c4c7d4; }
#wrapwrap .cdt-promo__dias { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 84px; padding: 6px 10px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 12px; text-align: center; }
#wrapwrap .cdt-promo__dias b { font: 800 26px/1 Inter, Arial, sans-serif; color: #FF9A3D; }
#wrapwrap .cdt-promo__dias small { margin-top: 3px; font: 500 12px/1.2 Inter, Arial, sans-serif; color: #c4c7d4; }
#wrapwrap .cdt-promo--proxima .cdt-promo__pct { background: transparent; border: 2px solid #FF7900; color: #FF9A3D; }
#wrapwrap .cdt-ventajas { background: #fff7ee; border-bottom: 1px solid #f3d3ae; }
#wrapwrap .cdt-ventajas__in { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 22px; padding-top: 8px; padding-bottom: 8px; font: 400 13.5px/1.4 Inter, Arial, sans-serif; color: #4a3518; text-align: center; }
#wrapwrap .cdt-ventajas__in b { font-weight: 700; color: #16172b; }
@media (max-width: 575px) {
  #wrapwrap .cdt-promo__in { gap: 12px; }
  #wrapwrap .cdt-promo__pct { min-width: 60px; height: 46px; font-size: 18px; }
  #wrapwrap .cdt-promo__texto strong { font-size: 15px; }
  #wrapwrap .cdt-promo__texto span { font-size: 12.5px; }
  #wrapwrap .cdt-promo__dias { min-width: 64px; padding: 5px 6px; }
  #wrapwrap .cdt-promo__dias b { font-size: 21px; }
  #wrapwrap .cdt-promo__dias small { font-size: 10.5px; }
}
/* el tema impone color y tipo a span/strong/small: el banner los fija */
#wrapwrap .cdt-promo .cdt-promo__pct { color: #fff !important; font: 800 22px/1 Inter, Arial, sans-serif !important; }
#wrapwrap .cdt-promo.cdt-promo--proxima .cdt-promo__pct { color: #FF9A3D !important; }
#wrapwrap .cdt-promo .cdt-promo__texto strong { color: #fff !important; font-weight: 700 !important; }
#wrapwrap .cdt-promo .cdt-promo__texto span { color: #d5d8e2 !important; }
#wrapwrap .cdt-promo .cdt-promo__dias b { color: #FF9A3D !important; font-weight: 800 !important; }
#wrapwrap .cdt-promo .cdt-promo__dias small { color: #d5d8e2 !important; }
#wrapwrap .cdt-ventajas .cdt-ventajas__in b { font-weight: 700 !important; color: #16172b !important; }
@media (max-width: 575px) { #wrapwrap .cdt-promo .cdt-promo__pct { font-size: 18px !important; } }