:root{
  --cart-ink:#102b46;
  --cart-muted:#607589;
  --cart-line:#d7e4ee;
  --cart-surface:#fbfdff;
  --cart-soft:#eef6fb;
  --cart-brand:#004c97;
  --cart-accent:#008e3b;
  --cart-ease:cubic-bezier(.22,1,.36,1);
}

body.cart-is-open{overflow:hidden}

.cart-drawer{
  width:min(440px,100%);
  max-width:none;
  height:100dvh;
  max-height:none;
  margin:0 0 0 auto;
  padding:0;
  border:0;
  background:var(--cart-surface);
  color:var(--cart-ink);
  box-shadow:-22px 0 60px rgba(0,43,92,.2);
  overflow:hidden;
}
.cart-drawer[open]{animation:cart-enter .34s var(--cart-ease) both}
.cart-drawer::backdrop{background:rgba(5,30,55,.48);backdrop-filter:blur(3px)}
@keyframes cart-enter{from{opacity:.4;transform:translateX(44px)}to{opacity:1;transform:translateX(0)}}

.cart-drawer-shell{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100%}
.cart-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:76px;padding:1rem 1.25rem;border-bottom:1px solid var(--cart-line);background:linear-gradient(180deg,#f8fcff,#f1f8fc)}
.cart-drawer-title{display:grid;gap:.08rem}
.cart-drawer-title strong{font-size:1.18rem;line-height:1.25;letter-spacing:-.02em}
.cart-drawer-title span{color:var(--cart-muted);font-size:.78rem}
.cart-close{width:44px;height:44px;display:grid;place-items:center;flex:none;border:1px solid var(--cart-line);border-radius:50%;background:#edf5fa;cursor:pointer;transition:transform .14s var(--cart-ease),background .14s linear}
.cart-close:hover{background:#dfeef7;transform:rotate(4deg)}
.cart-close img{width:16px;height:16px;filter:invert(25%) sepia(55%) saturate(1480%) hue-rotate(176deg) brightness(76%)}

.cart-drawer-body{overflow:auto;padding:1rem 1.25rem 1.5rem;overscroll-behavior:contain}
.cart-empty{display:grid;align-content:center;justify-items:center;gap:.65rem;min-height:54vh;padding:2rem;text-align:center}
.cart-empty strong{font-size:1.15rem;color:var(--cart-ink)}
.cart-empty p{max-width:32ch;color:var(--cart-muted);font-size:.9rem;line-height:1.6}
.cart-empty a{min-height:44px;display:inline-flex;align-items:center;justify-content:center;margin-top:.4rem;padding:.65rem 1.1rem;border-radius:999px;background:var(--cart-brand);color:#f8fcff;font-size:.86rem;font-weight:750}

.cart-items{display:grid;gap:.9rem}
.cart-item{display:grid;grid-template-columns:76px minmax(0,1fr);gap:.85rem;padding-bottom:.9rem;border-bottom:1px solid var(--cart-line)}
.cart-item-media{width:76px;height:84px;border-radius:12px;overflow:hidden;background:var(--cart-soft);border:1px solid #dce8f1}
.cart-item-media img{width:100%;height:100%;object-fit:cover}
.cart-item-copy{min-width:0;display:grid;gap:.42rem}
.cart-item-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem;align-items:start}
.cart-item-name{color:var(--cart-ink);font-size:.87rem;font-weight:750;line-height:1.35}
.cart-item-price{color:var(--cart-brand);font-size:.85rem;font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
.cart-item-meta{color:var(--cart-muted);font-size:.72rem}
.cart-item-actions{display:flex;align-items:center;justify-content:space-between;gap:.65rem}
.cart-quantity{display:grid;grid-template-columns:36px 36px 36px;align-items:center;border:1px solid #cadbe8;border-radius:999px;background:#f4f9fc;overflow:hidden}
.cart-quantity button{width:36px;height:36px;display:grid;place-items:center;border:0;background:transparent;cursor:pointer}
.cart-quantity button:hover{background:#dfedf6}
.cart-quantity img{width:12px;height:12px;filter:invert(25%) sepia(55%) saturate(1480%) hue-rotate(176deg) brightness(76%)}
.cart-quantity output{text-align:center;color:var(--cart-ink);font-size:.8rem;font-weight:800;font-variant-numeric:tabular-nums}
.cart-remove{min-height:36px;padding:.25rem .2rem;border:0;background:transparent;color:#a33232;font-size:.75rem;font-weight:700;cursor:pointer}
.cart-remove:hover{text-decoration:underline;text-underline-offset:3px}

.cart-drawer-foot{display:grid;gap:.85rem;padding:1rem 1.25rem max(1.25rem,env(safe-area-inset-bottom));border-top:1px solid var(--cart-line);background:#f7fbfe}
.cart-subtotal{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}
.cart-subtotal span{color:var(--cart-muted);font-size:.84rem;font-weight:650}
.cart-subtotal strong{color:var(--cart-ink);font-size:1.35rem;font-variant-numeric:tabular-nums}
.cart-policy{color:var(--cart-muted);font-size:.72rem;line-height:1.5}
.cart-drawer-actions{display:grid;gap:.55rem}
.cart-order-link{min-height:48px;display:flex;align-items:center;justify-content:center;padding:.75rem 1rem;border-radius:12px;background:linear-gradient(135deg,var(--cart-brand),#0063ba);color:#f8fcff;font-size:.9rem;font-weight:800;box-shadow:0 8px 18px rgba(0,76,151,.18);transition:transform .18s var(--cart-ease),box-shadow .18s var(--cart-ease)}
.cart-order-link:hover{transform:translateY(-1px);box-shadow:0 11px 24px rgba(0,76,151,.24)}
.cart-continue{min-height:44px;border:1px solid #bfd4e2;border-radius:12px;background:#f5fafc;color:var(--cart-brand);font-size:.82rem;font-weight:800;cursor:pointer;transition:background .18s linear,border-color .18s linear}
.cart-continue:hover{border-color:#95bfd7;background:#eaf4f9}

.cart-toast{position:fixed;left:50%;bottom:max(1.25rem,env(safe-area-inset-bottom));z-index:2100;max-width:min(92vw,430px);padding:.75rem 1rem;border:1px solid #b8d7c4;border-radius:12px;background:#edf9f1;color:#165e31;font-size:.86rem;font-weight:750;box-shadow:0 14px 30px rgba(0,43,92,.16);opacity:0;pointer-events:none;transform:translate(-50%,16px);transition:opacity .2s linear,transform .28s var(--cart-ease)}
.cart-toast.show{opacity:1;transform:translate(-50%,0)}

.cart-drawer button:focus-visible,.cart-drawer a:focus-visible{outline:3px solid #4bb8e3;outline-offset:2px}

@media(max-width:520px){
  .cart-drawer{width:100%}
  .cart-drawer-head{min-height:68px;padding:.8rem 1rem}
  .cart-drawer-body,.cart-drawer-foot{padding-inline:1rem}
}

@media(prefers-reduced-motion:reduce){
  .cart-drawer[open]{animation:none}
  .cart-toast,.cart-order-link,.cart-continue,.cart-close{transition:none}
}

/* Floating WhatsApp assistance */
.whatsapp-assist{
  position:fixed;
  right:max(18px,env(safe-area-inset-right));
  bottom:max(18px,env(safe-area-inset-bottom));
  z-index:1200;
  display:flex;
  align-items:center;
  color:#fff;
  text-decoration:none;
  isolation:isolate;
  filter:drop-shadow(0 12px 20px rgba(0,43,92,.19));
  animation:whatsapp-assist-enter .48s var(--cart-ease) .55s both;
}
.whatsapp-assist-label{
  min-height:40px;
  margin-right:-8px;
  padding:.6rem 1.05rem .6rem .78rem;
  display:flex;
  align-items:center;
  gap:.5rem;
  border:1px solid #1264a4;
  border-right:0;
  border-radius:14px 0 0 14px;
  background:linear-gradient(110deg,#003f7d 0%,#075daa 70%,#5134c8 100%);
  color:#f8fcff;
  font-size:.76rem;
  font-weight:800;
  line-height:1;
  letter-spacing:.01em;
  white-space:nowrap;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16);
}
.whatsapp-assist-dot{
  width:6px;
  height:6px;
  flex:0 0 auto;
  border-radius:50%;
  background:#45de7b;
  box-shadow:0 0 0 3px rgba(69,222,123,.16);
}
.whatsapp-assist-icon{
  position:relative;
  z-index:1;
  width:52px;
  height:52px;
  flex:0 0 52px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid transparent;
  border-radius:16px 16px 24px 16px;
  background:linear-gradient(145deg,#fff 20%,#f2f9ff 100%) padding-box,linear-gradient(135deg,#00a6ff,#5640db 48%,#ef2786 74%,#27c566) border-box;
  box-shadow:inset 0 1px 0 #fff,0 8px 18px rgba(0,76,151,.14);
}
.whatsapp-assist-gif{width:38px;height:38px;display:block;object-fit:contain}
.whatsapp-assist-static{width:27px;height:27px;display:none;fill:#075daa}
.whatsapp-assist:active{transform:scale(.98)}
.whatsapp-assist:focus-visible{outline:3px solid #4bb8e3;outline-offset:4px;border-radius:18px}
.whatsapp-assist--mobile{display:none!important}

@media(hover:hover) and (pointer:fine){
  .whatsapp-assist{transition:transform .22s var(--cart-ease),filter .22s var(--cart-ease)}
  .whatsapp-assist:hover{transform:translateY(-3px);filter:drop-shadow(0 15px 24px rgba(0,43,92,.26))}
}

@media(max-width:760px){
  .product-page .whatsapp-assist{bottom:var(--whatsapp-assist-mobile-bottom,calc(86px + env(safe-area-inset-bottom)))}
}

@media(max-width:520px){
  .whatsapp-assist{right:max(12px,env(safe-area-inset-right));bottom:var(--whatsapp-assist-mobile-bottom,max(12px,env(safe-area-inset-bottom)))}
  .whatsapp-assist-label{min-height:38px;padding:.56rem .98rem .56rem .7rem;font-size:.68rem}
  .whatsapp-assist-icon{width:46px;height:46px;flex-basis:46px;border-radius:14px 14px 21px 14px}
  .whatsapp-assist-gif{width:34px;height:34px}
  .product-page .whatsapp-assist{bottom:var(--whatsapp-assist-mobile-bottom,calc(84px + env(safe-area-inset-bottom)))}
}

@media(max-width:767.98px), (max-height:500px) and (pointer:coarse){
  body>.whatsapp-assist:not(.whatsapp-assist--mobile),
  body>.shop-whatsapp{display:none!important}
  body>.whatsapp-assist--mobile{
    right:max(12px,env(safe-area-inset-right));
    bottom:var(--whatsapp-assist-mobile-bottom,max(12px,env(safe-area-inset-bottom)));
    z-index:1490;
    display:flex!important;
    max-width:calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right));
    animation:whatsapp-assist-mobile-enter .28s var(--cart-ease) .1s both;
  }
}

@media(prefers-reduced-motion:reduce){
  .whatsapp-assist,
  body>.whatsapp-assist--mobile{animation:none;transition:none}
  .whatsapp-assist:hover,.whatsapp-assist:active{transform:none}
  .whatsapp-assist-gif{display:none}
  .whatsapp-assist-static{display:block}
}

@keyframes whatsapp-assist-enter{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes whatsapp-assist-mobile-enter{
  from{opacity:0}
  to{opacity:1}
}
