/* SANAD product page v1 — sizes, bundles, calculator */
:root {
  --sanad-blue:#1f4fd6;
  --sanad-navy:#0c1f52;
  --sanad-sky:#eef4ff;
  --sanad-line:#e3e8f0;
  --sanad-text:#111827;
  --sanad-muted:#6b7280;
  --sanad-green:#16a34a;
  --sanad-r:14px;
}

.sanad-visually-hidden {
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  white-space:nowrap!important;
  border:0!important;
  padding:0!important;
  margin:-1px!important
}

html.sanad-lock,
html.sanad-lock body {
  overflow:hidden!important;
  touch-action:none
}

.sanad-pdp {
  font-family:inherit;
  color:var(--sanad-text);
  margin:8px 0 18px;
  direction:rtl
}

.sanad-pdp * {
  box-sizing:border-box
}

.sanad-pdp button {
  font-family:inherit;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent
}

.sanad-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:nowrap;
  margin-bottom:12px
}

.sanad-h {
  font-size:17px;
  font-weight:700;
  margin:0
}

.sanad-h--center {
  text-align:center;
  margin:26px 0 14px;
  font-size:19px
}

.sanad-req {
  color:#ef4444
}

.sanad-calc-open {
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:linear-gradient(180deg,var(--sanad-blue),var(--sanad-navy));
  color:#fff;
  border:0;
  border-radius:10px;
  padding:9px 14px;
  font-size:14px;
  font-weight:600;
  box-shadow:0 4px 12px rgba(12,31,82,.22)
}

.sanad-sizes {
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px
}

.sanad-size {
  height:46px;
  border:1.5px solid var(--sanad-line);
  background:#fff;
  border-radius:12px;
  font-size:15px;
  font-weight:600;
  color:var(--sanad-text);
  transition:.15s
}

.sanad-size:hover {
  border-color:#b9c6e4
}

.sanad-size.is-active {
  border-color:var(--sanad-blue);
  background:var(--sanad-sky);
  color:var(--sanad-blue);
  box-shadow:0 0 0 3px rgba(31,79,214,.12)
}

.sanad-size.is-disabled {
  opacity:.4;
  text-decoration:line-through;
  cursor:not-allowed
}

.sanad-err {
  color:#dc2626;
  font-size:13px;
  margin:8px 0 0
}

.sanad-tiers {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  padding-top:10px
}

.sanad-tier {
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  background:#fff;
  border:1.5px solid var(--sanad-line);
  border-radius:var(--sanad-r);
  padding:16px 6px 10px;
  min-width:0;
  box-shadow:0 2px 8px rgba(16,24,40,.04);
  transition:.18s
}

.sanad-tier.is-active {
  border-color:var(--sanad-blue);
  background:var(--sanad-sky);
  box-shadow:0 0 0 3px rgba(31,79,214,.12)
}

.sanad-badge {
  position:absolute;
  top:-11px;
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
  font-size:10.5px;
  font-weight:700;
  padding:3px 8px;
  border-radius:999px;
  background:var(--sanad-navy);
  color:#fff
}

.sanad-tier:nth-child(3) .sanad-badge {
  background:var(--sanad-blue)
}

.sanad-tier:nth-child(4) .sanad-badge {
  background:#fff;
  color:var(--sanad-blue);
  border:1px solid var(--sanad-blue)
}

.sanad-tier-title {
  font-weight:700;
  font-size:14px
}

.sanad-tiles {
  display:grid;
  gap:2px;
  width:100%;
  aspect-ratio:1/1;
  align-content:center;
  justify-items:center
}

.sanad-tiles img,
.sanad-tile-ph {
  width:100%;
  aspect-ratio:1/1;
  object-fit:contain;
  border-radius:6px;
  background:#f3f6fb
}

.sanad-tiles--1 {
  grid-template-columns:1fr;
  padding:0 10%
}

.sanad-tiles--2 {
  grid-template-columns:1fr 1fr
}

.sanad-tiles--4 {
  grid-template-columns:1fr 1fr
}

.sanad-tiles--8 {
  grid-template-columns:repeat(4,1fr);
  grid-template-rows:1fr 1fr;
  aspect-ratio:auto;
  padding-top:20%
}

.sanad-tier-img {
  width:100%;
  aspect-ratio:1/1;
  object-fit:contain;
  display:block
}

.sanad-free {
  font-size:11.5px;
  color:var(--sanad-text);
  display:flex;
  align-items:center;
  gap:3px;
  min-height:18px;
  white-space:nowrap
}

.sanad-free svg {
  color:#ef6c00
}

.sanad-tier-price {
  border-top:1px solid var(--sanad-line);
  width:100%;
  padding-top:8px;
  text-align:center;
  color:var(--sanad-blue);
  font-size:12px;
  line-height:1.3
}

.sanad-tier-price b {
  font-size:17px
}

.sanad-tier-price small {
  display:block;
  color:var(--sanad-muted);
  font-size:11px
}

.sanad-guide-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:16px 2px 6px
}

.sanad-guide-t {
  display:flex;
  align-items:center;
  gap:6px;
  font-weight:700
}

.sanad-guide-open {
  background:none;
  border:0;
  color:var(--sanad-text);
  font-size:14px;
  padding:6px 0
}

.sanad-summary {
  background:#f8fafc;
  border:1px solid var(--sanad-line);
  border-radius:var(--sanad-r);
  padding:12px 14px;
  margin-top:10px;
  font-size:14px
}

.sanad-summary>div {
  display:flex;
  justify-content:space-between;
  padding:4px 0
}

.sanad-summary>div span:first-child {
  color:var(--sanad-muted)
}

.sanad-green {
  color:var(--sanad-green);
  display:inline-flex;
  gap:4px;
  align-items:center
}

.sanad-muted {
  color:var(--sanad-muted)
}

.sanad-note {
  font-size:12px;
  color:var(--sanad-muted);
  margin:8px 0 0
}

.sanad-modal {
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  direction:rtl;
  font-family:inherit
}

.sanad-backdrop {
  position:absolute;
  inset:0;
  background:rgba(10,18,40,.5);
  opacity:0;
  transition:.2s
}

.sanad-dialog {
  position:relative;
  background:#fff;
  border-radius:22px;
  width:100%;
  max-width:480px;
  max-height:calc(100dvh - 32px);
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:22px 20px 20px;
  transform:translateY(16px);
  opacity:0;
  transition:.22s;
  outline:none;
  color:var(--sanad-text)
}

.sanad-modal.is-open .sanad-backdrop {
  opacity:1
}

.sanad-modal.is-open .sanad-dialog {
  transform:none;
  opacity:1
}

.sanad-x {
  position:absolute;
  top:16px;
  left:16px;
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid var(--sanad-line);
  background:#fff;
  font-size:22px;
  line-height:1;
  color:#555
}

.sanad-mt {
  font-size:19px;
  font-weight:700;
  margin:6px 0 4px;
  padding-left:44px
}

.sanad-ms {
  color:var(--sanad-muted);
  font-size:14px;
  margin:0 0 16px
}

.sanad-field {
  border:1px solid #eef0f4;
  border-radius:16px;
  padding:16px;
  margin-bottom:12px
}

.sanad-field>label {
  display:block;
  color:var(--sanad-muted);
  font-size:13px;
  margin-bottom:12px
}

.sanad-range {
  display:flex;
  align-items:center;
  gap:14px
}

.sanad-val {
  flex:0 0 auto;
  min-width:88px;
  text-align:center;
  background:#f3f4f6;
  border-radius:10px;
  padding:10px 8px;
  font-size:16px;
  font-weight:600
}

.sanad-range input {
  flex:1;
  -webkit-appearance:none;
  appearance:none;
  height:6px;
  border-radius:6px;
  direction:rtl;
  background:linear-gradient(to left,var(--sanad-blue) 0 var(--p,50%),#e5e7eb var(--p,50%) 100%);
  touch-action:pan-y
}

.sanad-range input::-webkit-slider-thumb {
  -webkit-appearance:none;
  width:30px;
  height:22px;
  border-radius:12px;
  background:#fff;
  border:1px solid #d6dbe4;
  box-shadow:0 2px 6px rgba(0,0,0,.15)
}

.sanad-range input::-moz-range-thumb {
  width:30px;
  height:22px;
  border-radius:12px;
  background:#fff;
  border:1px solid #d6dbe4
}

.sanad-under {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:8px;
  margin-bottom:8px
}

.sanad-under button {
  height:48px;
  border:1.5px solid var(--sanad-line);
  border-radius:12px;
  background:#fff;
  font-size:15px;
  color:#374151;
  font-family:inherit
}

.sanad-under button[data-u="3XL"] {
  grid-column:1/-1
}

.sanad-under .sanad-under-unk {
  grid-column:1/-1;
  color:var(--sanad-muted)
}

.sanad-under button.is-active {
  border-color:var(--sanad-blue);
  background:var(--sanad-sky);
  color:var(--sanad-blue)
}

.sanad-primary {
  display:block;
  width:100%;
  height:52px;
  border:0;
  border-radius:12px;
  background:var(--sanad-blue);
  color:#fff;
  font-size:16px;
  font-weight:600;
  font-family:inherit;
  margin-top:6px
}

.sanad-result:empty {
  display:none
}

.sanad-result {
  margin-top:14px
}

.sanad-res-ok,
.sanad-res-warn {
  border-radius:16px;
  padding:16px;
  background:var(--sanad-sky);
  border:1px solid #d6e2ff
}

.sanad-res-warn {
  background:#fff8eb;
  border-color:#fde3b0
}

.sanad-res-ok p,
.sanad-res-warn p {
  margin:0 0 8px
}

.sanad-big {
  font-size:26px;
  color:var(--sanad-blue)
}

.sanad-warn {
  color:#b45309;
  font-size:13px
}

.sanad-table {
  width:100%;
  border-collapse:collapse;
  font-size:14px;
  text-align:center;
  margin-top:8px
}

.sanad-table th {
  background:var(--sanad-navy);
  color:#fff;
  padding:9px 4px;
  font-weight:600;
  font-size:12.5px
}

.sanad-table th:first-child {
  border-radius:0 10px 0 0
}

.sanad-table th:last-child {
  border-radius:10px 0 0 0
}

.sanad-table td {
  padding:9px 4px;
  border-bottom:1px solid var(--sanad-line)
}

@media (max-width:420px) {
  .sanad-h {
    font-size:15px
  }
  .sanad-calc-open {
    padding:8px 11px;
    font-size:13px;
    white-space:nowrap
  }
  .sanad-sizes {
    grid-template-columns:repeat(6,1fr);
    gap:6px
  }
  .sanad-size {
    height:44px;
    font-size:14px
  }
  .sanad-tiers {
    gap:6px
  }
  .sanad-tier {
    padding:15px 4px 8px
  }
  .sanad-badge {
    font-size:9.5px;
    padding:2px 6px
  }
  .sanad-tier-price b {
    font-size:15px
  }
  .sanad-free {
    font-size:10.5px
  }
}

@media (prefers-reduced-motion:reduce) {
  .sanad-pdp *,.sanad-dialog,.sanad-backdrop {
    transition:none!important
  }
}

.sanad-tier-sub {
  font-size:11.5px;
  color:var(--sanad-muted);
  margin-top:-6px
}

.sanad-tier-price em {
  display:block;
  font-style:normal;
  color:var(--sanad-text);
  font-size:11px;
  margin-top:2px
}

.sanad-tier:disabled {
  cursor:not-allowed
}

.sanad-tier.is-na {
  opacity:.45
}

.sanad-tier-na {
  font-size:10.5px;
  color:#b45309;
  text-align:center
}

.sanad-status {
  font-size:13px;
  margin:8px 0 0;
  color:var(--sanad-green)
}

.sanad-status.is-err {
  color:#dc2626
}

html.sanad-bundle-on salla-mini-checkout-widget {
  display:none!important
}

.sanad-calc-open {
  white-space:nowrap;
  flex:0 0 auto
}

.sanad-h {
  min-width:0
}

.sanad-tier-title {
  white-space:nowrap;
  font-size:13px
}

.sanad-tier-price b {
  font-size:15px
}

@media (max-width:420px) {
  .sanad-tier-title {
    font-size:12px
  }
}

html.sanad-pdp-on form section:has(> .center-between .price-wrapper.bottom-side) {
  display:none!important
}

html.sanad-pdp-on #my-size-widget {
  display:none!important
}

.sold-q-or-remained_wrapper {
  display:none!important
}

.sanad-badge,
.sanad-tier:nth-child(3) .sanad-badge,
.sanad-tier:nth-child(4) .sanad-badge {
  top:-9px;
  font-size:9.5px;
  font-weight:600;
  padding:2px 7px;
  line-height:1.5;
  background:var(--sanad-navy);
  color:#fff;
  border:0;
  max-width:calc(100% - 8px);
  overflow:hidden;
  text-overflow:ellipsis
}

.sanad-tier.is-active .sanad-badge {
  background:var(--sanad-blue)
}

.sanad-free {
  justify-content:center;
  font-size:11px;
  color:var(--sanad-green);
  font-weight:600
}

.sanad-free svg {
  color:var(--sanad-green);
  width:14px;
  height:14px
}

.sanad-tier-price {
  margin-top:auto
}

.sanad-tier-img {
  mix-blend-mode:multiply
}

section.s-block:has(a[href$="/p1223996975"]):not(:has(a[href$="/p943398097"])),
section.s-block:has(a[href$="/p1541258807"]):not(:has(a[href$="/p943398097"])),
section.s-block:has(a[href$="/p2098616636"]):not(:has(a[href$="/p943398097"])) {
  display:none!important
}

custom-salla-product-card:has(a[href$="/p1223996975"]),
.s-products-slider-card:has(a[href$="/p1223996975"]),
custom-salla-product-card:has(a[href$="/p1541258807"]),
.s-products-slider-card:has(a[href$="/p1541258807"]),
custom-salla-product-card:has(a[href$="/p2098616636"]),
.s-products-slider-card:has(a[href$="/p2098616636"]) {
  display:none!important
}

section.s-block--best-offers {
  display:none!important
}

salla-bought-together {
  display:none!important
}

/* إخفاء قسم "منتجات قد تعجبك" */
.similar-products,
salla-products-slider[source="related"] {
  display:none!important
}
/* =====================================================================
   لمسات جمالية — SANAD v1.2
   ===================================================================== */

/* ---- عام ---- */
:root {
  --sanad-grad: linear-gradient(135deg, #2b5cf0 0%, #1f4fd6 45%, #0c1f52 100%);
  --sanad-shadow: 0 1px 2px rgba(12,31,82,.06), 0 8px 24px rgba(12,31,82,.08);
  --sanad-ease: cubic-bezier(.2,.8,.2,1);
}
.sanad-pdp button:focus-visible,
.sanad-modal button:focus-visible,
.sanad-modal input:focus-visible {
  outline: 2px solid var(--sanad-blue);
  outline-offset: 2px;
}

/* ---- العنوان وزر الحاسبة ---- */
.sanad-h {
  letter-spacing: -.2px;
}
.sanad-calc-open {
  background: var(--sanad-grad);
  transition: transform .2s var(--sanad-ease), box-shadow .2s var(--sanad-ease), filter .2s;
}
.sanad-calc-open:active {
  transform: scale(.97);
}

/* ---- أزرار المقاسات ---- */
.sanad-size {
  transition: transform .15s var(--sanad-ease), background .2s, border-color .2s, color .2s, box-shadow .2s;
}
.sanad-size:active {
  transform: scale(.94);
}
.sanad-size.is-active {
  background: var(--sanad-grad);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 6px 16px rgba(31,79,214,.28);
}

/* ---- بطاقات الباقات ---- */
.sanad-tier {
  box-shadow: var(--sanad-shadow);
  transition: transform .25s var(--sanad-ease), box-shadow .25s var(--sanad-ease), border-color .2s, background .2s;
}
.sanad-tier:active {
  transform: scale(.98);
}
.sanad-tier.is-active {
  background: linear-gradient(180deg, #f3f7ff 0%, #e8f0ff 100%);
  border-color: var(--sanad-blue);
  box-shadow: 0 0 0 3px rgba(31,79,214,.14), 0 10px 26px rgba(31,79,214,.18);
}
/* علامة صح على البطاقة المختارة */
.sanad-tier::after {
  content: "";
  position: absolute;
  top: -8px;
  left: -6px;
  width: 20px;
  height: 20px;
  border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(31,79,214,.35);
  z-index: 2;
  border-radius: 50%;
  background: var(--sanad-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 10px no-repeat;
  transform: scale(0);
  transition: transform .25s var(--sanad-ease);
}
.sanad-tier.is-active::after {
  transform: scale(1);
}
.sanad-tier-img {
  transition: transform .35s var(--sanad-ease);
}
.sanad-tier-price b {
  font-weight: 800;
  letter-spacing: -.3px;
}
.sanad-tier-price em {
  font-weight: 600;
}
.sanad-badge {
  box-shadow: 0 4px 10px rgba(12,31,82,.22);
}
.sanad-tier.is-active .sanad-badge {
  background: var(--sanad-grad);
}

/* تأثير التمرير على الكمبيوتر فقط */
@media (hover: hover) {
  .sanad-tier:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 30px rgba(12,31,82,.14);
  }
  .sanad-tier:hover .sanad-tier-img {
    transform: scale(1.04);
  }
  .sanad-size:not(.is-active):not(.is-disabled):hover {
    border-color: var(--sanad-blue);
    color: var(--sanad-blue);
  }
  .sanad-calc-open:hover {
    filter: brightness(1.08);
    box-shadow: 0 8px 20px rgba(31,79,214,.32);
  }
}

/* ---- ملخص الطلب ---- */
.sanad-summary {
  background: #fff;
  box-shadow: var(--sanad-shadow);
  padding: 14px 16px;
}
.sanad-summary > div {
  padding: 6px 0;
}
.sanad-summary > div:nth-child(4) {
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px dashed var(--sanad-line);
  font-size: 15px;
}
.sanad-summary > div:nth-child(4) b {
  color: var(--sanad-blue);
  font-size: 17px;
}

/* ---- رابط دليل المقاسات ---- */
.sanad-guide-open {
  color: var(--sanad-blue);
  font-weight: 600;
}

/* ---- النوافذ المنبثقة ---- */
.sanad-backdrop {
  background: rgba(10,18,40,.45);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.sanad-dialog {
  box-shadow: 0 24px 60px rgba(12,31,82,.25);
}
.sanad-x {
  transition: background .2s, transform .2s;
}
.sanad-x:hover {
  background: #f3f4f6;
}
.sanad-primary {
  background: var(--sanad-grad);
  box-shadow: 0 8px 20px rgba(31,79,214,.28);
  transition: transform .15s var(--sanad-ease), filter .2s;
}
.sanad-primary:active {
  transform: scale(.98);
}
.sanad-range input::-webkit-slider-thumb {
  border: 2px solid var(--sanad-blue);
  box-shadow: 0 0 0 4px rgba(31,79,214,.12), 0 2px 6px rgba(0,0,0,.15);
}
.sanad-range input::-moz-range-thumb {
  border: 2px solid var(--sanad-blue);
}
.sanad-result > div {
  animation: sanadPop .35s var(--sanad-ease);
}
.sanad-big {
  background: var(--sanad-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-weight: 800;
}
.sanad-table tbody tr:nth-child(even) td {
  background: #f8fafc;
}
@keyframes sanadPop {
  from { opacity: 0; transform: translateY(8px) scale(.98); }
  to   { opacity: 1; transform: none; }
}

/* الجوال: الحاسبة تطلع من أسفل الشاشة */
@media (max-width: 600px) {
  .sanad-modal {
    align-items: flex-end;
    padding: 0;
  }
  .sanad-dialog {
    max-width: none;
    max-height: 92dvh;
    border-radius: 24px 24px 0 0;
    padding-bottom: calc(20px + env(safe-area-inset-bottom));
    transform: translateY(100%);
    transition: transform .32s var(--sanad-ease), opacity .2s;
  }
  .sanad-dialog::before {
    content: "";
    display: block;
    width: 44px;
    height: 5px;
    margin: -10px auto 12px;
    border-radius: 99px;
    background: #e5e7eb;
  }
}

/* احترام إعداد تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
  .sanad-tier,
  .sanad-size,
  .sanad-tier-img,
  .sanad-tier::after,
  .sanad-result > div,
  .sanad-dialog {
    transition: none !important;
    animation: none !important;
  }
}

/* =====================================================================
   لمسات التجربة — SANAD FX v1.3
   حركات خفيفة يحسها العميل بدون ما ينتبه لها.
   تشتغل فقط بعد ما يضيف كود JS الكلاس sanad-fx (لو تعطل JS ما يتأثر شي).
   ===================================================================== */

/* ---- نعومة عامة ---- */
html.sanad-fx {
  scroll-behavior: smooth;
}
html.sanad-fx body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  -webkit-tap-highlight-color: transparent;
}
html.sanad-fx ::selection {
  background: rgba(31,79,214,.18);
  color: inherit;
}

/* ---- ظهور العناصر مع التمرير ---- */
html.sanad-fx .sanad-rv {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
  transition-delay: calc(var(--sanad-i, 0) * 70ms);
  will-change: opacity, transform;
}
html.sanad-fx .sanad-rv.sanad-in {
  opacity: 1;
  transform: none;
}

/* ---- الصور تظهر بنعومة ---- */
html.sanad-fx img {
  transition: opacity .5s ease;
}
html.sanad-fx img.sanad-img-wait {
  opacity: 0;
}

/* ---- ضغطة الأزرار ---- */
html.sanad-fx .s-button-element,
html.sanad-fx a.btn,
html.sanad-fx .mobile-nav-inner a {
  transition: transform .15s cubic-bezier(.2,.8,.2,1), filter .2s, box-shadow .2s;
}
html.sanad-fx .s-button-element:active,
html.sanad-fx a.btn:active {
  transform: scale(.97);
}
html.sanad-fx .mobile-nav-inner a:active {
  transform: scale(.92);
}

/* ---- بطاقات المنتجات على الكمبيوتر ---- */
@media (hover: hover) {
  html.sanad-fx custom-salla-product-card {
    transition: transform .35s cubic-bezier(.2,.8,.2,1), filter .35s;
  }
  html.sanad-fx custom-salla-product-card:hover {
    transform: translateY(-4px);
    filter: drop-shadow(0 12px 22px rgba(12,31,82,.12));
  }
  html.sanad-fx .s-button-element:hover {
    filter: brightness(1.06);
  }
}

/* ---- عداد السلة ينبض عند الإضافة ---- */
html.sanad-fx .sanad-bump {
  animation: sanadBump .6s cubic-bezier(.2,.8,.2,1);
}
@keyframes sanadBump {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.35); }
  60%  { transform: scale(.92); }
  100% { transform: scale(1); }
}

/* ---- الإجمالي ينبض لما يتغير ---- */
html.sanad-fx .sanad-summary.sanad-pulse > div:nth-child(4) b {
  display: inline-block;
  animation: sanadPulse .45s cubic-bezier(.2,.8,.2,1);
}
@keyframes sanadPulse {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.12); }
  100% { transform: scale(1); }
}

/* ---- شريط تمرير أنيق على الكمبيوتر ---- */
@media (hover: hover) and (pointer: fine) {
  html.sanad-fx ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }
  html.sanad-fx ::-webkit-scrollbar-thumb {
    background: rgba(12,31,82,.28);
    border-radius: 99px;
    border: 3px solid transparent;
    background-clip: padding-box;
  }
  html.sanad-fx ::-webkit-scrollbar-thumb:hover {
    background-color: rgba(31,79,214,.55);
  }
}

/* ---- احترام إعداد تقليل الحركة ---- */
@media (prefers-reduced-motion: reduce) {
  html.sanad-fx {
    scroll-behavior: auto;
  }
  html.sanad-fx .sanad-rv,
  html.sanad-fx img.sanad-img-wait {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  html.sanad-fx .sanad-bump,
  html.sanad-fx .sanad-summary.sanad-pulse > div:nth-child(4) b {
    animation: none !important;
  }
}

/* =====================================================================
   لمسات جذب — SANAD FX v1.4
   ===================================================================== */

/* ---- البطاقات: ظهور أبطأ من ضبابي إلى واضح ---- */
html.sanad-fx custom-salla-product-card.sanad-rv,
html.sanad-fx .sanad-tier.sanad-rv {
  transform: translateY(26px) scale(.96);
  filter: blur(6px);
  transition: opacity 1.1s cubic-bezier(.16,.84,.24,1),
              transform 1.1s cubic-bezier(.16,.84,.24,1),
              filter 1s ease;
  transition-delay: calc(var(--sanad-i, 0) * 140ms);
}
html.sanad-fx custom-salla-product-card.sanad-rv.sanad-in,
html.sanad-fx .sanad-tier.sanad-rv.sanad-in {
  transform: none;
  filter: none;
}

/* بعد الظهور: الرفع عند المرور بالماوس يبقى سريع */
@media (hover: hover) {
  html.sanad-fx custom-salla-product-card.sanad-rv.sanad-in:hover {
    transform: translateY(-4px);
    filter: drop-shadow(0 12px 22px rgba(12,31,82,.12));
    transition: transform .35s cubic-bezier(.2,.8,.2,1), filter .35s;
    transition-delay: 0s;
  }
}

/* ---- زر «أضف للسلة»: لمعة تمر كل كم ثانية ---- */
html.sanad-fx salla-add-product-button.sticky-product-bar__btn .s-button-element {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
html.sanad-fx salla-add-product-button.sticky-product-bar__btn .s-button-element::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 45%;
  background: linear-gradient(105deg, transparent 0%, rgba(255,255,255,.38) 50%, transparent 100%);
  transform: translateX(-160%) skewX(-18deg);
  animation: sanadShine 5.5s ease-in-out 2s infinite;
  pointer-events: none;
}
@keyframes sanadShine {
  0%, 72% { transform: translateX(-160%) skewX(-18deg); }
  100%    { transform: translateX(320%) skewX(-18deg); }
}

/* ---- شارة «الأكثر مبيعًا»: توهج هادئ ---- */
html.sanad-fx .sanad-tier:nth-child(3) .sanad-badge {
  animation: sanadGlow 2.6s ease-in-out infinite;
}
@keyframes sanadGlow {
  0%, 100% { box-shadow: 0 4px 10px rgba(12,31,82,.22), 0 0 0 0 rgba(31,79,214,.0); }
  50%      { box-shadow: 0 4px 14px rgba(31,79,214,.45), 0 0 0 4px rgba(31,79,214,.12); }
}

/* ---- شاحنة التوصيل المجاني: حركة بسيطة ---- */
html.sanad-fx .sanad-free svg {
  animation: sanadDrive 3.2s ease-in-out infinite;
}
@keyframes sanadDrive {
  0%, 70%, 100% { transform: translateX(0); }
  80%           { transform: translateX(-3px); }
  90%           { transform: translateX(1px); }
}

/* ---- احترام إعداد تقليل الحركة ---- */
@media (prefers-reduced-motion: reduce) {
  html.sanad-fx custom-salla-product-card.sanad-rv,
  html.sanad-fx .sanad-tier.sanad-rv {
    filter: none !important;
  }
  html.sanad-fx salla-add-product-button.sticky-product-bar__btn .s-button-element::after,
  html.sanad-fx .sanad-tier:nth-child(3) .sanad-badge,
  html.sanad-fx .sanad-free svg {
    animation: none !important;
  }
}

/* ---- البنر الرئيسي: نفس شكله النهائي من أول لحظة (قبل ما يجهز السلايدر) ---- */
section.s-block-fullscreen-banners .swiper-wrapper > .swiper-slide:first-child {
  width: 100%;
  flex-shrink: 0;
}
section.s-block-fullscreen-banners .swiper-slide:first-child .bg__image img {
  height: auto;
}

/* ---- 5 بكجات: صف واحد بالشاشات الكبيرة، و3 + 2 بالجوال ---- */
.sanad-tiers {
  grid-template-columns: repeat(5, 1fr);
}
@media (max-width: 640px) {
  .sanad-tiers {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 16px;
  }
  .sanad-tiers > .sanad-tier {
    flex: 0 0 calc((100% - 12px) / 3);
    min-width: 0;
  }
}