/* ComboMatanot Upsell Slide (RTL) */
.cm-upsell-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.25);
  opacity:0; pointer-events:none; transition:opacity .2s ease;
  z-index:99998;
}
.cm-upsell-overlay.is-open{opacity:1; pointer-events:auto;}

.cm-upsell-drawer{
  position:fixed;
  top:0;
  left:0; /* RTL desktop: drawer from left */
  height:100vh;
  /* Desktop: compact drawer */
  width:360px;
  max-width:420px;
  background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  transform:translateX(-105%);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:transform .25s ease, opacity .16s ease, visibility 0s linear .25s;
  z-index:99999;
  display:flex;
  flex-direction:column;
  will-change:transform;
}
.cm-upsell-drawer.is-open{
  transform:translateX(0);
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s;
}
.cm-upsell-drawer.cm-upsell-noanim{transition:none !important;}
.cm-upsell-overlay.cm-upsell-noanim{transition:none !important;}

.cm-upsell-header{display:flex; align-items:center; justify-content:space-between; padding:14px 14px 10px; border-bottom:1px solid rgba(0,0,0,.08);} 
.cm-upsell-title{font-size:16px; font-weight:700;}
.cm-upsell-close{border:0; background:transparent; font-size:22px; line-height:1; cursor:pointer; padding:4px 8px;}

.cm-upsell-body{padding:10px 14px; overflow:auto; flex:1;}
.cm-upsell-loading{opacity:.75;}

.cm-upsell-items{display:flex; flex-direction:column; gap:10px;}

.cm-upsell-item{display:flex; align-items:center; gap:10px; border:1px solid rgba(0,0,0,.08); border-radius:12px; padding:10px;}
.cm-upsell-item input{margin:0; width:18px; height:18px;}
.cm-upsell-thumb{width:54px; height:54px; border-radius:10px; object-fit:cover; flex:0 0 54px;}
.cm-upsell-main{display:flex; align-items:flex-start; justify-content:space-between; gap:10px; width:100%;}
.cm-upsell-name{font-size:14px; font-weight:600; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; white-space:normal; line-height:1.25;}
.cm-upsell-price{font-size:14px; font-weight:700; white-space:nowrap; flex:0 0 auto;}

.cm-upsell-actions{
  display:flex;
  gap:10px;
  padding:10px 14px;
  border-top:1px solid rgba(0,0,0,.08);
  background:#fff;
  position:sticky;
  bottom:0;
} 
.cm-upsell-btn{flex:1; border:0; border-radius:12px; padding:12px 10px; cursor:pointer; font-weight:700;}
.cm-upsell-add{background:#111; color:#fff;}
.cm-upsell-continue{background:rgba(0,0,0,.06);}

/* Mobile: bottom sheet up to 40% of screen */

@media (min-width: 769px){
  /* Desktop hybrid: dynamic height + compact cards */
  .cm-upsell-drawer{
    top:80px;
    height:auto;
    max-height:80vh;
    border-radius:18px;
    overflow:auto; /* allow scrolling only if content is tall */
  }
  .cm-upsell-body{
    flex:0;
    overflow:visible;
  }
  .cm-upsell-items{gap:8px;}
  .cm-upsell-item{
    border:0;
    background:rgba(0,0,0,.03);
    padding:8px 10px;
    border-radius:14px;
  }
  /* Keep actions visible when drawer scrolls */
  .cm-upsell-actions{
    position:sticky;
    bottom:0;
  }
}

@media (max-width: 768px){
  .cm-upsell-name{white-space:nowrap; -webkit-line-clamp:1; display:block; text-overflow:ellipsis;}
  .cm-upsell-main{align-items:center;}
  .cm-upsell-drawer{
    left:0; right:0; top:auto; bottom:0;
    width:100vw;
    height:min(40vh, 360px);
    border-top-left-radius:16px;
    border-top-right-radius:16px;
    transform:translateY(105%);
  }
  .cm-upsell-drawer.is-open{
    transform:translateY(0);
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }

  /* Keep action buttons always visible on mobile */
  .cm-upsell-actions{position:sticky; bottom:0;}
}


/* Collapsed pill (mobile) */
.cm-upsell-pill{
  position:fixed;
  right:14px;
  bottom:14px;
  z-index:100000;
  background:#111;
  color:#fff;
  border-radius:999px;
  padding:10px 14px;
  font-weight:700;
  font-size:13px;
  box-shadow:0 10px 25px rgba(0,0,0,.25);
  display:none;
  cursor:pointer;
  user-select:none;
}
.cm-upsell-pill.is-open{display:block;}
