/* Carrito flotante en móvil (≤768px): barra inferior + hoja con el resumen.
   Escritorio (>768px): sin cambios — el resumen sigue dentro de "Tu selección".
   Componente compartido por Caravista, Repellables y Fachaletas (ver cart-sheet.js). */

/* El contenedor no altera el layout del sidebar en escritorio. */
.cart-summary{ display:contents; }

.cart-bar,
.cart-sheet,
.cart-sheet-overlay{ display:none; }

@media (max-width:768px){
  /* ---- Barra flotante (pill) ---- */
  .cart-bar{
    position:fixed;
    left:12px;
    /* deja libre la columna derecha para los botones flotantes (chat y WhatsApp) */
    right:76px;
    bottom:calc(var(--cart-bar-bottom, 12px) + var(--cart-bar-safe, env(safe-area-inset-bottom, 0px)));
    z-index:66;
    display:flex;
    align-items:center;
    gap:10px;
    min-height:52px;
    padding:0 16px;
    border:0;
    border-radius:26px;
    background:var(--brick);
    color:#fff;
    font-family:'Space Grotesk', sans-serif;
    font-size:13px;
    font-weight:500;
    letter-spacing:0.02em;
    text-align:left;
    box-shadow:0 8px 24px rgba(0,0,0,0.45);
    -webkit-tap-highlight-color:transparent;
  }
  .cart-bar[hidden]{ display:none !important; }
  .cart-bar:focus-visible{ outline:2px solid var(--plaster); outline-offset:3px; }
  .cart-bar svg{ width:20px; height:20px; flex:none; }
  .cart-bar__text{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .cart-bar.is-pulse{ animation:cartBarPulse 0.4s ease; }
  @keyframes cartBarPulse{
    0%{ transform:scale(1); }
    40%{ transform:scale(1.05); }
    100%{ transform:scale(1); }
  }

  /* Espacio para que la barra no tape el pie de página */
  body.has-cart-bar{
    padding-bottom:calc(var(--cart-bar-stack, 76px) + var(--cart-bar-safe, env(safe-area-inset-bottom, 0px)));
  }
  /* La confirmación "Producto agregado" se apoya encima de la barra */
  body.has-cart-bar .cart-toast{
    left:12px;
    right:76px;                 /* misma columna libre que la barra: no tapa chat ni WhatsApp */
    width:auto;
    bottom:calc(var(--cart-bar-bottom, 12px) + var(--cart-bar-safe, env(safe-area-inset-bottom, 0px)) + 64px);
  }
  /* Mientras haya otra hoja abierta (filtros / "Tu selección") no se muestra la barra */
  body.selection-drawer-open .cart-bar,
  body.mobile-filters-open .cart-bar{ display:none !important; }

  /* ---- Hoja inferior ---- */
  .cart-sheet-overlay{
    position:fixed;
    inset:0;
    z-index:210;
    display:block;
    background:rgba(0,0,0,0.66);
    opacity:0;
    visibility:hidden;
    transition:opacity 0.25s ease, visibility 0s linear 0.25s;
  }
  .cart-sheet-overlay.is-open{
    opacity:1;
    visibility:visible;
    transition:opacity 0.25s ease;
  }
  .cart-sheet{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:220;
    display:flex;
    flex-direction:column;
    max-height:88vh;
    max-height:88dvh;
    padding-bottom:env(safe-area-inset-bottom, 0px);
    background:#171512;
    border:1px solid var(--line-on-dark);
    border-bottom:0;
    border-radius:18px 18px 0 0;
    box-shadow:0 -18px 50px rgba(0,0,0,0.5);
    transform:translateY(100%);
    visibility:hidden;
    transition:transform 0.25s ease, visibility 0s linear 0.25s;
  }
  .cart-sheet.is-open{
    transform:translateY(0);
    visibility:visible;
    transition:transform 0.25s ease;
  }
  .cart-sheet:focus{ outline:none; }
  .cart-sheet__grip{
    flex:none;
    width:40px;
    height:4px;
    margin:10px auto 0;
    border-radius:2px;
    background:var(--line-on-dark);
  }
  .cart-sheet__head{
    flex:none;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:4px 14px 0 18px;
  }
  .cart-sheet__undo,
  .cart-sheet__close{
    min-height:44px;
    border:0;
    background:none;
    color:var(--sand);
    font-family:'Space Grotesk', sans-serif;
    font-size:11px;
    letter-spacing:0.06em;
    text-transform:uppercase;
  }
  .cart-sheet__undo{ padding:0 4px; }
  .cart-sheet__undo[hidden]{ display:none; }
  .cart-sheet__close{
    margin-left:auto;
    width:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--line-on-dark);
    border-radius:50%;
    min-height:44px;
  }
  .cart-sheet__close svg{ width:20px; height:20px; }
  .cart-sheet__undo:focus-visible,
  .cart-sheet__close:focus-visible{ outline:2px solid var(--sand); outline-offset:2px; }
  .cart-sheet__body{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:6px 18px 20px;
  }
  .cart-sheet__body .cart-summary{
    display:flex;
    flex-direction:column;
    gap:14px;
  }
  .cart-sheet__body .cart-list{ max-height:none; overflow:visible; }
  /* estilos que en la página dependían de estar dentro de .sidebar */
  .cart-sheet h3{
    font-family:'Fraunces', serif;
    font-weight:400;
    font-size:17px;
    display:flex;
    align-items:center;
    gap:8px;
  }
  .cart-sheet .badge{
    background:var(--brick);
    color:#fff;
    font-family:'Space Grotesk', sans-serif;
    font-size:10.5px;
    width:18px;
    height:18px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .cart-sheet .cart-del svg{ width:15px; height:15px; }

  /* Bloquea el desplazamiento del fondo mientras la hoja está abierta */
  html.cart-sheet-open,
  html.cart-sheet-open body{ overflow:hidden; }
}

@media (min-width:601px) and (max-width:768px){
  .cart-bar,
  body.has-cart-bar .cart-toast{ right:92px; }
}

@media (prefers-reduced-motion:reduce){
  .cart-sheet,
  .cart-sheet-overlay{ transition:none; }
  .cart-bar.is-pulse{ animation:none; }
}