/* previa.css */
/*
 * Lo que la vista previa cambia fuera de las paginas nuevas: el carrito lateral
 * y el checkout. Se carga solo para quien ve la web nueva (body.eph-previa).
 *
 * El checkout toma la cara de /checkout-alt/ con `plantillas/checkout-form.php`;
 * aca se visten las piezas que dibuja WooCommerce adentro. Los campos, el pago y
 * lo que se guarda en el pedido son los de siempre.
 *
 * El carrito lateral usa tokens propios (--pv-*) porque no vive adentro de .epa
 * ni de .eph-home. Los valores son los mismos.
 */
body.eph-previa{
  --pv-fondo:#F8FAFC; --pv-blanco:#FFFFFF; --pv-tinta:#0F172A; --pv-texto:#475569;
  --pv-borde:#E2E8F0; --pv-azul:#0064FF; --pv-azul-osc:#0052D4; --pv-azul-texto:#0052D4;
  --pv-verde-tinta:#05602C; --pv-sombra:0 1px 2px rgba(16,24,40,.05); --pv-radio:16px;
  --pv-verde:#0B7038; --pv-verde-osc:#095C2E;
}
[data-theme="dark"] body.eph-previa{
  --pv-fondo:#0B1222; --pv-blanco:#151D35; --pv-tinta:#E9EEF6; --pv-texto:#A2B0C6;
  --pv-borde:#253149; --pv-azul:#3B82F6; --pv-azul-osc:#2563EB; --pv-azul-texto:#7FB0FF;
  --pv-verde-tinta:#5FD98D; --pv-sombra:0 1px 2px rgba(0,0,0,.3);
  --pv-verde:#15954A; --pv-verde-osc:#0E7A3C;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) body.eph-previa{
    --pv-fondo:#0B1222; --pv-blanco:#151D35; --pv-tinta:#E9EEF6; --pv-texto:#A2B0C6;
    --pv-borde:#253149; --pv-azul:#3B82F6; --pv-azul-osc:#2563EB; --pv-azul-texto:#7FB0FF;
    --pv-verde-tinta:#5FD98D; --pv-sombra:0 1px 2px rgba(0,0,0,.3);
    --pv-verde:#15954A; --pv-verde-osc:#0E7A3C;
  }
}

/* ─────────────────────────── El carrito lateral ─────────────────────────── */

body.eph-previa .header-cart-drawer__panel{background:var(--pv-fondo);color:var(--pv-tinta);
  font-family:'Inter',system-ui,-apple-system,sans-serif}
body.eph-previa .header-cart-drawer__panel .header-cart-drawer__title{color:var(--pv-tinta);font-weight:700}
body.eph-previa .header-cart-drawer__panel .header-cart-drawer__close{color:var(--pv-texto)}
body.eph-previa .header-cart-drawer__panel .header-cart-item{background:var(--pv-blanco);
  border:1px solid var(--pv-borde);border-radius:var(--pv-radio);box-shadow:var(--pv-sombra)}
body.eph-previa .header-cart-drawer__panel .header-cart-item__thumb img{background:#fff;border-radius:12px}
body.eph-previa .header-cart-drawer__panel .header-cart-item__name,
body.eph-previa .header-cart-drawer__panel .header-cart-item__name a{color:var(--pv-tinta);font-weight:600}
body.eph-previa .header-cart-drawer__panel .header-cart-item__qty{color:var(--pv-texto)}
/* − N +: los arma `EPH_Previa::cajon_cantidades()` sobre el "Cant: N" del tema. */
body.eph-previa .header-cart-drawer__panel .eph-cant{display:inline-flex;align-items:center;
  border:1px solid var(--pv-borde);border-radius:12px;overflow:hidden;background:var(--pv-fondo)}
body.eph-previa .header-cart-drawer__panel .eph-cant-btn{width:2rem;height:2rem;display:grid;place-items:center;
  padding:0;border:0;background:transparent;color:var(--pv-tinta);font:inherit;font-size:1.125rem;font-weight:600;
  line-height:1;cursor:pointer;transition:background .15s var(--ep-suave,ease)}
body.eph-previa .header-cart-drawer__panel .eph-cant-btn:hover:not(:disabled){background:var(--pv-borde)}
body.eph-previa .header-cart-drawer__panel .eph-cant-btn:focus-visible{outline:2px solid var(--pv-azul);outline-offset:-2px}
body.eph-previa .header-cart-drawer__panel .eph-cant-btn:disabled{opacity:.35;cursor:default}
body.eph-previa .header-cart-drawer__panel .eph-cant-n{min-width:1.9rem;text-align:center;font-weight:600;
  color:var(--pv-tinta);font-variant-numeric:tabular-nums}
body.eph-previa .header-cart-drawer__panel .header-cart-item.eph-cargando,
body.eph-previa .header-cart-drawer.eph-cargando .header-cart-drawer__content{opacity:.55;pointer-events:none}
body.eph-previa .header-cart-drawer__panel .header-cart-item__price{color:var(--pv-tinta);font-weight:600}
body.eph-previa .header-cart-drawer__panel .header-cart-item__remove{color:var(--pv-texto)}
body.eph-previa .header-cart-drawer__panel .header-cart-drawer__footer{background:var(--pv-fondo);
  border-top:1px solid var(--pv-borde)}
body.eph-previa .header-cart-drawer__panel .header-cart-summary__row{color:var(--pv-texto)}
body.eph-previa .header-cart-drawer__panel .header-cart-summary__row strong{color:var(--pv-tinta)}
body.eph-previa .header-cart-drawer__panel .header-cart-summary__row .is-success{color:var(--pv-verde-tinta)}
body.eph-previa .header-cart-drawer__panel .btn{border-radius:999px;font-weight:600;box-shadow:none}
body.eph-previa .header-cart-drawer__panel .btn--primary{background:var(--pv-azul);color:#fff;border-color:transparent}
body.eph-previa .header-cart-drawer__panel .btn--primary:hover{background:var(--pv-azul-osc)}
body.eph-previa .header-cart-drawer__panel .btn--secondary{background:transparent;color:var(--pv-tinta);
  border:1px solid var(--pv-borde)}
body.eph-previa .header-cart-drawer__panel .header-cart-drawer__empty-btn{color:var(--pv-texto)}

/* ─────────────────────────────── El checkout ─────────────────────────────── */

/* El tema le pone overflow-x:hidden al body, y eso convierte al body en el que
   scrollea: el resumen, que es sticky, dejaba de acompañar al bajar. `clip`
   recorta lo mismo sin ese efecto, y el boton de confirmar queda a la vista. */
body.eph-previa.woocommerce-checkout{overflow-x:clip}
/* El encabezado del tema es fijo y mide 117px con el menu (medido el 22/9); con
   la barra de administracion, 32 mas. El resumen se queda justo debajo. */
@media (min-width:960px){
  body.eph-previa .epa .epa-co-resumen{top:calc(117px + 1rem)}
  body.eph-previa.admin-bar .epa .epa-co-resumen{top:calc(149px + 1rem)}
}

/* El tema centra su envoltorio con left:50% y translate; aca lo centra .epa-wrap.
   Sumarle un margin auto encima fue lo que lo corria a la derecha. */
body.eph-previa .electropc-checkout-shortcode{position:static;left:auto;transform:none;
  width:auto;max-width:none;margin:0;padding:0}

body.eph-previa .electropc-checkout-shortcode .woocommerce-message,
body.eph-previa .electropc-checkout-shortcode .woocommerce-info,
body.eph-previa .electropc-checkout-shortcode .woocommerce-error{width:min(1152px,calc(100% - 32px));margin:1rem auto 0;
  background:var(--pv-blanco);color:var(--pv-tinta);border:1px solid var(--pv-borde);
  border-left:3px solid var(--pv-azul);border-radius:12px;box-shadow:none}
body.eph-previa .electropc-checkout-shortcode .woocommerce-error{border-left-color:#E5484D}
body.eph-previa .electropc-checkout-shortcode .woocommerce-message a,
body.eph-previa .electropc-checkout-shortcode .woocommerce-info a{color:var(--pv-azul-texto);font-weight:600;
  background:none;border:0}

/* ── Los campos ── */
body.eph-previa .epa-co .woocommerce-billing-fields > h3{display:none}
body.eph-previa .epa-co .woocommerce-billing-fields__field-wrapper,
body.eph-previa .epa-co .woocommerce-additional-fields__field-wrapper{margin-top:.9rem;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));column-gap:.8rem}
body.eph-previa .epa-co .form-row{grid-column:1 / -1;float:none;width:auto;margin:0 0 .8rem;padding:0}
body.eph-previa .epa-co .form-row-first{grid-column:1}
body.eph-previa .epa-co .form-row-last{grid-column:2}
@media (max-width:620px){
  body.eph-previa .epa-co .form-row-first,
  body.eph-previa .epa-co .form-row-last{grid-column:1 / -1}
}
body.eph-previa .epa-co .form-row label{display:block;margin:0 0 .3rem;font-size:.875rem;font-weight:600;
  color:var(--epa-texto)}
body.eph-previa .epa-co .form-row .required{color:var(--epa-azul-texto);text-decoration:none}
body.eph-previa .epa-co .form-row .optional{font-weight:400}
body.eph-previa .epa-co .input-text,
body.eph-previa .epa-co select,
body.eph-previa .epa-co textarea,
body.eph-previa .epa-co .select2-container .select2-selection{width:100%;font:inherit;font-size:1rem;
  padding:.7rem .8rem;min-height:2.9rem;border-radius:12px;border:1px solid var(--epa-borde);
  background:var(--epa-blanco);color:var(--epa-tinta);box-shadow:none}
body.eph-previa .epa-co .select2-container .select2-selection__rendered{color:var(--epa-tinta);padding:0;line-height:1.5}
body.eph-previa .epa-co .select2-container .select2-selection__arrow{top:50%;transform:translateY(-50%)}
body.eph-previa .epa-co .input-text:focus,
body.eph-previa .epa-co select:focus,
body.eph-previa .epa-co textarea:focus{outline:2px solid var(--epa-azul);outline-offset:1px;border-color:transparent}
body.eph-previa .epa-co .input-text::placeholder{color:var(--epa-texto);opacity:.6}
body.eph-previa .epa-co .form-row .description{font-size:.75rem;color:var(--epa-texto);margin-top:.3rem}
body.eph-previa .epa-co .woocommerce-account-fields label{display:flex;gap:.5rem;align-items:center}
body.eph-previa .select2-dropdown{background:var(--pv-blanco);color:var(--pv-tinta);border-color:var(--pv-borde)}
body.eph-previa .select2-results__option--highlighted[aria-selected]{background:var(--pv-azul);color:#fff}

/* ── El resumen: productos, envio y total ── */
body.eph-previa .epa-co .shop_table{width:100%;margin:.9rem 0 0;border:0;border-collapse:collapse;
  font-size:.875rem;color:var(--epa-texto)}
body.eph-previa .epa-co .shop_table thead{display:none}
body.eph-previa .epa-co .shop_table th,
body.eph-previa .epa-co .shop_table td{padding:.55rem 0;border:0;border-top:1px solid var(--epa-borde);
  background:none;text-align:left;vertical-align:top}
body.eph-previa .epa-co .shop_table tbody tr:first-child td{border-top:0}
body.eph-previa .epa-co .shop_table td:last-child{text-align:right;white-space:nowrap;padding-left:.8rem}
body.eph-previa .epa-co .shop_table .product-name{color:var(--epa-tinta);font-weight:600;font-size:.875rem;line-height:1.35}
body.eph-previa .epa-co .shop_table .product-name .product-quantity{color:var(--epa-texto);font-weight:600}
body.eph-previa .epa-co .shop_table .product-total{color:var(--epa-tinta);font-weight:600}
body.eph-previa .epa-co .shop_table tfoot th{color:var(--epa-texto);font-weight:400}
body.eph-previa .epa-co .shop_table tfoot td{color:var(--epa-tinta);font-weight:600}
body.eph-previa .epa-co .shop_table .order-total th,
body.eph-previa .epa-co .shop_table .order-total td{font-size:1.125rem;font-weight:700;color:var(--epa-tinta)}

/* El envio en el resumen es una fila mas: lo elegido y su precio. Las opciones
   se tildan a la izquierda, en "Como la recibis". */
body.eph-previa .epa-co .eph-co-envio-fila td .amount{color:var(--epa-tinta)}

/* ── Como la recibis ── */
/* El tema posiciona en absoluto los radios del envio; aca van en su tarjeta. */
body.eph-previa .epa-co .eph-co-envio input{position:static}
body.eph-previa .epa-co .eph-co-envio .epa-co-op-num .amount{color:inherit}
body.eph-previa .epa-co .eph-co-direccion{margin-top:.2rem}
/* Se vende solo en Argentina: el pais va igual en el pedido, sin preguntarlo. */
body.eph-previa .epa-co #billing_country_field{display:none}
/* La direccion se ve solo con envio, y ahi es obligatoria (lo valida
   EPH_Previa::validar_envio): el "(opcional)" de WooCommerce mentiria. */
body.eph-previa .epa-co .eph-co-direccion .optional{display:none}


/* ── La aclaracion del pedido, plegada: casi nadie la usa y alargaba la pantalla ── */
body.eph-previa .epa-co .eph-co-notas{margin-top:1.6rem}
body.eph-previa .epa-co .eph-co-notas summary{cursor:pointer;font-size:.875rem;font-weight:600;color:var(--epa-azul-texto)}
body.eph-previa .epa-co .eph-co-notas textarea{min-height:5rem}

/* ── El pago: cada medio es una tarjeta, igual que en la maqueta ── */
body.eph-previa .epa-co #payment{margin-top:1.1rem;background:none;border:0;border-radius:0}
body.eph-previa .epa-co #payment ul.payment_methods{margin:0;padding:0;border:0;list-style:none;display:grid;gap:.5rem}
body.eph-previa .epa-co #payment .wc_payment_method{margin:0;padding:.75rem .9rem;list-style:none;
  background:var(--epa-blanco);border:1px solid var(--epa-borde);border-radius:var(--epa-radio)}
body.eph-previa .epa-co #payment .wc_payment_method:has(> input:checked){border-color:var(--epa-azul);
  box-shadow:0 0 0 1px var(--epa-azul)}
body.eph-previa .epa-co #payment .wc_payment_method > input{accent-color:var(--epa-azul);margin:0 .5rem 0 0}
body.eph-previa .epa-co #payment .wc_payment_method > label{display:inline;color:var(--epa-tinta);font-weight:600;
  font-size:1rem;cursor:pointer}
body.eph-previa .epa-co #payment .wc_payment_method > label img{max-height:1.4rem;vertical-align:middle;margin-left:.3rem}
body.eph-previa .epa-co #payment .eph-co-pago-nota{display:block;margin:.15rem 0 0 1.55rem;font-size:.875rem;
  font-weight:400;color:var(--epa-texto)}
body.eph-previa .epa-co #payment div.payment_box{margin:.6rem 0 0;padding:.7rem .8rem;background:var(--epa-fondo);
  color:var(--epa-texto);border-radius:12px;font-size:.875rem}
body.eph-previa .epa-co #payment div.payment_box::before{display:none}
body.eph-previa .epa-co #payment .place-order{margin:1rem 0 0;padding:0}
body.eph-previa .epa-co .woocommerce-terms-and-conditions-wrapper,
body.eph-previa .epa-co .woocommerce-privacy-policy-text{font-size:.75rem;color:var(--epa-texto)}
body.eph-previa .epa-co .woocommerce-terms-and-conditions-wrapper a,
body.eph-previa .epa-co .woocommerce-privacy-policy-text a{color:var(--epa-azul-texto)}
body.eph-previa .epa-co #place_order{width:100%;margin-top:.8rem;padding:.95rem 1.2rem;border:0;border-radius:999px;
  background:var(--epa-azul);background-image:none;color:#fff;font:inherit;font-weight:600;font-size:1rem;
  box-shadow:none;cursor:pointer;transition:background .2s var(--epa-ease)}
body.eph-previa .epa-co #place_order:hover{background:var(--epa-azul-osc)}

/* ── Abajo del total: confirmar, y la seña como alternativa ── */
/* La casilla de los terminos y el boton, que el script trae de "Como abonas". */
body.eph-previa .epa-co .eph-co-pagar .place-order{margin:1rem 0 0;padding:0}
/* La seña va con borde y no rellena: es la alternativa, no lo elegido. */
body.eph-previa .eph-co-sena{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--pv-borde)}
body.eph-previa .eph-co-sena p{margin:0 0 .7rem;color:var(--pv-texto);font-size:.875rem;line-height:1.5}
body.eph-previa .eph-co-sena-btn{display:flex;align-items:center;justify-content:center;text-align:center;
  padding:.7rem 1rem;border-radius:999px;background:transparent;border:1px solid var(--pv-verde);
  color:var(--pv-verde-tinta);font-weight:600;text-decoration:none;font-size:.875rem;line-height:1.3}
body.eph-previa .eph-co-sena-btn:hover{background:var(--pv-verde);color:#fff}

/* ─────────────────────── Gracias por tu compra ─────────────────────── */
/* Misma grilla que el checkout (.epa-co): a la izquierda lo que sigue, a la
   derecha el pedido. */
body.eph-previa .eph-gr-tilde{display:inline-grid;place-items:center;width:2.6rem;height:2.6rem;margin:0 0 .8rem;
  border-radius:50%;background:var(--epa-badge-bg);color:var(--epa-badge-texto)}
body.eph-previa .eph-gr-numero{margin-top:.6rem;font-size:1rem;color:var(--epa-texto)}
body.eph-previa .eph-gr-numero b{color:var(--epa-tinta)}
body.eph-previa .eph-gr-caja{padding:1.1rem 1.2rem;background:var(--epa-blanco);border:1px solid var(--epa-borde);
  border-radius:var(--epa-radio)}
body.eph-previa .eph-gr-caja h2{margin:0 0 .6rem}
body.eph-previa .eph-gr-pago{font-size:1rem;color:var(--epa-texto);line-height:1.6}
body.eph-previa .eph-gr-pago h2,
body.eph-previa .eph-gr-pago h3{font-size:1rem;font-weight:600;color:var(--epa-tinta);margin:.6rem 0 .3rem}
body.eph-previa .eph-gr-pago ul{margin:.3rem 0;padding:0;list-style:none}
body.eph-previa .eph-gr-pago strong{color:var(--epa-tinta)}
body.eph-previa .eph-gr-pago a.button,
body.eph-previa .eph-gr-pago .button{display:inline-flex;margin-top:.6rem;padding:.8rem 1.1rem;border-radius:999px;
  background:var(--epa-azul);background-image:none;color:#fff;font-weight:600;text-transform:none;letter-spacing:0;box-shadow:none}
body.eph-previa .eph-gr-lista{margin:0;padding:0;list-style:none;display:grid;gap:.3rem;color:var(--epa-tinta);font-size:1rem}
body.eph-previa .eph-gr-destino{margin:0;color:var(--epa-tinta);font-size:1rem}
body.eph-previa .eph-gr-nota{margin:.5rem 0 0;font-size:.875rem;color:var(--epa-texto)}
body.eph-previa .eph-gr-acciones{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.7rem}
body.eph-previa .eph-gr-items{margin-top:.9rem;display:grid;gap:.6rem}
body.eph-previa .eph-gr-item{display:flex;justify-content:space-between;gap:1rem;font-size:.875rem;color:var(--epa-tinta)}
body.eph-previa .eph-gr-item span{font-weight:600;line-height:1.35}
body.eph-previa .eph-gr-item small{color:var(--epa-texto);font-weight:600}
body.eph-previa .eph-gr-item small.eph-gr-mejora{display:block;font-weight:400}
/* La mejora elegida en el carrito lateral: "Con 32GB RAM · 1TB" */
.header-cart-item__mejora{margin:.1rem 0 .2rem;font-size:.75rem;font-weight:600;line-height:1.35;color:var(--epa-azul-texto,#0052D4)}
body.eph-previa .eph-gr-item b{white-space:nowrap}
body.eph-previa .eph-gr-sub{margin-top:1.3rem}
body.eph-previa .eph-gr-datos{margin:.7rem 0 0;display:grid;gap:.45rem}
body.eph-previa .eph-gr-datos > div{display:flex;justify-content:space-between;gap:1rem;font-size:.875rem}
body.eph-previa .eph-gr-datos dt{color:var(--epa-texto)}
body.eph-previa .eph-gr-datos dd{margin:0;color:var(--epa-tinta);font-weight:600;text-align:right;word-break:break-word}
/* Lo que otros plugins cuelgan de woocommerce_thankyou. Los avisos de venta
   (Facebook, Google) son scripts y corren igual aunque no se vea; lo visible
   era el bloque "Pedido extra" del plugin de campos, que repetia DNI y tipo de
   factura, ya mostrados en "Tus datos". */
body.eph-previa .eph-gr-hooks{display:none}

/* La cuenta para transferir, con botones de copiar. */
body.eph-previa .eph-gr-intro{margin:0 0 .8rem;font-size:1rem;color:var(--epa-texto)}
body.eph-previa .eph-gr-intro b{color:var(--epa-tinta);font-size:1.125rem}
body.eph-previa .eph-gr-cuenta{margin:0;display:grid;border:1px solid var(--epa-borde);border-radius:var(--epa-radio);overflow:hidden}
body.eph-previa .eph-gr-cuenta > div{display:grid;grid-template-columns:5.5rem 1fr;gap:.8rem;align-items:center;
  padding:.65rem .9rem;border-top:1px solid var(--epa-borde);font-size:1rem}
body.eph-previa .eph-gr-cuenta > div:first-child{border-top:0}
body.eph-previa .eph-gr-cuenta dt{color:var(--epa-texto);font-size:.875rem}
body.eph-previa .eph-gr-cuenta dd{margin:0;display:flex;justify-content:space-between;align-items:center;gap:.6rem;
  color:var(--epa-tinta);font-weight:600;min-width:0}
body.eph-previa .eph-gr-cuenta dd span{overflow-wrap:anywhere}
body.eph-previa .eph-copiar{flex:none;padding:.35rem .7rem;border-radius:999px;border:1px solid var(--epa-azul);
  background:transparent;color:var(--epa-azul-texto);font:inherit;font-size:.875rem;font-weight:600;cursor:pointer}
body.eph-previa .eph-copiar:hover{background:var(--epa-azul);color:#fff}
body.eph-previa .eph-gr-informar{display:flex;width:100%;margin-top:1rem;font-size:1rem;padding:1rem 1.2rem}

/* recorrido-menu.css */
/* ElectroPC · El encabezado y el menú del lienzo "Recorrido simple" (26/9).
 *
 * Carga con el diseño nuevo prendido (`EPH_Vista::recorrido`), en todas las
 * pantallas, después de menu-alt.css. El encabezado es del tema: acá se lo
 * viste claro, como el lienzo, aunque el tema esté en oscuro (el diseño nuevo
 * es solo claro). El menú del celular lo arma `EPH_MenuRecorrido` (`.rm`).
 *
 * Cada regla lleva `body.eph-recorrido` dos veces: le gana a menu-alt.css
 * (`body.eph-alt`) y a las reglas del tema para `[data-theme="dark"]`. */

/* ── Los colores: los del modo claro de menu-alt.css ── */
body.eph-recorrido.eph-recorrido{
  --mn-fondo:rgba(255,255,255,.96);
  --mn-borde:#E2E8F0;
  --mn-tinta:#0F172A;
  --mn-texto:#475569;
  --mn-azul:#0064FF;
  --mn-campo:#F1F5F9;
  --mn-panel:#FFFFFF;
  --mn-hover:rgba(15,23,42,.05);
}
body.eph-recorrido.eph-recorrido .site-header{background:var(--mn-fondo)!important;border-bottom:1px solid var(--mn-borde);color:var(--mn-tinta)}
body.eph-recorrido.eph-recorrido .site-header .header-actions__btn,
body.eph-recorrido.eph-recorrido .site-header .header-actions > a,
body.eph-recorrido.eph-recorrido .site-header .mobile-menu-toggle{color:var(--mn-tinta)!important}
/* Las rayas, del color del botón: así siguen al modo oscuro como el carrito. */
body.eph-recorrido.eph-recorrido .site-header .mobile-menu-toggle span{background:currentColor!important}
body.eph-recorrido.eph-recorrido .header-search input[type="search"]{background:var(--mn-campo)!important;color:var(--mn-tinta)!important;border-color:var(--mn-borde)!important}
/* El tema en oscuro deja el texto de ayuda en blanco: sobre el campo claro no se leía. */
body.eph-recorrido.eph-recorrido .header-search input[type="search"]::placeholder{color:var(--mn-texto)!important;opacity:1!important}
body.eph-recorrido.eph-recorrido .header-search input[type="search"]::-webkit-input-placeholder{color:var(--mn-texto)!important;opacity:1!important}
body.eph-recorrido.eph-recorrido .header-search .dgwt-wcas-ico-magnifier,
body.eph-recorrido.eph-recorrido .header-search .dgwt-wcas-search-icon svg{fill:var(--mn-texto)!important}

/* El logo oscuro sobre el fondo claro, aunque el tema esté en oscuro. */
body.eph-recorrido.eph-recorrido :is(.site-header,.mobile-nav) img.logo-light{display:block!important}
body.eph-recorrido.eph-recorrido :is(.site-header,.mobile-nav) img.logo-dark{display:none!important}

/* ── La fila de la computadora: texto, sin íconos, y el de la página marcado ── */
body.eph-recorrido.eph-recorrido .header-nav{background:var(--rm-blanco,#FFFFFF);border-top:1px solid var(--mn-borde)}
body.eph-recorrido.eph-recorrido .nav-pill:not(.nav-pill--dropdown) > svg,
body.eph-recorrido.eph-recorrido .nav-pill--dropdown > svg:first-child{display:none}
body.eph-recorrido.eph-recorrido .nav-pill{color:var(--mn-tinta);border-color:transparent;background:none;border-radius:0;box-shadow:none}
body.eph-recorrido.eph-recorrido .nav-pill:hover{color:var(--mn-azul);background:none;border-color:transparent}
body.eph-recorrido.eph-recorrido .nav-pill[aria-current="page"]{color:var(--mn-azul);box-shadow:inset 0 -2px 0 var(--mn-azul)}
body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill,
body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill:hover{background:var(--mn-azul);color:#FFFFFF;border-radius:999px;box-shadow:none}
body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill:hover{background:#0052D4}
body.eph-recorrido.eph-recorrido .nav-pill--dropdown[aria-expanded="true"]{color:var(--mn-azul);background:none;border-color:transparent}
body.eph-recorrido.eph-recorrido .mega-dropdown{box-shadow:0 18px 40px rgba(15,23,42,.14)}
/* El título del desplegable quedaba en blanco sobre blanco, y los íconos en el
   violeta del tema, que no es del diseño nuevo. */
body.eph-recorrido.eph-recorrido .mega-dropdown__title{color:var(--mn-texto)!important}
body.eph-recorrido.eph-recorrido .mega-dropdown svg{color:var(--mn-azul)!important;stroke:currentColor}
body.eph-recorrido.eph-recorrido .mega-dropdown__viewall{color:var(--mn-azul)!important}

/* ── En el celular: la lupa, el carrito y el menú, como el lienzo ──
   El sol y la luna no van (el diseño nuevo es solo claro), y "Mi cuenta" pasa
   al menú. */
@media (max-width:1023px){
  body.eph-recorrido.eph-recorrido .site-header .theme-toggle,
  body.eph-recorrido.eph-recorrido .site-header .header-actions__account{display:none!important}
}
/* La lupa de FiboSearch, que en el celular queda solo como ícono, va con el
   carrito y el menú: a la derecha, del mismo color y tamaño, cada uno con
   44px para el dedo y sin espacio extra entre ellos (lienzo, tablero Main;
   Martín, 2/10: "la lupa se pierde"). */
@media (max-width:1023px){
  body.eph-recorrido.eph-recorrido .site-header .header-search{display:flex!important;justify-content:flex-end!important;flex:1 1 auto!important;min-width:0;margin-left:0!important;padding:0!important}
  /* La caja de FiboSearch ocupaba todo el hueco con la lupa a la izquierda: se achica a la lupa y va contra el carrito. */
  body.eph-recorrido.eph-recorrido .site-header .header-search .dgwt-wcas-search-wrapp.dgwt-wcas-layout-icon{flex:none!important;width:44px!important;min-width:0!important;max-width:44px!important;margin:0 0 0 auto!important}
  body.eph-recorrido.eph-recorrido .site-header .header-actions{gap:0!important;margin-left:0!important}
  /* La fila del tema separa sus partes 8px: la lupa va pegada al carrito, como entre carrito y menú. */
  body.eph-recorrido.eph-recorrido .site-header .header-search{margin-right:-8px!important}
  /* La barra abierta: el texto desde el borde (no hay ícono a la izquierda) y la cruz de borrar visible. */
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon-open .dgwt-wcas-search-input{padding-left:16px!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon-open .dgwt-wcas-close{color:var(--mn-texto)!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon-open .dgwt-wcas-close :is(svg,svg *){fill:currentColor!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon .dgwt-wcas-search-icon{display:inline-flex!important;align-items:center;justify-content:center;
    width:44px!important;height:44px!important;margin:0!important;padding:0!important;color:var(--mn-tinta)!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon .dgwt-wcas-search-icon svg{width:24px!important;height:24px!important;stroke:currentColor!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon .dgwt-wcas-search-icon :is(svg,svg *){fill:none!important;stroke:currentColor!important}
  body.eph-recorrido.eph-recorrido .site-header .header-actions__cart{display:inline-flex!important;align-items:center;justify-content:center;width:44px!important;height:44px!important;margin:0!important;padding:0!important}
  body.eph-recorrido.eph-recorrido .site-header .header-actions__cart svg{width:24px!important;height:24px!important}
  /* El menú solo crece la caja: las tres rayas y su cruz las mueve el tema. */
  body.eph-recorrido.eph-recorrido .site-header .mobile-menu-toggle{width:44px!important;height:44px!important;margin:0!important}
}

/* ── El menú del celular ── */
body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja{background:#FFFFFF!important;color:#0F172A}
body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__header{background:#FFFFFF;border-bottom:1px solid #E2E8F0}
body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__close{color:#0F172A}
body.eph-recorrido.eph-recorrido .rm{font-family:Inter,system-ui,sans-serif;padding:16px;display:flex;flex-direction:column;gap:18px}
body.eph-recorrido.eph-recorrido .rm *{box-sizing:border-box}
body.eph-recorrido.eph-recorrido .rm .rm-encontra{display:flex;align-items:center;gap:12px;padding:16px;border-radius:12px;background:#0064FF;color:#FFFFFF;text-decoration:none}
body.eph-recorrido.eph-recorrido .rm .rm-encontra:hover{background:#0052D4;color:#FFFFFF}
body.eph-recorrido.eph-recorrido .rm-encontra > span{flex:1;display:flex;flex-direction:column;gap:2px}
body.eph-recorrido.eph-recorrido .rm-encontra b{font-size:1.125rem;font-weight:700;color:#FFFFFF}
body.eph-recorrido.eph-recorrido .rm-encontra small{font-size:.875rem;color:#DBEAFE}
body.eph-recorrido.eph-recorrido .rm-encontra svg{flex:none}
body.eph-recorrido.eph-recorrido .rm-grupo{display:flex;flex-direction:column}
body.eph-recorrido.eph-recorrido .rm-titulo{margin:0;padding:0 4px 6px;font-size:.75rem;font-weight:700;color:#475569}
body.eph-recorrido.eph-recorrido .rm .rm-fila{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 4px;min-height:48px;
  border-bottom:1px solid #E2E8F0;color:#0F172A;text-decoration:none;font-size:1rem;font-weight:600}
body.eph-recorrido.eph-recorrido .rm .rm-fila:last-child{border-bottom:0}
body.eph-recorrido.eph-recorrido .rm .rm-fila:hover{color:#0052D4}
body.eph-recorrido.eph-recorrido .rm-fila small{display:block;margin-top:2px;font-size:.75rem;font-weight:400;color:#475569}
body.eph-recorrido.eph-recorrido .rm-fila svg{flex:none;color:#94A3B8}
body.eph-recorrido.eph-recorrido .rm-local{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:12px;background:#F8FAFC}
body.eph-recorrido.eph-recorrido .rm-local p{margin:0;font-size:.875rem;line-height:1.5;color:#475569}
body.eph-recorrido.eph-recorrido .rm .rm-wa{display:flex;align-items:center;justify-content:center;gap:8px;height:46px;border-radius:999px;background:#0B7038;
  color:#FFFFFF;font-size:1rem;font-weight:600;text-decoration:none}
body.eph-recorrido.eph-recorrido .rm .rm-wa:hover{background:#05602C;color:#FFFFFF}
body.eph-recorrido.eph-recorrido .rm :is(a):focus-visible{outline:3px solid color-mix(in srgb,#0064FF 45%,transparent);outline-offset:2px}

/* ── La franja de confianza, arriba de todo (lienzo v76 y v79, 1/10) ──
   La imprime `EPH_MenuRecorrido::tira`. De a un texto, cada 4 segundos, en
   la computadora y en el celular (Martín, 1/10: "información que iba pasando
   sola"); con "reducir movimiento", el primero quieto. Cada texto con su
   ícono y lo clave en blanco y negrita; "3 cuotas sin interés" en verde.
   Con temporada, del color de la temporada y su texto primero. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira{position:relative;display:block;box-sizing:border-box;height:40px;overflow:hidden;padding:0;border-bottom:1px solid rgb(30 41 59);
  background:#0F172A;color:#E2E8F0;font-family:Inter,system-ui,sans-serif;font-size:.875rem;font-weight:400;line-height:1.35;text-align:center}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-fija{position:fixed;left:0;right:0;z-index:1001}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira b{font-weight:700;color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira svg{display:inline-block;flex:none;vertical-align:-3px;margin-right:8px;color:#93C5FD}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-google svg{color:#FBBC05}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-cuotas svg,body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-cuotas b{color:#6EE7A0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .ept-franja-item{display:inline-flex;align-items:center;gap:8px;vertical-align:middle;line-height:1.35}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .ept-franja-item svg{margin-right:0;color:inherit}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira a{color:inherit;font-weight:700;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-temporada{background:var(--ept-color,#FF7A1A);border-bottom-color:transparent;color:rgb(15 23 42)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-temporada b,body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-temporada svg,body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-temporada .rt-cuotas b{color:rgb(15 23 42)}
/* Alto de línea entero, sin centrar con flex y el ícono bajado 3px justos:
   centrado, el texto caía en medio píxel y se veía borroso (Martín, 1/10). */
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item{position:absolute;inset:0;display:block;line-height:39px;padding:0 16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;
  animation-duration:calc(var(--rt-n) * 4s);animation-iteration-count:infinite;animation-timing-function:ease;animation-delay:calc(var(--rt-i) * 4s);animation-fill-mode:both}
/* Cada mensaje con el fondo de la franja: la animación lo pone en una capa
   aparte, y sobre una capa transparente Chrome en Windows dibuja la letra sin
   su suavizado fino y se ve borrosa (Martín, 7/10). Con fondo, queda nítida. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item{background:inherit}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n1 .rt-item{opacity:1;animation:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n2{--rt-n:2}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n2 .rt-item{animation-name:rt-gira-2}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n3{--rt-n:3}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n3 .rt-item{animation-name:rt-gira-3}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n4{--rt-n:4}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n4 .rt-item{animation-name:rt-gira-4}
@keyframes rt-gira-2{0%{opacity:0;transform:translateY(8px)}6%{opacity:1;transform:none}44%{opacity:1;transform:none}50%{opacity:0;transform:translateY(-8px)}100%{opacity:0}}
@keyframes rt-gira-3{0%{opacity:0;transform:translateY(8px)}4%{opacity:1;transform:none}29%{opacity:1;transform:none}33%{opacity:0;transform:translateY(-8px)}100%{opacity:0}}
@keyframes rt-gira-4{0%{opacity:0;transform:translateY(8px)}3%{opacity:1;transform:none}22%{opacity:1;transform:none}25%{opacity:0;transform:translateY(-8px)}100%{opacity:0}}
@media (max-width:759px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira{height:38px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item{line-height:37px;padding:0 12px}
}
@media (prefers-reduced-motion:reduce){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item{animation:none;opacity:0}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item:first-child{opacity:1}
}

/* ── Modo oscuro (generado por herramientas/gen_recorrido_oscuro.py: no editar a mano) ── */
html[data-theme="dark"] body.eph-recorrido.eph-recorrido{--mn-fondo:rgba(21,29,53,.96);--mn-borde:#253149;--mn-tinta:#E9EEF6;--mn-texto:#A2B0C6;--mn-azul:#3B82F6;--mn-campo:#1B2440;--mn-panel:#151D35;--mn-hover:rgba(233,238,246,.05)}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .header-nav{background:var(--rm-blanco,#151D35)}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill:hover{background:#7FB0FF}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja{background:#151D35!important;color:#E9EEF6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__header{background:#151D35;border-bottom:1px solid #253149}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__close{color:#E9EEF6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-encontra{background:#3B82F6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-encontra:hover{background:#7FB0FF}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-encontra small{color:#17305C}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-titulo{color:#A2B0C6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-fila{border-bottom:1px solid #253149;color:#E9EEF6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-fila:hover{color:#7FB0FF}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-fila small{color:#A2B0C6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-local{background:#0B1222}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-local p{color:#A2B0C6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-wa{background:#15954A}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-wa:hover{background:#5FD98D}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm :is(a):focus-visible{outline:3px solid color-mix(in srgb,#3B82F6 45%,transparent)}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira{background:#22304F}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido :is(.site-header,
html[data-theme="dark"] .mobile-nav) img.logo-light{display:none!important}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido :is(.site-header,
html[data-theme="dark"] .mobile-nav) img.logo-dark{display:block!important}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido{--mn-fondo:rgba(21,29,53,.96);--mn-borde:#253149;--mn-tinta:#E9EEF6;--mn-texto:#A2B0C6;--mn-azul:#3B82F6;--mn-campo:#1B2440;--mn-panel:#151D35;--mn-hover:rgba(233,238,246,.05)}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .header-nav{background:var(--rm-blanco,#151D35)}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill:hover{background:#7FB0FF}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja{background:#151D35!important;color:#E9EEF6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__header{background:#151D35;border-bottom:1px solid #253149}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__close{color:#E9EEF6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-encontra{background:#3B82F6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-encontra:hover{background:#7FB0FF}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-encontra small{color:#17305C}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-titulo{color:#A2B0C6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-fila{border-bottom:1px solid #253149;color:#E9EEF6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-fila:hover{color:#7FB0FF}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-fila small{color:#A2B0C6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-local{background:#0B1222}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-local p{color:#A2B0C6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-wa{background:#15954A}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-wa:hover{background:#5FD98D}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm :is(a):focus-visible{outline:3px solid color-mix(in srgb,#3B82F6 45%,transparent)}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira{background:#22304F}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido :is(.site-header,
html:not([data-theme="light"]) .mobile-nav) img.logo-light{display:none!important}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido :is(.site-header,
html:not([data-theme="light"]) .mobile-nav) img.logo-dark{display:block!important}}