/* ==========================================================================
   داروسین — استایل‌های تکمیلی نسخهٔ داینامیک (HTMX)
   style.css دست‌نخورده می‌ماند؛ این فایل فقط حالت‌های پویا را پوشش می‌دهد.
   ========================================================================== */

/* ---- خطاهای فرم ---- */
.dk-error { font-size: .72rem; color: #B4453F; margin-top: 6px; line-height: 1.8; }
.dk-input.is-invalid, .dk-select.is-invalid, .dk-textarea.is-invalid,
.dk-otp input.is-invalid { border-color: #D9736D; box-shadow: 0 0 0 3px rgba(217, 115, 109, .12); }
.dk-form-error {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px; margin-bottom: 14px;
  border-radius: var(--dk-r-sm);
  background: #FDECEC; color: #8F3A35;
  font-size: .76rem; line-height: 1.9;
}
.dk-form-error svg { width: 18px; height: 18px; flex: none; margin-top: 3px; }
.dk-success-box { text-align: center; padding: 30px 16px; }
.dk-success-box .dk-success-ico {
  width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--dk-mint-100); color: var(--dk-green-700);
}
.dk-success-box .dk-success-ico svg { width: 30px; height: 30px; }

/* ---- نشان تعداد سبد وقتی صفر است ---- */
.dk-cart-count[hidden], .dk-tab-badge[hidden] { display: none !important; }

/* ---- اعلان‌ها (toast) ---- */
.dk-toasts {
  position: fixed; z-index: 1090;
  inset-inline-start: 16px; bottom: calc(76px + env(safe-area-inset-bottom));
  display: flex; flex-direction: column; gap: 8px;
  max-width: min(360px, calc(100vw - 32px));
  pointer-events: none;
}
@media (min-width: 992px) { .dk-toasts { bottom: 24px; } }
.dk-toast {
  pointer-events: auto;
  display: flex; align-items: center; gap: 10px;
  padding: 11px 14px;
  border-radius: var(--dk-r-sm);
  background: var(--dk-green-800); color: #fff;
  font-size: .78rem; font-weight: 600; line-height: 1.7;
  box-shadow: var(--dk-shadow-lg);
  animation: dk-toast-in .25s ease-out;
}
.dk-toast svg { width: 18px; height: 18px; flex: none; }
.dk-toast--success { background: var(--dk-green-700); }
.dk-toast--error { background: #B4453F; }
.dk-toast--warning { background: #A9773A; }
.dk-toast--info { background: var(--dk-ink); }
.dk-toast.is-leaving { opacity: 0; transform: translateY(6px); transition: .25s ease; }
@keyframes dk-toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ---- نشانگر بارگذاری HTMX ---- */
.htmx-indicator { display: none; }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { display: inline-block; }
.dk-spin {
  width: 16px; height: 16px; border-radius: 50%;
  border: 2px solid currentColor; border-inline-end-color: transparent;
  animation: dk-spin .7s linear infinite; vertical-align: -3px; margin-inline-end: 6px;
}
@keyframes dk-spin { to { transform: rotate(360deg); } }
.htmx-request .dk-btn { opacity: .75; pointer-events: none; }
#product-results.htmx-request, #blog-results.htmx-request, #cart-root.htmx-request { opacity: .55; transition: opacity .15s; }

/* ---- پیشنهاد زندهٔ جستجو ---- */
.dk-suggest {
  position: absolute; top: calc(100% + 6px); inset-inline: 0; z-index: 1060;
  background: var(--dk-white, #fff); border: 1px solid var(--dk-line-2);
  border-radius: var(--dk-r-md); box-shadow: var(--dk-shadow-lg);
  overflow: hidden;
}
.dk-suggest:empty { display: none; }
.dk-suggest a {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 14px; font-size: .8rem; color: var(--dk-ink);
}
.dk-suggest a:hover { background: var(--dk-mint-50); }
.dk-suggest img { width: 34px; height: 34px; object-fit: contain; flex: none; }
.dk-suggest .dk-suggest-price { margin-inline-start: auto; font-size: .72rem; color: var(--dk-green-700); font-weight: 700; white-space: nowrap; }
.dk-suggest .dk-suggest-all { justify-content: center; font-weight: 700; color: var(--dk-green-700); border-top: 1px solid var(--dk-line); }
.dk-suggest .dk-suggest-empty { padding: 12px 14px; font-size: .76rem; color: var(--dk-muted); }

/* ---- کارت محصول: وضعیت ناموجود / نیازمند نسخه ---- */
.dk-product.is-out .dk-product-media img { filter: grayscale(1); opacity: .55; }
.dk-rx-badge {
  position: absolute; top: 12px; inset-inline-start: 12px; z-index: 1;
  padding: 3px 9px; border-radius: 999px;
  background: #EAF2FA; color: #2F6FA8; font-size: .64rem; font-weight: 700;
}
.dk-product .dk-off-badge + .dk-rx-badge { top: 40px; inset-inline-start: auto; inset-inline-end: 12px; }
.dk-btn-cart:disabled { opacity: .4; cursor: not-allowed; }

/* ---- قالب‌های متفرقه ---- */
.dk-otp-debug { font-size: .74rem; color: var(--dk-green-700); background: var(--dk-mint-100); border-radius: var(--dk-r-xs); padding: 6px 10px; display: inline-block; margin-top: 10px; direction: ltr; letter-spacing: 3px; font-weight: 800; }
.dk-thumb { cursor: pointer; }
.dk-acc-item .dk-acc-body a, .dk-prose a, .dk-note a { color: var(--dk-green-700); font-weight: 700; }
.dk-order-items .dk-cart-item { align-items: center; }
.dk-mini-list { display: flex; flex-direction: column; gap: 10px; }
.dk-review { padding: 12px 0; border-bottom: 1px solid var(--dk-line); font-size: .8rem; }
.dk-review:last-child { border-bottom: 0; }
.dk-review-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.dk-stars { color: var(--dk-gold); font-size: .82rem; letter-spacing: 1px; direction: ltr; display: inline-block; }
.dk-stars-input { display: flex; gap: 4px; direction: ltr; }
.dk-stars-input label { cursor: pointer; font-size: 1.3rem; color: var(--dk-line-2); }
.dk-stars-input input { position: absolute; opacity: 0; width: 0; height: 0; }
.dk-stars-input input:checked ~ label, .dk-stars-input label:hover, .dk-stars-input label:hover ~ label { color: var(--dk-gold); }
.dk-qa { padding: 12px 0; border-bottom: 1px solid var(--dk-line); font-size: .8rem; }
.dk-qa:last-child { border-bottom: 0; }
.dk-qa-a { margin-top: 6px; padding: 10px 12px; border-radius: var(--dk-r-xs); background: var(--dk-mint-50); color: #46605A; }
.dk-sandbox { max-width: 520px; margin: 0 auto; }
.dk-sandbox .dk-sandbox-amount { font-size: 1.6rem; font-weight: 800; color: var(--dk-green-800); }
.dk-filters .dk-btn[type="reset"] { margin-top: 8px; }
.dk-post-cover img { width: 100%; height: 100%; object-fit: cover; }
.dk-article-cover img { width: 100%; height: 100%; object-fit: cover; }
.dk-empty { text-align: center; }

/* ==========================================================================
   صفحهٔ ورود / ثبت‌نام
   موبایل: کارت دقیقاً وسط فضای بین هدر و تب‌بار (فوتر مخفی)
   دسکتاپ: چیدمان دو ستونه — پنل معرفی سبز + فرم
   ========================================================================== */
.dk-page-auth .dk-footer { display: none; }
.dk-page-auth .dk-auth-link { visibility: hidden; }        /* لینک «ورود» در هدر وقتی خود صفحهٔ ورود هستیم */

.dk-auth {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  /* ارتفاع پنجره منهای هدر موبایل (۵۶px + خط زیرین) و نوار پایین (۶۹px)
     → کارت دقیقاً وسط فضای قابل‌مشاهده قرار می‌گیرد */
  min-height: calc(100vh - 57px - 69px);
  min-height: calc(100dvh - 57px - 69px);
}
.dk-auth-side { display: none; }
.dk-auth-main {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 16px;
}
.dk-auth-panel { width: 100%; max-width: 400px; }
.dk-auth .dk-auth-card { margin: 0 auto; }
.dk-auth-foot {
  margin: 16px 0 0;
  text-align: center;
  font-size: .72rem;
  color: var(--dk-muted);
}
.dk-auth-foot a { display: inline-flex; align-items: center; gap: 4px; color: var(--dk-muted); }
.dk-auth-foot a:hover { color: var(--dk-green-700); }
.dk-auth-foot svg { width: 14px; height: 14px; }
.dk-auth .dk-form-error { text-align: start; }

@media (min-width: 992px) {
  .dk-auth {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    min-height: calc(100vh - var(--dk-header-h) - 1px);
    min-height: calc(100dvh - var(--dk-header-h) - 1px);
  }

  /* ---- پنل معرفی ---- */
  .dk-auth-side {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    background:
      radial-gradient(circle at 18% 18%, rgba(255, 255, 255, .08), transparent 42%),
      linear-gradient(160deg, var(--dk-green-900) 0%, var(--dk-green-800) 55%, var(--dk-green-700) 100%);
    color: #fff;
    padding: 56px 64px;
  }
  .dk-auth-side::before,
  .dk-auth-side::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, .05);
  }
  .dk-auth-side::before { width: 320px; height: 320px; inset-inline-start: -110px; top: -110px; }
  .dk-auth-side::after { width: 420px; height: 420px; inset-inline-end: -160px; bottom: -190px; }
  .dk-auth-side-inner { position: relative; z-index: 1; max-width: 480px; }
  .dk-auth-side-badge {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    font-size: .72rem; font-weight: 700;
    margin-bottom: 22px;
  }
  .dk-auth-side-title { font-size: 1.9rem; font-weight: 800; color: #fff; line-height: 1.7; margin-bottom: 14px; }
  .dk-auth-side-text { font-size: .9rem; line-height: 2.2; color: rgba(255, 255, 255, .82); margin-bottom: 26px; }
  .dk-auth-perks { list-style: none; padding: 0; margin: 0 0 34px; display: flex; flex-direction: column; gap: 12px; }
  .dk-auth-perks li { display: flex; align-items: center; gap: 12px; font-size: .84rem; font-weight: 600; }
  .dk-auth-perks svg {
    width: 26px; height: 26px; flex: none; padding: 5px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    color: #fff;
  }
  .dk-auth-side-media img { width: 100%; max-width: 300px; display: block; }

  /* ---- ستون فرم ---- */
  .dk-auth-main {
    background: var(--dk-surface-2);
    padding: 48px 40px;
  }
  .dk-auth-panel { max-width: 460px; }
  .dk-auth .dk-auth-card {
    max-width: none;
    text-align: start;
    padding: 44px 40px 36px;
    border: 0;
    border-radius: var(--dk-r-xl);
    box-shadow: var(--dk-shadow-lg);
  }
  .dk-auth .dk-auth-icon { margin: 0 0 22px; width: 60px; height: 60px; border-radius: 20px; }
  .dk-auth .dk-auth-icon svg { width: 30px; height: 30px; }
  .dk-auth .dk-auth-title { font-size: 1.55rem; margin-bottom: 8px; }
  .dk-auth .dk-auth-note { font-size: .86rem; margin-bottom: 26px; }
  .dk-auth .dk-auth-note br { display: none; }
  .dk-auth .dk-input { padding: 13px 16px; font-size: .95rem; }
  .dk-auth .dk-btn { padding-block: 13px; font-size: .92rem; }
  .dk-auth .dk-otp { justify-content: flex-end; gap: 12px; }   /* جعبه‌ها LTR هستند؛ چسبیده به سمت راست کارت */
  .dk-auth .dk-otp input { width: 54px; height: 62px; font-size: 1.4rem; }
  .dk-auth .dk-otp-debug { margin-top: 0; margin-bottom: 18px; }
  .dk-auth .dk-hint { text-align: start; font-size: .74rem; }
  .dk-auth-foot { text-align: start; margin-top: 22px; }
}

@media (min-width: 1400px) {
  .dk-auth-side { padding: 72px 96px; }
  .dk-auth-side-inner { max-width: 540px; }
}

/* ==========================================================================
   پنل کاربری — نسخهٔ موبایل/تبلت
   ========================================================================== */
.dk-acc-user { color: inherit; }
.dk-acc-user-text { min-width: 0; flex: 1; }
.dk-acc-name, .dk-acc-mobile { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dk-acc-user-chevron { width: 16px; height: 16px; color: var(--dk-muted-2); flex: none; }
.dk-acc-user:hover .dk-acc-user-chevron { color: var(--dk-green-700); }
.dk-acc-nav a.dk-acc-logout { color: #B4453F; }
.dk-acc-nav a.dk-acc-logout svg { color: #B4453F; }
.dk-acc-nav a.dk-acc-logout:hover { background: #FDECEC; }

@media (max-width: 991.98px) {
  .dk-acc-grid { gap: 14px; }
  .dk-acc-side { padding: 12px 14px 14px; border-radius: var(--dk-r-md); }
  .dk-acc-user { padding-bottom: 12px; margin-bottom: 12px; }
  .dk-acc-avatar { width: 40px; height: 40px; border-radius: 13px; }

  /* حالت نوار افقی (صفحات داخلی): تب‌های کوچک، تب فعال پررنگ و در دید */
  .dk-acc-nav { gap: 6px; scroll-snap-type: x proximity; scroll-padding-inline: 8px; }
  .dk-acc-nav a {
    flex: none; scroll-snap-align: start;
    padding: 8px 12px;
    font-size: .74rem;
    background: var(--dk-surface);
    border-radius: 999px;
  }
  .dk-acc-nav a svg { width: 16px; height: 16px; }
  .dk-acc-nav a.is-active { background: var(--dk-green-800); color: #fff; }
  .dk-acc-nav a.is-active svg { color: #fff; }
  .dk-acc-nav a.dk-acc-logout { background: #FDECEC; }

  /* حالت شبکه‌ای (پیشخوان): همهٔ بخش‌ها یک‌جا مثل صفحهٔ «حساب من» اپلیکیشن */
  .dk-acc-nav--grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    overflow: visible;
  }
  .dk-acc-nav--grid a {
    flex-direction: column; justify-content: center;
    gap: 8px;
    padding: 14px 6px 12px;
    border-radius: var(--dk-r-md);
    text-align: center; white-space: normal; line-height: 1.6;
    font-size: .72rem;
  }
  .dk-acc-nav--grid a svg { width: 24px; height: 24px; }
  .dk-acc-nav--grid a.is-active { background: var(--dk-mint-100); color: var(--dk-green-800); }
  .dk-acc-nav--grid a.is-active svg { color: var(--dk-green-700); }
  .dk-acc-nav--grid a.dk-acc-logout { background: var(--dk-surface); }

  .dk-acc-grid .dk-page-title { font-size: 1.15rem; }
  .dk-acc-grid .dk-card { padding: 16px 14px; border-radius: var(--dk-r-md); }
  .dk-acc-grid .dk-split { gap: 14px; }
}

@media (max-width: 575.98px) {
  /* آمار پیشخوان: دو ستون فشرده به‌جای چهار کارت بلند زیر هم */
  .dk-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
  .dk-stat { padding: 12px 14px; }
  .dk-stat-label { font-size: .68rem; margin-bottom: 4px; }
  .dk-stat-value { font-size: 1.05rem; }
  .dk-acc-nav--grid a { font-size: .68rem; padding: 12px 4px 10px; }
}

/* ---- جدول‌های پنل: در موبایل هر ردیف یک کارت می‌شود ---- */
@media (max-width: 767.98px) {
  .dk-table--stack { min-width: 0; }
  .dk-table--stack thead { display: none; }
  .dk-table--stack tbody, .dk-table--stack tr, .dk-table--stack td { display: block; width: 100%; }
  .dk-table--stack tr {
    border: 1px solid var(--dk-line);
    border-radius: var(--dk-r-md);
    padding: 4px 14px;
    margin-bottom: 10px;
    background: var(--dk-white, #fff);
  }
  .dk-table--stack tr:last-child { margin-bottom: 0; }
  .dk-table--stack td {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 9px 0;
    border-bottom: 1px dashed var(--dk-line);
    text-align: end;
    font-size: .8rem;
  }
  .dk-table--stack td:last-child { border-bottom: 0; }
  .dk-table--stack td[data-label]::before {
    content: attr(data-label);
    flex: none;
    font-size: .7rem; font-weight: 600; color: var(--dk-muted);
  }
  .dk-table--stack td.dk-table-actions { justify-content: flex-start; padding-top: 10px; }
  .dk-table--stack td.dk-table-actions .dk-section-link { font-weight: 700; color: var(--dk-green-700); }
  .dk-table--stack tr.dk-table-note { margin-top: -6px; border-top-left-radius: 0; border-top-right-radius: 0; }
  .dk-table--stack tr.dk-table-note td { display: block; text-align: start; background: transparent !important; padding: 10px 0; }
}

/* ---- تب‌بار موبایل: دکمهٔ برجستهٔ «ارسال نسخه» خط نشانگر بالای تب را نمی‌گیرد؛
        به‌جای آن، در حالت فعال یک حلقهٔ روشن دور دکمه می‌افتد ---- */
.dk-tab--fab.is-active::before { display: none; }
.dk-tab--fab.is-active .dk-tab-fab {
  box-shadow: 0 0 0 4px var(--dk-mint-200), 0 8px 18px rgba(5, 81, 63, .35);
}


/* ==========================================================================
   سبد خرید و تسویه حساب — نسخهٔ موبایل
   ========================================================================== */
.dk-sticky-bar { display: none; }

@media (max-width: 991.98px) {
  /* نوار چسبان بالای تب‌بار: جمع مبلغ + دکمهٔ اقدام اصلی */
  .dk-sticky-bar {
    position: fixed; z-index: 1034;
    inset-inline: 0;
    bottom: calc(69px + env(safe-area-inset-bottom));
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 10px 16px;
    background: rgba(255, 255, 255, .97);
    backdrop-filter: saturate(180%) blur(12px);
    border-top: 1px solid var(--dk-line);
    box-shadow: 0 -6px 24px rgba(16, 48, 40, .07);
  }
  .dk-sticky-bar .dk-btn { flex: none; padding: 11px 22px; font-size: .84rem; }
  .dk-sticky-bar-total { min-width: 0; line-height: 1.5; }
  .dk-sticky-bar-label { display: block; font-size: .64rem; color: var(--dk-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dk-sticky-bar-total b { font-size: 1.05rem; font-weight: 800; color: var(--dk-ink); white-space: nowrap; }
  .dk-sticky-bar-total small { font-size: .68rem; font-weight: 500; color: var(--dk-muted); }

  /* جا برای نوار چسبان (۶۲px تب‌بار + ۶۶px نوار) و بالا رفتن toastها */
  body.dk-page-cart, body.dk-page-checkout { padding-bottom: calc(62px + 68px); }
  .dk-page-cart .dk-toasts, .dk-page-checkout .dk-toasts { bottom: calc(76px + 68px + env(safe-area-inset-bottom)); }
  .dk-page-cart .dk-footer, .dk-page-checkout .dk-footer { margin-bottom: 0; }

  /* سبد: کارت‌ها و اقلام فشرده‌تر */
  .dk-cart-grid { gap: 14px; }
  .dk-cart-grid .dk-card { padding: 16px 14px; border-radius: var(--dk-r-md); }
  .dk-cart-item { padding: 14px 0; gap: 12px; }
  .dk-cart-name { font-size: .84rem; }
  .dk-cart-actions .dk-price { font-size: .95rem; }
  .dk-cart-actions .dk-qty button { width: 32px; height: 32px; }
  .dk-cart-grid .dk-summary .dk-card--flat { display: flex; flex-wrap: wrap; gap: 4px 18px; padding: 12px 14px; }
  .dk-cart-grid .dk-summary .dk-card--flat .dk-summary-row { flex: 1 1 45%; padding: 5px 0; font-size: .74rem; gap: 6px; }

  /* دکمه‌های داخل کارت خلاصه در موبایل تکراری‌اند (نوار چسبان هست) → فقط لینک ادامهٔ خرید مخفی */
  .dk-page-cart .dk-summary .dk-card > .dk-btn-primary { display: none; }
  .dk-page-cart .dk-summary .dk-card > .dk-btn-outline { margin-top: 12px; }
  .dk-page-checkout #checkout-summary .dk-card > .dk-btn-primary { display: none; }

  /* تسویه: مراحل و کارت‌ها */
  .dk-page-checkout .dk-steps { margin-bottom: 16px; }
  .dk-page-checkout .dk-cart-grid .dk-stack > .dk-card + .dk-card { margin-top: 0; }
  .dk-radio-card { padding: 12px 14px; gap: 10px; }
  .dk-radio-title { font-size: .82rem; }
  .dk-radio-sub { font-size: .7rem; }
  .dk-radio-price { font-size: .76rem; }
}

@media (max-width: 575.98px) {
  .dk-cart-thumb { width: 64px; height: 64px; }
  .dk-cart-item { grid-template-columns: 64px minmax(0, 1fr); }
  .dk-sticky-bar { padding: 9px 14px; }
}

/* ---- نوار اطلاع‌رسانی بالای هدر (از تنظیمات پنل مدیریت) ---- */
.dk-announce {
  background: var(--dk-green-800); color: #fff;
  font-size: .76rem; font-weight: 600; text-align: center;
  padding: 7px 0; line-height: 1.8;
}
.dk-announce a { color: #fff; text-decoration: underline; text-decoration-color: rgba(255,255,255,.4); text-underline-offset: 3px; }
.dk-announce a:hover { color: #fff; text-decoration-color: #fff; }
.dk-acc-nav a.dk-acc-staff { color: var(--dk-green-700); }
.dk-acc-nav a.dk-acc-staff svg { color: var(--dk-green-700); }

/* ==========================================================================
   گالری صفحهٔ محصول: کشیدن (موبایل)، ذره‌بین (دسکتاپ)، نمایش تمام‌صفحه
   ========================================================================== */
.dk-pd-gallery { min-width: 0; }
.dk-pd-stage { position: relative; padding: 0; overflow: hidden; }
.dk-pd-track {
  display: flex; width: 100%;
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.dk-pd-track::-webkit-scrollbar { display: none; }
.dk-pd-slide {
  flex: 0 0 100%; margin: 0;
  display: flex; align-items: center; justify-content: center;
  min-height: 320px; padding: 26px;
  scroll-snap-align: center;
  overflow: hidden; cursor: zoom-in;
}
.dk-pd-slide img {
  max-height: 300px; width: auto; max-width: 100%;
  transition: transform .25s ease;
  -webkit-user-select: none; user-select: none;
}
.dk-pd-slide.is-zoomed img { transform: scale(2); transition: transform .1s ease; }

.dk-pd-expand {
  position: absolute; top: 12px; inset-inline-end: 12px;
  width: 38px; height: 38px; border-radius: 12px; border: 0;
  background: rgba(255, 255, 255, .92); color: var(--dk-green-800);
  box-shadow: var(--dk-shadow-sm);
  display: inline-flex; align-items: center; justify-content: center;
  transition: transform .15s ease, background-color .15s ease;
}
.dk-pd-expand:hover { transform: scale(1.06); background: var(--dk-white, #fff); }
.dk-pd-expand svg { width: 20px; height: 20px; }
.dk-pd-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; border-radius: 999px; border: 0;
  background: rgba(255, 255, 255, .9); color: var(--dk-ink);
  box-shadow: var(--dk-shadow-sm);
  display: inline-flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .2s ease;
}
.dk-pd-arrow svg { width: 18px; height: 18px; }
.dk-pd-arrow--prev { right: 10px; }
.dk-pd-arrow--next { left: 10px; }
.dk-pd-stage:hover .dk-pd-arrow, .dk-pd-arrow:focus-visible { opacity: 1; }
.dk-pd-dots {
  position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 6px; pointer-events: none;
}
.dk-pd-dots span { width: 6px; height: 6px; border-radius: 999px; background: rgba(22, 48, 42, .22); transition: width .2s ease, background-color .2s ease; }
.dk-pd-dots span.is-active { width: 18px; background: var(--dk-green-700); }
.dk-pd-count {
  position: absolute; bottom: 10px; inset-inline-start: 12px;
  font-size: .68rem; font-weight: 700; color: var(--dk-muted);
  background: rgba(255, 255, 255, .85); border-radius: 999px; padding: 1px 9px;
}
.dk-pd-gallery .dk-thumbs { overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.dk-pd-gallery .dk-thumbs::-webkit-scrollbar { display: none; }
.dk-pd-gallery .dk-thumb { flex: none; transition: border-color .15s ease, box-shadow .15s ease; }
.dk-pd-gallery .dk-thumb.is-active { box-shadow: 0 0 0 3px rgba(29, 163, 131, .15); }
.dk-pd-gallery-hint { font-size: .68rem; color: var(--dk-muted-2); margin: 8px 0 0; text-align: center; }
@media (hover: hover) and (pointer: fine) { .dk-pd-gallery-hint { display: none; } }

/* ---- نمایش تمام‌صفحه ---- */
html.dk-lb-open, html.dk-lb-open body { overflow: hidden; }
.dk-lightbox {
  position: fixed; inset: 0; z-index: 2000;
  background: rgba(8, 20, 17, .94);
  display: flex; flex-direction: column;
  opacity: 0; transition: opacity .2s ease, background-color .2s ease;
  color: #fff;
}
.dk-lightbox.is-open { opacity: 1; }
.dk-lightbox[hidden] { display: none; }
.dk-lb-bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: max(12px, env(safe-area-inset-top)) 14px 8px;
}
.dk-lb-count { font-size: .8rem; font-weight: 700; opacity: .85; }
.dk-lb-tools { display: flex; gap: 8px; }
.dk-lb-btn, .dk-lb-nav {
  width: 42px; height: 42px; border-radius: 999px; border: 0;
  background: rgba(255, 255, 255, .12); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background-color .15s ease;
}
.dk-lb-btn:hover, .dk-lb-nav:hover { background: rgba(255, 255, 255, .22); }
.dk-lb-btn svg, .dk-lb-nav svg { width: 22px; height: 22px; }
.dk-lb-stage {
  position: relative; flex: 1; min-height: 0;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; touch-action: none; cursor: zoom-in;
}
.dk-lightbox.is-zoomed .dk-lb-stage { cursor: grab; }
.dk-lb-img {
  width: min(92vw, 720px); height: auto; max-height: 100%;
  object-fit: contain; background: var(--dk-white, #fff); border-radius: 18px; padding: 18px;
  transform-origin: center center; will-change: transform;
  -webkit-user-select: none; user-select: none; -webkit-user-drag: none;
}
.dk-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); }
.dk-lb-nav[hidden] { display: none; }
.dk-lb-prev { right: 14px; }
.dk-lb-next { left: 14px; }
.dk-lb-thumbs {
  display: flex; gap: 8px; justify-content: center;
  padding: 10px 14px 4px; overflow-x: auto; scrollbar-width: none;
}
.dk-lb-thumbs[hidden] { display: none; }
.dk-lb-thumbs button {
  flex: none; width: 52px; height: 52px; border-radius: 12px; padding: 4px;
  border: 2px solid transparent; background: rgba(255, 255, 255, .92); opacity: .6;
  transition: opacity .15s ease, border-color .15s ease;
}
.dk-lb-thumbs button.is-active { opacity: 1; border-color: var(--dk-green-500); }
.dk-lb-thumbs img { width: 100%; height: 100%; object-fit: contain; }
.dk-lb-hint { text-align: center; font-size: .7rem; opacity: .6; margin: 4px 0 max(12px, env(safe-area-inset-bottom)); }
@media (hover: hover) and (pointer: fine) { .dk-lb-hint { display: none; } }
@media (max-width: 767.98px) {
  .dk-lb-nav { display: none; }
  .dk-lb-img { width: 96vw; padding: 10px; border-radius: 14px; }
}

/* ==========================================================================
   خرید در صفحهٔ محصول: بسته‌بندی‌ها و جمع قیمت
   ========================================================================== */
.dk-pd-buybox { display: flex; flex-direction: column; gap: 12px; }
.dk-variants { border: 0; margin: 0; padding: 0; min-width: 0; }
.dk-variants-title { font-size: .82rem; font-weight: 800; color: var(--dk-ink); margin-bottom: 8px; float: none; width: auto; padding: 0; }
.dk-variants-list { display: flex; flex-wrap: wrap; gap: 8px; }
.dk-variant {
  position: relative;
  display: flex; flex-direction: column; gap: 2px;
  min-width: 118px; padding: 10px 14px;
  border: 1.5px solid var(--dk-line-2); border-radius: var(--dk-r-sm);
  background: var(--dk-white, #fff); cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.dk-variant input { position: absolute; opacity: 0; pointer-events: none; }
.dk-variant:hover { border-color: var(--dk-green-500); }
.dk-variant:has(input:checked) { border-color: var(--dk-green-700); background: var(--dk-mint-50); box-shadow: 0 0 0 3px rgba(29, 163, 131, .14); }
.dk-variant:has(input:focus-visible) { outline: 2px solid var(--dk-green-600); outline-offset: 2px; }
.dk-variant.is-out { opacity: .55; cursor: not-allowed; background: var(--dk-surface); }
.dk-variant-title { font-size: .8rem; font-weight: 800; color: var(--dk-ink); line-height: 1.7; }
.dk-variant-price { font-size: .76rem; font-weight: 700; color: var(--dk-green-800); }
.dk-variant-price small { font-size: .64rem; font-weight: 500; color: var(--dk-muted); }
.dk-variant-off {
  position: absolute; top: -9px; inset-inline-end: 10px;
  font-size: .62rem; font-weight: 800; color: #fff;
  background: #D9534F; border-radius: 999px; padding: 0 7px; line-height: 1.6;
}
.dk-pd-unit-label { display: block; font-size: .68rem; font-weight: 600; color: var(--dk-muted); line-height: 1.6; }
.dk-pd-price del[hidden] { display: none; }
.dk-pd-total {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px;
  padding: 12px 16px; border-radius: var(--dk-r-md);
  background: var(--dk-mint-50); border: 1px dashed var(--dk-mint-300);
  transition: background-color .2s ease, border-color .2s ease;
}
.dk-pd-buybox.is-multi .dk-pd-total { background: var(--dk-mint-100); border-style: solid; border-color: var(--dk-mint-300); }
.dk-pd-total-label { font-size: .8rem; font-weight: 700; color: var(--dk-text); }
.dk-pd-total-qty { font-weight: 500; color: var(--dk-muted); }
.dk-pd-total-value b { font-size: 1.15rem; font-weight: 800; color: var(--dk-green-800); }
.dk-pd-total-value small { font-size: .72rem; color: var(--dk-muted); }
.dk-pd-total-saving { flex-basis: 100%; font-size: .72rem; color: #B4453F; }
.dk-pd-total-saving[hidden] { display: none; }
.dk-qty button:disabled { opacity: .35; cursor: not-allowed; background: transparent; }
.dk-price-from { font-size: .62rem !important; font-weight: 600; color: var(--dk-muted); margin-inline: 0 3px !important; }
.dk-cart-variant {
  display: inline-block; font-size: .7rem; font-weight: 700; color: var(--dk-green-800);
  background: var(--dk-mint-100); border-radius: 999px; padding: 0 10px; margin: 2px 0 4px; line-height: 1.9;
}
.dk-search-note { margin-bottom: 16px; }
@media (max-width: 991.98px) {
  .dk-pd-slide { min-height: 260px; padding: 18px; }
  .dk-pd-slide img { max-height: 230px; }
}
@media (max-width: 575.98px) {
  .dk-variant { min-width: calc(50% - 4px); flex: 1 1 calc(50% - 4px); }
}

/* ==========================================================================
   آپلود چندفایلی نسخه
   ========================================================================== */
.dk-upload.is-drag { border-color: var(--dk-green-600); background: var(--dk-mint-100); }
.dk-upload.is-invalid { border-color: #D9736D; }
[data-multi-upload].has-files .dk-upload { padding: 18px 20px; }
.dk-upload-list { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.dk-upload-list:empty { display: none; }
.dk-upload-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px; border: 1px solid var(--dk-line); border-radius: var(--dk-r-sm); background: var(--dk-white, #fff);
  animation: dk-pop .2s ease;
}
.dk-upload-item.is-busy { color: var(--dk-muted); border-style: dashed; }
.dk-upload-thumb {
  flex: none; width: 46px; height: 46px; border-radius: 10px; overflow: hidden;
  background: var(--dk-surface); display: inline-flex; align-items: center; justify-content: center;
}
.dk-upload-thumb img { width: 100%; height: 100%; object-fit: cover; }
.dk-upload-thumb.is-pdf { font-size: .66rem; font-weight: 800; color: #B4453F; background: #FBEDEC; }
.dk-upload-meta { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.7; }
.dk-upload-meta b { font-size: .74rem; font-weight: 700; color: var(--dk-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; direction: ltr; text-align: right; }
.dk-upload-meta small { font-size: .66rem; color: var(--dk-muted); }
.dk-upload-remove {
  flex: none; width: 30px; height: 30px; border-radius: 999px; border: 0;
  background: var(--dk-surface); color: #B4453F;
  display: inline-flex; align-items: center; justify-content: center;
}
.dk-upload-remove:hover { background: #FBEDEC; }
.dk-upload-remove svg { width: 16px; height: 16px; }
.dk-rx-links { display: inline-flex; flex-wrap: wrap; gap: 4px 12px; }
@keyframes dk-pop { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: none; } }

/* ==========================================================================
   هیرو صفحهٔ اصلی: گوشی با نمای اپلیکیشن داروسین
   همهٔ اندازه‌های داخل گوشی بر حسب em هستند و با --phone-w مقیاس می‌گیرند.
   ========================================================================== */
.dk-hero-art {
  --phone-w: 244px;
  position: relative;
  height: 530px;
  display: flex; align-items: center; justify-content: center;
  isolation: isolate;
}
.dk-hero-art img { width: auto; border-radius: 0; display: inline; }
.dk-hero-glow {
  position: absolute; z-index: -2;
  width: 470px; height: 470px; border-radius: 50%;
  background: radial-gradient(circle at 50% 45%, #D6EEE5 0%, #E6F4EE 40%, rgba(237, 246, 243, 0) 70%);
}
.dk-hero-ring {
  position: absolute; z-index: -1;
  width: 390px; height: 390px; border-radius: 50%;
  border: 1.5px dashed rgba(18, 130, 104, .22);
  animation: dk-ring-spin 80s linear infinite;
}
.dk-hero-capsule {
  position: absolute; z-index: -1;
  width: 64px; height: 24px; border-radius: 999px;
  background: linear-gradient(90deg, var(--dk-green-600) 0 50%, #fff 50% 100%);
  box-shadow: 0 8px 18px -8px rgba(5, 81, 63, .45), inset 0 0 0 1px rgba(5, 81, 63, .08);
  animation: dk-capsule 9s ease-in-out infinite;
}
.dk-hero-capsule--a { top: 9%; right: 13%; --r: 32deg; }
.dk-hero-capsule--b { top: 60%; left: 5%; width: 48px; height: 18px; --r: -28deg; animation-delay: -4s; background: linear-gradient(90deg, var(--dk-gold) 0 50%, #fff 50% 100%); }
.dk-hero-cross {
  position: absolute; z-index: -1; top: 12%; left: 20%;
  width: 26px; height: 26px; opacity: .55;
  background:
    linear-gradient(var(--dk-green-500), var(--dk-green-500)) center / 8px 100% no-repeat,
    linear-gradient(var(--dk-green-500), var(--dk-green-500)) center / 100% 8px no-repeat;
  border-radius: 3px;
  animation: dk-capsule 11s ease-in-out infinite reverse;
}

/* ---- بدنهٔ گوشی ---- */
.dk-phone {
  position: relative;
  width: var(--phone-w);
  aspect-ratio: 9 / 19;
  font-size: calc(var(--phone-w) / 24);
  padding: .72em;
  border-radius: 3.7em;
  background: linear-gradient(150deg, #33443F 0%, #16211E 42%, #0B1311 100%);
  box-shadow:
    inset 0 0 0 .12em #4B5E58,
    inset 0 0 0 .34em #0A100E,
    0 2.8em 5em -1.6em rgba(4, 54, 44, .45),
    0 1.2em 2.2em -1.2em rgba(4, 54, 44, .35);
  animation: dk-phone-float 7s ease-in-out infinite;
}
.dk-phone::after {
  content: ""; position: absolute; inset: .72em; z-index: 6; pointer-events: none;
  border-radius: 3em;
  background: linear-gradient(115deg, rgba(255, 255, 255, .22) 0%, rgba(255, 255, 255, 0) 26%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, .06) 100%);
}
.dk-phone-key { position: absolute; width: .32em; border-radius: .2em; background: linear-gradient(90deg, #1B2522, #3A4944); }
.dk-phone-key--power { right: -.26em; top: 15em; height: 6.4em; }
.dk-phone-key--up { left: -.26em; top: 12em; height: 4.2em; }
.dk-phone-key--down { left: -.26em; top: 17.2em; height: 4.2em; }
.dk-phone-screen {
  position: relative; height: 100%;
  border-radius: 3em; overflow: hidden;
  background: linear-gradient(180deg, #F2F8F5 0%, #F7FAF9 100%);
}
.dk-phone-island {
  position: absolute; z-index: 7; top: .85em; left: 50%; transform: translateX(-50%);
  width: 7.4em; height: 2.15em; border-radius: 1.2em; background: #050807;
}

/* ---- اپلیکیشن ---- */
.dk-app { position: relative; height: 100%; display: flex; flex-direction: column; color: var(--dk-ink); line-height: 1.5; }
.dk-app svg { display: block; }
.dk-app-status {
  direction: ltr; flex: none;
  display: flex; align-items: center; justify-content: space-between;
  height: 3.9em; padding: .7em 2.1em 0 2.5em;
}
.dk-app-status b { font-size: 1.15em; font-weight: 800; font-family: -apple-system, "Segoe UI", Vazirmatn, sans-serif; }
.dk-app-status-icons { display: flex; align-items: center; gap: .4em; }
.dk-app-status-icons svg { height: 1em; width: auto; }
.dk-app-battery { width: 2.2em; height: 1.1em; border: .13em solid currentColor; border-radius: .38em; padding: .12em; position: relative; }
.dk-app-battery::after { content: ""; position: absolute; right: -.35em; top: .28em; width: .18em; height: .38em; border-radius: 0 .1em .1em 0; background: currentColor; }
.dk-app-battery i { display: block; width: 72%; height: 100%; border-radius: .15em; background: var(--dk-green-600); }

.dk-app-body { flex: 1; min-height: 0; overflow: hidden; padding: .3em 1.3em 0; display: flex; flex-direction: column; gap: .8em; }
.dk-app-head { display: flex; align-items: center; gap: .8em; }
.dk-app-logo {
  flex: none; width: 3.4em; height: 3.4em; border-radius: 1.1em;
  background: linear-gradient(140deg, var(--dk-green-500), var(--dk-green-800));
  color: #fff; display: grid; place-items: center;
  box-shadow: 0 .5em 1em -.4em rgba(5, 81, 63, .6);
}
.dk-app-logo svg { width: 1.8em; height: 1.8em; }
.dk-app-brand { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.35; }
.dk-app-brand b { font-size: 1.45em; font-weight: 900; color: var(--dk-green-800); }
.dk-app-brand small { font-size: .82em; color: var(--dk-muted); }
.dk-app-bell {
  position: relative; flex: none; width: 3.2em; height: 3.2em; border-radius: 1em;
  background: var(--dk-white, #fff); color: var(--dk-ink); display: grid; place-items: center;
  box-shadow: 0 .3em .9em rgba(16, 48, 40, .07);
}
.dk-app-bell svg { width: 1.7em; height: 1.7em; }
.dk-app-bell i { position: absolute; top: .75em; right: .8em; width: .6em; height: .6em; border-radius: 50%; background: #E0574F; box-shadow: 0 0 0 .18em #fff; }
.dk-app-search {
  flex: none; height: 3.6em; border-radius: 1.2em; background: var(--dk-white, #fff);
  box-shadow: 0 .3em 1em rgba(16, 48, 40, .06);
  display: flex; align-items: center; gap: .7em; padding: 0 1.1em; color: var(--dk-muted-2);
}
.dk-app-search svg { width: 1.6em; height: 1.6em; color: var(--dk-green-700); }
.dk-app-search span { font-size: .92em; }
.dk-app-banner {
  flex: none; position: relative; overflow: hidden;
  display: flex; align-items: center; gap: .8em;
  padding: .9em 1.05em; border-radius: 1.5em; color: #fff;
  background: linear-gradient(130deg, #05513F 0%, #128268 62%, #1DA383 100%);
  box-shadow: 0 .8em 1.6em -.9em rgba(5, 81, 63, .8);
}
.dk-app-banner::before, .dk-app-banner::after { content: ""; position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .08); }
.dk-app-banner::before { width: 9em; height: 9em; left: -3em; top: -4em; }
.dk-app-banner::after { width: 5em; height: 5em; left: 5em; bottom: -3.2em; }
.dk-app-banner-text { position: relative; flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .15em; }
.dk-app-banner-text b { font-size: 1.08em; font-weight: 800; white-space: nowrap; }
.dk-app-banner-text small { font-size: .72em; opacity: .85; line-height: 1.6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dk-app-banner-btn {
  align-self: flex-start; margin-top: .35em;
  font-size: .72em; font-weight: 800; color: var(--dk-green-800);
  background: var(--dk-white, #fff); border-radius: 999px; padding: .15em 1em;
}
.dk-app-banner-ico { position: relative; flex: none; width: 3.8em; height: 3.8em; border-radius: 1.2em; background: rgba(255, 255, 255, .16); display: grid; place-items: center; }
.dk-app-banner-ico svg { width: 2.1em; height: 2.1em; color: #fff; }
.dk-app-cats { flex: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5em; text-align: center; }
.dk-app-cat { display: flex; flex-direction: column; align-items: center; gap: .35em; min-width: 0; }
.dk-app-cat > span {
  width: 3.9em; height: 3.9em; border-radius: 1.2em; background: var(--dk-white, #fff); color: var(--dk-green-800);
  display: grid; place-items: center; box-shadow: 0 .3em .9em rgba(16, 48, 40, .06);
}
.dk-app-cat:first-child > span { background: var(--dk-mint-200); }
.dk-app-cat svg { width: 2em; height: 2em; }
.dk-app-cat small { font-size: .72em; font-weight: 600; color: var(--dk-text); max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dk-app-section { flex: none; display: flex; justify-content: space-between; align-items: baseline; }
.dk-app-section b { font-size: 1.05em; font-weight: 800; }
.dk-app-section small { font-size: .76em; font-weight: 700; color: var(--dk-green-700); }
.dk-app-products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8em; }
.dk-app-product {
  position: relative; display: flex; flex-direction: column; gap: .35em;
  padding: .65em; border-radius: 1.3em; background: var(--dk-white, #fff); min-width: 0;
  box-shadow: 0 .3em 1em rgba(16, 48, 40, .06);
}
.dk-app-off {
  position: absolute; top: .55em; right: .55em; z-index: 1;
  font-style: normal; font-size: .66em; font-weight: 800; color: #fff;
  background: #E0574F; border-radius: 999px; padding: 0 .65em; line-height: 1.7;
}
.dk-app-product-img { height: 4.8em; border-radius: .9em; background: var(--dk-surface-2); display: grid; place-items: center; overflow: hidden; }
.dk-app-product-img img { max-height: 4.2em !important; max-width: 80% !important; object-fit: contain; }
.dk-app-product-name { font-size: .72em; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dk-app-product-foot { display: flex; align-items: center; justify-content: space-between; gap: .3em; }
.dk-app-product-foot b { font-size: .86em; font-weight: 800; color: var(--dk-ink); }
.dk-app-add { flex: none; width: 1.9em; height: 1.9em; border-radius: .7em; background: var(--dk-green-800); color: #fff; font-size: 1.05em; font-weight: 700; display: grid; place-items: center; line-height: 1; }
.dk-app-tabbar {
  position: relative; z-index: 2; flex: none;
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: end;
  height: 6.2em; padding: 0 .6em 1.5em;
  background: var(--dk-white, #fff); border-radius: 1.8em 1.8em 0 0;
  box-shadow: 0 -.5em 1.6em rgba(16, 48, 40, .07);
}
.dk-app-tabbar > span { display: flex; flex-direction: column; align-items: center; gap: .15em; color: var(--dk-muted-2); }
.dk-app-tabbar svg { width: 1.8em; height: 1.8em; }
.dk-app-tabbar small { font-size: .64em; font-weight: 700; }
.dk-app-tabbar .is-active { color: var(--dk-green-800); }
.dk-app-tab-rx { color: var(--dk-green-800) !important; }
.dk-app-tab-rx i {
  width: 4.3em; height: 4.3em; margin-top: -2.4em; border-radius: 50%;
  display: grid; place-items: center; color: #fff;
  background: linear-gradient(140deg, var(--dk-green-500), var(--dk-green-800));
  box-shadow: 0 .6em 1.2em -.4em rgba(5, 81, 63, .7), 0 0 0 .4em #fff;
}
.dk-app-tab-rx i svg { width: 2.1em; height: 2.1em; }
.dk-app-home-bar { position: absolute; z-index: 3; bottom: .6em; left: 50%; transform: translateX(-50%); width: 8.5em; height: .36em; border-radius: 999px; background: #16302A; }

/* ---- کارت‌های شناور اطراف گوشی ---- */
.dk-hero-float {
  position: absolute; z-index: 3;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px 10px 12px; border-radius: 16px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 14px 34px -10px rgba(16, 48, 40, .22), 0 2px 6px rgba(16, 48, 40, .05);
  line-height: 1.55; white-space: nowrap;
  animation: dk-float 6s ease-in-out infinite;
}
.dk-hero-float b { display: block; font-size: .76rem; font-weight: 800; color: var(--dk-ink); }
.dk-hero-float small { display: block; font-size: .64rem; color: var(--dk-muted); }
.dk-hero-float-ico { flex: none; width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; background: var(--dk-mint-100); color: var(--dk-green-700); }
.dk-hero-float-ico svg { width: 18px; height: 18px; }
.dk-hero-float-ico--gold { background: var(--dk-cream); color: var(--dk-gold); }
.dk-hero-float-ico--blue { background: #EAF1FB; color: #3B6FB6; }
.dk-hero-float--rx { top: 7%; left: 0; }
.dk-hero-float--ship { top: 47%; right: -2%; animation-delay: -2s; }
.dk-hero-float--chat { bottom: 6%; left: -1%; animation-delay: -4s; }

@keyframes dk-phone-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes dk-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes dk-capsule { 0%, 100% { transform: translateY(0) rotate(var(--r, 0deg)); } 50% { transform: translateY(-12px) rotate(calc(var(--r, 0deg) + 12deg)); } }
@keyframes dk-ring-spin { to { transform: rotate(360deg); } }

@media (max-width: 1199.98px) {
  .dk-hero-art { --phone-w: 226px; height: 500px; }
  .dk-hero-float { padding: 8px 11px 8px 10px; gap: 8px; }
  .dk-hero-float small { display: none; }
  .dk-hero-float--rx { left: -2%; }
  .dk-hero-float--ship { right: -4%; }
  .dk-hero-float--chat { left: -3%; }
}
@media (max-width: 991.98px) {
  .dk-hero-art { --phone-w: 214px; height: 470px; }
  .dk-hero-glow { width: 400px; height: 400px; }
  .dk-hero-ring { width: 340px; height: 340px; }
  .dk-hero-float small { display: block; }
  .dk-hero-float--rx { top: 12%; left: 4%; }
  .dk-hero-float--ship { top: 52%; right: 4%; }
  .dk-hero-float--chat { display: none; }
}
@media (max-width: 575.98px) {
  .dk-hero-art {
    --phone-w: 190px; height: 360px; align-items: flex-start; padding-top: 14px;
    -webkit-mask-image: linear-gradient(to bottom, #000 82%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 82%, transparent 100%);
  }
  .dk-hero-glow { width: 330px; height: 330px; top: 10px; }
  .dk-hero-ring { width: 280px; height: 280px; top: 35px; }
  .dk-hero-float { padding: 7px 10px 7px 9px; gap: 7px; border-radius: 13px; }
  .dk-hero-float b { font-size: .66rem; }
  .dk-hero-float small { font-size: .56rem; }
  .dk-hero-float-ico { width: 26px; height: 26px; border-radius: 9px; }
  .dk-hero-float-ico svg { width: 14px; height: 14px; }
  .dk-hero-float--rx { top: 14%; left: 0; }
  .dk-hero-float--ship { top: auto; bottom: 9%; right: 0; }
  .dk-hero-capsule--a { right: 4%; }
}
@media (prefers-reduced-motion: reduce) {
  .dk-phone, .dk-hero-float, .dk-hero-capsule, .dk-hero-cross, .dk-hero-ring { animation: none; }
}
.dk-upload-item.is-busy .dk-spin { display: inline-block; flex: none; margin: 0 12px; }

/* ==========================================================================
   فوتر: بخش بالایی اختیاری (معرفی، اطلاعات تماس، نمادهای اعتماد) از تنظیمات سایت
   و سطر ثابت «طراحی، توسعه و پشتیبانی»
   ========================================================================== */
.dk-footer-top {
  display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;
  gap: 18px 40px;
  padding-bottom: 18px; margin-bottom: 16px;
  border-bottom: 1px solid var(--dk-line);
}
.dk-footer-about { flex: 1 1 260px; max-width: 460px; }
.dk-footer-brand { font-size: .9rem; font-weight: 800; color: var(--dk-ink); margin-bottom: 4px; }
.dk-footer-about p { font-size: .76rem; color: var(--dk-muted); line-height: 2.1; }
.dk-footer-contact { list-style: none; margin: 0; padding: 0; flex: 1 1 260px; display: flex; flex-direction: column; gap: 2px; }
.dk-footer-contact li { display: flex; align-items: flex-start; gap: 8px; font-size: .76rem; color: var(--dk-muted); line-height: 2; }
.dk-footer-contact svg { width: 15px; height: 15px; flex: none; margin-top: 6px; color: var(--dk-green-700); }
.dk-footer-sep { margin-inline: 8px; color: var(--dk-muted-2); }
.dk-footer-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.dk-footer-badges img { max-height: 96px; width: auto; }
.dk-footer-credit {
  display: flex; justify-content: center;
  margin-top: 14px; padding-top: 12px;
  border-top: 1px dashed var(--dk-line);
  font-size: .7rem; color: var(--dk-muted-2); text-align: center;
}
.dk-footer-credit a { color: var(--dk-green-700); font-weight: 700; }
.dk-footer-credit a:hover { color: var(--dk-green-800); text-decoration: underline; text-underline-offset: 3px; }
.dk-pharmacy-list a:hover { color: var(--dk-green-700); }

@media (max-width: 767.98px) {
  .dk-footer-top { flex-direction: column; align-items: center; text-align: center; }
  .dk-footer-about, .dk-footer-contact { flex-basis: auto; max-width: none; }
  .dk-footer-contact li { justify-content: center; }
  .dk-footer-badges { justify-content: center; }
}

/* ==========================================================================
   متن غنی ویرایشگر پنل (توضیحات محصول، مقاله، صفحه‌ها، پرسش‌های متداول)
   هرگز از کادر خود بیرون نمی‌زند: کلمه/نشانی بلند می‌شکند، تصویر و جدول در عرض کادر می‌مانند.
   اندازهٔ متن با :where (بدون وزن) تعریف شده تا .dk-article / .dk-prose / .dk-acc-body آن را بازنویسی کنند.
   ========================================================================== */
.dk-rich { max-width: 100%; min-width: 0; overflow-wrap: anywhere; }
:where(.dk-rich) { font-size: .85rem; line-height: 2.3; color: var(--dk-text); }
.dk-rich > :first-child { margin-top: 0; }
.dk-rich > :last-child { margin-bottom: 0; }
:where(.dk-rich) p { margin: 0 0 12px; }
:where(.dk-rich) :is(h2, h3, h4) { color: var(--dk-ink); font-weight: 800; line-height: 1.9; margin: 22px 0 8px; }
:where(.dk-rich) h2 { font-size: 1rem; }
:where(.dk-rich) h3 { font-size: .92rem; }
:where(.dk-rich) h4 { font-size: .86rem; }
:where(.dk-rich) :is(ul, ol) { padding-inline-start: 22px; margin: 0 0 14px; }
:where(.dk-rich) li { margin-bottom: 4px; }
.dk-rich li::marker { color: var(--dk-green-600); }
.dk-rich a { color: var(--dk-green-700); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.dk-rich blockquote {
  margin: 0 0 14px; padding: 10px 16px;
  border-inline-start: 3px solid var(--dk-green-500); border-radius: var(--dk-r-sm);
  background: var(--dk-mint-50);
}
.dk-rich :is(img, video, iframe) { max-width: 100%; height: auto; border-radius: var(--dk-r-sm); }
.dk-rich table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: 0 0 14px; }
.dk-rich :is(th, td) { border: 1px solid var(--dk-line); padding: 6px 10px; }
.dk-rich pre { white-space: pre-wrap; background: var(--dk-surface); border-radius: var(--dk-r-sm); padding: 10px 14px; }
/* کلاس‌های تراز و تورفتگی Quill */
.dk-rich .ql-align-center { text-align: center; }
.dk-rich .ql-align-right { text-align: right; }
.dk-rich .ql-align-left { text-align: left; }
.dk-rich .ql-align-justify { text-align: justify; }
.dk-rich .ql-direction-rtl { direction: rtl; }
.dk-rich .ql-indent-1 { padding-inline-start: 2em; }
.dk-rich .ql-indent-2 { padding-inline-start: 4em; }
.dk-rich .ql-indent-3 { padding-inline-start: 6em; }