:root{
  --dlwa-primary:#0F6B4D;
  --dlwa-wh-green:#25D366;
  --dlwa-badge-bg:#000;
  --dlwa-text:#222;
  --dlwa-muted:#444;
}

.dlwa-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.35);
  backdrop-filter:saturate(120%) blur(1px);
  z-index:9997; display:block;
}
[hidden].dlwa-backdrop{ display:none; }

.dlwa-drawer{
  position:fixed; top:0; right:-420px; width:420px; max-width:100vw; height:100vh;
  background:#fff; box-shadow:-6px 0 24px rgba(0,0,0,.18);
  z-index:9998; display:flex; flex-direction:column; transition:right .25s ease;
}
.dlwa-drawer[data-open="1"]{ right:0; }
@media(max-width:768px){
  .dlwa-drawer{ right:-100vw; width:100vw; }
}

.dlwa-header{
  height:64px; background:var(--dlwa-primary); color:#fff;
  display:flex; align-items:center; justify-content:space-between; padding:0 16px;
}
.dlwa-title{ font-weight:700; font-size:18px; letter-spacing:.2px; }
.dlwa-close{
  width:32px; height:32px;
  padding:0; line-height:1;
  border-radius:999px; /* identical roundness to qty buttons */
  background:#fff;
  border:none;
  color:#000;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 20px rgba(0,0,0,0.10);
  -webkit-appearance:none; appearance:none;
  aspect-ratio:1/1;
}
.dlwa-close .dlwa-close-icon{ width:18px; height:18px; stroke:#000; stroke-width:2.5; }
.dlwa-close:hover{ background:#f2f2f2; }
.dlwa-close .dlwa-close-icon{
  width:18px; height:18px;
  stroke:#000;
  stroke-width:2.5;
}
.dlwa-close:hover{ background:#f2f2f2; }
.dlwa-close .dlwa-close-icon{ width:16px; height:16px; stroke:#000; }
.dlwa-close:hover{ background:#f9f9f9; }
.dlwa-close .dlwa-close-icon{ width:16px; height:16px; stroke:#000; }
.dlwa-close:hover{ background:#f2f2f2; }
.dlwa-close .dlwa-close-icon{ width:16px; height:16px; }
.dlwa-close:hover{ filter:brightness(0.95); }
.dlwa-close .dlwa-close-icon{ width:20px; height:20px; display:block; }
.dlwa-close:hover{ background:rgba(255,255,255,.35); }
.dlwa-close:active{ transform:scale(0.98); }

.dlwa-body{ flex:1; overflow:auto; padding:12px 14px; }
.dlwa-empty{ color:var(--dlwa-muted); text-align:center; padding:32px 8px; }

.dlwa-item{ display:flex; gap:12px; padding:10px 6px; border-bottom:1px solid #f0f0f0; align-items:flex-start; }
.dlwa-thumb img{ width:56px; height:56px; object-fit:cover; border-radius:8px; }
.dlwa-meta{ flex:1; min-width:0; }
.dlwa-name{ font-weight:700; color:var(--dlwa-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:4px; }
.dlwa-unit{ color:var(--dlwa-muted); font-size:13px; margin-bottom:8px; }

.dlwa-qty{ display:flex; align-items:center; gap:8px; }
.dlwa-qty-btn{
  width:32px; height:32px; border-radius:999px; background:var(--dlwa-primary);
  border:0; color:#fff; font-size:18px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.dlwa-qty-input{
  width:70px; height:36px; border:1px solid #e5e5e5; border-radius:10px; text-align:center; font-weight:600;
}
.dlwa-remove{
  width:32px; height:32px;
  border-radius:50%;
  background:#0F6B4D;
  border:none;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 4px rgba(0,0,0,0.1);
}
.dlwa-remove:hover{ background:#0F6B4D; }

.dlwa-footer{
  border-top:1px solid #f0f0f0; padding:12px 14px; background:#fff;
}
.dlwa-total-row{
  display:flex; align-items:center; justify-content:space-between; font-weight:700; font-size:16px; margin-bottom:6px;
}
.dlwa-note{ color:#666; font-size:12px; margin-bottom:10px; }
.dlwa-wa-btn{
  width:100%; height:44px; border:0; border-radius:999px; background:var(--dlwa-wh-green);
  color:#fff; font-weight:700; display:flex; align-items:center; justify-content:center; gap:8px; cursor:pointer;
}

.dlwa-fab{
  position:fixed; right:18px; bottom:18px; width:60px; height:60px; border-radius:999px;
  background:#fff; border:1px solid #ececec; box-shadow:0 8px 28px rgba(0,0,0,.16);
  display:flex; align-items:center; justify-content:center; z-index:9999; cursor:pointer;
}
.dlwa-fab-icon{ display:flex; align-items:center; justify-content:center; color:#111; }
.dlwa-cart-count{
  position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; font-size:12px; line-height:20px; text-align:center;
  background:var(--dlwa-badge-bg); color:#fff; border-radius:999px; padding:0 6px; font-weight:700;
}

.dlwa-toast{
  position:fixed; right:18px; bottom:90px; background:#000; color:#fff; padding:10px 12px; border-radius:10px; z-index:10000; font-size:13px;
}
[hidden].dlwa-toast{ display:none; }



/* Custom modifications v1.1.3 */
@media (max-width: 768px) {
  #dlwa-send.dlwa-wa-btn {
    position: fixed !important;
    left: 10px !important;
    bottom: 30px !important; /* raised about 3cm */
    width: calc(100% - 20px);
    z-index: 10000;
  }
  #dlwa-wa-footer-msg {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 14px;
    color: var(--dlwa-text);
    margin-bottom: 4px;
    font-family: inherit;
  }
}



/* === DLWA custom patch v1.1.5 === */

/* Normalize header close button alignment (force right) */
.dlwa-header{ justify-content: space-between !important; align-items: center; }
.dlwa-header .dlwa-title{ order: 0 !important; }
.dlwa-header .dlwa-close{ order: 1 !important; margin-left: auto !important; }

/* Make line-remove (×) visually match the + button */
.dlwa-remove{
  width:32px; height:32px;
  border-radius:999px;
  background: var(--dlwa-primary) !important;
  color:#fff !important;
  border:0 !important;
  font-size:20px; line-height:1;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 4px rgba(0,0,0,0.1);
}

/* Mobile: move FAB to left, desktop remain right */
@media (max-width: 768px){
  .dlwa-fab{ right:auto !important; left:18px !important; bottom: calc(env(safe-area-inset-bottom,0px) + 18px) !important; }
}

/* Mobile: keep WhatsApp send button always visible and raised (~3cm), with message below */
@media (max-width: 768px){
  #dlwa-send.dlwa-wa-btn{
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    bottom: calc(env(safe-area-inset-bottom,0px) + 90px) !important; /* ~3cm general */
    z-index: 10000 !important;
  }
  #dlwa-wa-footer-msg{
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    bottom: calc(env(safe-area-inset-bottom,0px) + 18px) !important; /* ~2cm under the button */
    text-align: center;
    font: inherit;
    color: var(--dlwa-text);
    z-index: 9999;
  }
}



/* === v1.1.6: Show WhatsApp button/message ONLY when drawer is open (mobile) === */
@media (max-width: 768px){
  /* Hide by default */
  #dlwa-send.dlwa-wa-btn,
  #dlwa-wa-footer-msg{ display:none !important; }

  /* Visible & positioned only while drawer is open */
  #dlwa-drawer[data-open="1"] #dlwa-send.dlwa-wa-btn{
    display:block !important;
    position:fixed !important;
    left:10px !important; right:10px !important; width:auto !important;
    bottom:calc(env(safe-area-inset-bottom,0px) + 90px) !important; /* ~3cm */
    z-index:10010 !important;
  }
  #dlwa-drawer[data-open="1"] #dlwa-wa-footer-msg{
    display:block !important;
    position:fixed !important;
    left:10px !important; right:10px !important;
    bottom:calc(env(safe-area-inset-bottom,0px) + 18px) !important; /* ~2cm under button */
    text-align:center; font:inherit; color:var(--dlwa-text);
    z-index:10005 !important;
  }
}



/* Ensure drawer covers FAB */
.dlwa-backdrop{ z-index: 10020 !important; }
.dlwa-drawer{ z-index: 10030 !important; }
.dlwa-fab{ z-index: 10000 !important; }



/* === v1.1.7: keep WA button/message inside drawer footer, avoid covering Total === */
@media (max-width: 768px){
  .dlwa-footer{ position: relative !important; padding-bottom: 100px !important; } /* space for button + message */

  /* Override any fixed rules: use absolute inside footer */
  #dlwa-drawer[data-open="1"] .dlwa-footer #dlwa-send.dlwa-wa-btn{
    display:block !important;
    position: absolute !important;
    left:10px !important; right:10px !important; width:auto !important;
    bottom: 50px !important; /* ~3cm above bottom of footer */
    z-index: 3 !important;
  }
  #dlwa-drawer[data-open="1"] .dlwa-footer #dlwa-wa-footer-msg{
    display:block !important;
    position: absolute !important;
    left:10px !important; right:10px !important;
    bottom: 8px !important; /* ~2cm under button approx */
    text-align:center; font: inherit; color: var(--dlwa-text);
    z-index: 2 !important;
  }
}
/* Ensure drawer covers FAB globally */
.dlwa-backdrop{ z-index: 10020 !important; }
.dlwa-drawer{ z-index: 10030 !important; }
.dlwa-fab{ z-index: 10000 !important; }