/* =========================================================
   ZDV Product Page — Separate Lid CSS
   Loaded only for products that require separate lid purchase
   Generated from all.css V.12 cleanup
   ========================================================= */



/* =========================================================
   01. Lid notice inside purchase box
   ========================================================= */

/* ==========================================================
   ZDV Purchase Box - Strong Lid Disclosure
   Scope: .zdv-summary
   Purpose: Prevent buying bottle without noticing lid is separate
========================================================== */

.zdv-summary .zdv-lid-status-wrap{
  position: relative;
  overflow: hidden;

  display: grid !important;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;

  min-height: 72px !important;
  padding: 12px 16px !important;

  border-radius: 16px !important;

  background: #FFF7ED !important;
  border: 1px solid #FDBA74 !important;
  box-shadow: 0 8px 22px rgba(249, 115, 22, .08) !important;
}

/* هشدار تصویری سمت راست */
.zdv-summary .zdv-lid-status-wrap::before{
  content: "⚠";
  width: 34px;
  height: 34px;

  display:none !important;
  align-items: center;
  justify-content: center;

  border-radius: 12px;
  background: #FFEDD5;
  color: #C2410C;

  font-size: 18px;
  font-weight: 900;

  box-shadow: inset 0 0 0 1px rgba(194, 65, 12, .12);
}
.zdv-summary .zdv-lid-jump{
  height: 38px;
  padding: 0 14px;

  border: 1px solid #FDBA74;
  border-radius: 12px;

  background: #FFEDD5;
  color: #9A3412;

  font-size: 13px;
  font-weight: 900;

  cursor: pointer;
  transition: all .18s ease;
  white-space: nowrap;
}

.zdv-summary .zdv-lid-jump:hover{
  background: #FB923C;
  border-color: #FB923C;
  color: #fff;
  transform: translateY(-1px);
}

/* لیبل */
.zdv-summary .zdv-lid-status-label{
  color: #9A3412 !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  white-space: nowrap;
}

/* متن */
.zdv-summary .zdv-lid-status-text{
  color: #9A3412 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.8 !important;
  text-align: right !important;
}

/* حالت انتخاب‌شده هم همچنان هشدار بماند */
.zdv-summary .zdv-lid-status-wrap.is-selected{
  background: #FFF7ED !important;
  border-color: #FDBA74 !important;
}

.zdv-summary .zdv-lid-status-wrap.is-selected .zdv-field-label,
.zdv-summary .zdv-lid-status-wrap.is-selected .zdv-lid-status-text{
  color: #9A3412 !important;
}
/* Lid warning icon - stronger visual */

.zdv-summary .zdv-lid-icon{
  width: 38px;
  height: 34px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  flex: 0 0 38px;

  border-radius: 12px;

  background: #FFEDD5;
  border: 1px solid #FDBA74;
  color: #C2410C;

  font-size: 0;
  font-weight: 900;

  position: relative;

  box-shadow:
    0 6px 14px rgba(249, 115, 22, .12),
    inset 0 1px 0 rgba(255,255,255,.75);
}

/* مثلث هشدار */
.zdv-summary .zdv-lid-icon::before{
  content: "!";
  width: 22px;
  height: 20px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  clip-path: polygon(50% 4%, 96% 92%, 4% 92%);

  background: #F97316;
  color: #FFFFFF;

  font-size: 13px;
  font-weight: 900;
  line-height: 1;

  padding-top: 3px;
}

/* چیدمان ردیف وضعیت درب */
.zdv-summary .zdv-lid-status-wrap{
  display: grid !important;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
}

/* متن */
.zdv-summary .zdv-lid-copy{
  min-width: 0;
}

.zdv-summary .zdv-lid-status-text{
  color: #9A3412 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1.8 !important;
  text-align: right !important;
}

/* دکمه */
.zdv-summary .zdv-lid-jump{
  height: 40px;
  padding: 0 16px;

  border: 1px solid #FDBA74;
  border-radius: 12px;

  background: #FFEDD5;
  color: #9A3412;

  font-size: 13px;
  font-weight: 900;

  cursor: pointer;
  transition: all .18s ease;
  white-space: nowrap;
}

.zdv-summary .zdv-lid-jump:hover{
  background: #FB923C;
  border-color: #FB923C;
  color: #fff;
  transform: translateY(-1px);
}
/* موبایل */
@media (max-width: 767px){
  .zdv-summary .zdv-lid-status-wrap{
    grid-template-columns: auto 1fr;
    align-items: flex-start;
  }

  .zdv-summary .zdv-lid-status-text{
    grid-column: 1 / -1;
  }
}
.zdv-summary .zdv-lid-status-wrap.is-confirmed{
  background:#ECFDF5 !important;
  border-color:#86EFAC !important;
}

.zdv-summary .zdv-lid-status-wrap.is-confirmed .zdv-lid-status-text,
.zdv-summary .zdv-lid-status-wrap.is-confirmed .zdv-lid-confirm{
  color:#166534 !important;
}

.zdv-summary .zdv-lid-status-wrap.is-confirmed .zdv-lid-icon{
  background:#DCFCE7 !important;
  border-color:#86EFAC !important;
  color:#166534 !important;
}

.zdv-summary .zdv-lid-status-wrap.is-confirmed .zdv-lid-icon::before{
  content:"✓";
  clip-path:none;
  background:#22C55E;
  border-radius:50%;
}
/* Actions group: checkbox + compatible lids button */

.zdv-summary .zdv-lid-status-wrap{
  grid-template-columns: auto 1fr auto !important;
}

.zdv-summary .zdv-lid-copy{
  min-width: 0;
}

.zdv-summary .zdv-lid-status-text{
  font-size: 13px !important;
  line-height: 1.6 !important;
  white-space: normal;
}

.zdv-summary .zdv-lid-actions{
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex: 0 0 auto;
  white-space: nowrap;
}

/* Confirm box */
.zdv-summary .zdv-lid-confirm{
  height: 40px;
  padding: 0 12px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;

  border: 1px solid #FDBA74;
  border-radius: 12px;

  background: #FFF7ED;
  color: #9A3412;

  font-size: 13px;
  font-weight: 900;
  line-height: 1;

  cursor: pointer;
  transition: all .18s ease;
}

.zdv-summary .zdv-lid-confirm input{
  width: 19px;
  height: 19px;
  margin: 0;
  accent-color: #16A34A;
}

/* Button */
.zdv-summary .zdv-lid-jump{
  height: 40px;
  padding: 0 16px;

  border: 1px solid #FDBA74;
  border-radius: 12px;

  background: #FFEDD5;
  color: #9A3412;

  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}

/* Confirmed green state */
.zdv-summary .zdv-lid-status-wrap.is-confirmed{
  background:#ECFDF5 !important;
  border-color:#86EFAC !important;
}

.zdv-summary .zdv-lid-status-wrap.is-confirmed .zdv-lid-status-text{
  color:#166534 !important;
}

/* متوجه شدم - تغییر خیلی ملایم */

.zdv-summary .zdv-lid-status-wrap.is-confirmed .zdv-lid-confirm{
    background: #ECFDF5 !important;
    border-color: #ccf3de !important;
    color: #071932 !important;
}

/* مشاهده درب‌ها - دکمه اصلی */

.zdv-summary .zdv-lid-status-wrap.is-confirmed .zdv-lid-jump{
  background:#22C55E !important;
  border-color:#22C55E !important;
  color:#FFFFFF !important;

  box-shadow:
    0 6px 18px rgba(34,197,94,.22) !important;
}

.zdv-summary .zdv-lid-status-wrap.is-confirmed .zdv-lid-jump:hover{
  background:#16A34A !important;
  border-color:#16A34A !important;
}


.zdv-summary .zdv-lid-status-wrap.is-confirmed .zdv-lid-jump:hover{
  background:#16A34A !important;
  border-color:#16A34A !important;
  color:#fff !important;
}
.zdv-lid-check{
    appearance: none;
    -webkit-appearance: none;

    width: 18px !important;
    height: 18px !important;

    border: 2px solid #F97316;
    border-radius: 4px;

    background: #fff;
    cursor: pointer;

    position: relative;
}
.zdv-lid-check:checked{
    background: #22C55E;
    border-color: #1cad51;
}

.zdv-lid-check:checked::after{
    content: "✓";

    position: absolute;
    top: 50%;
    left: 50%;

    transform: translate(-50%, -55%);

    color: #fff;
    font-size: 11px;
    font-weight: 900;
}
#compatible-lids{
  transition:
    background-color .35s ease,
    box-shadow .35s ease,
    border-color .35s ease;
}

#compatible-lids.zdv-lids-highlight{
  background: rgba(34, 197, 94, .08) !important;
  box-shadow:
    0 0 0 2px rgba(34, 197, 94, .55),
    0 18px 45px rgba(34, 197, 94, .16) !important;
  border-radius: 22px;
}
/* Mobile / narrow */
@media (max-width: 767px){
  .zdv-summary .zdv-lid-status-wrap{
    grid-template-columns: auto 1fr !important;
  }

  .zdv-summary .zdv-lid-actions{
    grid-column: 1 / -1;
    width: 100%;
    justify-content: stretch;
  }

  .zdv-summary .zdv-lid-confirm,
  .zdv-summary .zdv-lid-jump{
    flex: 1;
  }
}
.zdv-summary .zdv-lid-confirm{
    margin-bottom: 0 !important;
}
/* ==================================================
   Confirmed State - Force Green
================================================== */

.zdv-lid-status-wrap.is-confirmed{
    border-color:#86EFAC !important;
    box-shadow: 0 8px 22px rgba(34, 197, 94, .15) !important;
}

/* آیکن سمت راست */

.zdv-lid-status-wrap.is-confirmed .zdv-lid-icon{
    background:#DCFCE7 !important;
    border-color:#86EFAC !important;
    color:#16A34A !important;

    box-shadow:
        0 0 0 4px rgba(34,197,94,.08),
        0 8px 18px rgba(34,197,94,.15) !important;
}

/* اگر آیکن با before ساخته شده */

.zdv-lid-status-wrap.is-confirmed .zdv-lid-icon::before{
    background:#22C55E !important;
}

/* دکمه مشاهده درب */

.zdv-lid-status-wrap.is-confirmed .zdv-lid-jump{
    background:#BBF7D0 !important;
    border-color:#4ADE80 !important;
    color:#166534 !important;

    box-shadow:
        0 4px 12px rgba(34,197,94,.12) !important;
}

.zdv-lid-status-wrap.is-confirmed .zdv-lid-jump:hover{
    background:#22C55E !important;
    border-color:#22C55E !important;
    color:#fff !important;
}

/* دکمه متوجه شدم */

.zdv-lid-status-wrap.is-confirmed .zdv-lid-confirm{
    background:#DCFCE7 !important;
    border-color:#86EFAC !important;
    color:#166534 !important;
}



/* Out of stock: separate-lid notice becomes neutral/inactive inside purchase box */
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-status-wrap{
  background: #F8FAFC !important;
  border-color: #E2E8F0 !important;
  box-shadow: none !important;
  filter: grayscale(.28) !important;
  opacity: .82 !important;
  pointer-events: none !important;
}

.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-icon{
  width: 30px !important;
  height: 30px !important;
  flex-basis: 30px !important;
  border-radius: 10px !important;
  background: #EEF2F7 !important;
  border-color: #D8DEE8 !important;
}

.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-icon::before{
  width: 18px !important;
  height: 17px !important;
  background: #94A3B8 !important;
  font-size: 11px !important;
}

.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-status-text,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-confirm,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-jump{
  color: #7B8794 !important;
}

.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-confirm,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-jump{
  background: #F8FAFC !important;
  border-color: #D8DEE8 !important;
  color: #8A95A3 !important;
  box-shadow: none !important;
  filter: grayscale(1) !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-confirm input,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-check{
  background: #F1F5F9 !important;
  border-color: #CBD5E1 !important;
  accent-color: #94A3B8 !important;
  box-shadow: none !important;
}

.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-confirm:hover,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-jump:hover{
  background: #F8FAFC !important;
  border-color: #D8DEE8 !important;
  color: #8A95A3 !important;
  transform: none !important;
  box-shadow: none !important;
}

@media (max-width: 767px){
  .zdv-summary .zdv-lid-status-wrap{
    min-height: 62px !important;
    padding: 10px 12px !important;
    gap: 8px !important;
  }

  .zdv-summary .zdv-lid-icon{
    width: 30px !important;
    height: 30px !important;
    flex-basis: 30px !important;
    border-radius: 10px !important;
  }

  .zdv-summary .zdv-lid-icon::before{
    width: 18px !important;
    height: 17px !important;
    font-size: 11px !important;
  }

  .zdv-summary .zdv-lid-status-text{
    font-size: 12px !important;
    line-height: 1.65 !important;
  }

  .zdv-summary .zdv-lid-confirm,
  .zdv-summary .zdv-lid-jump{
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
  }
}

/* =========================================================
   02. Separate lid toast final
   ========================================================= */

/* =========================================================
   V.12 - Separate Lid Toast
   Toast after adding main product to cart
   ========================================================= */

body.single-product .zdv-lid-toast-overlay {
    position: fixed !important;
    inset: 0 !important;

    z-index: 2147483000 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100vw !important;
    height: 100vh !important;

    padding: 18px !important;

    background: rgba(15, 23, 42, 0.48) !important;
    backdrop-filter: blur(4px) !important;

    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;

    box-sizing: border-box !important;

    transition:
        opacity 0.22s ease,
        visibility 0.22s ease !important;
}

body.single-product .zdv-lid-toast-overlay.is-active {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

body.single-product .zdv-lid-toast-box {
    width: 680px !important;
    max-width: 92vw !important;

    direction: rtl !important;
    text-align: right !important;

    padding: 28px !important;

    border: 1px solid #dbeafe !important;
    border-radius: 22px !important;

    background: #ffffff !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28) !important;

    transform: translateY(12px) scale(0.98) !important;
    transition: transform 0.22s ease !important;

    box-sizing: border-box !important;
}

body.single-product
.zdv-lid-toast-overlay.is-active
.zdv-lid-toast-box {
    transform: translateY(0) scale(1) !important;
}

body.single-product .zdv-lid-toast-head {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;

    margin-bottom: 14px !important;
}

body.single-product .zdv-lid-toast-icon {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 auto !important;

    display: grid !important;
    place-items: center !important;

    border-radius: 14px !important;

    background: #ecfdf5 !important;
    color: #059669 !important;

    font-weight: 900 !important;
}

body.single-product .zdv-lid-toast-title {
    margin: 0 !important;

    font-size: 17px !important;
    font-weight: 900 !important;
    line-height: 1.8 !important;

    color: #143b2b !important;
}

body.single-product .zdv-lid-toast-selection {
    margin-top: 2px !important;

    color: #64748b !important;

    font-size: 12.5px !important;
    font-weight: 700 !important;
    line-height: 1.8 !important;
}

body.single-product .zdv-lid-toast-note {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;

    margin: 12px 0 18px !important;
    padding: 14px 18px !important;

    border: 1px solid #fed7aa !important;
    border-radius: 16px !important;

    background: #fff7ed !important;
    color: #9a3412 !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 2 !important;
}

body.single-product .zdv-lid-toast-note-icon {
    width: 26px !important;
    height: 26px !important;
    flex: 0 0 auto !important;

    display: grid !important;
    place-items: center !important;

    border-radius: 10px !important;

    background: #fb923c !important;
    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

body.single-product .zdv-lid-toast-actions {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

body.single-product .zdv-lid-toast-primary,
body.single-product .zdv-lid-toast-secondary {
    min-height: 46px !important;

    padding: 0 16px !important;

    border-radius: 14px !important;

    font-size: 14px !important;
    font-weight: 900 !important;

    cursor: pointer !important;
    transition: 0.18s ease !important;
}

body.single-product .zdv-lid-toast-primary {
    flex: 1 !important;

    border: 0 !important;

    background: #10b981 !important;
    color: #ffffff !important;

    box-shadow: 0 10px 24px rgba(16, 185, 129, 0.22) !important;
}

body.single-product .zdv-lid-toast-primary:hover {
    background: #059669 !important;
    transform: translateY(-1px) !important;
}

body.single-product .zdv-lid-toast-secondary {
    border: 1px solid #e2e8f0 !important;

    background: #f8fafc !important;
    color: #64748b !important;
}

body.single-product .zdv-lid-toast-secondary:hover {
    background: #f1f5f9 !important;
    color: #334155 !important;
}

body.single-product .zdv-lids-highlight {
    animation: zdvLidsHighlight 2.8s ease !important;
}

@keyframes zdvLidsHighlight {
    0% {
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.45);
    }

    45% {
        box-shadow: 0 0 0 8px rgba(16, 185, 129, 0.16);
    }

    100% {
        box-shadow: none;
    }
}

@media (max-width: 575px) {
    body.single-product .zdv-lid-toast-box {
        padding: 18px !important;
        border-radius: 18px !important;
    }

    body.single-product .zdv-lid-toast-actions {
        flex-direction: column !important;
    }

    body.single-product .zdv-lid-toast-primary,
    body.single-product .zdv-lid-toast-secondary {
        width: 100% !important;
    }
}
/* =========================================================


/* =========================================================
   03. Compatible lids picker desktop/tablet
   ========================================================= */

.zd-compatible-lids-picker .zd-picker{
  direction:rtl;
  width:100%;
  padding:16px;
  border:1px solid #E8DED0;
  border-radius:22px;
  background:#fffdfa;
  box-shadow:0 14px 34px rgba(15,23,42,.045);
}

.zd-compatible-lids-picker .zd-picker-main{
  display:grid;
  grid-template-columns:minmax(390px,550px) minmax(0,1fr);
  gap:16px;
  align-items:stretch;
}

.zd-compatible-lids-picker .zd-picker-side{
  padding-inline-end:16px;
  border-inline-end:1px solid #E8DED0;
}

.zd-compatible-lids-picker .zd-picker-header{
  margin-bottom:14px;
  text-align:right;
}

.zd-compatible-lids-picker .zd-picker-kicker{
  display:inline-flex;
  margin-bottom:8px;
  padding:5px 11px;
  border-radius:999px;
  background:#fff8df;
  border:1px solid #f2c14e;
  color:#8a5a00;
  font-size:13px;
  font-weight:800;
}

.zd-compatible-lids-picker .zd-picker-header h3{
  margin:0 0 6px;
  font-size:22px;
  font-weight:950;
  color:#16351f;
}

.zd-compatible-lids-picker .zd-picker-header p{
  margin:0;
  color:#6b7280;
  font-size:14px;
  font-weight:650;
}
/* دکمه‌های لیست */
.zd-compatible-lids-picker .zd-picker-badge{
  position:relative;
  width:100%;
  min-height:44px;
  padding:0 14px;
  border:1px solid #E2E8F0;
  border-radius:13px;
  background:#fff;
  color:#1f2a37;
  font-size:14px;
  font-weight:850;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
/* عنوان‌های بلند دکمه‌ها کامل‌تر دیده شوند */
.zd-compatible-lids-picker .zd-picker-badge{
  white-space: normal !important;
  line-height: 1.45 !important;
  min-height: 44px !important;
  height: auto !important;
  padding: 4px 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

/* حالت فعال */
.zd-compatible-lids-picker .zd-picker-badge.is-active{
  background:#06B18F;
  border-color:#06B18F;
  color:#fff;
}

/* ناموجود */
.zd-compatible-lids-picker .zd-picker-badge.is-out{
  background:#F7F8FA !important;
  color:#9CA3AF !important;
  border-color:#E5E7EB !important;
}

/* باجت شناور ناموجود */
.zd-compatible-lids-picker .zd-picker-badge.is-out:after{
  content:"ناموجود";
  position:absolute;
  top:6px;
  left:6px;
  z-index:2;
  background:#D92D20;
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1;
  padding:4px 6px;
  border-radius:999px;
  pointer-events:none;
}

/* حالت پایه لیست */
.zd-compatible-lids-picker .zd-picker-badges{
  display:grid;
  gap:8px 10px;
  align-content:start;
}

/* تا 7 آیتم: یک ستون */
.zd-compatible-lids-picker .zd-picker--one-col .zd-picker-badges{
  grid-template-columns:1fr;
}

/* 8 تا 14 آیتم: دو ستون */
.zd-compatible-lids-picker .zd-picker--two-cols .zd-picker-badges{
  grid-template-rows:repeat(7, auto);
  grid-auto-flow:column;
  grid-auto-columns:1fr;
}

/* بیشتر از 14 آیتم: دو ستون + اسکرول عمودی */
.zd-compatible-lids-picker .zd-picker--scroll-cols .zd-picker-badges{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  grid-auto-flow:row !important;
  grid-auto-rows:42px !important;
  height: 390px !important;
  max-height: 390px !important;
  gap:8px 10px !important;

  height:370px !important;
  max-height:370px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;

  padding:2px 8px 2px 0 !important;
  padding-right: 16px !important;
  padding-left: 4px !important;
  align-content:start !important;
}
/* پس‌زمینه اسکرول‌بار */
.zd-compatible-lids-picker .zd-picker--scroll-cols .zd-picker-badges::-webkit-scrollbar-track{
  background:#F1F5F9;
  border-radius:999px;
}

/* خود اسکرول‌بار */
.zd-compatible-lids-picker .zd-picker--scroll-cols .zd-picker-badges::-webkit-scrollbar-thumb{
  background:#C89B3C;
  border-radius:999px;
}

/* هاور روی اسکرول‌بار */
.zd-compatible-lids-picker .zd-picker--scroll-cols .zd-picker-badges::-webkit-scrollbar-thumb:hover{
  background:#7c5f21;
}

/* ظاهر دکمه‌ها در حالت اسکرول مثل حالت عادی */
.zd-compatible-lids-picker .zd-picker--scroll-cols .zd-picker-badge{
  min-height:42px !important;
  height:42px !important;
  border-radius:13px !important;
  background:#fff !important;
  border:1px solid #E2E8F0 !important;
}

/* فعال */
.zd-compatible-lids-picker .zd-picker--scroll-cols .zd-picker-badge.is-active{
  background:#06B18F !important;
  border-color:#06B18F !important;
  color:#fff !important;
}

/* ناموجود */
.zd-compatible-lids-picker .zd-picker--scroll-cols .zd-picker-badge.is-out{
  background:#F7F8FA !important;
  color:#9CA3AF !important;
  border-color:#E5E7EB !important;
}

.zd-compatible-lids-picker .zd-picker-badge.is-active{
  background:#06B18F;
  border-color:#06B18F;
  color:#fff;
  box-shadow:0 10px 22px rgba(6,177,143,.18);
}

.zd-compatible-lids-picker .zd-picker-panel{
  display:none;
}

.zd-compatible-lids-picker .zd-picker-panel.is-active{
  display:flex;
  gap:14px;
  min-height:456px;
  padding:16px;
  border:1px solid #E7EDF3;
  border-radius:22px;
  background:#fff;
  overflow:hidden;
}

.zd-compatible-lids-picker .zd-picker-media-col{
  flex:0 0 235px;
  max-width:235px;
  display:flex;
  justify-content: flex-end;
  flex-direction:column;
  gap:10px;
}

.zd-compatible-lids-picker .zd-picker-media{
  display:block;
  width:235px;
  height:235px;
  border-radius:20px;
  overflow:hidden;
  background:#F3F4F6;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}

.zd-compatible-lids-picker .zd-picker-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:20px;
}

.zd-compatible-lids-picker .zd-picker-help{
  display:flex;
  align-items:flex-start;
  gap:7px;
  padding:24px 10px;
  border:1px solid #D7EAFE;
  border-radius:13px;
  background:#F2F8FF;
  color:#315A7D;
  font-size:12px;
  font-weight:650;
  line-height:1.65;
}

.zd-compatible-lids-picker .zd-picker-info-col{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  text-align:right;
}

.zd-compatible-lids-picker .zd-picker-info-top{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
}

.zd-compatible-lids-picker .zd-picker-title{
  display:block;
  margin:0 0 12px;
  color:#8A7357;
  font-size:24px;
  font-weight:950;
  line-height:1.45;
  text-decoration:none;
}
.zd-compatible-lids-picker .zd-picker-title{
    position: relative;
    display: block;
    padding-bottom: 18px;
}

.zd-compatible-lids-picker .zd-picker-title:after{
    content: '';
    position: absolute;
    bottom: 0;
    right: 50%;
    transform: translateX(50%);
    width: 100%;
    height: 1px;
    background: #E5E7EB;
}
.zd-compatible-lids-picker .zd-picker-form-area{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:185px;
}

.zd-compatible-lids-picker .zd-picker-cart,
.zd-compatible-lids-picker .zd-picker-cart form.cart,
.zd-compatible-lids-picker .zd-picker-cart form.variations_form{
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

.zd-compatible-lids-picker .zd-picker-cart .woocommerce-variation.single_variation,
.zd-compatible-lids-picker .zd-picker-cart .added_to_cart{
  display:none !important;
}

.zd-compatible-lids-picker .zd-picker-cart form.cart,
.zd-compatible-lids-picker .zd-picker-cart form.variations_form{
  margin:0 !important;
}

.zd-compatible-lids-picker .zd-picker-cart table.variations{
  width:100% !important;
  margin:0 0 12px !important;
}

.zd-compatible-lids-picker .zd-picker-cart table.variations tr{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:10px !important;
  flex-wrap:wrap !important;
}

.zd-compatible-lids-picker .zd-picker-cart table.variations th.label{
  width:100% !important;
  display:block !important;
  padding:0 !important;
  margin:0 8px 5px !important;
  color:#1F5132 !important;
  font-size:16px !important;
  font-weight:950 !important;
  text-align:right !important;
}

.zd-compatible-lids-picker .zd-picker-cart table.variations td.value{
  width:100% !important;
  display:flex !important;
  margin-bottom: 35px !important;
  margin-top: 20px;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:9px !important;
  padding:0 !important;
  flex-wrap:wrap !important;
  border:0 !important;
  background:transparent !important;
}

.zd-compatible-lids-picker .zd-picker-cart .wd-swatches-product{
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  flex-wrap:wrap !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
}

.zd-compatible-lids-picker .zd-picker-cart .wd-swatch{
  margin:0 !important;
}

.zd-compatible-lids-picker .zd-picker-cart .reset_variations{
  color:#9CA3AF !important;
  font-size:13px !important;
  font-weight:700 !important;
}

.zd-compatible-lids-picker .zd-picker-cart .single_variation_wrap{
  width:100% !important;
  max-width:100% !important;
  display:block !important;
  overflow:visible !important;
  margin-top:0 !important;
}

.zd-compatible-lids-picker .zd-picker-cart form.cart:not(.variations_form),
.zd-compatible-lids-picker .zd-picker-cart .woocommerce-variation-add-to-cart{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:30px !important;
    width:100% !important;
}
/* ردیف خرید: چپ‌چین با کادر قیمت */
.zd-compatible-lids-picker .zd-picker-cart form.cart:not(.variations_form),
.zd-compatible-lids-picker .zd-picker-cart .woocommerce-variation-add-to-cart{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:12px !important;
  width:100% !important;
  max-width:100% !important;
}

/* CTR کوچک‌تر، سمت چپ ردیف */
.zd-compatible-lids-picker .zd-picker-cart .single_add_to_cart_button{
  width:135px !important;
  min-width:200px !important;
  max-width: 200px !important;
  flex:0 0 135px !important;
  height:54px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:14px !important;
  background:#06B18F !important;
  color:#fff !important;
  font-size:15px !important;
  font-weight:950 !important;
  border:0 !important;
  padding:0 12px !important;
  white-space:nowrap !important;
}

/* کنترل تعداد بزرگ‌تر و کامل */
.zd-compatible-lids-picker .zd-picker-cart .woopq-quantity{
  width:210px !important;
  min-width:200px !important;
  max-width:210px !important;
  flex:0 0 210px !important;
  height:65px !important;
  padding:5px !important;
  display:flex !important;
  align-items:center !important;
  border:none !important;
  border-radius:14px !important;
  background:#fff !important;
  margin:0 !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}

.zd-compatible-lids-picker .zd-picker-cart .woopq-quantity-input{
  width:100% !important;
  height:100% !important;
  display:grid !important;
  grid-template-columns:44px 1fr 44px !important;
  gap:7px !important;
  align-items:center !important;
}

.zd-compatible-lids-picker .zd-picker-cart .woopq-quantity-input-plus,
.zd-compatible-lids-picker .zd-picker-cart .woopq-quantity-input-minus{
  width:44px !important;
  height:40px !important;
  min-width:44px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:11px !important;
  background:#06B18F !important;
  color:#fff !important;
  font-size:18px !important;
  font-weight:900 !important;
}

.zd-compatible-lids-picker .zd-picker-cart input.qty{
  width:100% !important;
  height:40px !important;
  min-width:0 !important;
  margin:0 !important;
  border:1px solid #E2E8F0 !important;
  border-radius:10px !important;
  text-align:center !important;
  font-size:15px !important;
  font-weight:900 !important;
}

.zd-compatible-lids-picker .zd-picker-info-bottom{
  flex:0 0 auto;
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:0px;
}

.zd-compatible-lids-picker .zd-picker-meta-row{
  display:flex;
  flex-direction:column;
  gap:9px;
}

.zd-compatible-lids-picker .zd-picker-price{
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 16px;
  border:1px solid #F2C14E;
  border-radius:15px;
  background:#FFF8DF;
  color:#8A5A00;
  font-weight:900;
  white-space:nowrap;
}

.zd-compatible-lids-picker .zd-picker-price-label{
  font-size:14px;
  font-weight:850;
}

.zd-compatible-lids-picker .zd-picker-price-value,
.zd-compatible-lids-picker .zd-picker-price-value *{
  color:#8A5A00 !important;
  font-size:21px !important;
  font-weight:950 !important;
}

.zd-compatible-lids-picker .zd-picker-stock{
  min-height:50px;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 16px;
  border-radius:15px;
  font-size:14px;
  font-weight:900;
}

.zd-compatible-lids-picker .zd-picker-stock::before{
  content:"وضعیت موجودی";
  font-size:14px;
  font-weight:850;
}

.zd-compatible-lids-picker .zd-picker-stock--in{
  color:#116B43;
  background:#EAFBF3;
  border:1px solid #BCEFD7;
}

.zd-compatible-lids-picker .zd-picker-stock--out{
  color:#D92D20;
  background:#FFF1F1;
  border:1px solid #FFC9C9;
}
/* ناموجود: دکمه‌ها مخفی نشوند */
.zd-compatible-lids-picker .zd-picker-panel.is-out .zd-picker-cart{
  display:block !important;
  visibility:visible !important;
  opacity:.45 !important;
  filter:grayscale(100%) !important;
}

.zd-compatible-lids-picker .zd-picker-panel.is-out .zd-picker-cart form,
.zd-compatible-lids-picker .zd-picker-panel.is-out .single_add_to_cart_button,
.zd-compatible-lids-picker .zd-picker-panel.is-out .woopq-quantity{
  display:flex !important;
  visibility:visible !important;
}

/* همه چیز خاکستری، به‌جز وضعیت موجودی */
.zd-compatible-lids-picker .zd-picker-panel.is-out .zd-picker-media-col,
.zd-compatible-lids-picker .zd-picker-panel.is-out .zd-picker-title,
.zd-compatible-lids-picker .zd-picker-panel.is-out .zd-picker-form-area,
.zd-compatible-lids-picker .zd-picker-panel.is-out .zd-picker-price{
  filter:grayscale(100%) !important;
  opacity:.45 !important;
}

/* کادر ناموجود قرمز و واضح بماند */
.zd-compatible-lids-picker .zd-picker-panel.is-out .zd-picker-stock,
.zd-compatible-lids-picker .zd-picker-panel.is-out .zd-picker-stock--out{
  filter:none !important;
  opacity:1 !important;
}
.zd-compatible-lids-picker .zd-picker-badge.is-out{
  background:#F7F8FA !important;
  color:#9CA3AF !important;
  border-color:#E5E7EB !important;
  position:relative;
}

.zd-compatible-lids-picker .zd-picker-badge.is-out{
    position:relative;
}

.zd-compatible-lids-picker .zd-picker-badge.is-out::after{
    content:"ناموجود";
    position:absolute;
    top:1px;
    left:-6px;
    rotate: -13deg;

    background:#D92D20;
    color:#fff;

    font-size:10px;
    font-weight:800;
    line-height:1;

    padding:4px 6px;
    border-radius:999px;

    pointer-events:none;
}

.zd-compatible-lids-picker .zd-picker-badge.is-out.is-active{
  background:#FFF1F1 !important;
  color:#D92D20 !important;
  border-color:#FFC9C9 !important;
  box-shadow:none !important;
}
.zd-compatible-lids-picker .zd-picker-kicker{
  display:none !important;
}

.zd-compatible-lids-picker .zd-picker-header h3{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.zd-compatible-lids-picker .zd-picker-title-icon{
  font-size:20px;
  line-height:1;
}

.zd-compatible-lids-picker .zd-picker-header h3 small{
  font-size:13px;
  font-weight:800;
  color:#8A5A00;
  background:#fff8df;
  border:1px solid #f2c14e;
  border-radius:999px;
  padding:4px 9px;
}
/* لیست درب‌ها: کنترل تعداد زیاد */
.zd-compatible-lids-picker .zd-picker-badges{
  max-height: 360px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 2px 0 2px 6px;
  align-content: start;
}

/* اسکرول ظریف */
.zd-compatible-lids-picker .zd-picker-badges::-webkit-scrollbar{
  width: 6px;
}

.zd-compatible-lids-picker .zd-picker-badges::-webkit-scrollbar-thumb{
  background: #D6DEE8;
  border-radius: 999px;
}

.zd-compatible-lids-picker .zd-picker-badges::-webkit-scrollbar-track{
  background: transparent;
}
/* Hover دکمه‌های انتخاب درب */
.zd-compatible-lids-picker .zd-picker-badge{
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    background-color .18s ease,
    color .18s ease;
}

.zd-compatible-lids-picker .zd-picker-badge:not(.is-active):not(.is-out):hover{
  transform: translateY(-1px);
  border-color: rgba(6,177,143,.45);
  box-shadow: 0 8px 18px rgba(15,23,42,.07);
  color: #064E3B;
  background: #FBFFFD;
}

.zd-compatible-lids-picker .zd-picker-badge.is-active:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(6,177,143,.22);
}

.zd-compatible-lids-picker .zd-picker-badge.is-out:hover{
  transform: none;
  box-shadow: none;
}
/* انیمیشن سبک هنگام تغییر کارت درب */
.zd-compatible-lids-picker .zd-picker-panel{
  opacity: 0;
  transform: translateY(6px);
  transition:
    opacity .18s ease,
    transform .18s ease;
}

.zd-compatible-lids-picker .zd-picker-panel.is-active{
  opacity: 1;
  transform: translateY(0);
}

@media(max-width:991px){
  .zd-compatible-lids-picker .zd-picker-main{
    grid-template-columns:1fr;
  }

  .zd-compatible-lids-picker .zd-picker-side{
    padding-inline-end:0;
    border-inline-end:0;
    border-bottom:1px solid #E8DED0;
    padding-bottom:18px;
  }

  .zd-compatible-lids-picker .zd-picker-badges{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
  }

  .zd-compatible-lids-picker .zd-picker-badge{
    width:auto;
    white-space:normal;
  }

  .zd-compatible-lids-picker .zd-picker-panel.is-active{
    flex-direction:column;
  }

  .zd-compatible-lids-picker .zd-picker-media-col{
    flex:0 0 auto;
    width:100%;
    max-width:100%;
  }

  .zd-compatible-lids-picker .zd-picker-media{
    width:100%;
    height:240px;
  }
}
/* V.06.2 | Compatible Lids - unavailable variation state */
/* فقط وقتی ورییشن انتخاب‌شده ناموجود است */

.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .zd-picker-media,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .zd-picker-price,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .zd-picker-qty,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .quantity,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .single_add_to_cart_button,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .zd-picker-help {
  opacity: .38;
  filter: grayscale(1);
  pointer-events: none;
}

/* انتخابگر ورییشن همیشه فعال بماند */
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .variations,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .zd-picker-variations,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .zd-picker-variations-top,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .zd-picker-option-buttons,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .zd-picker-option-btn,
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .reset_variations {
  opacity: 1 !important;
  filter: none !important;
  pointer-events: auto !important;
}

/* وضعیت موجودی قرمز و واضح بماند */
.zd-compatible-lids-picker .zd-picker-panel.is-variation-out .zd-picker-stock {
  opacity: 1 !important;
  filter: none !important;
  pointer-events: auto !important;
}
/* =========================================================


/* =========================================================
   04. Compatible lids mobile
   ========================================================= */

/* =========================================================
   V.12 - Mobile Compatible Lids Picker
   اصلاح کامل بخش درب‌های سازگار در موبایل
   فقط محصول تست 2815
   ========================================================= */

@media (max-width: 767px) {

    /* =====================================================
       1. کنترل عمومی عرض و Box Sizing
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-compatible-lids-picker,
    .zdv-product-layout--separate-lid .zd-compatible-lids-picker *,
    .zdv-product-layout--separate-lid .zd-picker,
    .zdv-product-layout--separate-lid .zd-picker-main,
    .zdv-product-layout--separate-lid .zd-picker-side,
    .zdv-product-layout--separate-lid .zd-picker-panels,
    .zdv-product-layout--separate-lid .zd-picker-panel {
        box-sizing: border-box !important;
    }

    .zdv-product-layout--separate-lid .zd-compatible-lids-picker,
    .zdv-product-layout--separate-lid .zd-picker,
    .zdv-product-layout--separate-lid .zd-picker-main,
    .zdv-product-layout--separate-lid .zd-picker-side,
    .zdv-product-layout--separate-lid .zd-picker-panels {
        width: 100% !important;
        max-width: 100% !important;
    }


    /* =====================================================
       2. عنوان اصلی بخش درب‌های سازگار
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-picker-header h3 {
        margin-bottom: 5px !important;

        font-size: 16px !important;
        line-height: 1.7 !important;
    }

    .zdv-product-layout--separate-lid .zd-picker-header h3 small {
        display: inline-block !important;

        font-size: 9px !important;
        line-height: 1.5 !important;
    }

    .zdv-product-layout--separate-lid .zd-picker-header p {
        margin: 0 !important;

        font-size: 13px !important;
        line-height: 1.8 !important;
    }


    /* =====================================================
       3. لیست انتخاب درب‌ها
       تمام گزینه‌ها هم‌عرض باشند
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-picker-badges {
        width: 100% !important;
        max-width: 100% !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 8px !important;
    }

    .zdv-product-layout--separate-lid .zd-picker-badge {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        flex: 0 0 auto !important;

        margin: 0 !important;
        padding-right: 12px !important;
        padding-left: 12px !important;

        text-align: right !important;

        white-space: normal !important;
        overflow-wrap: break-word !important;
    }


    /* =====================================================
       4. تصویر و کادر راهنمای تعداد
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-picker-media-col,
    .zdv-product-layout--separate-lid .zd-picker-media,
    .zdv-product-layout--separate-lid .zd-picker-thumb {
        max-width: 100% !important;
    }

    .zdv-product-layout--separate-lid .zd-picker-help {
        width: 100% !important;
        max-width: 100% !important;

        min-height: 42px !important;
        height: auto !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        gap: 5px !important;

        margin-top: 8px !important;
        padding: 7px 9px !important;

        text-align: center !important;
    }

    .zdv-product-layout--separate-lid .zd-picker-help-icon {
        width: auto !important;
        min-width: 0 !important;

        flex: 0 0 auto !important;

        font-size: 11px !important;
        line-height: 1 !important;
    }

    .zdv-product-layout--separate-lid .zd-picker-help-text {
        min-width: 0 !important;
        max-width: 100% !important;

        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;

        overflow: hidden !important;

        font-size: 10.5px !important;
        line-height: 1.65 !important;
        font-weight: 600 !important;

        text-align: center !important;
    }


    /* =====================================================
       5. عنوان طلایی هر درب
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-picker-title {
        display: block !important;

        max-width: 100% !important;

        margin: 0 0 12px !important;
        padding-right: 10px !important;
        padding-left: 6px !important;

        font-size: 15.5px !important;
        line-height: 1.75 !important;

        overflow-wrap: break-word !important;
        width: 100% !important;
        text-align: right !important;
    }


    /* =====================================================
       6. فرم خرید ورییشن‌های درب
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-picker-form-area,
    .zdv-product-layout--separate-lid .zd-picker-cart,
    .zdv-product-layout--separate-lid .zd-picker-cart form.cart {
        width: 100% !important;
        max-width: 100% !important;
    }

    .zdv-product-layout--separate-lid .zd-picker-cart form.cart {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 8px !important;
    }


    /* جدول ورییشن */

    .zdv-product-layout--separate-lid .zd-picker-cart table.variations {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 0 8px !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    table.variations
    th.label,

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    table.variations
    td.value {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    table.variations
    td.value {
        width: 100% !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        padding-right: 0 !important;
        padding-left: 0 !important;

        overflow: visible !important;
    }


    /* =====================================================
       7. دکمه لغو انتخاب
       بالای دکمه‌های ورییشن
       ===================================================== */

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    table.variations
    .wd-reset-var {
        position: static !important;

        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;

        order: -1 !important;

        width: auto !important;
        max-width: 100% !important;

        align-self: flex-start !important;

        margin: 0 0 6px !important;
        padding: 0 !important;

        transform: none !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .reset_variations {
        position: static !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;

        min-height: 24px !important;

        margin: 0 !important;
        padding: 3px 7px !important;

        border: 1px solid #e2e8f0 !important;
        border-radius: 7px !important;

        background: #f8fafc !important;
        color: #64748b !important;

        font-size: 9px !important;
        line-height: 1.4 !important;
        font-weight: 600 !important;

        white-space: nowrap !important;

        transform: none !important;
    }


    /* =====================================================
       8. گزینه‌های ورییشن
       داخل کانتینر و دارای Wrap
       ===================================================== */

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .wd-swatches-product {
        order: 1 !important;

        width: 100% !important;
        max-width: 100% !important;

        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: flex-start !important;

        gap: 8px !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .wd-swatches-product
    .wd-swatch {
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;

        flex: 0 1 auto !important;

        margin: 0 !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .wd-swatches-product
    .wd-swatch-text {
        max-width: 100% !important;

        white-space: normal !important;
        overflow-wrap: break-word !important;
    }


    /* =====================================================
       9. کنترل تعداد تمام‌عرض
       منفی راست، عدد وسط، مثبت چپ
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-picker-cart .quantity {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        display: block !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;

        gap: 6px !important;

        margin: 0 !important;
        padding: 3px !important;

        direction: rtl !important;
    }

    /* منفی سمت راست */

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-minus {
        order: 1 !important;

        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;

        flex: 0 0 44px !important;
    }

    /* فیلد عدد، تمام فضای میانی */

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    input.qty {
        order: 2 !important;

        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;

        flex: 1 1 0 !important;

        margin: 0 !important;
        padding: 0 8px !important;

        text-align: center !important;
        direction: rtl !important;
    }

    /* مثبت سمت چپ */

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-plus {
        order: 3 !important;

        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;

        flex: 0 0 44px !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-minus,

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-plus,

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    input.qty {
        height: 40px !important;
        min-height: 40px !important;

        box-sizing: border-box !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-minus,

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-plus {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }


    /* =====================================================
       10. ساختار فرم محصول متغیر
       ===================================================== */

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .single_variation_wrap,

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woocommerce-variation-add-to-cart {
        width: 100% !important;
        max-width: 100% !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woocommerce-variation-add-to-cart {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 8px !important;
    }


    /* =====================================================
       11. دکمه ثبت سفارش تمام‌عرض
       ===================================================== */

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .single_add_to_cart_button {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        min-height: 44px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 8px 14px !important;

        font-size: 13px !important;
        line-height: 1.4 !important;

        box-sizing: border-box !important;
    }
}
/* =========================================================
   V.12 - Compatible Lids Mobile Fix Patch
   اصلاح اسکرول، سواچ رنگ، تعداد و CTA
   فقط محصول تست 2815
   ========================================================= */

@media (max-width: 767px) {

    /* =====================================================
       1. بازگرداندن اسکرول لیست درب‌ها
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-picker-side {
        overflow: visible !important;
    }

    .zdv-product-layout--separate-lid .zd-picker-badges {
        width: 100% !important;
        max-width: 100% !important;

        max-height: 340px !important;
        height: auto !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 8px !important;

        overflow-y: auto !important;
        overflow-x: hidden !important;

        padding-left: 6px !important;
        padding-right: 0 !important;

        scrollbar-gutter: stable;
        overscroll-behavior: contain;
    }

    .zdv-product-layout--separate-lid .zd-picker-badge {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;

        flex: 0 0 auto !important;

        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* اسکرول‌بار ظریف */
    .zdv-product-layout--separate-lid .zd-picker-badges::-webkit-scrollbar {
        width: 5px;
    }

    .zdv-product-layout--separate-lid .zd-picker-badges::-webkit-scrollbar-track {
        background: #f1f5f9;
        border-radius: 10px;
    }

    .zdv-product-layout--separate-lid .zd-picker-badges::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 10px;
    }


    /* =====================================================
       2. بازگرداندن اندازه سواچ‌های رنگ
       فقط ورییشن رنگ
       ===================================================== */

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .wd-swatches-product[data-id="pa_color"] {
        width: 100% !important;

        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: flex-start !important;

        gap: 9px !important;

        overflow: visible !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .wd-swatches-product[data-id="pa_color"]
    > .wd-swatch.wd-bg {
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;

        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;

        flex: 0 0 42px !important;

        margin: 0 !important;
        padding: 3px !important;

        box-sizing: border-box !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .wd-swatches-product[data-id="pa_color"]
    .wd-swatch-bg {
        width: 100% !important;
        height: 100% !important;

        display: block !important;

        margin: 0 !important;

        border-radius: 9px !important;
    }

    /* نام رنگ داخل سواچ نمایش داده نشود */
    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .wd-swatches-product[data-id="pa_color"]
    .wd-swatch-text {
        display: none !important;
    }

    /* ورییشن‌های متنی مثل داخل سفید و داخل زرد */
    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .wd-swatches-product:not([data-id="pa_color"])
    > .wd-swatch {
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;

        height: auto !important;

        flex: 0 1 auto !important;
    }


    /* =====================================================
       3. تمام‌عرض‌شدن ستون اطلاعات و فرم خرید
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-picker-panel .zd-picker-info-col,
    .zdv-product-layout--separate-lid .zd-picker-panel .zd-picker-info-top,
    .zdv-product-layout--separate-lid .zd-picker-panel .zd-picker-form-area,
    .zdv-product-layout--separate-lid .zd-picker-panel .zd-picker-cart,
    .zdv-product-layout--separate-lid .zd-picker-panel .zd-picker-cart form.cart,
    .zdv-product-layout--separate-lid .zd-picker-panel .single_variation_wrap,
    .zdv-product-layout--separate-lid
    .zd-picker-panel
    .woocommerce-variation-add-to-cart {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        box-sizing: border-box !important;
    }


    /* =====================================================
       4. فرم محصولات ساده
       ===================================================== */

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-simple
    .zd-picker-cart
    form.cart {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 8px !important;
    }


    /* =====================================================
       5. فرم محصولات متغیر
       ===================================================== */

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-variable
    .woocommerce-variation-add-to-cart {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 8px !important;
    }


    /* =====================================================
       6. کنترل تعداد کاملاً تمام‌عرض
       ===================================================== */

    .zdv-product-layout--separate-lid .zd-picker-cart .quantity,
    .zdv-product-layout--separate-lid .zd-picker-cart .woopq-quantity {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        display: block !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        display: grid !important;

        grid-template-columns:
            44px minmax(0, 1fr) 44px !important;

        grid-template-areas:
            "plus field minus" !important;

        gap: 6px !important;

        margin: 0 !important;
        padding: 3px !important;

        direction: ltr !important;

        box-sizing: border-box !important;
    }

    /* مثبت سمت چپ */
    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-plus {
        grid-area: plus !important;
    }

    /* فیلد عدد تمام فضای میانی */
    .zdv-product-layout--separate-lid
    .zd-picker-cart
    input.qty {
        grid-area: field !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 8px !important;

        text-align: center !important;
        direction: rtl !important;

        box-sizing: border-box !important;
    }

    /* منفی سمت راست */
    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-minus {
        grid-area: minus !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-plus,

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-minus,

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    input.qty {
        width: 100% !important;
        height: 40px !important;
        min-height: 40px !important;

        margin: 0 !important;

        box-sizing: border-box !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-plus,

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .woopq-quantity-input-minus {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }


    /* =====================================================
       7. دکمه ثبت سفارش کاملاً تمام‌عرض
       ===================================================== */

    .zdv-product-layout--separate-lid
    .zd-picker-cart
    .single_add_to_cart_button {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;

        min-height: 44px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        flex: 0 0 100% !important;

        margin: 0 !important;
        padding: 8px 14px !important;

        box-sizing: border-box !important;
    }
}
/* =========================================================
   V.12 - Compatible Lids Vertical Scroll Fix
   فقط محصول تست 2815
   لیست درب‌ها فقط زیر هم + اسکرول عمودی
   ========================================================= */

@media (max-width: 767px) {

    /* ستون لیست درب‌ها */
    .zdv-product-layout--separate-lid .zd-picker-side {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    /* خود لیست */
    .zdv-product-layout--separate-lid .zd-picker-badges {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        justify-content: flex-start !important;

        gap: 8px !important;

        max-height: 340px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;

        margin: 0 !important;
        padding: 0 0 0 6px !important;

        box-sizing: border-box !important;
    }

    /* هر آیتم فقط یک ردیف کامل */
    .zdv-product-layout--separate-lid .zd-picker-badge {
        display: block !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        flex: 0 0 auto !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }

    /* خود دکمه/لینک هر درب */
    .zdv-product-layout--separate-lid .zd-picker-badge > a,
    .zdv-product-layout--separate-lid .zd-picker-badge > button,
    .zdv-product-layout--separate-lid .zd-picker-badge > div {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        box-sizing: border-box !important;
    }

    /* اگر حالت active روی آیتم اعمال می‌شود، بیرون‌زدگی نداشته باشد */
    .zdv-product-layout--separate-lid .zd-picker-badge.is-active,
    .zdv-product-layout--separate-lid .zd-picker-badge.active,
    .zdv-product-layout--separate-lid .zd-picker-badge[aria-current="true"] {
        margin: 0 !important;
        transform: none !important;
    }

    /* اسکرول‌بار ظریف */
    .zdv-product-layout--separate-lid .zd-picker-badges::-webkit-scrollbar {
        width: 5px;
    }

    .zdv-product-layout--separate-lid .zd-picker-badges::-webkit-scrollbar-track {
        background: #f1f5f9;
        border-radius: 999px;
    }

    .zdv-product-layout--separate-lid .zd-picker-badges::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 999px;
    }
}
/* =========================================================
   V.12 - Compatible Lids Full Width Purchase Controls
   کنترل تعداد و CTA کاملاً تمام عرض
   فقط محصول تست 2815
   ========================================================= */

@media (max-width: 767px) {

    /* ستون اطلاعات محصول فعال */
    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-info-col,

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-info-top,

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-form-area,

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        align-self: stretch !important;

        margin-right: 0 !important;
        margin-left: 0 !important;

        box-sizing: border-box !important;
    }

    /* تمام فرم‌های ساده و متغیر */
    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    form.cart {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 8px !important;

        margin-right: 0 !important;
        margin-left: 0 !important;

        box-sizing: border-box !important;
    }

    /* والد خرید محصول متغیر */
    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .single_variation_wrap,

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .woocommerce-variation-add-to-cart,

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .variations_button {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        align-self: stretch !important;

        box-sizing: border-box !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .woocommerce-variation-add-to-cart {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 8px !important;
    }

    /* پوسته کنترل تعداد */
    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    .quantity,

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    .woopq-quantity {
        float: none !important;

        width: 100% !important;
        min-width: 100% !important;
        max-width: none !important;

        flex: 0 0 100% !important;
        align-self: stretch !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }

    /* ردیف منفی، عدد و مثبت */
    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    .woopq-quantity-input {
        width: 100% !important;
        min-width: 100% !important;
        max-width: none !important;

        display: grid !important;

        grid-template-columns:
            44px minmax(0, 1fr) 44px !important;

        grid-template-areas:
            "plus number minus" !important;

        gap: 6px !important;

        margin: 0 !important;
        padding: 4px !important;

        direction: ltr !important;

        box-sizing: border-box !important;
    }

    /* مثبت سمت چپ */
    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    .woopq-quantity-input-plus {
        grid-area: plus !important;
    }

    /* عدد در تمام فضای میانی */
    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    input.qty {
        grid-area: number !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 10px !important;

        text-align: center !important;
        direction: rtl !important;

        box-sizing: border-box !important;
    }

    /* منفی سمت راست */
    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    .woopq-quantity-input-minus {
        grid-area: minus !important;
    }

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    .woopq-quantity-input-plus,

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    .woopq-quantity-input-minus,

    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    input.qty {
        height: 42px !important;
        min-height: 42px !important;

        box-sizing: border-box !important;
    }

    /* CTA کاملاً تمام عرض */
    .zdv-product-layout--separate-lid
    .zd-picker-panel.is-active
    .zd-picker-cart
    .single_add_to_cart_button {
        float: none !important;

        width: 100% !important;
        min-width: 100% !important;
        max-width: none !important;

        flex: 0 0 100% !important;
        align-self: stretch !important;

        min-height: 46px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 9px 14px !important;

        box-sizing: border-box !important;
    }
}
/* =========================================================
   V.12 - Mobile Compatible Lids Scroll Fade
   ابتدای لیست: فقط Fade پایین
   وسط لیست: Fade بالا و پایین
   انتهای لیست: فقط Fade بالا
   فقط محصول تست 2815
   ========================================================= */

@media (max-width: 767px) {

    .zdv-product-layout--separate-lid .zd-picker-side {
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    /* حذف Fadeهای قدیمی والد */
    .zdv-product-layout--separate-lid .zd-picker-side::before,
    .zdv-product-layout--separate-lid .zd-picker-side::after {
        content: none !important;
        display: none !important;
    }

    /* لیست اسکرولی */
    .zdv-product-layout--separate-lid .zd-picker-badges {
        position: relative !important;

        width: 100% !important;
        max-width: 100% !important;

        max-height: 236px !important;
        height: auto !important;

        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;

        gap: 8px !important;

        overflow-y: auto !important;
        overflow-x: hidden !important;

        margin: 0 !important;
        padding: 0 0 0 6px !important;

        box-sizing: border-box !important;
        overscroll-behavior: contain;
    }

    /* هر درب یک ردیف کامل */
    .zdv-product-layout--separate-lid .zd-picker-badge {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        flex: 0 0 auto !important;

        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* حالت اولیه: فقط پایین لیست Fade شود */
    .zdv-product-layout--separate-lid
    .zd-picker-side.has-scroll.is-scroll-start
    .zd-picker-badges {
        -webkit-mask-image: linear-gradient(
            to bottom,
            #000 0%,
            #000 calc(100% - 85px),
            transparent 100%
        ) !important;

        mask-image: linear-gradient(
            to bottom,
            #000 0%,
            #000 calc(100% - 85px),
            transparent 100%
        ) !important;
    }

    /* وسط لیست: بالا و پایین Fade شوند */
    .zdv-product-layout--separate-lid
    .zd-picker-side.has-scroll:not(.is-scroll-start):not(.is-scroll-end)
    .zd-picker-badges {
        -webkit-mask-image: linear-gradient(
            to bottom,
            transparent 0%,
            #000 75px,
            #000 calc(100% - 85px),
            transparent 100%
        ) !important;

        mask-image: linear-gradient(
            to bottom,
            transparent 0%,
            #000 75px,
            #000 calc(100% - 85px),
            transparent 100%
        ) !important;
    }

    /* انتهای لیست: فقط بالا Fade شود */
    .zdv-product-layout--separate-lid
    .zd-picker-side.has-scroll.is-scroll-end
    .zd-picker-badges {
        -webkit-mask-image: linear-gradient(
            to bottom,
            transparent 0%,
            #000 75px,
            #000 100%
        ) !important;

        mask-image: linear-gradient(
            to bottom,
            transparent 0%,
            #000 75px,
            #000 100%
        ) !important;
    }

    /* اگر لیست نیاز به اسکرول نداشت، هیچ Fadeای نداشته باشد */
    .zdv-product-layout--separate-lid
    .zd-picker-side:not(.has-scroll)
    .zd-picker-badges {
        -webkit-mask-image: none !important;
        mask-image: none !important;
    }

    /* اسکرول‌بار ظریف */
    .zdv-product-layout--separate-lid .zd-picker-badges::-webkit-scrollbar {
        width: 5px;
    }

    .zdv-product-layout--separate-lid .zd-picker-badges::-webkit-scrollbar-track {
        background: #edf2f7;
        border-radius: 999px;
    }

    .zdv-product-layout--separate-lid .zd-picker-badges::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 999px;
    }
}

/* =========================================================
   V.12.8 - Separate Lid Mobile Polish Corrections — Final Pass
   ========================================================= */

/* Out-of-stock: make all lid notice actions fully neutral/inactive */
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-status-wrap,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-actions,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-confirm,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-jump {
  pointer-events: none !important;
}

.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-confirm,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-jump,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-check {
  background: #F8FAFC !important;
  border-color: #D8DEE8 !important;
  color: #8A95A3 !important;
  box-shadow: none !important;
  filter: grayscale(1) !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-confirm span,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-status-wrap.is-selected .zdv-lid-status-text,
.zdv-summary .zdv-purchase-box.is-outofstock .zdv-lid-status-wrap .zdv-lid-status-text {
  color: #8A95A3 !important;
}

@media (max-width: 767px) {

  /* Lids list option text should not touch right edge */
  .zdv-product-layout--separate-lid .zd-picker-badge,
  .zd-compatible-lids-picker .zd-picker-badge,
  .zdv-product-layout--separate-lid .zd-picker--scroll-cols .zd-picker-badge {
    min-height: 44px !important;
    height: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    padding-top: 6px !important;
    padding-right: 24px !important;
    padding-bottom: 6px !important;
    padding-left: 12px !important;
    text-align: right !important;
    line-height: 1.55 !important;
    direction: rtl !important;
    white-space: normal !important;
  }

  .zdv-product-layout--separate-lid .zd-picker-badge > a,
  .zdv-product-layout--separate-lid .zd-picker-badge > button,
  .zdv-product-layout--separate-lid .zd-picker-badge > div,
  .zd-compatible-lids-picker .zd-picker-badge > a,
  .zd-compatible-lids-picker .zd-picker-badge > button,
  .zd-compatible-lids-picker .zd-picker-badge > div {
    width: 100% !important;
    justify-content: flex-start !important;
    text-align: right !important;
    direction: rtl !important;
  }

  .zdv-product-layout--separate-lid .zd-picker-badge.is-active,
  .zd-compatible-lids-picker .zd-picker-badge.is-active {
    padding-right: 26px !important;
  }
}