/* ═══════════════════════════════════════════════════════════
   CARRITO LATERAL + animación de agregar
   ═══════════════════════════════════════════════════════════ */
.vic-drawer-scrim{position:fixed;inset:0;z-index:90;background:rgba(6,20,28,.5);
  backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .25s}
.vic-drawer-scrim.on{opacity:1;pointer-events:auto}
.vic-drawer{position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);z-index:91;
  background:var(--vic-papel);display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .32s cubic-bezier(.16,1,.3,1);
  box-shadow:-24px 0 60px -30px rgba(6,20,28,.6)}
.vic-drawer.on{transform:none}
.vic-drawer.ocupado{opacity:.6;pointer-events:none}
.vic-drawer header{display:flex;align-items:center;justify-content:space-between;
  padding:20px 22px;border-bottom:1px solid var(--vic-linea);flex:0 0 auto}
.vic-drawer header h2{font-size:1.15rem!important;margin:0!important}
.vic-drawer .cerrar{width:34px;height:34px;border:0;border-radius:50%;background:var(--vic-fondo);
  color:var(--vic-mute);cursor:pointer;display:flex;align-items:center;justify-content:center}
.vic-drawer .cerrar:hover{background:var(--vic-soft);color:var(--vic-azul)}
.vic-drawer .cuerpo{flex:1;overflow-y:auto;padding:8px 22px}
.vic-drawer .linea{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:6px 12px;
  padding:16px 0;border-bottom:1px solid var(--vic-linea);align-items:start}
.vic-drawer .linea:last-child{border-bottom:0}
.vic-drawer .mini{grid-column:1;grid-row:1/3}
.vic-drawer .mini img{width:58px!important;height:58px;border-radius:12px;background:var(--vic-soft);
  object-fit:contain!important;padding:12px;max-height:none!important;max-width:none!important;opacity:1!important}
.vic-drawer .txt{grid-column:2;grid-row:1/3;min-width:0}
.vic-drawer .txt a{display:block;font-size:14px;font-weight:700;color:var(--vic-tinta);
  text-decoration:none;line-height:1.3;overflow-wrap:anywhere}
.vic-drawer .txt a:hover{color:var(--vic-azul)}
.vic-drawer .lab{display:block;font-size:11.5px;color:var(--vic-mute);margin-top:2px}
.vic-drawer .qty{display:inline-flex;align-items:center;border:1px solid var(--vic-linea);
  border-radius:999px;margin-top:9px;overflow:hidden}
.vic-drawer .qty button{width:32px;height:32px;border:0;background:none;color:var(--vic-azul);
  font-size:18px;cursor:pointer;line-height:1}
.vic-drawer .qty button:hover{background:var(--vic-soft)}
.vic-drawer .qty .valor{min-width:38px;text-align:center;font-weight:800;font-size:14px;
  color:var(--vic-tinta);font-variant-numeric:tabular-nums}
.vic-drawer .der{grid-column:3;grid-row:1/3;text-align:right;display:flex;flex-direction:column;
  align-items:flex-end;justify-content:space-between;gap:10px;min-height:64px}
.vic-drawer .sub{font-weight:800;color:var(--vic-tinta);font-size:15px;white-space:nowrap;
  font-variant-numeric:tabular-nums}
.vic-drawer .quitar{border:0;background:none;color:var(--vic-mute);font-size:12px;cursor:pointer;
  text-decoration:underline;padding:0}
.vic-drawer .quitar:hover{color:#B26B00}
.vic-drawer .vacio{text-align:center;padding:60px 20px;color:var(--vic-mute)}
.vic-drawer .vacio a{display:inline-block;margin-top:14px;padding:12px 24px;border-radius:999px;
  background:var(--vic-azul);color:#fff;text-decoration:none;font-weight:700;font-size:14px}
.vic-drawer footer{flex:0 0 auto;border-top:1px solid var(--vic-linea);padding:18px 22px;
  padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}
.vic-drawer .total{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}
.vic-drawer .total span{color:var(--vic-mute);font-size:14px}
.vic-drawer .total b{font-size:1.45rem;color:var(--vic-tinta);letter-spacing:-.04em;
  font-variant-numeric:tabular-nums}
.vic-drawer .wa{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  box-sizing:border-box;padding:15px 12px;border-radius:999px;background:var(--vic-teal);
  color:#04241E;font-weight:700;font-size:15px;text-decoration:none;
  min-width:0;text-align:center;line-height:1.25}
.vic-drawer .wa svg{flex:0 0 auto}
.vic-drawer .wa:hover{background:var(--vic-teal-osc);color:#fff}
.vic-drawer .nota{margin-top:11px;font-size:12px;color:var(--vic-mute);line-height:1.45;text-align:center}
@media(max-width:600px){
  .vic-drawer{width:78%;min-width:262px;border-radius:0}
  .vic-drawer .wa{font-size:14px;padding:14px 10px;gap:8px}
  .vic-drawer footer{padding-left:15px;padding-right:15px}
  .vic-drawer .cuerpo{padding:6px 16px}
  .vic-drawer header,.vic-drawer footer{padding-left:16px;padding-right:16px}
}

/* ── cantidad dentro de la tarjeta del catálogo ─────────────── */
.vic-card-qty{display:inline-flex;align-items:center;border:1px solid var(--vic-linea);
  border-radius:999px;overflow:hidden;margin-top:10px;background:var(--vic-papel)}
.vic-card-qty button{width:32px;height:34px;border:0;background:none;color:var(--vic-azul);
  font-size:17px;line-height:1;cursor:pointer}
.vic-card-qty button:hover:not(:disabled){background:var(--vic-soft)}
.vic-card-qty button:disabled{opacity:.3;cursor:default}
.vic-card-qty .valor{min-width:36px;text-align:center;font-weight:800;font-size:13.5px;
  color:var(--vic-tinta);font-variant-numeric:tabular-nums}

/* ── animación de agregar: antes no se notaba nada ─────────── */
@keyframes vicPulso{0%{transform:scale(1)}45%{transform:scale(.95)}100%{transform:scale(1)}}
@keyframes vicGiro{to{transform:rotate(360deg)}}
.woocommerce ul.products li.product a.button,
.single-product form.cart button.button{position:relative;overflow:hidden;
  transition:background .2s,transform .18s cubic-bezier(.16,1,.3,1),box-shadow .2s}
.woocommerce ul.products li.product a.button:active,
.single-product form.cart button.button:active{transform:scale(.97)}
.woocommerce ul.products li.product a.button:hover,
.single-product form.cart button.button:hover{transform:translateY(-1px);
  box-shadow:0 10px 22px -12px rgba(0,114,187,.8)}
.cargando{color:transparent!important;pointer-events:none}
.cargando::after{content:"";position:absolute;inset:0;margin:auto;width:17px;height:17px;
  border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;
  animation:vicGiro .6s linear infinite}
/* El texto propio del botón se esconde con color:transparent, igual que en
   .cargando. Antes se hacía con font-size:0, pero la regla del catálogo
   (.woocommerce ul.products li.product a.button{font-size:12.5px!important})
   tiene más especificidad y ganaba: "Añadir" seguía visible debajo de
   "✓ Agregado". Con color no hay pelea de especificidad que valga. */
.listo{background:var(--vic-teal)!important;color:transparent!important;
  animation:vicPulso .45s ease}
.listo *{color:transparent!important}
.listo::after{content:"✓ Agregado";position:absolute;inset:0;display:flex;align-items:center;
  justify-content:center;font-weight:700;font-size:13.5px;color:#04241E!important;
  white-space:nowrap}
/* el contador de la barra inferior salta al agregar */
.vic-tabbar .badge.late{animation:vicPulso .5s ease}