/* E16 · Panel agregado: azul niebla, cristal nítido y tres zonas estables. */
.eb-drawer-root.mc-mundo { --mc-acento:#1f8a72; position:fixed; inset:0; z-index:99990; background:transparent; visibility:hidden; pointer-events:none; font-family:var(--mc-fuente,'Albert Sans',system-ui,sans-serif); color:#161514; transition:visibility 0s linear .3s; }
.eb-drawer-root.is-open { visibility:visible; pointer-events:auto; transition-delay:0s; }
.eb-drawer-root button.eb-drawer-dim { position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; border:0; border-radius:0; background:rgba(30,45,60,.28); box-shadow:none; opacity:0; transition:opacity .3s; cursor:pointer; text-align:left; }
.eb-drawer-root.is-open .eb-drawer-dim { opacity:1; }
.eb-drawer-dim span { position:absolute; left:55px; top:140px; font:600 15px/1.5 var(--mc-fuente); color:#fff; }
.eb-drawer-root .eb-drawer { position:absolute; top:16px; right:16px; bottom:16px; width:min(640px,calc(100vw - 32px)); box-sizing:border-box; display:flex; flex-direction:column; border-radius:28px; overflow:hidden; background:linear-gradient(180deg,#d9e3ec,#e8eef2); box-shadow:inset 0 1px 0 #fff,0 34px 70px -40px rgba(30,50,70,.35); transform:translateX(calc(100% + 21px)); transition:transform .3s var(--mc-curva-entrada); }
.eb-drawer-root .eb-drawer::before { content:''; position:absolute; inset:0; z-index:0; border-radius:inherit; background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,.72)); pointer-events:none; }
.eb-drawer-root.is-open .eb-drawer { transform:none; }
.eb-drawer-head,.eb-drawer-body,.eb-drawer-toast { position:relative; z-index:1; }
.eb-drawer-head { display:flex; align-items:center; justify-content:space-between; gap:13px; padding:24px 28px 16px; }
.eb-drawer-title { display:flex; align-items:center; gap:10px; font-size:21px; font-weight:700; line-height:1.25; letter-spacing:-.025em; }
.mc-agregado-ok { display:inline-grid; place-items:center; width:24px; height:24px; flex:none; border-radius:50%; background:#1f8a72; color:#fff; font-size:15px; }
.eb-drawer-root [hidden] { display:none!important; }
.eb-drawer-root button.eb-drawer-x { width:40px; height:40px; flex:none; padding:0; margin:0; border:0; color:#161514; cursor:pointer; }
.eb-drawer-toast { display:flex; gap:8px; margin:0 28px 13px; font-size:13px; color:#a8402d; }
.eb-drawer-body { flex:1; min-height:0; display:flex; flex-direction:column; gap:10px; padding:0 28px 20px; overflow:hidden; }
.mc-panel-cuenta { flex:none; margin:0; font-size:13px; color:var(--mc-texto-3); }
.mc-panel-lista { flex:1; min-height:64px; overflow-y:auto; overscroll-behavior:contain; display:flex; flex-direction:column; gap:8px; padding:6px; margin:-6px; }
.eb-drawer-root .mc-panel-item { position:relative; flex:none; display:grid; grid-template-columns:64px minmax(0,1fr) auto; gap:13px; align-items:center; min-height:64px; padding:8px; border-radius:13px; background:rgba(255,255,255,.62); box-shadow:inset 0 0 0 1px rgba(255,255,255,.85); }
.eb-drawer-root .mc-panel-item::before { pointer-events:none; }
.eb-drawer-root .mc-panel-foto { width:64px; height:64px; aspect-ratio:1; border-radius:10px; }
.eb-drawer-root .mc-panel-foto img { width:80%; height:80%; object-fit:contain; }
.eb-drawer-root .mc-panel-info { display:flex; flex-direction:column; min-width:0; gap:4px; padding-right:8px; }
.eb-drawer-root .mc-panel-nombre { color:#161514!important; font-size:15px; font-weight:600; line-height:1.25; text-decoration:none!important; overflow-wrap:anywhere; }
.eb-drawer-root .mc-panel-detalle { display:none; }
.eb-drawer-root .mc-panel-fila { display:flex; gap:8px; align-items:center; }
.eb-drawer-root .mc-panel-fila .mc-precio { position:absolute; right:16px; bottom:12px; font-size:15px; font-weight:700; font-variant-numeric:tabular-nums; }
.eb-drawer-root .mc-panel-quitar { grid-column:3; align-self:start; display:grid; place-items:center; width:32px; height:32px; color:var(--mc-texto-3)!important; }
.eb-drawer-root .mc-cantidad { display:inline-flex; align-items:center; min-height:34px; border-radius:999px; background:rgba(255,255,255,.65); }
.eb-drawer-root .eb-step-b { display:grid; place-items:center; width:32px; height:34px; padding:0!important; margin:0!important; border:0!important; border-radius:50%; background:none!important; box-shadow:none!important; color:#161514!important; font:500 18px/1 var(--mc-fuente)!important; cursor:pointer; }
.eb-drawer-root .eb-step-b:disabled { opacity:.3; cursor:default; }
.eb-drawer-root .eb-step-n { min-width:20px; text-align:center; font-size:14px; font-weight:600; }
.eb-drawer-root .mc-panel-pie { display:flex; flex-direction:column; flex:none; gap:10px; padding-top:13px; border-top:1px solid var(--mc-filete); }
.eb-drawer-root .mc-fila-total { display:flex; justify-content:space-between; margin:0; padding:0; border:0; font-size:16px; }
.eb-drawer-root .mc-total-valor { font-size:20px; font-weight:700; font-variant-numeric:tabular-nums; }
.eb-drawer-root .mc-panel-botones { display:grid; grid-template-columns:1.3fr 1fr; gap:10px; }
.eb-drawer-root .mc-panel-botones .mc-boton { width:100%; min-height:52px; padding:10px 13px; text-align:center; font-size:15px; gap:8px; }
.eb-drawer-root .mc-panel-botones .mc-boton--principal { background:#1f8a72; }
.eb-drawer-root .mc-panel-botones svg { flex:none; width:16px; height:16px; }
.eb-drawer-root .mc-carrito-envio { padding:0; border:0; margin:0; }
.eb-drawer-root .mc-carrito-envio-texto { display:flex; flex-wrap:wrap; gap:0 4px; margin:0; font-size:13px; line-height:1.4; color:#1f8a72; }
.eb-drawer-root .mc-carrito-envio-texto .mc-nota { font-size:inherit; color:inherit; }
.eb-drawer-root .mc-carrito-envio-barra { display:none; }
.eb-drawer-root .mc-panel-rutina { display:flex; flex-direction:column; gap:10px; padding-top:13px; border-top:1px solid var(--mc-filete); }
.mc-panel-rutina-cabeza { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.mc-panel-rutina-cabeza h2 { margin:0; font-size:17px; font-weight:700; }
.mc-panel-rutina-cabeza > div { display:flex; gap:8px; }
.eb-drawer-root .mc-panel-rutina-cabeza button { width:38px; height:38px; margin:0; padding:0; border:0; font-size:24px; color:#161514; cursor:pointer; }
.mc-panel-rutina-cabeza button:disabled { opacity:.35; }
.mc-panel-estante { display:flex; gap:10px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; padding:2px 2px 8px; }
.eb-drawer-root .mc-panel-estante .mc-tarjeta { display:flex; flex-direction:column; flex:0 0 132px; box-sizing:border-box; gap:6px; padding:8px; border-radius:21px; background:#fff; scroll-snap-align:start; }
.eb-drawer-root .mc-panel-estante .mc-vitrina { width:100%; height:112px; aspect-ratio:auto; }
.eb-drawer-root .mc-panel-estante .mc-vitrina img { width:78%; height:78%; object-fit:contain; }
.eb-drawer-root .mc-panel-estante .mc-tarjeta-nombre { font-size:13px; font-weight:600; line-height:1.3; color:#161514!important; min-height:34px; }
.eb-drawer-root .mc-panel-estante .mc-tarjeta-pie { display:flex; justify-content:space-between; gap:4px; align-items:center; margin-top:auto; }
.eb-drawer-root .mc-panel-estante .mc-precio { font-size:13px; font-variant-numeric:tabular-nums; }
.eb-drawer-root .mc-panel-estante .mc-icono { width:34px; height:34px; flex:none; }
.eb-drawer-root .mc-panel-estante .mc-precio del { display:none; }
.eb-drawer-root .mc-panel-vacio { display:flex; flex-direction:column; align-items:center; justify-content:center; flex:1; gap:21px; }
.eb-drawer-root .mc-panel-item.eb-quitando { pointer-events:none; opacity:.5; }
.eb-drawer-root .mc-panel-item.mc-recien-agregado::after { content:''; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 0 2px rgba(31,138,114,.35),0 0 0 5px rgba(31,138,114,.08); pointer-events:none; animation:eb-agregado-brillo 1.5s ease-out both; }
@keyframes eb-agregado-brillo { from { opacity:1; } to { opacity:0; } }
@media(max-width:720px) { .eb-drawer-dim span { display:none; } .eb-drawer-head { padding:16px 16px 13px; } .eb-drawer-title { font-size:18px; } .eb-drawer-body { padding:0 16px 16px; } .eb-drawer-root .mc-panel-fila .mc-precio { font-size:14px; } }
@media(max-height:720px) { .eb-drawer-root .mc-panel-estante .mc-vitrina { height:64px; } .eb-drawer-root .mc-panel-estante .mc-tarjeta-nombre { min-height:17px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .eb-drawer-root .mc-panel-estante .mc-tarjeta { flex-basis:132px; } .eb-drawer-head { padding-top:13px; padding-bottom:10px; } .eb-drawer-body { gap:8px; } }
@media(prefers-reduced-motion:reduce) { .eb-drawer-root *,.eb-drawer-root *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
/* Ajustes finos (1-oct): todo el contenido por encima del velo blanco del panel (las sugerencias y el botón se veían lavados); sin marco al abrir; flechas centradas. */
.eb-drawer-root .eb-drawer > * { position:relative; z-index:1; }
.eb-drawer-root .eb-drawer:focus, .eb-drawer-root .eb-drawer:focus-visible { outline:none!important; }
.eb-drawer-root .mc-panel-rutina-cabeza button { display:inline-grid; place-items:center; font-size:0; }
.eb-drawer-root .mc-panel-rutina-cabeza button svg { width:18px; height:18px; }
/* El desvanecido del suelo de .mc-mundo no va en el panel; las fotos se quedaban con visibility:hidden al abrir. */
body .eb-drawer-root.mc-mundo::after { content:none !important; }
/* Igual con el aviso inferior del carrito: en la portada el desvanecido lo dejaba deslavado. */
body .mc-tienda-aviso.mc-mundo::after { content:none !important; }
/* El brillo de cristal (::before, z 1) quedaba encima del texto fuera de la tienda: el contenido siempre arriba. */
.mc-tienda-aviso.mc-mundo > * { position: relative; z-index: 2; }
.eb-drawer-root.is-open .mc-panel-foto, .eb-drawer-root.is-open .mc-panel-foto img { visibility:visible; }

/* Estado de carga compartido: el clic se captura también con teclado. */
a.eb-ocupado, button.eb-ocupado { position: relative; cursor: progress; }
a.eb-ocupado { pointer-events: auto; }
a.eb-ocupado > svg { visibility: hidden; }
.eb-agregar-carga {
  display: inline-block; width: 16px; height: 16px; box-sizing: border-box;
  border: 2px solid rgba(31,138,114,.2); border-top-color: #1f8a72; border-radius: 50%;
  animation: eb-agregar-gira .7s linear infinite;
}
a .eb-agregar-carga { position: absolute; left: calc(50% - 8px); top: calc(50% - 8px); }
button .eb-agregar-carga { margin-inline-start: 8px; vertical-align: middle; }
@keyframes eb-agregar-gira { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .eb-agregar-carga { animation: none; } }

/* Aviso persistente tras agregar: el cristal limpio del buscador, sin sombra larga. */
.mc-tienda-aviso.mc-mundo {
  position: fixed; z-index: 99991; left: 0; right: 0; margin-inline: auto; bottom: calc(16px + env(safe-area-inset-bottom));
  width: calc(100% - 32px); max-width: 720px; box-sizing: border-box;
  display: grid; grid-template-columns: minmax(0, 1fr) 44px; gap: var(--mc-e3);
  padding: var(--mc-e3); border-radius: var(--mc-r-pieza);
  background: rgba(255,255,255,.42);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.7), inset 0 1px 0 rgba(255,255,255,.95), 0 1px 2px rgba(22,21,20,.04);
}
.mc-tienda-aviso[hidden] { display: none; }
.mc-tienda-aviso:not([hidden]) { animation: mc-tienda-aviso-entra .24s var(--mc-curva-entrada) backwards; }
.mc-tienda-aviso-cuerpo { grid-column: 1; display: flex; flex-direction: column; gap: var(--mc-e2); min-width: 0; }
.mc-tienda-aviso-titulo { font-size: 14px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.mc-tienda-aviso .mc-nota { font-size: 13px; line-height: 1.4; }
.mc-tienda-aviso-progreso { height: 6px; overflow: hidden; border-radius: var(--mc-r-pildora); background: rgba(22,21,20,.08); }
.mc-tienda-aviso-progreso i { display: block; height: 100%; background: var(--mc-acento); transform-origin: left; transform: scaleX(var(--eb-avance, 0)); transition: transform .24s var(--mc-curva-entrada); }
.mc-tienda-aviso .mc-boton { grid-column: 1; min-height: 44px; }
.mc-tienda-aviso-cerrar { grid-column: 2; grid-row: 1; align-self: start; }
.mc-tienda.mc-con-aviso .mc-secciones { padding-bottom: calc(var(--mc-e5) + var(--mc-aviso-alto, 200px) + 32px + env(safe-area-inset-bottom)); }
@keyframes mc-tienda-aviso-entra {
  from { opacity: 0; translate: 0 var(--mc-e3); }
  to { opacity: 1; translate: 0 0; }
}
@media (min-width: 768px) {
  .mc-tienda-aviso.mc-mundo { grid-template-columns: minmax(0, 1fr) auto 44px; align-items: center; padding: var(--mc-e3) var(--mc-e3) var(--mc-e3) var(--mc-e4); border-radius: var(--mc-r-pildora); }
  .mc-tienda-aviso .mc-boton { grid-column: 2; grid-row: 1; }
  .mc-tienda-aviso-cerrar { grid-column: 3; align-self: center; }
}
@media (prefers-reduced-motion: reduce) {
  .mc-tienda-aviso:not([hidden]) { animation: none; }
  .mc-tienda-aviso-progreso i { transition: none; }
}