
/* Amar Drawer Cart - Glassy White + Green Logo (v1.1.0) */
:root{
  --adc-bg: rgba(255,255,255,.78);
  --adc-text:#0e1411;
  --adc-muted:#5b6360;
  --adc-border: rgba(0,0,0,.08);
  --adc-shadow: 0 18px 55px rgba(0,0,0,.22);
  --adc-radius: 18px;
  --adc-primary:#106839; /* Amar Shop in BD green */
}

/* Overlay */
.adc-overlay{
  position:fixed; inset:0;
  background:rgba(0,0,0,.45);
  opacity:0; pointer-events:none;
  transition: opacity .2s ease;
  z-index:99990;
}

/* Drawer */
.adc-drawer{
  position:fixed;
  top:0; bottom:0;
  width:min(440px, 92vw);
  background:var(--adc-bg);
  color:var(--adc-text);
  box-shadow:var(--adc-shadow);
  z-index:99991;
  transform:translateX(110%);
  transition: transform .25s ease;
  display:flex;
  flex-direction:column;

  /* glass */
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);

  /* soft border */
  border-left: 1px solid var(--adc-border);
  border-right: 1px solid var(--adc-border);
}

.adc-pos-left{ left:0; transform:translateX(-110%); border-right: 1px solid var(--adc-border); border-left: 0; }
.adc-pos-right{ right:0; border-left: 1px solid var(--adc-border); border-right: 0; }

body.adc-open .adc-overlay{ opacity:1; pointer-events:auto; }
body.adc-open .adc-drawer.adc-pos-right{ transform:translateX(0); }
body.adc-open .adc-drawer.adc-pos-left{ transform:translateX(0); }

/* Header */
.adc-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px;
  border-bottom:1px solid var(--adc-border);
  position:sticky;
  top:0;
  z-index:2;
  background: rgba(255,255,255,.55);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.adc-brand{
  display:flex;
  align-items:center;
  gap:10px;
}

.adc-logo{
  width:40px; height:40px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  letter-spacing:.5px;
  color:var(--adc-primary);
  border:2px solid var(--adc-primary);
  background: rgba(255,255,255,.9);
  user-select:none;
}

.adc-title{
  display:flex; gap:10px;
  align-items:center;
  font-weight:900;
  letter-spacing:.6px;
}

.adc-count{
  font-size:12px;
  background:var(--adc-fab-bg, var(--adc-primary));
  color:#fff;
  padding:2px 10px;
  border-radius:999px;
  font-weight:800;
}

.adc-close{
  width:40px; height:40px;
  border:0; border-radius:14px;
  background: rgba(0,0,0,.06);
  font-size:24px;
  cursor:pointer;
}

/* Body */
.adc-body{
  padding:12px 12px 88px; /* space for checkout bar */
  overflow:auto;
  flex:1;
}

/* left scrollbar trick */
.adc-scroll-left .adc-body{ direction: rtl; }
.adc-scroll-left .adc-body > *{ direction:ltr; }

.adc-empty{
  padding:18px;
  color:var(--adc-muted);
  text-align:center;
}

.adc-items{
  list-style:none;
  padding:0; margin:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* Item row (like screenshot) */
.adc-item{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px;
  border:1px solid var(--adc-border);
  border-radius:16px;
  background: rgba(255,255,255,.65);
}

.adc-thumb-wrap{
  width:56px; height:56px;
  flex:0 0 56px;
  overflow:hidden;
  border-radius:14px;
  border:1px solid var(--adc-border);
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.9);
}
.adc-thumb{ width:100%; height:100%; object-fit:cover; }

.adc-meta{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.adc-name{
  font-weight:900;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.adc-name a{ color:inherit; text-decoration:none; }

.adc-price{
  font-weight:900;
  color:var(--adc-text);
  font-size:14px;
}

/* qty controls */
.adc-qty{
  display:inline-flex;
  align-items:center;
  gap:0;
  border:1px solid var(--adc-border);
  border-radius:10px;
  overflow:hidden;
  width:120px;
  background: rgba(255,255,255,.9);
}

.adc-qty-btn{
  width:36px; height:34px;
  border:0;
  background: rgba(0,0,0,.06);
  cursor:pointer;
  font-size:18px;
  font-weight:900;
}

.adc-qty-input{
  width:48px;
  border:0;
  outline:none;
  text-align:center;
  font-weight:900;
  background: transparent;
  height:34px;
}

/* remove */
.adc-remove{
  position:absolute;
  top:10px; right:10px;
  border:0;
  background:transparent;
  color: rgba(0,0,0,.55);
  font-size:14px;
  cursor:pointer;
}
.adc-remove:hover{ color:#b00020; }

/* subtotal line */
.adc-footer{
  margin-top:12px;
  padding:10px 6px 0;
}
.adc-subtotal-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  color: var(--adc-muted);
  font-weight:800;
}
.adc-subtotal-val{
  color: var(--adc-text);
  font-weight:900;
}

/* Bottom sticky checkout bar */
.adc-checkoutbar{
  position:absolute;
  left:10px; right:10px;
  bottom:12px;
  height:56px;
  border-radius:18px;
  background: rgba(0,0,0,.78);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  box-shadow: 0 18px 45px rgba(0,0,0,.28);
  display:flex;
  align-items:center;
  overflow:hidden;
}

.adc-checkoutbtn{
  flex:1;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-decoration:none;
  color:#fff;
  font-weight:900;
  font-size:16px;
}

.adc-checkoutclose{
  width:56px;
  height:56px;
  border:0;
  background: rgba(255,255,255,.10);
  color:#fff;
  font-size:24px;
  cursor:pointer;
}

/* Floating button */
.adc-fab{
  position:fixed;
  bottom:90px;
  right:16px;
  width:60px;
  height:60px;
  border-radius:20px;
  border:0;
  background:var(--adc-fab-bg, var(--adc-primary));
  color:#fff;
  box-shadow: var(--adc-shadow);
  cursor:pointer;
  z-index:99989;
  display:flex;
  align-items:center;
  justify-content:center;
}
.adc-fab-badge{
  position:absolute;
  top:-8px;
  right:-8px;
  min-width:22px;
  height:22px;
  border-radius:999px;
  background:#111;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  padding:0 6px;
}

/* Hide per device */
@media (min-width: 768px){
  .adc-hide-desktop{ display:none !important; }
}
@media (max-width: 767px){
  .adc-hide-mobile{ display:none !important; }
  .adc-drawer{ width:min(440px, 96vw); }
}

/* Fix remove for left-scroll direction */
.adc-scroll-left .adc-remove{ right:10px; left:auto; }


/* Floating button position controls */
.adc-fab-top{ top:90px; bottom:auto; }
.adc-fab-bottom{ bottom:90px; top:auto; }
.adc-fab-left{ left:16px; right:auto; }
.adc-fab-right{ right:16px; left:auto; }

/* Icon perfectly centered */
.adc-fab{ display:flex; align-items:center; justify-content:center; }
.adc-fab-icon{ line-height:1; font-size:22px; }


/* Center controls */
.adc-fab-center{
  top:50% !important;
  left:50% !important;
  right:auto !important;
  bottom:auto !important;
  transform: translate(-50%, -50%);
}
.adc-fab-vcenter{
  top:50% !important;
  bottom:auto !important;
  transform: translateY(-50%);
}
.adc-fab-hcenter{
  left:50% !important;
  right:auto !important;
  transform: translateX(-50%);
}

/* If both axis are centered via separate classes, prefer full translate */
.adc-fab-vcenter.adc-fab-hcenter{
  transform: translate(-50%, -50%);
}
