/** Shopify CDN: Minification failed

Line 674:11 Expected identifier but found whitespace
Line 674:12 Unexpected "#141414"
Line 791:11 Expected identifier but found whitespace
Line 791:12 Unexpected "#222222"
Line 814:19 Expected identifier but found whitespace
Line 814:28 Unexpected "("

**/
/* ========== ODEN CART (layout + accordions + login gate) ========== */

.oden-cart-grid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 24px;
  align-items:start;
}

@media (max-width: 989px){
  .oden-cart-grid{ grid-template-columns: 1fr; }
}

/* Caja base */
.oden-box{
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  padding: 16px;
  background: rgba(0,0,0,.12);
}

/* Toggle retiro/delivery */
.oden-toggle{
  display:flex;
  gap:10px;
  margin-bottom:14px;
}

.oden-toggle button{
  flex:1;
  border-radius: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.15);
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.oden-toggle button.is-active{
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.25);
}

.oden-method-panel .field{ margin-top: 6px; }

/* Acordeón resumen */
.oden-accordion{ margin-top: 8px; }
.oden-acc-btn{
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 10px;
  padding: 10px 0;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
}

.oden-acc-left{
  display:flex;
  align-items:center;
  gap: 10px;
}

.oden-acc-arrow{
  display:inline-block;
  width: 14px;
  height: 14px;
  transform: rotate(0deg);
  transition: transform .15s ease;
  opacity: .85;
}

.oden-acc-item.is-open .oden-acc-arrow{
  transform: rotate(180deg);
}

.oden-acc-panel{
  display:none;
  padding: 6px 0 14px;
  opacity:.95;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.oden-acc-item.is-open .oden-acc-panel{ display:block; }

.oden-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap: 12px;
  padding: 6px 0;
}

.oden-row span:last-child{
  text-align:right;
  white-space:nowrap;
}

.oden-note{
  margin-top: 10px;
  opacity: .8;
  font-size: 12.5px;
}

/* Botón pagar */
.oden-pay{
  margin-top: 14px;
  width:100%;
  border-radius: 14px;
  padding: 14px 16px;
}

/* Login overlay (bloquea carrito hasta login) */
.oden-cart-login-gate{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.62);
  z-index: 9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 18px;
}

.oden-cart-login-card{
  width: min(520px, 100%);
  border-radius: 16px;
  padding: 18px;
  background: #fff;
  color: #111;
  border: 1px solid rgba(255,255,255,.12);
}

.oden-cart-login-card h2{ margin: 0 0 8px; }
.oden-cart-login-card p{ margin: 0 0 12px; opacity: .9; }

.oden-cart-login-small{
  opacity:.8;
  margin-top: 10px;
  font-size: 13px;
}

/* Slots */
.oden-slots{
  margin-top: 10px;
}

.oden-slot-btn{
  margin: 8px 8px 0 0;
  border-radius: 12px;
  padding: 10px 12px;
}

.oden-slot-selected{
  margin-top: 10px;
  opacity: .9;
  font-size: 13px;
}

.oden-cart-login-card .button{
  width: 100%;
}

body:has(.oden-cart-login-gate){
  overflow: hidden;
}

.oden-cart-email{ margin: 12px 0; }
.oden-cart-login-card .field__input{ width: 100%; }

.button.is-loading{
  opacity: .85;
  pointer-events: none;
}

/* Spinner dentro del botón */
.oden-spinner{
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255,255,255,.4);
  border-top-color: #fff;
  border-radius: 50%;
  animation: oden-spin .7s linear infinite;
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
}

@keyframes oden-spin{
  to { transform: rotate(360deg); }
}

/* Estado loading del botón */
.button.is-loading{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  pointer-events: none;
  opacity: .9;
}
/* Ocultamos el checkout real de Dawn, pero lo dejamos en el DOM */
.oden-hidden-checkout{
  display: none !important;
}
/* Mejor encaje del listado dentro del acordeón */
.oden-cart-items-in-summary {
  margin: 0 !important;
}

#oden-cart-items-slot .cart-items {
  width: 100%;
}
/* Que no se vea como “tabla gigante” apretada */
#oden-cart-items-slot table.cart-items {
  width: 100%;
}
.oden-cart-items-in-summary {
  margin: 0 !important;
}


/* Opcional: saca borde/espacios si se ve pesado */
#oden-cart-items-slot .cart__items {
  padding: 0;
  border: 0;
}

/* ====== Layout principal del carrito (2 recuadros) ====== */

/* Asegura que el bloque del footer use todo el ancho disponible */
.cart__blocks,
.cart__blocks .oden-cart-grid {
  width: 100%;
  max-width: none;
}

/* Fuerza la grilla de 2 columnas a ocupar el ancho (no pegada a la derecha) */
.cart__blocks .oden-cart-grid {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(360px, 1fr);
  gap: 18px;
  align-items: start;
  justify-content: stretch;
}

/* Importante: evita que algún contenedor interno la “encierre” */
.cart__blocks {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Mobile: 1 columna */
@media (max-width: 990px) {
  .cart__blocks .oden-cart-grid {
    grid-template-columns: 1fr;
  }
}
/* Reduce aire arriba donde antes estaba la tabla */
.template-cart #cart .cart__items:empty {
  display: none;
}

/* ====== Carrito Oden: usar mejor el ancho ====== */

/* Hacer el contenedor del footer más ancho (solo en la plantilla de carrito) */
.template-cart #main-cart-footer .page-width {
  max-width: 1400px; /* ajusta: 1200-1600 según tu gusto */
}

/* Grilla principal: 2 columnas, izquierda flexible, derecha más angosta */
.template-cart #main-cart-footer .cart__blocks .oden-cart-grid {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 420px; /* izquierda ocupa, derecha angosta */
  gap: 18px;
  align-items: start;
}

/* Que el recuadro derecho quede un poquito más a la derecha visualmente */
.template-cart #main-cart-footer .cart__blocks .oden-cart-grid > div:nth-child(2) {
  justify-self: end;
}

/* Mobile: 1 columna */
@media (max-width: 990px) {
  .template-cart #main-cart-footer .cart__blocks .oden-cart-grid {
    grid-template-columns: 1fr;
  }
  .template-cart #main-cart-footer .cart__blocks .oden-cart-grid > div:nth-child(2) {
    justify-self: stretch;
  }
}
/* ====== Dentro del acordeón "Productos": limpiar tabla ====== */
#oden-cart-items-slot table.cart-items thead,
#oden-cart-items-slot table.cart-items caption {
  display: none !important;
}

/* Quitar precio bajo el nombre (solo el precio directo, no variantes) */
#oden-cart-items-slot .cart-item__details > .product-option,
#oden-cart-items-slot .cart-item__details > .cart-item__discounted-prices {
  display: none !important;
}

/* ====== Compactar controles de cantidad dentro del resumen ====== */
#oden-cart-items-slot quantity-input.quantity.cart-quantity {
  width: auto;
}

#oden-cart-items-slot .quantity.cart-quantity {
  min-height: 28px;
}

#oden-cart-items-slot .quantity__button {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  padding: 0 !important;
}

#oden-cart-items-slot .quantity__input {
  width: 44px !important;
  min-height: 28px !important;
  padding: 0 6px !important;
  font-size: 13px;
}

#oden-cart-items-slot .quantity__button .svg-wrapper {
  width: 14px;
  height: 14px;
}
#oden-cart-items-slot cart-remove-button a.button {
  padding: 6px 8px !important;
  min-height: 28px;
}
#oden-cart-items-slot cart-remove-button .svg-wrapper {
  width: 14px;
  height: 14px;
}
/* ====== En resumen: quitar links en productos ====== */
#oden-cart-items-slot a.cart-item__name,
#oden-cart-items-slot a.cart-item__link {
  pointer-events: none !important;
  cursor: default !important;
  text-decoration: none !important;
  color: inherit !important;
}
/* ====== En resumen: transformar la tabla a layout compacto por fila ====== */
#oden-cart-items-slot table.cart-items,
#oden-cart-items-slot tbody,
#oden-cart-items-slot tr.cart-item,
#oden-cart-items-slot td {
  display: block;
  width: 100%;
}

#oden-cart-items-slot tr.cart-item {
  border-bottom: 1px solid rgba(0,0,0,.08);
  padding: 10px 0;
}

/* Grid interno por item */
#oden-cart-items-slot tr.cart-item {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  grid-template-areas:
    "media details totals"
    "media qty     totals";
  column-gap: 10px;
  row-gap: 6px;
  align-items: start;
}

#oden-cart-items-slot td.cart-item__media { grid-area: media; }
#oden-cart-items-slot td.cart-item__details { grid-area: details; }
#oden-cart-items-slot td.cart-item__quantity { grid-area: qty; }
#oden-cart-items-slot td.cart-item__totals.right.small-hide { grid-area: totals; }

/* Quitar columna totals duplicada mobile/others */
#oden-cart-items-slot td.cart-item__totals.right.medium-hide,
#oden-cart-items-slot td.cart-item__totals.right.large-up-hide {
  display: none !important;
}

/* Imagen más compacta */
#oden-cart-items-slot .cart-item__image-container {
  width: 56px;
}
#oden-cart-items-slot .cart-item__image {
  width: 56px;
  height: auto;
}

/* ====== En resumen: quantity ultra-compacto ====== */
#oden-cart-items-slot td.cart-item__quantity {
  padding: 0 !important;
}

#oden-cart-items-slot .cart-item__quantity-wrapper {
  justify-content: flex-start;
  gap: 6px;
}

#oden-cart-items-slot .quantity.cart-quantity {
  min-height: 22px !important;
  height: 22px !important;
}

#oden-cart-items-slot .quantity__button {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  padding: 0 !important;
}

#oden-cart-items-slot .quantity__input {
  width: 34px !important;
  min-height: 22px !important;
  height: 22px !important;
  padding: 0 4px !important;
  font-size: 12px !important;
}

#oden-cart-items-slot .quantity__button .svg-wrapper {
  width: 12px;
  height: 12px;
}

/* Botón remover pequeño */
#oden-cart-items-slot cart-remove-button a.button {
  padding: 4px 6px !important;
  min-height: 22px !important;
  height: 22px !important;
}
#oden-cart-items-slot cart-remove-button .svg-wrapper {
  width: 12px;
  height: 12px;
}
/* ====== Oden: Qty con basurero dentro (solo resumen) ====== */

/* Oculta el remove original por si JS no alcanzó a setear style */
#oden-cart-items-slot cart-remove-button {
  display: none !important;
}

/* Botón basurero dentro del quantity */
#oden-cart-items-slot .oden-trash-btn .svg-wrapper {
  width: 12px;
  height: 12px;
}

/* Ultra-compacto */
#oden-cart-items-slot .quantity__button {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  padding: 0 !important;
}
#oden-cart-items-slot .quantity__input {
  width: 34px !important;
  height: 22px !important;
  min-height: 22px !important;
  padding: 0 4px !important;
  font-size: 12px !important;
}

/* Total a la derecha más marcado */
#oden-cart-items-slot td.cart-item__totals .price,
#oden-cart-items-slot td.cart-item__totals .cart-item__price-wrapper {
  font-weight: 700;
}
/* Desgloses: más pequeños y tenues */
#oden-cart-items-slot .cart-item__details dl,
#oden-cart-items-slot .cart-item__details .product-option,
#oden-cart-items-slot .cart-item__details .discounts {
  font-size: 12px;
  opacity: 0.75;
  line-height: 1.25;
}

/* Que no ocupen tanto aire */
#oden-cart-items-slot .cart-item__details dl .product-option {
  margin: 2px 0;
}

/* “Delivery / Descuento” en negrita (si están como filas en tu resumen Oden) */
[data-oden-summary] .oden-row strong,
[data-oden-summary] .oden-row.is-strong > span:first-child {
  font-weight: 700;
}
#oden-cart-items-slot tr.cart-item {
  padding: 8px 0 !important;
}
#oden-cart-items-slot tr.cart-item .cart-item__details {
  margin: 0 !important;
}
/* ================================
   ODEN – JERARQUÍA CORRECTA
   ================================ */

/* Títulos del acordeón (Productos / Delivery / etc.) */
[data-oden-summary] .oden-acc-btn {
  font-size: 15px;
  font-weight: 700;
}

/* Total del producto a la derecha: visible pero no dominante */
#oden-cart-items-slot td.cart-item__totals .price {
  font-size: 13px;
  font-weight: 600;
}

/* Desgloses (opciones, descuentos, etc.) */
#oden-cart-items-slot .cart-item__details dl,
#oden-cart-items-slot .cart-item__details .product-option,
#oden-cart-items-slot .cart-item__details .discounts {
  font-size: 11px;
  opacity: 0.65;
  line-height: 1.2;
}
/* ================================
   ODEN – ALINEACIÓN IZQUIERDA
   ================================ */

/* Evitar desplazamientos raros */
#oden-cart-items-slot td.cart-item__details,
#oden-cart-items-slot td.cart-item__quantity {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* Contenedor del nombre */
#oden-cart-items-slot .cart-item__details {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* Incrementador alineado bajo el nombre */
#oden-cart-items-slot td.cart-item__quantity {
  justify-self: start;
  align-self: start;
}

/* Wrapper del quantity: alineado a la izquierda */
#oden-cart-items-slot .cart-item__quantity-wrapper {
  justify-content: flex-start;
  margin-top: 4px;
}
/* Menos aire entre imagen y texto */
#oden-cart-items-slot tr.cart-item {
  column-gap: 8px;
}

/* Imagen bien alineada con texto */
#oden-cart-items-slot td.cart-item__media {
  align-self: start;
}
/* ================================
   ODEN – RESUMEN OSCURO
   ================================ */

/* Fondo del recuadro Detalle del pedido */
[data-oden-summary] .oden-box {
  background-color: #121212; /* negro suave */
  color: #ffffff;
  border-radius: 12px;
  padding: 16px;
}

/* Título principal */
[data-oden-summary] .oden-box h2 {
  color: #ffffff;
}

/* Títulos del acordeón (Productos / Delivery / etc.) */
[data-oden-summary] .oden-acc-btn {
  color: #ffffff;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}

/* Flecha del acordeón */
[data-oden-summary] .oden-acc-arrow {
  color: #ffffff;
}

/* Panel interior */
[data-oden-summary] .oden-acc-panel {
  color: #ffffff;
}
/* Nombre del producto */
#oden-cart-items-slot .cart-item__name {
  color: #ffffff;
}

/* Precio total por producto */
#oden-cart-items-slot td.cart-item__totals .price {
  color: #ffffff;
}

/* Desgloses (opciones, descuentos, etc.) */
#oden-cart-items-slot .cart-item__details dl,
#oden-cart-items-slot .cart-item__details .product-option,
#oden-cart-items-slot .cart-item__details .discounts {
  color: rgba(255,255,255,0.65);
}
/* Controles de cantidad */
#oden-cart-items-slot .quantity__button,
#oden-cart-items-slot .quantity__input {
  background-color: #1e1e1e;
  color: #ffffff;
  border: 1px solid rgba(255,255,255,0.2);
}

/* Iconos del quantity */
#oden-cart-items-slot .quantity__button .svg-wrapper svg {
  fill: #ffffff;
}

/* Input number */
#oden-cart-items-slot .quantity__input {
  background-color: #1e1e1e;
}
/* Separador entre productos */
#oden-cart-items-slot tr.cart-item {
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
/* Hover suave en botones */
#oden-cart-items-slot .quantity__button:hover {
  background-color: #2a2a2a;
}
/* ================================
   ODEN – RESUMEN OSCURO FORZADO
   ================================ */

/* Forzar fondo oscuro ignorando color-scheme de Dawn */
.template-cart [data-oden-summary] .oden-box {
  background: #0f0f0f !important; /* casi negro */
  color: #ffffff !important;
  border-radius: 12px;
}

/* Eliminar cualquier gradiente heredado */
.template-cart [data-oden-summary] .oden-box.gradient {
  background: #0f0f0f !important;
}

/* Títulos */
.template-cart [data-oden-summary] h2,
.template-cart [data-oden-summary] .oden-acc-btn,
.template-cart [data-oden-summary] .oden-acc-arrow {
  color: #ffffff !important;
}

/* Panel interno */
.template-cart [data-oden-summary] .oden-acc-panel {
  background: transparent !important;
  color: #ffffff !important;
}
background: #141414 !important;
/* ================================
   ODEN – FORZAR OSCURO EN AMBOS RECUADROS
   ================================ */

/* Fondo oscuro en ambos "cards" dentro del grid (izq: delivery/retiro, der: detalle) */
.template-cart #main-cart-footer .oden-cart-grid > div {
  background: #0f0f0f !important;  /* casi negro */
  color: #ffffff !important;
  border-radius: 12px;
  padding: 16px;
}

/* Si alguno trae la clase gradient, la anulamos */
.template-cart #main-cart-footer .oden-cart-grid > div.gradient,
.template-cart #main-cart-footer .oden-cart-grid > div .gradient {
  background: transparent !important;
}

/* Textos dentro de ambos recuadros */
.template-cart #main-cart-footer .oden-cart-grid > div,
.template-cart #main-cart-footer .oden-cart-grid > div * {
  color: inherit;
}

/* Títulos y labels más marcados */
.template-cart #main-cart-footer .oden-cart-grid > div h1,
.template-cart #main-cart-footer .oden-cart-grid > div h2,
.template-cart #main-cart-footer .oden-cart-grid > div h3,
.template-cart #main-cart-footer .oden-cart-grid > div label,
.template-cart #main-cart-footer .oden-cart-grid > div .oden-acc-btn {
  color: #ffffff !important;
}

/* Líneas/separadores suaves en oscuro */
.template-cart #main-cart-footer .oden-cart-grid > div hr,
.template-cart #main-cart-footer .oden-cart-grid > div .oden-row,
.template-cart #main-cart-footer #oden-cart-items-slot tr.cart-item {
  border-color: rgba(255,255,255,0.12) !important;
}

/* Desgloses más tenues */
.template-cart #main-cart-footer #oden-cart-items-slot .cart-item__details dl,
.template-cart #main-cart-footer #oden-cart-items-slot .cart-item__details .product-option,
.template-cart #main-cart-footer #oden-cart-items-slot .cart-item__details .discounts {
  color: rgba(255,255,255,0.65) !important;
}

/* Inputs y botones en modo oscuro (delivery/retiro + dirección, etc.) */
.template-cart #main-cart-footer .oden-cart-grid input,
.template-cart #main-cart-footer .oden-cart-grid select,
.template-cart #main-cart-footer .oden-cart-grid textarea {
  background: #1a1a1a !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
}

/* Botones en oscuro */
/*.template-cart #main-cart-footer .oden-cart-grid .oden-method-panel button,
.template-cart #main-cart-footer .oden-cart-grid [data-oden-open-slots]{
  background: #1a1a1a;
  color: #ffffff;
  border: 1px solid rgba(255,255,255,0.2);
}
*/
/* Hover suave */
.template-cart #main-cart-footer .oden-cart-grid .button:hover,
.template-cart #main-cart-footer .oden-cart-grid button:hover {
  background: #242424;
}
/* Plan B: fondo oscuro en el área completa del footer */
.template-cart #main-cart-footer .cart__footer {
  background: transparent !important;
}
.template-cart #main-cart-footer {
  background: transparent !important;
}
/* ================================
   ODEN – CARDS OSCURAS (FORZADO)
   ================================ */

/* Apaga fondos claros heredados en el área del footer */
.template-cart #main-cart-footer,
.template-cart #main-cart-footer .cart__footer,
.template-cart #main-cart-footer .cart__blocks {
  background: transparent !important;
}

/* Las 2 cards (izq y der) ahora sí: casi negro */
.template-cart #main-cart-footer .oden-card {
  background: #0f0f0f !important;   /* casi negro */
  color: #fff !important;
  border-radius: 14px;
  padding: 16px;
}

/* MUY importante: si dentro tus snippets hay cajas con fondo claro, las forzamos también */
.template-cart #main-cart-footer .oden-card .oden-box,
.template-cart #main-cart-footer .oden-card [data-oden-fulfillment],
.template-cart #main-cart-footer .oden-card [data-oden-summary] {
  background: transparent !important;
}

/* Texto blanco dentro */
.template-cart #main-cart-footer .oden-card,
.template-cart #main-cart-footer .oden-card * {
  color: inherit;
}

/* Inputs en oscuro */
.template-cart #main-cart-footer .oden-card input,
.template-cart #main-cart-footer .oden-card select,
.template-cart #main-cart-footer .oden-card textarea {
  background: #1a1a1a !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.22) !important;
}
background: #222222 !important;
/* Botón pagar rojo */
.template-cart [data-oden-pay] {
  background: #e11d2e !important;  /* rojo */
  color: #fff !important;
  border: none !important;
}

.template-cart [data-oden-pay]:hover {
  filter: brightness(0.95);
}
/* ====== Pagar rojo (Dawn usa variables) ====== */
.template-cart [data-oden-pay],
.template-cart #main-cart-footer .oden-cart-grid [data-oden-pay] {
  --color-button: 225, 29, 46;        /* rojo */
  --color-button-text: 255, 255, 255; /* blanco */
  --alpha-button-background: 1;
  --alpha-button-border: 1;

  background: rgb(var(--color-button)) !important;
  color: rgb(var(--color-button-text)) !important;
  border: 1px solid rgb(var(--color-button)) !important;
}
* Header acordeón: derecha (monto + flecha) */
[data-oden-summary] .oden-acc-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

[data-oden-summary] .oden-acc-right {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* Overlay login */
.oden-login-overlay{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0,0,0,.78);
  backdrop-filter: blur(6px);
}

/* Card */
.oden-login-card{
  width: min(520px, 92vw);
  background: rgba(18,18,18,.92);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  padding: 20px 18px 22px;
  box-shadow: 0 18px 60px rgba(0,0,0,.55);
  color: #fff;
  text-align: center;
}

/* Logo centrado arriba */
.oden-login-logo--center{
  display: flex;
  justify-content: center;
  margin-bottom: 14px;
}
.oden-login-logo--center img{
  max-width: 180px;
  max-height: 56px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

/* Título grande + visible sí o sí */
.oden-login-title{
  margin: 0;
  text-align: center;
  color: #fff !important;
  font-size: 26px !important;
  font-weight: 900 !important;
  line-height: 1.15;
  letter-spacing: .2px;
   margin-bottom: 12px; /* separa del divider */
}

/*Linea debajo del titulo */
.oden-login-divider{
  display: block;
  margin: 14px auto 22px;   /* más espacio abajo */
  height: 1px;
  width: 100%;
  background: rgba(255,255,255,.14);
}

/* Mensaje centrado */
.oden-login-message{
  margin: 0 0 18px;
  text-align: center;
  font-size: 14px;
  line-height: 1.45;
  color: rgba(255,255,255,.86);
   margin-top: 18px;    /* aire entre título y mensaje */
  margin-bottom: 22px;
}

/* Botón rojo centrado */
.oden-login-actions{
  display: grid;
  justify-items: center;
}
.oden-login-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  min-width: 200px;
  border-radius: 12px;
  background: #e30613;
  color: #fff;
  text-decoration: none;
  font-weight: 800;
  font-size: 14px;
  line-height: 1;
  border: 1px solid rgba(255,255,255,.10);
  transition: transform .12s ease, filter .12s ease, opacity .12s ease;
}
.oden-login-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.03);
}
.oden-login-btn:active{
  transform: translateY(0px);
  opacity: .95;
}

/* Línea completa bajo el logo */
.oden-login-logo--center{
  position: relative;
  padding-bottom: 14px;
  margin-bottom: 18px;
}

.oden-login-logo--center::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: rgba(255,255,255,.12); /* blanco muy tenue */
}

/* =========================
   ODEN: Oculta listado nativo de Dawn (arriba)
   y dejamos que el resumen (derecha) sea el que muestre todo
========================= */
.template-cart #main-cart-items .cart-items,
.template-cart #main-cart-items .cart__items,
.template-cart #main-cart-items .title-wrapper-with-link {
  display: none !important;
}
/* ===========================
   Ocultar listado "arriba" (Dawn) pero mantener funcionalidad
   =========================== */
.template-cart .title-wrapper-with-link{
  display:none !important;
}

/* Oculta la tabla/listado de items, pero deja el form #cart vivo */
.template-cart table.cart-items{
  display:none !important;
}

/* Oculta el bloque de warnings cuando el carrito NO está vacío (opcional, pero recomendado) */
.template-cart cart-items:not(.is-empty) .cart__warnings{
  display:none !important;
}
/* Mini lista dentro del recuadro */
.oden-mini-item{
  display:flex;
  gap:12px;
  padding:10px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.oden-mini-item:last-child{ border-bottom:0; }

.oden-mini-img{
  width:64px;
  height:64px;
  border-radius: 12px;
  overflow:hidden;
  background: rgba(255,255,255,.06);
  flex: 0 0 64px;
}
.oden-mini-img img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}

.oden-mini-info{ flex:1; min-width:0; }
.oden-mini-title{
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.oden-mini-meta{
  margin-top:4px;
  opacity:.9;
  display:flex;
  justify-content: space-between;
  gap:10px;
  font-size: 12.5px;
}

.oden-mini-controls{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
}

.oden-mini-btn{
  border-radius: 12px;
  padding: 8px 10px;
  line-height: 1;
  min-width: 40px;
}

.oden-mini-qty{
  min-width: 18px;
  text-align:center;
}

/* ================================
   ODEN – Carrito a ancho completo + resumen más amplio
   (PEGAR AL FINAL DEL ARCHIVO)
   ================================ */

/* 1) Usar toda la pantalla (rompe la centralización de Dawn solo en carrito) */
.template-cart #main-cart-footer .page-width {
  max-width: none !important;
  width: 100% !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

@media (max-width: 749px) {
  .template-cart #main-cart-footer .page-width {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* 2) Grilla: izquierda dominante, derecha un poco más grande */
@media (min-width: 990px) {
  .template-cart #main-cart-footer .cart__blocks .oden-cart-grid {
    grid-template-columns: 1fr 520px !important; /* sube/baja: 500-580 */
    gap: 20px !important;
  }

  /* 3) Asegura que el recuadro derecho use TODO el ancho de su columna */
  .template-cart #main-cart-footer .cart__blocks .oden-cart-grid > div:nth-child(2) {
    justify-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
  }
}
/* ================================
   ODEN – Ocultar precio redundante (span) bajo el nombre
   Mantener total a la derecha
   ================================ */

/* Si el precio es un <span> dentro de cart-item__details, lo ocultamos */
.template-cart #main-cart-footer #oden-cart-items-slot td.cart-item__details span:has(> .money),
.template-cart #main-cart-footer #oden-cart-items-slot td.cart-item__details span:has(> .price),
.template-cart #main-cart-footer #oden-cart-items-slot td.cart-item__details span:has(> .amount),
.template-cart #main-cart-footer #oden-cart-items-slot td.cart-item__details span:has(> .currency),
.template-cart #main-cart-footer #oden-cart-items-slot td.cart-item__details span:has(> span),
.template-cart #main-cart-footer #oden-cart-items-slot td.cart-item__details > span {
  display: none !important;
}
/* 100% compatible: oculta el último span simple dentro de details */
.template-cart #main-cart-footer #oden-cart-items-slot td.cart-item__details > span {
  display: none !important;
}
/* ODEN – En mini resumen: ocultar precio unitario, dejar total por línea */
.template-cart #main-cart-footer .oden-mini-meta span:first-child {
  display: none !important;
}
.template-cart #main-cart-footer .oden-mini-meta {
  justify-content: flex-end;
}

/* ================================
   ODEN – Botón PAGAR bonito y protagonista
   ================================ */

/* Botón pagar */
.template-cart [data-oden-pay] {
  width: 100%;
  margin-top: 18px;

  background: linear-gradient(180deg, #e30613 0%, #c8000d 100%) !important;
  color: #ffffff !important;

  border: none !important;
  border-radius: 16px;

  padding: 16px 18px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.3px;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  cursor: pointer;

  box-shadow: 0 10px 24px rgba(227, 6, 19, 0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

/* Hover */
.template-cart [data-oden-pay]:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(227, 6, 19, 0.45);
}

/* Active (click) */
.template-cart [data-oden-pay]:active {
  transform: translateY(0);
  box-shadow: 0 8px 18px rgba(227, 6, 19, 0.35);
}

/* Disabled */
.template-cart [data-oden-pay][disabled],
.template-cart [data-oden-pay].is-disabled {
  opacity: 0.6;
  cursor: not-allowed;
  box-shadow: none;
}
/* ================================
   ODEN – RESET TOTAL botón PAGAR (Dawn)
   ================================ */

.template-cart [data-oden-pay],
.template-cart [data-oden-pay]::before,
.template-cart [data-oden-pay]::after {
  all: unset;
  box-sizing: border-box;
}

/* ================================
   ODEN – Botón PAGAR limpio y profesional
   ================================ */

.template-cart [data-oden-pay] {
  width: 100%;
  margin-top: 16px;

  background: #e30613 !important;
  color: #ffffff !important;

  border-radius: 14px;
  padding: 12px 18px; /* ↓ menos alto */

  font-size: 15px;   /* ↓ un poco más chico */
  font-weight: 800;
  letter-spacing: 0.3px;

  display: flex;
  align-items: center;
  justify-content: center;

  cursor: pointer;

  box-shadow: 0 8px 22px rgba(227, 6, 19, 0.32);
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

/* Hover */
.template-cart [data-oden-pay]:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(227, 6, 19, 0.45);
}

/* Active */
.template-cart [data-oden-pay]:active {
  transform: translateY(0);
  box-shadow: 0 8px 20px rgba(227, 6, 19, 0.35);
}

/* Disabled */
.template-cart [data-oden-pay][disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}
.template-cart [data-oden-pay] {
  max-width: 420px;
  margin-left: auto;
  margin-right: auto;
}
/* ODEN – texto de horario seleccionado */
.template-cart .oden-slot-selected{
  margin-top: 10px;
  font-size: 13px;
  opacity: .9;
}

.template-cart .oden-slot-selected strong{
  font-weight: 800;
}
/* ================================
   ODEN – Recuadro "Retiro/Despacho en"
   ================================ */
.template-cart .oden-where{
  margin: 10px 0 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
}

.template-cart .oden-where__label{
  font-size: 12px;
  opacity: 0.8;
  margin-bottom: 4px;
}

.template-cart .oden-where__value{
  font-size: 14px;
  font-weight: 800;
  line-height: 1.25;
}
.template-cart .oden-slots-title{
  font-size: 12px;
  font-weight: 800;
  opacity: .85;
  margin: 8px 0 10px;
  letter-spacing: .2px;
}
.template-cart .oden-slots-empty{
  font-size: 12px;
  opacity: .8;
  padding: 8px 0;
}



/* ============================
   ODEN — Mini incrementador (oden-mini-controls)
   ============================ */

.oden-mini-controls .oden-mini-btn{
  min-width: 28px !important;
  height: 28px !important;
  padding: 0 8px !important;
  border-radius: 10px !important;
}

.oden-mini-controls .oden-mini-btn .svg-wrapper{
  width: 12px;
  height: 12px;
}

.oden-mini-controls .oden-mini-qty{
  font-size: 12px;
  min-width: 16px;
}

/* ============================
   ODEN — Tamaño mini incrementador (detalle pedidos)
   Ajusta SOLO el control (no el producto completo)
   ============================ */

:root{
  /* Cambia SOLO este número para variar el tamaño total */
  --oden-mini-size: 24px;   /* prueba 22px / 24px / 26px */
  --oden-mini-pad-x: 6px;   /* padding horizontal del botón */
  --oden-mini-icon: 11px;   /* tamaño del ícono +/- */
  --oden-mini-font: 12px;   /* tamaño del número */
}

.oden-mini-controls .oden-mini-btn{
  height: var(--oden-mini-size) !important;
  min-height: var(--oden-mini-size) !important;
  min-width: var(--oden-mini-size) !important; /* mantiene “cuadradito” */
  padding: 0 var(--oden-mini-pad-x) !important;
  border-radius: 10px !important;
  line-height: 1 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.oden-mini-controls .oden-mini-btn .svg-wrapper{
  width: var(--oden-mini-icon) !important;
  height: var(--oden-mini-icon) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.oden-mini-controls .oden-mini-btn svg{
  width: var(--oden-mini-icon) !important;
  height: var(--oden-mini-icon) !important;
}

.oden-mini-controls .oden-mini-qty{
  font-size: var(--oden-mini-font) !important;
  line-height: 1 !important;
  min-width: 16px;
  text-align: center;
}

/* ODEN — Nombre de producto en mini resumen: sin negrita */
.oden-mini-title{
  font-weight: 400 !important;
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* Título sobre los horarios (anti-confusión) */
.template-cart .oden-slots-title{
  font-size: 16px;        /* más grande */
  font-weight: 900;
  opacity: 1;
  margin: 10px 0 12px;
  letter-spacing: .3px;
  text-transform: uppercase;
}

.template-cart .oden-slot-selected{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}

.template-cart .oden-slot-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .3px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18);
  text-transform: uppercase;
}

/* ================================
   ODEN — "Productos" sin recuadro, solo línea inferior
   (mantiene monto derecha + flecha)
   ================================ */

/* Header del acordeón (Productos / etc.) */
[data-oden-summary] .oden-acc-btn{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  padding: 12px 0 !important;     /* menos “botón”, más “fila” */
  border-bottom: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 0 !important;
}

/* Asegura layout izquierda/derecha */
[data-oden-summary] .oden-acc-left,
[data-oden-summary] .oden-acc-right{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* Flecha un poco más discreta */
[data-oden-summary] .oden-acc-arrow{
  opacity: 0.85;
}

/* Panel cuando abre: separa un poco del header */
[data-oden-summary] .oden-acc-panel{
  border-bottom: 0 !important;   /* evita doble línea si tenías */
  padding: 10px 0 14px !important;
}
/* ================================
   ODEN — Botones Retiro / Delivery
   Letras más grandes y claras
   ================================ */

.template-cart .oden-toggle button{
  font-size: 18px;        /* antes ~13px */
  font-weight: 700;       /* más presencia */
  padding: 10px 14px;     /* más cómodos al click */
}

/* Botón activo aún más claro */
.template-cart .oden-toggle button.is-active{
  font-weight: 800;
}

/* ================================
   ODEN — Toggle Retiro / Delivery
   Fondo oscuro → fondo blanco al seleccionar
   ================================ */

/* Estado normal (NO seleccionado) */
.template-cart .oden-toggle button{
  background-color: #1a1a1a;     /* gris oscuro */
  color: #ffffff;                /* texto blanco */
  border: 1px solid rgba(255,255,255,0.25);
  font-size: 15px;
  font-weight: 700;
  padding: 12px 14px;
  transition: background-color 0.15s ease,
              color 0.15s ease,
              border-color 0.15s ease;
}

/* Estado seleccionado */
.template-cart .oden-toggle button.is-active{
  background-color: #ffffff;     /* fondo blanco */
  color: #2b2b2b;                /* texto gris oscuro */
  border-color: #ffffff;
  font-weight: 800;
}

/* Hover solo para el NO activo */
.template-cart .oden-toggle button:not(.is-active):hover{
  background-color: #242424;
}

/* ================================
   ODEN — Toggle Retiro/Delivery: texto oscuro SOLO en el botón activo
   Sin afectar otros controles (incrementadores)
   ================================ */

.template-cart #main-cart-footer .oden-toggle button.is-active{
  color: #2b2b2b !important;
}

/* Si el texto está envuelto en spans dentro de esos botones, SOLO ahí */
.template-cart #main-cart-footer .oden-toggle button.is-active > span,
.template-cart #main-cart-footer .oden-toggle button.is-active > span *{
  color: #2b2b2b !important;
}
/* ================================
   ODEN — Incrementadores del resumen: no blancos
   ================================ */

#oden-cart-items-slot .quantity__button,
#oden-cart-items-slot .quantity__input,
.oden-mini-controls .oden-mini-btn,
.oden-mini-controls .oden-mini-btn svg{
  color: #ffffff !important; /* texto/icono blanco en oscuro */
  fill: currentColor !important;
}
/* ================================
   ODEN — Blindaje incrementadores en Resumen (derecha)
   Fondo gris oscuro + texto/iconos blancos
   ================================ */

/* Mini incrementador ODEN (los tuyos con data-oden-plus/minus) */
.template-cart #main-cart-footer [data-oden-summary] .oden-mini-controls .oden-mini-btn{
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
}

.template-cart #main-cart-footer [data-oden-summary] .oden-mini-controls .oden-mini-btn svg,
.template-cart #main-cart-footer [data-oden-summary] .oden-mini-controls .oden-mini-btn .svg-wrapper{
  color: #ffffff !important;
  fill: currentColor !important;
}

/* Por si algún texto interno hereda color oscuro */
.template-cart #main-cart-footer [data-oden-summary] .oden-mini-controls .oden-mini-qty{
  color: #ffffff !important;
}

/* Si en algún punto aparece el quantity nativo (Dawn) dentro del slot */
.template-cart #main-cart-footer #oden-cart-items-slot .quantity__button,
.template-cart #main-cart-footer #oden-cart-items-slot .quantity__input{
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
}

.template-cart #main-cart-footer #oden-cart-items-slot .quantity__button svg{
  fill: currentColor !important;
}
/* ================================
   ODEN — Fix hover en botón activo (Retiro / Delivery)
   ================================ */

/* Hover SOLO para el botón NO activo */
.template-cart #main-cart-footer .oden-toggle button:not(.is-active):hover{
  background-color: #242424;
  color: #ffffff;
}

/* Botón activo: IGNORAR hover (mantener texto oscuro) */
.template-cart #main-cart-footer .oden-toggle button.is-active:hover{
  background-color: #ffffff !important;  /* sigue blanco */
  color: #2b2b2b !important;             /* texto gris oscuro */
}

/* Por si el texto está dentro de spans */
.template-cart #main-cart-footer .oden-toggle button.is-active:hover > span,
.template-cart #main-cart-footer .oden-toggle button.is-active:hover > span *{
  color: #2b2b2b !important;
}
/* ================================
   ODEN — Botones de horarios (slots)
   Forzar oscuro + texto blanco
   ================================ */

.template-cart #main-cart-footer .oden-slot-btn{
  background-color: #1a1a1a !important;  /* gris oscuro */
  color: #ffffff !important;             /* texto blanco */
  border: 1px solid rgba(255,255,255,0.22) !important;
  box-shadow: none !important;
}

/* Hover */
.template-cart #main-cart-footer .oden-slot-btn:hover{
  background-color: #242424 !important;
  color: #ffffff !important;
}

/* Por si el tema mete wrappers de texto */
.template-cart #main-cart-footer .oden-slot-btn *,
.template-cart #main-cart-footer .oden-slot-btn span{
  color: #ffffff !important;
}
/* ================================
   ODEN — Botón "Escoge horario" (ancho completo y visible)
   ================================ */
/*
.template-cart #main-cart-footer .oden-open-slots-btn{
  width: 100% !important;
  display: flex;
  align-items: center;
  justify-content: center;

  margin-top: 10px;
  padding: 14px 14px;

  border-radius: 14px;
  font-weight: 800;
  font-size: 15px;

  background-color: #1a1a1a !important;  /* destaca */
 /* color: #ffffff !important;             /* texto oscuro */
 /* border: 1px solid rgba(255,255,255,0.85) !important;

  cursor: pointer;
}
*/
/* Hover suave */
.template-cart #main-cart-footer .oden-open-slots-btn:hover{
  filter: brightness(0.96);
}

/* Asegurar color en spans internos */
.template-cart #main-cart-footer .oden-open-slots-btn *{
  color: #2b2b2b !important;
}
/* ================================
   ODEN — Check verde horario seleccionado
   ================================ */

.template-cart .oden-open-slots-btn .oden-check{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 22px;
  height: 22px;
  border-radius: 50%;

  background-color: #22c55e; /* verde */
  color: #ffffff;

  font-size: 14px;
  font-weight: 900;
  line-height: 1;
}

/* Opcional: leve cambio visual cuando está completo */
.template-cart .oden-open-slots-btn.is-complete{
  border-color: rgba(34,197,94,0.6);
}

/* ================================
   ODEN — Botón Escoge horario
   Texto izquierda + check derecha
   ================================ */

.template-cart #main-cart-footer .oden-open-slots-btn{
  width: 100%;
  padding: 14px 16px;
  border-radius: 14px;

  background-color: #1a1a1a;
  color: #ffffff;
  border: 1px solid rgba(255,255,255,0.25);

  font-size: 15px;
  font-weight: 800;

  display: flex;
  align-items: center;
  justify-content: space-between; /* 🔑 clave */

  cursor: pointer;
}

/* Texto del botón */
.template-cart #main-cart-footer .oden-open-slots-btn{
  text-align: left;
}

/* Check verde a la derecha */
.template-cart .oden-open-slots-btn .oden-check{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 22px;
  height: 22px;
  border-radius: 50%;

  background-color: #22c55e;
  color: #ffffff;

  font-size: 14px;
  font-weight: 900;
  line-height: 1;

  flex-shrink: 0; /* evita que se aplaste */
}
/* ================================
   ODEN — Animación check horario
   ================================ */

.template-cart .oden-open-slots-btn .oden-check{
  animation: oden-check-pop 0.35s ease-out;
  transform-origin: center;
}

@keyframes oden-check-pop{
  0%{
    transform: scale(0.6);
    opacity: 0;
  }
  70%{
    transform: scale(1.15);
    opacity: 1;
  }
  100%{
    transform: scale(1);
  }
}

/* ================================
   ODEN — Botón final "Ir a pagar" (FORZADO)
   ================================ */
.template-cart #main-cart-footer .oden-pay[data-oden-pay]{
  width: 100% !important;
  max-width: none !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin-top: 18px !important;
  padding: 16px 20px !important;

  border-radius: 16px !important;

  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: .3px !important;

  background: #e30613 !important;
  color: #ffffff !important;
  border: 0 !important;

  box-shadow: 0 10px 26px rgba(227, 6, 19, 0.40) !important;
  cursor: pointer !important;
}

.template-cart #main-cart-footer .oden-pay[data-oden-pay]:hover{
  filter: brightness(1.06) !important;
  transform: translateY(-1px) !important;
}

.template-cart #main-cart-footer .oden-pay[data-oden-pay][disabled]{
  opacity: .55 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}
/* ODEN — Acordeón resumen: cerrado por defecto */
[data-oden-summary] .oden-acc-panel{
  display: none !important;
}

/* Abierto solo cuando el item tiene is-open */
[data-oden-summary] [data-acc].is-open .oden-acc-panel{
  display: block !important;
}

/* =========================
   ODEN — Header minimal SOLO carrito
   ========================= */
.template-cart .oden-cart-headerbar{
  padding: 18px 0 12px;
}

/* 3 columnas: logo / título / vacío (centra real) */
.template-cart .oden-cart-headerbar__inner{
  display: grid;
  grid-template-columns: 220px 1fr 220px;
  align-items: center;
  gap: 12px;
}

/* Logo un poquito hacia la derecha */
.template-cart .oden-cart-headerbar__left{
  padding-left: 14px;
}

.template-cart .oden-cart-headerbar__logo img{
  display: block;
  width: auto;
  max-height: 54px;
  height: auto;
}

/* Título grande, visible, sin negrita */
.template-cart .oden-cart-headerbar__title{
  text-align: center;
  font-size: 24px;
  font-weight: 400; /* sin negrita */
  letter-spacing: .2px;
  line-height: 1.15;
}

/* Mobile */
@media (max-width: 749px){
  .template-cart .oden-cart-headerbar__inner{
    grid-template-columns: 1fr;
    justify-items: center;
  }
  .template-cart .oden-cart-headerbar__left{
    padding-left: 0;
  }
  .template-cart .oden-cart-headerbar__title{
    font-size: 20px;
  }
}

/* =========================
   ODEN — Cart header divider + Stepper (solo carrito)
   ========================= */

/* Línea separadora bajo el header (solo carrito) */
.template-cart .section-header{
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  margin-bottom: 0 !important;
}
.template-cart #MainContent{
  padding-top: 10px;
}

/* ===== Stepper Carro → Pago (solo carrito) ===== */
.template-cart .oden-cart-stepper{
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 28px;                 /* separación entre: step - línea - step */
  width: 100%;
  max-width: 720px;          /* ⬅️ más ancho = más distancia entre círculos */
  margin: 14px auto 18px;
}

/* Cada hito: círculo arriba, texto abajo */
.template-cart .oden-step{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  min-width: 140px;          /* ⬅️ asegura separación visual */
  text-align: center;
}

/* Círculo con número */
.template-cart .oden-step__dot{
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  border: 2px solid #1f1f1f;
  background: transparent;
  color: #1f1f1f;
}

/* Activo */
.template-cart .oden-step.is-active .oden-step__dot{
  background: #1f1f1f;
  color: #fff;
}

/* Labels (SIEMPRE gris oscuro, no blancos) */
.template-cart .oden-step__label{
  font-size: 14px;
  font-weight: 500;
  color: #1f1f1f;            /* ⬅️ gris oscuro */
  opacity: .85;
}

/* Línea entre hitos (centrada a la mitad del círculo) */
.template-cart .oden-step__line{
  width: 180px;              /* ⬅️ controla distancia entre círculos */
  height: 2px;
  background: #1f1f1f;
  opacity: .35;
  border-radius: 99px;
  margin-top: 19px;          /* ⬅️ mitad de 38px (círculo) = 19px */
}

/* Mobile */
@media (max-width: 749px){
  .template-cart .oden-cart-stepper{
    max-width: 520px;
    gap: 18px;
  }
  .template-cart .oden-step{
    min-width: 110px;
  }
  .template-cart .oden-step__line{
    width: 120px;
  }
  .template-cart .oden-step__dot{
    width: 34px;
    height: 34px;
  }
  .template-cart .oden-step__line{
    margin-top: 17px;        /* mitad de 34px */
  }
}

/* =========================
   ODEN — Ajuste de espacios (compactar)
   ========================= */

/* 1) Header → Stepper */
.template-cart .oden-cart-headerbar{
  padding-bottom: 8px; /* antes estaba muy alto */
}

/* Si usas línea bajo el header */
.template-cart .oden-cart-headerbar::after{
  margin-top: 8px;     /* reduce espacio antes de la línea */
}

/* 2) Stepper: quitar aire extra arriba y abajo */
.template-cart .oden-cart-stepper{
  margin-top: 6px;    /* ⬇️ antes 14–16px */
  margin-bottom: 8px;/* ⬇️ acerca al resumen */
}

/* 3) Resumen de compra (recuadro negro) */
.template-cart .oden-box{
  margin-top: 0;      /* evita doble espacio */
}

/* 4) Seguro extra: evita márgenes fantasmas */
.template-cart #MainContent{
  padding-top: 6px;   /* antes 10px */
}

/* =========================
   ODEN — Cart empty toast
   ========================= */
.oden-cart-toast {
  position: fixed;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;

  width: min(720px, calc(100% - 24px));
  background: rgba(25, 25, 25, 0.95);
  border: 1px solid rgba(255,255,255,.12);
  color: #fff;

  padding: 12px 14px;
  border-radius: 14px;
  box-shadow: 0 10px 28px rgba(0,0,0,.35);

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;

  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}

.oden-cart-toast.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.oden-cart-toast__text {
  font-size: 14px;
  line-height: 1.25;
  opacity: .95;
}

.oden-cart-toast__close {
  appearance: none;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 6px 8px;
  opacity: .85;
}
.oden-cart-toast__close:hover { opacity: 1; }

/* ODEN Modal Confirm */
.oden-confirm[hidden] { display: none !important; }

.oden-confirm{
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: grid;
  place-items: center;
  padding: 16px;
}

.oden-confirm__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
}

.oden-confirm__dialog{
  position: relative;
  width: min(520px, 92vw);
  border-radius: 16px;
  background: rgba(25,25,25,.96);
  color: rgba(255,255,255,.92);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 20px 60px rgba(0,0,0,.55);
  padding: 16px;
  transform: translateY(6px);
  opacity: 0;
  animation: odenConfirmIn .16s ease-out forwards;
}

@keyframes odenConfirmIn{
  to { opacity: 1; transform: translateY(0); }
}

.oden-confirm__title{
  font-size: 16px;
  font-weight: 650;
  margin: 0 0 8px;
}

.oden-confirm__desc{
  font-size: 14px;
  line-height: 1.35;
  opacity: .95;
  margin: 0 0 14px;
}

.oden-confirm__actions{
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.oden-confirm__btn{
  min-width: 110px;
}

.oden-confirm__btn.is-danger{
  /* usa tu button--primary, pero con intención de “eliminar” */
  filter: brightness(1.05);
}

/* Evita scroll de fondo mientras está abierto */
html.oden-modal-open,
body.oden-modal-open{
  overflow: hidden;
}

/* ===============================
   ODEN — Modal confirmación (botones neutros + hover rojo)
   =============================== */

#odenConfirm .oden-confirm__actions{
  display: flex;
  gap: 12px;
}

/* Base: ambos botones IGUALES */
#odenConfirm .oden-confirm__btn{
  flex: 1;
  padding: 12px 14px;
  border-radius: 12px;
  background: #2a2a2a;          /* gris oscuro */
  color: #ffffff;
  border: 1px solid rgba(255,255,255,.12);
  font-weight: 600;
  cursor: pointer;

  transition:
    background-color .18s ease,
    transform .12s ease,
    filter .15s ease;
}

/* Hover: SOLO el botón bajo el cursor se vuelve rojo */
#odenConfirm .oden-confirm__btn:hover{
  background: #d11a1a;          /* rojo */
  transform: translateY(-1px);
}

/* Active / click */
#odenConfirm .oden-confirm__btn:active{
  transform: translateY(0);
  filter: brightness(.92);
}

/* ===============================
   ODEN — Botón "Volver" a la derecha
   =============================== */

.oden-cart-headerbar__inner{
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
}

.oden-cart-headerbar__left{
  justify-self: start !important;
}

.oden-cart-headerbar__center{
  justify-self: center !important;
  text-align: center !important;
}

.oden-cart-headerbar__right{
  justify-self: end !important;
  display: flex !important;
  align-items: center !important;
}

.oden-cart-back-btn{
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 14px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.08) !important;
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  cursor: pointer !important;
}

.oden-cart-back-btn:hover{
  background: rgba(255,255,255,.16) !important;
}

/* Solo en carrito */
.template-cart .oden-cart-back-btn{
  background: rgba(25,25,25,.92) !important; /* oscuro */
  color: rgba(255,255,255,.95) !important;  /* texto claro */
  border: 1px solid rgba(255,255,255,.14) !important;
}

.template-cart .oden-cart-back-btn:hover{
  background: rgba(230,0,0,.95) !important; /* rojo al hover si quieres */
  border-color: rgba(230,0,0,.95) !important;
}

/* ===============================
   ODEN — Botón Volver (blanco / negro)
   =============================== */

.template-cart .oden-cart-back-btn{
  background: #ffffff !important;
  color: #000000 !important;
  border: 1px solid rgba(0,0,0,.15) !important;
  border-radius: 999px !important;
  padding: 10px 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

/* Hover: feedback sutil */
.template-cart .oden-cart-back-btn:hover{
  background: #f2f2f2 !important;
  border-color: rgba(0,0,0,.25) !important;
}

/* ===============================
   ODEN — Compactar espacios (solo carrito)
   Anclado a .oden-cart-headerbar (solo existe en /cart)
   =============================== */

/* A) Reduce alto del bloque superior (headerbar) */
.oden-cart-headerbar{
  padding: 10px 0 6px !important; /* más compacto */
}

/* B) Stepper pegadito al headerbar */
.oden-cart-headerbar .oden-cart-stepper{
  margin: 2px auto 2px !important;
}

/* C) Quita “aire” que mete el header nativo debajo */
body.template-cart .section-header{
  margin-bottom: 0 !important;
}

/* D) Quita padding/aire al contenido principal del carrito */
body.template-cart #MainContent{
  padding-top: 0 !important;
}

/* E) Si tu Delivery/Retiro está en el footer del carrito (normal en Dawn) */
body.template-cart #main-cart-footer,
body.template-cart .cart__footer{
  padding-top: 2px !important;
  margin-top: 0 !important;
}

/* F) Tu caja resumen (oden-box) más arriba */
body.template-cart .oden-box{
  margin-top: 6px !important;
}

/* Fulfillment simplificado */
.oden-fulfillment-title{
  margin: 0 0 6px;
  font-size: 18px;
  font-weight: 600;
}

.oden-fulfillment-sub{
  margin: 0 0 12px;
  opacity: .85;
  font-size: 13.5px;
}

/* Slots en grid */
.oden-slots--grid{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.oden-slots--grid .oden-slot-btn{
  margin: 0;
}
.oden-slots[hidden]{ display:none !important; }
.oden-slots{ display:block; margin-top:12px; }


/* ================================
   Botón "Ver horarios disponibles"
   ================================ */
[data-oden-fulfillment] [data-oden-open-slots]{
  width: 100%;
  display: block;
  text-align: left;                /* 👈 texto a la izquierda */
  padding: 14px 16px;
  border-radius: 14px;
  font-weight: 600;
  background: transparent;
  color: inherit;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

/* Hover */
[data-oden-fulfillment] [data-oden-open-slots]:hover{
  background-color: #ffffff !important;
  color: #000000 !important;
  border-color: #ffffff !important;
}

/* Active (cuando se hace click) */
[data-oden-fulfillment] [data-oden-open-slots]:active{
  background-color: #ffffff !important;
  color: #000000 !important;
  border-color: #ffffff !important;
}

/* Estado "abierto" (cuando los horarios están visibles)
   El JS no agrega clase, así que lo forzamos cuando el botón fue clickeado */
[data-oden-fulfillment] [data-oden-open-slots].is-open{
  background-color: #ffffff !important;
  color: #000000 !important;
  border-color: #ffffff !important;
}

/* Si hay íconos SVG dentro del botón */
[data-oden-fulfillment] [data-oden-open-slots]:hover svg,
[data-oden-fulfillment] [data-oden-open-slots]:active svg,
[data-oden-fulfillment] [data-oden-open-slots].is-open svg{
  fill: #000000 !important;
}

/* ================================
   Botón "Ver horarios disponibles"
   ================================ */
.oden-slots-open{
  width: 100%;
  display: block;
  text-align: left;
}

/* Hover/active blanco + negro */
.oden-slots-open:hover,
.oden-slots-open:active,
.oden-slots-open:focus{
  background: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
}

/* ================================
   Bloque horario seleccionado
   - NO ancho completo
   - NO clickeable
   - Blanco/negro fijo
   ================================ */
.oden-selected-label{
  margin: 0 0 8px;
  font-size: 13px;
  opacity: .95;
}

/* Mantiene ancho natural */
.oden-selected-btn{
  width: auto;
  display: inline-flex;
  text-align: left;
  background: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
  cursor: default !important;
}

/* No efecto hover (que no se vea clickeable) */
.oden-selected-btn:hover,
.oden-selected-btn:active,
.oden-selected-btn:focus{
  background: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
  box-shadow: none !important;
}

/* Disabled: sin opacidad gris */
.oden-selected-btn:disabled{
  opacity: 1 !important;
  pointer-events: none !important;
}

/* Asegura que el botón siempre sea clickeable */
[data-oden-open-slots]{
  position: relative;
  z-index: 3;
  pointer-events: auto;
}

/* ===============================
   ODEN Confirm Modal — FINAL REAL
   Ambos botones: fondo oscuro + texto blanco
=============================== */

#odenConfirm [data-oden-confirm-ok],
#odenConfirm [data-oden-confirm-cancel]{
  background-color: rgba(0,0,0,.75) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,.35) !important;
}

/* Hover: solo un leve aclarado, sin cambiar colores */
#odenConfirm [data-oden-confirm-ok]:hover,
#odenConfirm [data-oden-confirm-cancel]:hover{
  background-color: rgba(0,0,0,.85) !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,.55) !important;
}

/* Focus / active */
#odenConfirm [data-oden-confirm-ok]:focus,
#odenConfirm [data-oden-confirm-cancel]:focus{
  outline: none;
  box-shadow: 0 0 0 2px rgba(255,255,255,.15);
}

/* ===============================
   ODEN Confirm Modal — HOVER ROJO
=============================== */

/* Estado normal: ambos botones iguales */
#odenConfirm [data-oden-confirm-ok],
#odenConfirm [data-oden-confirm-cancel]{
  background-color: rgba(0,0,0,.75) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  transition: background-color .15s ease, border-color .15s ease;
}

/* Hover: rojo */
#odenConfirm [data-oden-confirm-ok]:hover,
#odenConfirm [data-oden-confirm-cancel]:hover{
  background-color: #c62828 !important; /* rojo */
  color: #ffffff !important;
  border-color: #c62828 !important;
}

/* Focus (teclado) */
#odenConfirm [data-oden-confirm-ok]:focus,
#odenConfirm [data-oden-confirm-cancel]:focus{
  outline: none;
  box-shadow: 0 0 0 2px rgba(198,40,40,.35);
}


.qv-modal .qv-select {
  color: #fff !important;
  background: #1f1f1f !important;
  border: 1px solid rgba(255,255,255,.2);
}
.qv-modal .qv-select option {
  color: #111 !important;      /* para que no quede blanco sobre blanco */
  background: #fff !important; /* dropdown legible */
}

/* ODEN – Back button (link styled as button) */
.oden-cart-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;

  background: transparent;
  border: none;
  padding: 0;

  font: inherit;
  color: inherit;
  text-decoration: none;

  cursor: pointer;
}

/* Evita estilos de link por defecto */
.oden-cart-back-btn:hover,
.oden-cart-back-btn:focus,
.oden-cart-back-btn:active {
  text-decoration: none;
  color: inherit;
}

/* Icono */
.oden-cart-back-btn__icon {
  font-size: 1.6rem;
  line-height: 1;
  display: inline-block;
}

/* Texto */
.oden-cart-back-btn__text {
  font-size: 1.4rem;
  line-height: 1;
}

/* Accesibilidad: foco visible */
.oden-cart-back-btn:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

/* ODEN: variantes pro en resumen carrito */
.oden-mini-variant {
  margin-top: 2px;
  font-size: 0.85em;
  opacity: 0.8;
  line-height: 1.2;
}

.oden-mini-variant__name {
  font-weight: 600;
  opacity: 0.95;
}

.oden-mini-variant__sep {
  opacity: 0.6;
}
.oden-mini-variant {
  opacity: 0.75;
}