/* Capa de interactividad (no altera el diseño base) */
.drawer-back{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:.2s;z-index:200}
.drawer-back.on{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(420px,94vw);background:#fff;box-shadow:-8px 0 34px rgba(0,0,0,.22);transform:translateX(100%);transition:transform .25s;z-index:210;display:flex;flex-direction:column}
.drawer.on{transform:none}
.drawer .dh{font-family:var(--disp,'Barlow Condensed',sans-serif);font-weight:800;font-size:23px;padding:18px 20px;border-bottom:1px solid var(--linea,#e4e4e4);display:flex;justify-content:space-between;align-items:center}
.drawer .x{font-size:26px;color:var(--gris,#71767c);cursor:pointer;line-height:1;padding:0 4px}
.drawer .dbody{flex:1;overflow:auto;padding:6px 20px}
.drawer .empty{color:var(--gris,#71767c);text-align:center;padding:64px 12px;line-height:1.7}
.cline{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--linea,#e4e4e4);align-items:center}
.cline .cph{width:54px;height:54px;flex:none;display:flex;align-items:center;justify-content:center}
.cline .cph img{max-width:54px;max-height:54px;object-fit:contain}
.cline .cnm{font-size:12.5px;font-weight:600;line-height:1.3}
.cline .ccl{font-size:10.5px;color:var(--gris,#71767c);font-family:ui-monospace,monospace;margin-top:2px}
.cline .clt{font-family:var(--disp,sans-serif);font-weight:800;color:var(--naranja,#F15A24);white-space:nowrap;font-size:16px}
.cart-remove{display:inline-block;margin-top:6px;color:#b42318;background:#fff;border:1px solid #f1b8b3;border-radius:5px;padding:4px 9px;font:700 11px var(--body,Arial,sans-serif);cursor:pointer}
.cart-remove:hover,.cart-remove:focus{background:#fff1f0;border-color:#b42318;outline:none}
.stepper .qty-input{width:54px;min-width:0;border:0;border-left:1px solid var(--linea,#e4e4e4);border-right:1px solid var(--linea,#e4e4e4);background:#fff;text-align:center;font:700 14px inherit;color:var(--ink,#1c1c1c);padding:7px 2px;-moz-appearance:textfield}
.stepper .qty-input::-webkit-inner-spin-button,.stepper .qty-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.drawer .dfoot{border-top:1px solid var(--linea,#e4e4e4);padding:16px 20px}
.drawer .tot{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--disp,sans-serif);font-weight:800;font-size:23px;margin-bottom:12px}
.drawer .send{width:100%;background:var(--naranja,#F15A24);color:#fff;font-weight:800;padding:14px;border-radius:8px;font-size:15px;border:none;cursor:pointer}
.drawer .send[disabled]{cursor:wait;opacity:.72}
.drawer .send:hover{background:var(--naranja-h,#d94a17)}
.drawer .cont{width:100%;background:none;color:var(--gris,#71767c);font-weight:700;padding:10px;font-size:13px;border:none;cursor:pointer;margin-top:4px}
.info-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:220;padding:20px;background:rgba(0,0,0,.45)}
.info-modal.on{display:flex}
.info-card{background:#fff;border-radius:14px;max-width:440px;width:100%;padding:26px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.info-card h3{font-family:var(--disp,sans-serif);font-weight:800;font-size:23px;margin-bottom:10px}
.info-card p{color:var(--gris,#71767c);font-size:14px;line-height:1.6}
.info-card .ok{margin-top:18px;background:var(--ink,#1c1c1c);color:#fff;padding:12px 20px;border-radius:8px;font-weight:700;width:100%;border:none;cursor:pointer}