/* =========================================================
   Carro lateral deslizante
   ========================================================= */
.imp-drawer-overlay{position:fixed;inset:0;background:rgba(16,16,24,.45);opacity:0;transition:opacity .28s ease;z-index:9998;}
.imp-drawer-overlay.is-open{opacity:1;}
body.imp-drawer-open{overflow:hidden;}

.imp-drawer{position:fixed;top:0;right:0;bottom:0;width:min(430px,100vw);background:#fff;z-index:9999;
  display:flex;flex-direction:column;transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);
  box-shadow:-12px 0 40px rgba(16,16,24,.18);}
.imp-drawer.is-open{transform:translateX(0);}
.imp-drawer.is-busy{opacity:.6;pointer-events:none;}

/* Variante izquierda: añade la clase imp-drawer--left al <aside>. */
.imp-drawer--left{right:auto;left:0;transform:translateX(-100%);box-shadow:12px 0 40px rgba(16,16,24,.18);}
.imp-drawer--left.is-open{transform:translateX(0);}

.imp-drawer__head{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:22px 24px;border-bottom:1px solid var(--imp-border);}
.imp-drawer__head h2{font-family:var(--imp-font-head);font-size:19px;font-weight:600;margin:0;}
.imp-drawer__head span{color:var(--imp-muted);font-weight:400;}
.imp-drawer__close{background:none;border:0;font-size:30px;line-height:1;color:var(--imp-muted);cursor:pointer;padding:0 4px;}
.imp-drawer__close:hover{color:var(--imp-black);}

.imp-drawer__content{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.imp-drawer__items{list-style:none;margin:0;padding:8px 24px;overflow-y:auto;flex:1;}
.imp-drawer__item{display:grid;grid-template-columns:76px 1fr 24px;gap:14px;align-items:start;
  padding:18px 0;border-bottom:1px solid var(--imp-border);}
.imp-drawer__thumb{display:block;border-radius:10px;overflow:hidden;background:var(--imp-card);}
.imp-drawer__thumb img{width:100%;height:76px;object-fit:cover;display:block;}
.imp-drawer__name{font-family:var(--imp-font-head);font-size:15px;font-weight:500;color:var(--imp-black);line-height:1.35;}
.imp-drawer__name:hover{color:var(--imp-accent);}
.imp-drawer__meta{font-size:13px;color:var(--imp-muted);margin:5px 0 0;}
.imp-drawer__row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;}
.imp-drawer__price{font-weight:700;font-size:15px;color:var(--imp-black);}
.imp-drawer__remove{background:none;border:0;font-size:22px;line-height:1;color:#B9B9C2;cursor:pointer;padding:0;}
.imp-drawer__remove:hover{color:var(--imp-accent);}

.imp-qty--sm{padding:3px;}
.imp-qty--sm button{width:26px;height:26px;font-size:15px;}
.imp-qty--sm input{width:32px;font-size:14px;}

.imp-drawer__foot{border-top:1px solid var(--imp-border);padding:20px 24px 24px;display:grid;gap:10px;background:#fff;}
.imp-drawer__total{display:flex;align-items:baseline;justify-content:space-between;font-size:15px;}
.imp-drawer__total strong{font-family:var(--imp-font-head);font-size:21px;color:var(--imp-black);}
.imp-drawer__note{font-size:13px;color:var(--imp-muted);margin:0 0 6px;}
.imp-drawer__foot .imp-btn{width:100%;justify-content:center;padding:16px 20px;font-size:15px;}

.imp-drawer__empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  padding:40px 24px;color:var(--imp-muted);text-align:center;}
.imp-drawer__empty p{margin:0;font-size:16px;}
.imp-drawer__empty .imp-btn{min-width:200px;}

.imp-btn.is-loading{opacity:.6;pointer-events:none;}

@media (max-width:520px){
  .imp-drawer{width:100vw;}
  .imp-drawer__item{grid-template-columns:64px 1fr 22px;}
  .imp-drawer__thumb img{height:64px;}
}