/* =========================================================
   أغنام الوادي — ثيم ملاك · الإصدار 4.0 (نسخة موحّدة)
   تصميم «السوق الذكي» بالأحمر والأخضر · شبكة منتجات متوازنة ·
   بطاقة منتج احترافية (السعر يمين تحت الاسم) · إطارات صور متحركة ·
   حركات تمرير خفيفة على الأداء · متجاوب للجوال والتابلت
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');

/* ---------- 0. الهوية ---------- */
:root, html, body {
  --red: #E50019; --red-dark: #B60014; --red-soft: #FDECEE;
  --green: #347D20; --green-dark: #193F10; --pale: #EFF6EB; --pale-line: #DCEBD3;
  --ink: #1F2A1C; --text: #3D4639; --muted: #7A8076; --line: #E8ECE5; --surface: #F6F8F4;
  --container: 1232px;
  --radius: 16px;
  --shadow-sm: 0 1px 2px rgba(16,24,40,.04), 0 4px 14px rgba(16,24,40,.05);
  --shadow-lg: 0 18px 40px rgba(25,63,16,.14);
  --ring: conic-gradient(from 210deg, #347D20, #8BC34A, #E50019, #FF7A85, #347D20);
  --mat: linear-gradient(140deg, #E6F0DF 0%, #FFFFFF 48%, #F9E4E7 100%);
  --sans: 'IBM Plex Sans Arabic', system-ui, sans-serif;
  --num: 'IBM Plex Sans Arabic', system-ui, sans-serif;
  /* سلّم خطوط موحّد: نفس الأحجام في كل الصفحات (يُصغَّر للجوال في القسم 19) */
  --fs-xs: 12px; --fs-sm: 13px; --fs-ui: 14px; --fs-base: 15px; --fs-md: 16px; --fs-lg: 18px;
  --fs-price: 20px; --fs-h2: 26px; --fs-h1: 28px; --fs-pprice: 30px; --fs-cat: 40px;
  --fs-hero: clamp(32px, 3.3vw, 50px); --fs-hero-sub: clamp(16px, 1.4vw, 20px);
  --sec-gap: 40px; /* المسافة الموحّدة بين أقسام الصفحة الرئيسية */
  --ease-out: cubic-bezier(.16,1,.3,1); --ease-io: cubic-bezier(.65,0,.35,1); --ease-back: cubic-bezier(.34,1.56,.64,1);
  --hero-h: clamp(320px, 30vw, 500px);
  --hero-img: url("https://cdn.files.salla.network/other/1570729837/ac2cc816-bb7c-491f-b4a2-0dbe04e752da-original.webp");

  --font-main: 'IBM Plex Sans Arabic' !important;
  --color-primary: #E50019 !important; --color-primary-dark: #B60014 !important;
  --color-primary-light: #FDECEE !important; --color-primary-reverse: #FFFFFF !important;
  --dark-bg-main: #FFFFFF !important; --dark-text-main: #1F2A1C !important; --dark-text-sec: #6B7267 !important; --dark-grey: #F6F8F4 !important;
  --text-btn: #FFFFFF !important; --bg-color: #FFFFFF !important; --header-bg: #FFFFFF !important; --menu-bg: #FFFFFF !important;
  --footer-bg: #173D13 !important; --swiper-theme-color: #347D20 !important;
}

/* ---------- 1. الأساس ---------- */
html { scroll-behavior: smooth; scrollbar-color: #347D20 #EEF2EC; }
html, body { overflow-x: clip; }
body, button, input, select, textarea, h1, h2, h3, h4, h5, h6, p, a, span, label, li, .font-primary { font-family: var(--sans) !important; }
html body, body.da-bgm, .app-inner { background-color: #FFFFFF !important; color: var(--text); }
body { font-size: var(--fs-base); line-height: 1.7; font-weight: 400; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
h1, h2 { font-weight: 700 !important; letter-spacing: 0 !important; }
::selection { background: var(--red); color: #FFFFFF; }
:focus-visible { outline: 3px solid rgba(229,0,25,.45); outline-offset: 2px; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #EEF2EC; }
::-webkit-scrollbar-thumb { background: #347D20; border-radius: 10px; border: 2px solid #EEF2EC; }

/* ---------- 2. مكتبة الحركات ---------- */
@keyframes av-fade-up { from { opacity: .2; translate: 0 18px; } to { opacity: 1; translate: 0 0; } }
@keyframes av-card-in { from { opacity: .25; translate: 0 28px; scale: .97; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes av-img-in { from { scale: 1.16; } to { scale: 1; } }
@keyframes av-drop { from { opacity: 0; translate: 0 -24px; } to { opacity: 1; translate: 0 0; } }
@keyframes av-logo { 0% { opacity: 0; scale: .35; rotate: -25deg; } 55% { opacity: 1; scale: 1.14; rotate: 6deg; } 78% { scale: .97; rotate: -2deg; } 100% { scale: 1; rotate: 0deg; } }
@keyframes av-logo-wiggle { 0%, 100% { rotate: 0deg; } 25% { rotate: -8deg; } 60% { rotate: 6deg; } }
@keyframes av-title {
  0% { opacity: 0; translate: 0 34px; scale: 1.06; filter: blur(14px); clip-path: inset(0 0 0 100%); }
  60% { filter: blur(0); }
  100% { opacity: 1; translate: 0 0; scale: 1; filter: blur(0); clip-path: inset(0 0 0 0); }
}
@keyframes av-text-shine { 0% { background-position: 130% 0; } 35%, 100% { background-position: -30% 0; } }
@keyframes av-line-draw { from { background-size: 0% 2px; } to { background-size: 100% 2px; } }
@keyframes av-scale-x { from { scale: 0 1; } to { scale: 1 1; } }
@keyframes av-pop { 0% { scale: 0; } 70% { scale: 1.3; } 100% { scale: 1; } }
@keyframes av-ring-red { 0% { box-shadow: 0 0 0 0 rgba(229,0,25,.5); } 70%, 100% { box-shadow: 0 0 0 9px rgba(229,0,25,0); } }
@keyframes av-ring-wa { 0% { box-shadow: 0 0 0 0 rgba(37,211,102,.5); } 70%, 100% { box-shadow: 0 0 0 18px rgba(37,211,102,0); } }
@keyframes av-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -6px; } }
@keyframes av-cart { 0% { translate: 0 0; rotate: 0deg; } 30% { translate: -6px 0; rotate: -12deg; } 60% { translate: 3px 0; rotate: 6deg; } 100% { translate: 0 0; rotate: 0deg; } }
@keyframes av-sheen { 0% { background-position: 160% 0; } 40%, 100% { background-position: -60% 0; } }
@keyframes av-rotate { to { rotate: 360deg; } }
@keyframes av-badge { 0%, 70%, 100% { scale: 1; } 80% { scale: 1.08; } 90% { scale: .98; } }
@keyframes av-ribbon-in { from { translate: 0 -120%; } to { translate: 0 0; } }
@keyframes av-sway { 0%, 100% { rotate: 0deg; } 50% { rotate: 2.5deg; } }
@keyframes av-progress { from { scale: 0 1; } to { scale: 1 1; } }
@keyframes av-parallax { to { transform: translateY(-60px) scale(.95); opacity: .3; } }
@keyframes av-flow { to { background-position: 200% 0; } }
@keyframes av-vt-out { to { opacity: 0; translate: 0 -14px; filter: blur(4px); } }
@keyframes av-vt-in { from { opacity: 0; translate: 0 18px; filter: blur(6px); } }
@keyframes av-hero {
  0%   { background-position: 0 0, 0 0, 130% 0, 0 0, 50% 50%; }
  100% { background-position: 0 -422px, 233px -358px, -30% 0, 0 0, 50% 50%; }
}
@keyframes av-hero-m {
  0%   { background-position: 0 0, 0 0, 130% 0, 0 0, 50% 0; }
  100% { background-position: 0 -422px, 233px -358px, -30% 0, 0 0, 50% 0; }
}
@keyframes av-kb {
  from { background-size: 157px 211px, 233px 179px, 260% 100%, auto, 100% auto; }
  to   { background-size: 157px 211px, 233px 179px, 260% 100%, auto, 110% auto; }
}
@keyframes av-ticker {
  0%           { content: "لحوم وذبائح طازجة يومياً"; color: rgba(255,255,255,0); }
  3%, 30%      { content: "لحوم وذبائح طازجة يومياً"; color: #FFFFFF; }
  33%          { content: "لحوم وذبائح طازجة يومياً"; color: rgba(255,255,255,0); }
  33.4%        { content: "توصيل سريع داخل جدة"; color: rgba(255,255,255,0); }
  36.4%, 63.4% { content: "توصيل سريع داخل جدة"; color: #FFFFFF; }
  66.4%        { content: "توصيل سريع داخل جدة"; color: rgba(255,255,255,0); }
  66.8%        { content: "ادفع بأمان: مدى · Apple Pay · تابي"; color: rgba(255,255,255,0); }
  69.8%, 97%   { content: "ادفع بأمان: مدى · Apple Pay · تابي"; color: #FFFFFF; }
  100%         { content: "ادفع بأمان: مدى · Apple Pay · تابي"; color: rgba(255,255,255,0); }
}

/* ---------- 3. الشريط العلوي ---------- */
.app-inner::before {
  content: "لحوم وذبائح طازجة يومياً  ·  توصيل سريع داخل جدة";
  order: -1; display: flex; align-items: center; justify-content: center;
  width: 100%; min-height: 38px; padding: 6px 16px; box-sizing: border-box;
  background: var(--red); color: #FFFFFF;
  font-family: var(--sans); font-size: var(--fs-ui); font-weight: 700; text-align: center;
  animation: av-ticker 12s linear infinite;
}

/* ---------- 4. الهيدر ---------- */
.store-header, .store-header #mainnav, .store-header .main-nav-container,
.store-header .header-inner, .store-header .header-inner.has-custom-bg {
  background-color: #FFFFFF !important; border: 0 !important; box-shadow: none !important;
}
.store-header .header-inner { opacity: 1 !important; border-bottom: 1px solid var(--line) !important; view-transition-name: av-header; }
body.index .store-header .header-inner { animation: av-drop .9s var(--ease-out) both; }
.store-header .fixed-pinned .header-inner, .store-header .fixed-header .header-inner {
  box-shadow: 0 8px 24px rgba(16,24,40,.08) !important; border-bottom-color: transparent !important;
}
.store-header .header-container, .store-header .header-container > .flex {
  height: 80px !important; min-height: 80px !important; transition: height .35s var(--ease-out), min-height .35s var(--ease-out);
}
.store-header .fixed-pinned .header-container, .store-header .fixed-pinned .header-container > .flex { height: 66px !important; min-height: 66px !important; }
@media (min-width: 1024px) {
  .store-header .header-container.container { max-width: 1248px !important; padding: 0 24px !important; }
}
.store-header .navbar-brand { padding: 0 !important; }
.store-header .navbar-brand img {
  height: 62px !important; max-height: 62px !important; width: auto !important; transform-origin: 50% 50%;
  transition: height .35s var(--ease-out), max-height .35s var(--ease-out);
}
.store-header .fixed-pinned .navbar-brand img { height: 50px !important; max-height: 50px !important; }
body.index .store-header .navbar-brand img { animation: av-logo 1.2s var(--ease-out) .25s both; }
body .store-header .navbar-brand:hover img { animation: av-logo-wiggle .6s var(--ease-io); }
.store-header a, .store-header i, .store-header button, .store-header .header-btn,
.store-header span:not(.s-cart-summary-count) { color: var(--ink) !important; }
.store-header .search-btn i, .store-header .header-btn i, .store-header .mburger .sicon-menu { color: var(--green) !important; }
.store-header .mburger p { font-size: var(--fs-base) !important; font-weight: 700 !important; color: var(--green-dark) !important; }
.store-header .mburger .sicon-menu { font-size: 22px !important; }
.store-header .lang, .store-header .language-btn, .store-header .language-btn span { font-size: var(--fs-ui) !important; }
.store-header .header-btn, .store-header .search-btn {
  width: 42px !important; height: 42px !important; border-radius: 50% !important; justify-content: center; align-items: center;
  transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease, translate .3s var(--ease-back) !important;
}
.store-header .header-btn i, .store-header .search-btn i { font-size: 20px !important; }
.store-header .header-btn:hover, .store-header .search-btn:hover, .store-header .mburger:hover { background: var(--pale) !important; translate: 0 -2px; }
.store-header .s-cart-summary-count {
  background: var(--red) !important; color: #FFFFFF !important; font-family: var(--num) !important; font-weight: 800 !important;
  animation: av-pop .6s var(--ease-back) 1s both, av-ring-red 2.6s ease-out 2s infinite;
}
/* قائمة الجوال الجانبية */
#mobile-menu .mobile-menu-slider:not(:has(.swiper-slide)) { display: none !important; }
#mobile-menu .menu_title { font-size: var(--fs-md) !important; font-weight: 700 !important; color: var(--ink) !important; }
#mobile-menu a.sidemenu-link:hover .menu_title { color: var(--green) !important; }
@media (min-width: 1024px) {
  .store-header .header-container .search-btn {
    width: 260px !important; height: 44px !important; border-radius: 999px !important; padding: 0 16px !important; gap: 10px;
    justify-content: flex-start !important; background: var(--surface) !important; border: 1px solid #E1E8DC !important;
  }
  .store-header .header-container .search-btn::after {
    content: "ابحث عن منتجات اللحوم…"; font-family: var(--sans); font-size: var(--fs-sm); font-weight: 400; color: #8A9086; white-space: nowrap;
  }
  .store-header .header-container .search-btn:hover { background: #FFFFFF !important; border-color: var(--green) !important; box-shadow: 0 0 0 4px rgba(52,125,32,.08) !important; translate: 0 0; }
}

/* ---------- 5. البنر الرئيسي ---------- */
body.index .app-inner > salla-hook[name="index:start"] {
  position: relative; overflow: hidden; isolation: isolate;
  display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 6px; text-align: center;
  height: var(--hero-h); padding: 20px 20px 64px; box-sizing: border-box;
  background-color: #EDF2DF;
  background-image:
    radial-gradient(circle at 23% 67%, rgba(255,255,255,.75) 0 1.2px, transparent 2.2px),
    radial-gradient(circle at 71% 19%, rgba(255,240,200,.6) 0 1.8px, transparent 3px),
    linear-gradient(105deg, transparent 42%, rgba(255,255,255,.22) 50%, transparent 58%),
    radial-gradient(ellipse 34% 58% at 50% 44%, rgba(255,255,255,.9) 0%, rgba(255,255,255,.62) 45%, rgba(255,255,255,0) 78%),
    var(--hero-img);
  background-size: 157px 211px, 233px 179px, 260% 100%, auto, cover;
  background-repeat: repeat, repeat, no-repeat, no-repeat, no-repeat;
  background-position: 0 0, 0 0, 130% 0, 0 0, 50% 50%;
  animation: av-hero 26s linear infinite;
}
@media (min-width: 968px) {
  body.index .app-inner > salla-hook[name="index:start"] { animation: av-hero 26s linear infinite, av-kb 20s ease-in-out infinite alternate; }
}
body.index .app-inner > salla-hook[name="index:start"]::before {
  content: "لحوم طازجة .. لمائدتكم";
  font-family: var(--sans); font-weight: 700 !important; font-size: var(--fs-hero); line-height: 1.35; letter-spacing: 0;
  background: linear-gradient(100deg, transparent 40%, rgba(229,0,25,.95) 50%, transparent 60%) 130% 0 / 260% 100% no-repeat, #193F10;
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
  animation: av-title 1.5s var(--ease-out) .2s both, av-text-shine 7s ease-in-out 2.2s infinite;
}
body.index .app-inner > salla-hook[name="index:start"]::after {
  content: "أغنام الوادي .. جودة تثق بها";
  font-family: var(--sans); font-size: var(--fs-hero-sub); font-weight: 600; color: var(--green); padding-top: 14px;
  background: linear-gradient(90deg, transparent, var(--red), transparent) top center / 0% 2px no-repeat;
  animation: av-fade-up .9s var(--ease-out) .8s both, av-line-draw 1.1s var(--ease-io) 1.1s both;
}

/* القسم الأول بعد البنر + شريطة «طازجة 100%» */
body.index .app-inner > salla-hook[name="index:start"] + section {
  position: relative; z-index: 4; overflow: visible !important; -webkit-mask-image: none !important; mask-image: none !important;
}
body.index .app-inner > salla-hook[name="index:start"] + section::before {
  content: "لحوم طازجة\A 100%"; white-space: pre; position: absolute; z-index: 6; pointer-events: none;
  top: calc(var(--overlap, 0px) - var(--hero-h)); right: 28px; width: 112px; box-sizing: border-box;
  padding: 18px 8px 30px; text-align: center; color: #FFFFFF; background: var(--red);
  font-family: var(--sans); font-size: 18px; font-weight: 800; line-height: 1.45;
  clip-path: polygon(0 0, 100% 0, 100% 84%, 50% 100%, 0 84%);
  transform-origin: top center; filter: drop-shadow(0 8px 14px rgba(0,0,0,.25));
  animation: av-ribbon-in .9s var(--ease-back) .7s both, av-sway 5s ease-in-out 2s infinite;
}

/* ---------- 6. نظام الأقسام والعناوين ---------- */
.s-block__title h2::after, .s-slider-block__title h2::after { display: none !important; content: none !important; }
.s-block__title p:empty { display: none !important; }
.s-block .s-block__title { text-align: center; margin: 0 0 22px !important; }
.s-block .s-block__title h2 {
  text-align: center !important; font-family: var(--sans) !important; font-size: var(--fs-h2) !important; line-height: 1.35 !important; color: var(--ink) !important; margin: 0 !important;
}
.s-block .s-block__title h2::after {
  content: "" !important; display: block !important; width: 56px; height: 3px; margin: 10px auto 0; border-radius: 3px;
  background: linear-gradient(90deg, var(--green), var(--red));
}
.s-block .s-block__title p { text-align: center !important; color: var(--muted) !important; margin-top: 6px !important; }
.s-slider-block__title {
  display: flex !important; align-items: center !important; gap: 20px;
  min-height: 0 !important; height: auto !important; padding: 0 0 20px !important; margin: 0 !important; border: 0 !important;
}
.s-slider-block__title-right { display: flex !important; align-items: center !important; gap: 18px; flex: 1 1 auto !important; min-width: 0; }
.s-slider-block__title-right::after {
  content: ""; flex: 1 1 auto; height: 2px; border-radius: 2px; transform-origin: right center;
  background: linear-gradient(to left, var(--line), rgba(232,236,229,0));
}
.s-slider-block__title h2 {
  font-family: var(--sans) !important; font-size: var(--fs-h2) !important; font-weight: 700 !important; line-height: 1.35 !important;
  color: var(--ink) !important; margin: 0 !important; white-space: nowrap;
}
.s-slider-block__title-right h2::before {
  content: ""; display: inline-block; width: 6px; height: 24px; margin-inline-end: 10px; vertical-align: -4px; border-radius: 6px;
  background: linear-gradient(var(--red), var(--green));
}
.s-slider-block__display-all {
  display: inline-flex !important; flex-direction: row !important; align-items: center !important; gap: 6px;
  height: auto !important; padding: 6px 14px !important; border-radius: 999px !important; white-space: nowrap;
  color: var(--green) !important; background: var(--pale) !important; border: 1px solid var(--pale-line) !important;
  font-size: var(--fs-ui) !important; font-weight: 700 !important; line-height: 1.6 !important; text-decoration: none !important;
  transition: background-color .25s ease, color .25s ease, translate .3s var(--ease-back) !important;
}
.s-slider-block__display-all:hover { background: var(--green) !important; color: #FFFFFF !important; translate: -3px 0; }
.s-slider-block__display-all::before { display: none !important; }
.s-slider-block__title .s-slider-block__display-all::after {
  content: "←" !important; display: inline-block !important; position: static !important;
  width: auto !important; height: auto !important; background: none !important; border: 0 !important; margin: 0 !important;
  font-size: 14px; line-height: 1; color: currentColor; transition: translate .35s var(--ease-back);
}
.s-slider-block__title .s-slider-block__display-all:hover::after { translate: -4px 0; }

/* ---------- 7. شريط المزايا (يطفو على البنر) ---------- */
body .s-block--features, body .s-block--features.dark, body .s-block--features.bg-gray-100 {
  background: transparent !important; padding: 0 !important; -webkit-mask-image: none !important; mask-image: none !important;
}
body.index .app-inner > salla-hook[name="index:start"] + section.s-block--features { --overlap: 46px; margin-top: -46px !important; }
.s-block--features .s-block__title { display: none !important; }
.s-block--features .container { max-width: var(--container) !important; padding-left: 16px !important; padding-right: 16px !important; }
.s-block--features .grid { align-items: stretch !important; gap: 16px !important; }
.s-block--features .angel-feature {
  flex-direction: row !important; justify-content: flex-start !important; align-items: center !important; gap: 14px; text-align: start;
  height: 100%; padding: 16px 18px; box-sizing: border-box; border-radius: var(--radius);
  background: #FFFFFF; border: 1px solid #E6EDE1; box-shadow: 0 14px 34px rgba(25,63,16,.10);
  transition: transform .45s var(--ease-back), box-shadow .3s ease, border-color .3s ease;
}
.s-block--features .angel-feature:hover { transform: translateY(-5px); border-color: var(--pale-line); box-shadow: 0 22px 44px rgba(25,63,16,.16); }
.s-block--features .angel-feature > div:first-child {
  flex: 0 0 auto; width: 58px !important; height: 58px !important; border-radius: 50%;
  background: var(--pale); box-shadow: inset 0 0 0 1px var(--pale-line);
  transition: transform .5s var(--ease-back), background-color .3s ease;
}
.s-block--features .angel-feature > div:first-child > div {
  width: 34px !important; height: 34px !important; background-size: contain !important; background-position: center !important; background-repeat: no-repeat !important;
}
.s-block--features .angel-feature:hover > div:first-child { transform: rotate(-10deg) scale(1.08); background: var(--red-soft); }
.s-block--features .angel-feature > div:last-child { align-items: flex-start !important; margin: 0 !important; min-width: 0; }
.s-block--features .angel-feature p { text-align: start !important; }
.s-block--features .angel-feature p:first-child { color: var(--green-dark) !important; font-size: var(--fs-base) !important; font-weight: 700 !important; line-height: 1.4 !important; }
.s-block--features .angel-feature p + p { color: var(--muted) !important; font-size: var(--fs-sm) !important; line-height: 1.55 !important; margin-top: 2px !important; }

/* ---------- 8. الأقسام الدائرية بإطار متدرّج ---------- */
.s-block--banners { padding: var(--sec-gap) 0 0 !important; -webkit-mask-image: none !important; mask-image: none !important; }
.s-block--banners .container { max-width: var(--container) !important; padding-left: 16px !important; padding-right: 16px !important; }
.s-block--banners .s-slider-block__title { display: none !important; }
.s-block--banners .swiper { padding: 6px 0 0 !important; margin: 0 !important; width: 100% !important; overflow: visible !important; }
.s-block--banners .swiper-wrapper {
  display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 8px !important;
  transform: none !important; height: auto !important;
}
.s-block--banners .swiper-wrapper > .swiper-slide {
  --swiper-width-desktop: 100% !important; --swiper-width-mobile: 100% !important;
  width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 !important;
}
.s-block--banners .banner-square > div { width: 100%; box-sizing: border-box; text-align: center; }
.s-block--banners .banner-square .box-img { margin: 0 auto 12px !important; }
.s-block--banners .swiper-slide-duplicate, .s-block--banners .swiper-pagination, .s-block--banners .s-slider-block__title-nav { display: none !important; }
.s-block--banners .grayscaled-img img, .s-block--banners .grayscaled-img:hover img { filter: none !important; }
.s-block--banners .banner-square > div {
  padding: 10px 4px 12px; border-radius: 20px; transition: background-color .3s ease, transform .45s var(--ease-back);
}
.s-block--banners .banner-square:hover > div { background: var(--pale); transform: translateY(-4px); }
.s-block--banners .banner-square .box-img {
  position: relative; width: 124px; height: 124px; margin: 0 auto 12px; padding: 4px; box-sizing: border-box;
  border-radius: 50% !important; overflow: hidden; isolation: isolate; background: #FFFFFF;
  box-shadow: 0 10px 24px rgba(25,63,16,.14);
}
.s-block--banners .banner-square .box-img::before { content: ""; position: absolute; inset: 0; z-index: 0; border-radius: 50%; background: var(--ring); }
.s-block--banners .banner-square:hover .box-img::before { animation: av-rotate 2.4s linear infinite; }
.s-block--banners .banner-square .box-img::after {
  content: ""; position: absolute; inset: 4px; z-index: 2; border-radius: 50%; pointer-events: none; box-shadow: inset 0 0 0 3px #FFFFFF;
}
.s-block--banners .banner-square .box-img img {
  position: relative; z-index: 1; display: block; width: 100% !important; height: 100% !important; object-fit: cover !important;
  border-radius: 50% !important; transition: transform .6s var(--ease-out);
}
.s-block--banners .banner-square:hover .box-img img { transform: scale(1.08); }
.s-block--banners .banner-square p { width: 100%; text-align: center !important; font-size: var(--fs-base) !important; font-weight: 700 !important; line-height: 1.45 !important; color: var(--ink) !important; transition: color .25s ease; }
.s-block--banners .banner-square:hover p { color: var(--green) !important; }

/* ---------- 9. شبكة المنتجات ---------- */
.s-block--best-offers .s-slider-block__title-nav,
.s-block--best-offers .swiper-pagination,
.s-block--best-offers .swiper-slide-duplicate { display: none !important; }
body.index .s-block--best-offers {
  overflow: visible !important; margin: 0 auto !important; padding: var(--sec-gap) 16px 0 !important; max-width: var(--container) !important;
}
.s-block--best-offers .swiper { overflow: visible !important; padding: 0 !important; margin: 0 !important; }
.s-block--best-offers .swiper-wrapper { transform: none !important; height: auto !important; }
.s-block--best-offers .swiper-slide { width: auto !important; height: auto !important; margin: 0 !important; padding: 0 !important; display: flex !important; }
.s-block--best-offers .swiper-slide > .s-product-card-entry { flex: 1 1 auto; }
.app-inner > .container {
  max-width: var(--container) !important; margin-left: auto !important; margin-right: auto !important;
  padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box !important;
}
.s-products-list-wrapper.s-products-list-vertical-cards,
.s-block--best-offers .swiper-wrapper {
  display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 24px 20px !important; align-items: stretch !important; justify-content: stretch !important;
}

/* ---------- 10. بطاقة المنتج ---------- */
.s-product-card-entry {
  position: relative !important; display: flex !important; flex-direction: column !important;
  width: 100% !important; height: 100% !important; min-height: 0 !important; padding: 12px !important; box-sizing: border-box !important;
  background: #FFFFFF !important; border: 1px solid #ECEFEA !important; border-radius: var(--radius) !important;
  box-shadow: var(--shadow-sm) !important; text-align: start !important; overflow: hidden !important;
  transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out), border-color .3s ease !important;
}
.s-product-card-entry:hover { transform: translateY(-6px) !important; box-shadow: var(--shadow-lg) !important; border-color: #D3E5C8 !important; }
.angel-shine-obj::before, .angel-shine-obj::after,
.s-product-card-entry.angel-shine-hover::before, .s-product-card-entry.angel-shine-hover::after { display: none !important; opacity: 0 !important; }
.angel-quick-view-btn, .s-product-card-quick-view-btn { display: none !important; }
/* تقييم المنتج: شارة صغيرة أسفل يمين الصورة (يقابلها زر المفضلة يساراً) */
.s-product-card-image .s-product-card-rating {
  position: absolute !important; top: auto !important; left: auto !important; right: 7px !important; bottom: 12px !important; z-index: 3 !important;
  display: inline-flex !important; align-items: center !important; gap: 3px !important; height: 26px !important; margin: 0 !important; padding: 0 9px !important;
  border-radius: 999px !important; background: rgba(255,255,255,.95) !important; box-shadow: 0 4px 12px rgba(16,24,40,.16) !important;
  color: var(--ink) !important; font-family: var(--num) !important; font-size: var(--fs-xs) !important; font-weight: 700 !important; line-height: 1 !important;
}
.s-product-card-image .s-product-card-rating i { color: #F5A623 !important; font-size: 11px !important; margin: 0 !important; }
.s-product-card-image .s-product-card-rating span { color: inherit !important; font: inherit !important; }

/* الصورة: إطار متدرّج + حلقة ملوّنة تدور عند المرور */
.s-product-card-image {
  position: relative !important; display: block !important; width: 100% !important; height: auto !important; aspect-ratio: 1 / 1 !important;
  flex: 0 0 auto !important; margin: 0 !important; padding: 5px !important; box-sizing: border-box !important;
  border-radius: 14px !important; overflow: hidden !important; isolation: isolate; background: var(--mat) !important;
}
.s-product-card-image::before {
  content: ""; position: absolute; inset: -60%; z-index: 0; pointer-events: none;
  background: var(--ring); opacity: 0; transition: opacity .45s ease;
  animation: av-rotate 3.2s linear infinite paused;
}
.s-product-card-entry:hover .s-product-card-image::before { opacity: 1; animation-play-state: running; }
.s-product-card-image > a {
  position: relative !important; z-index: 1; display: block !important; width: 100% !important; height: 100% !important;
  border-radius: 10px !important; overflow: hidden !important; background: #FFFFFF;
}
.s-product-card-image img, .s-product-card-image-cover {
  display: block; width: 100% !important; height: 100% !important; object-fit: cover !important; border-radius: 0 !important;
  transition: transform .9s var(--ease-out) !important;
}
.s-product-card-entry:hover .s-product-card-image img { transform: scale(1.07); }
.s-product-card-entry:has(.s-product-card-content-footer .s-button-element:disabled) .s-product-card-image img { filter: grayscale(.75) opacity(.72) !important; }
.s-product-card-image::after {
  content: ""; position: absolute; inset: 5px; z-index: 2; pointer-events: none; border-radius: 10px;
  box-shadow: inset 0 0 0 1px rgba(16,24,40,.06);
  background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,.38) 50%, transparent 65%) 160% 0 / 250% 100% no-repeat;
}
.s-product-card-entry:hover .s-product-card-image::after { animation: av-sheen 1.1s var(--ease-io); }

/* شارات العروض أعلى يمين الصورة */
.s-product-card-promotion-title {
  position: absolute !important; top: 10px !important; right: 10px !important; left: auto !important; bottom: auto !important;
  transform: none !important; z-index: 3 !important; min-width: 0 !important; height: auto !important; max-width: calc(100% - 64px);
  padding: 4px 11px !important; line-height: 1.6 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  background: var(--red) !important; color: #FFFFFF !important; border-radius: 999px !important;
  font-size: var(--fs-xs) !important; font-weight: 700 !important; box-shadow: 0 6px 14px rgba(229,0,25,.30);
  transform-origin: right center; animation: av-badge 2.8s ease-in-out 1.5s infinite;
}
.s-product-card-out-badge { border-radius: 999px !important; background: #3D4639 !important; color: #FFFFFF !important; font-size: var(--fs-xs) !important; font-weight: 700 !important; }

/* زر المفضلة */
.s-product-card-actions {
  position: absolute !important; top: auto !important; left: 12px !important; right: auto !important; bottom: 12px !important;
  z-index: 4 !important; display: flex !important; flex-direction: column; gap: 6px; opacity: 1 !important; visibility: visible !important; transform: none !important;
}
.s-product-card-wishlist { display: inline-flex !important; position: static !important; opacity: 1 !important; visibility: visible !important; transform: none !important; }
.s-product-card-entry .s-product-card-wishlist .s-button-element {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  width: 36px !important; height: 36px !important; min-width: 0 !important; min-height: 0 !important; padding: 0 !important;
  border: 0 !important; border-radius: 50% !important; background: rgba(255,255,255,.95) !important; color: var(--ink) !important;
  box-shadow: 0 6px 14px rgba(16,24,40,.14) !important; transition: transform .35s var(--ease-back), color .25s ease !important;
}
.s-product-card-entry .s-product-card-wishlist .s-button-element i { font-size: 17px !important; color: inherit !important; }
.s-product-card-entry .s-product-card-wishlist .s-button-element:hover { transform: scale(1.12); color: var(--red) !important; }

/* المحتوى: الاسم ثم السعر يمين ثم الزر بعرض كامل */
.s-product-card-content {
  display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; min-height: 0;
  padding: 12px 4px 0 !important; margin: 0 !important; text-align: start !important; background: transparent !important;
}
.s-product-card-content-main { margin: 0 !important; padding: 0 !important; height: auto !important; min-height: 0 !important; overflow: visible !important; text-align: start !important; }
.s-product-card-props { margin: 0 !important; }
.s-product-card-content-title {
  height: auto !important; min-height: 0 !important; margin: 0 !important;
  font-size: var(--fs-base) !important; line-height: 1.5 !important; font-weight: 600 !important; text-align: start !important;
  display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important;
  overflow: hidden !important; white-space: normal !important;
}
.s-product-card-content-title a { font-size: inherit !important; line-height: inherit !important; font-weight: inherit !important; color: var(--ink) !important; transition: color .25s ease; }
.s-product-card-content-title a:hover { color: var(--green) !important; }
.s-product-card-content-subtitle {
  display: none !important;
  margin: 2px 0 0 !important; height: auto !important; font-size: 13px !important; line-height: 1.5 !important; font-weight: 500 !important;
  color: var(--muted) !important; text-align: start !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.s-product-card-content-sub {
  display: flex !important; flex-wrap: wrap; align-items: center !important; justify-content: flex-start !important; gap: 4px 10px;
  height: auto !important; min-height: 0 !important; margin: auto 0 0 !important; padding: 10px 0 12px !important;
}
.s-product-card-price {
  display: inline-flex !important; align-items: center !important; gap: 4px; margin: 0 !important;
  color: var(--red) !important; font-family: var(--num) !important; font-size: var(--fs-price) !important; font-weight: 700 !important; line-height: 1.2 !important;
  transform-origin: right center; transition: transform .35s var(--ease-back) !important;
}
.s-product-card-price i, .s-product-card-price .sicon-sar { color: inherit !important; font-size: .78em !important; }
.s-product-card-entry:hover .s-product-card-price { transform: scale(1.06); }
.s-product-card-sale-price { display: inline-flex !important; flex-direction: row !important; flex-wrap: wrap; align-items: baseline !important; gap: 4px 10px !important; }
.s-product-card-price-before {
  display: inline-flex !important; align-items: center !important; gap: 2px; height: auto !important;
  color: #9AA096 !important; font-family: var(--num) !important; font-size: var(--fs-sm) !important; font-weight: 500 !important; line-height: 1.2 !important;
  text-decoration: line-through; text-decoration-color: rgba(229,0,25,.6);
}
.s-product-card-price-before i { font-size: 11px !important; color: inherit !important; }
.s-product-card-starting-price { display: inline-flex !important; flex-wrap: wrap; align-items: baseline !important; gap: 6px !important; }
.s-product-card-starting-price p { margin: 0 !important; color: var(--muted) !important; font-size: var(--fs-sm) !important; line-height: 1.2 !important; }

/* الأزرار العامة */
.s-button-solid.s-button-primary, body.product-single .s-button-solid.s-button-primary {
  background: #347D20 !important; border-color: #347D20 !important; color: #FFFFFF !important; border-radius: 12px !important; font-weight: 700 !important;
  box-shadow: 0 6px 14px rgba(52,125,32,.22) !important;
  transition: background-color .25s ease, box-shadow .3s ease, translate .3s var(--ease-back) !important;
}
.s-button-solid.s-button-primary:hover { background: #193F10 !important; border-color: #193F10 !important; translate: 0 -2px; box-shadow: 0 10px 22px rgba(25,63,16,.30) !important; }
.s-button-outline.s-button-primary { border-color: var(--red) !important; color: var(--red) !important; border-radius: 12px !important; }
.s-button-outline.s-button-primary:hover { background: var(--red-soft) !important; }

/* زر «أضف للسلة» في البطاقة: عرض كامل + لمعة عند المرور */
.s-product-card-content-footer {
  margin: 0 !important; padding: 0 !important; height: auto !important; flex: 0 0 auto !important;
  background: transparent !important; display: block !important; border-radius: 0 !important;
}
.s-product-card-content-footer salla-add-product-button,
.s-product-card-content-footer salla-add-product-button > div,
.s-product-card-content-footer salla-button { display: block !important; width: 100% !important; height: auto !important; }
.s-product-card-entry .s-product-card-content-footer .s-button-element {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  width: 100% !important; max-width: none !important; flex: none !important; height: 44px !important; min-height: 44px !important; padding: 0 12px !important;
  border: 0 !important; border-radius: 12px !important; color: #FFFFFF !important; font-size: var(--fs-ui) !important; font-weight: 700 !important;
  background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.32) 50%, transparent 70%) -160% 0 / 250% 100% no-repeat, #347D20 !important;
  box-shadow: 0 6px 14px rgba(52,125,32,.22) !important; translate: 0 0;
  transition: background-color .25s ease, background-position .9s var(--ease-out), box-shadow .3s ease, transform .2s ease !important;
}
.s-product-card-entry .s-product-card-content-footer .s-button-element:hover {
  background-color: #193F10 !important; background-position: 260% 0 !important; box-shadow: 0 10px 22px rgba(25,63,16,.30) !important;
}
.s-product-card-entry .s-product-card-content-footer .s-button-element:active { transform: scale(.97); }
.s-product-card-content-footer .s-button-element *, .s-product-card-content-footer .s-button-element i { color: #FFFFFF !important; }
.s-product-card-content-footer .s-button-text { display: inline-flex !important; align-items: center !important; gap: 8px !important; font-size: inherit !important; font-weight: inherit !important; }
.s-product-card-content-footer .s-button-element i { font-size: 17px !important; }
.s-product-card-entry:hover .s-product-card-content-footer .s-button-element i { animation: av-cart .65s var(--ease-back); }
.s-product-card-entry .s-product-card-content-footer .s-button-element:disabled,
.s-product-card-entry .s-product-card-content-footer .s-button-element[disabled],
.s-product-card-entry .s-product-card-content-footer .s-button-disabled { background: #EEF1EC !important; color: #8A9286 !important; box-shadow: none !important; }
.s-product-card-entry .s-product-card-content-footer .s-button-element:disabled *,
.s-product-card-entry .s-product-card-content-footer .s-button-element[disabled] * { color: #8A9286 !important; }

/* ---------- 12. آراء العملاء ---------- */
.s-block--testimonials { background: #F7FAF5 !important; margin-top: calc(var(--sec-gap) + 8px) !important; padding: calc(var(--sec-gap) + 4px) 0 var(--sec-gap) !important; }
.s-block--testimonials .container { max-width: var(--container) !important; padding-left: 16px !important; padding-right: 16px !important; }
.s-block--testimonials .swiper-wrapper { align-items: stretch !important; }
.s-block--testimonials .swiper-slide { height: auto !important; display: flex !important; margin-top: 2rem !important; }
.s-block--testimonials .swiper-slide > div {
  width: 100%; height: auto !important;
  border: 1px solid #E6EEDF; border-radius: var(--radius) !important; box-shadow: 0 6px 18px rgba(25,63,16,.06);
  transition: transform .45s var(--ease-back), box-shadow .3s ease;
}
.s-block--testimonials .swiper-slide > div:hover { transform: translateY(-5px); box-shadow: 0 18px 34px rgba(25,63,16,.12); }
.s-block--testimonials .s-testimonials--slider--img p { font-size: var(--fs-md) !important; line-height: 1.5 !important; font-weight: 700 !important; color: var(--ink) !important; }
.s-block--testimonials .swiper-slide p.text-base {
  font-size: var(--fs-base) !important; line-height: 1.8 !important; color: var(--text) !important;
  display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 4 !important; overflow: hidden !important;
}
.s-block--testimonials .testimonial__avatar { padding: 3px; background: var(--ring) !important; box-shadow: 0 8px 18px rgba(25,63,16,.16); }
.s-block--testimonials .testimonial__avatar img { border-radius: 50% !important; border: 3px solid #FFFFFF; box-sizing: border-box; }
.s-block--bundle-personalized-shoppers-who-bought:not(:has(.s-product-card-entry, img)) { padding: 0 !important; margin: 0 !important; min-height: 0 !important; }

/* ---------- 13. صفحات التصنيف ---------- */
body.product-index .s-block--testimonials, body.product-index .cat-slider-banner, body.product-index .cat-square-banner { display: none !important; }
.app-inner > .nav-header {
  position: relative; overflow: hidden; min-height: 200px !important; height: auto !important; padding: 40px 20px !important;
  display: flex !important; justify-content: center !important; align-items: center !important;
  background-color: #193F10;
  background-image:
    radial-gradient(circle at 23% 67%, rgba(255,255,255,.55) 0 1.2px, transparent 2.2px),
    radial-gradient(circle at 71% 19%, rgba(255,240,200,.45) 0 1.8px, transparent 3px),
    linear-gradient(105deg, transparent 42%, rgba(255,255,255,.12) 50%, transparent 58%),
    linear-gradient(rgba(25,63,16,.78), rgba(25,63,16,.86)),
    var(--hero-img);
  background-size: 157px 211px, 233px 179px, 260% 100%, auto, cover;
  background-repeat: repeat, repeat, no-repeat, no-repeat, no-repeat;
  background-position: 0 0, 0 0, 130% 0, 0 0, 50% 50%;
  animation: av-hero 26s linear infinite;
}
.app-inner > .nav-header .nav-title.container { max-width: var(--container) !important; width: 100% !important; height: auto !important; padding: 0 16px !important; margin: 0 auto !important; }
.app-inner > .nav-header .category_title_wrapper {
  width: 100% !important; height: auto !important; display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important; gap: 12px;
}
.app-inner > .nav-header #page-main-title, .app-inner > .nav-header .category_title {
  font-family: var(--sans) !important; font-size: var(--fs-cat) !important; font-weight: 700 !important; line-height: 1.25 !important;
  color: #FFFFFF !important; margin: 0 !important; text-align: center; letter-spacing: 0 !important; text-shadow: 0 2px 18px rgba(0,0,0,.25);
  animation: av-title 1.3s var(--ease-out) .15s both;
}
.nav-header nav.breadcrumbs { width: auto !important; }
.app-inner > .nav-header .nav-title { display: flex !important; }
.app-inner > .nav-header .nav-title, .app-inner > .nav-header .nav-title > div, .app-inner > .nav-header .nav-title .flex-col {
  flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; gap: 12px;
}
.app-inner > .nav-header h1 span { color: rgba(255,255,255,.75) !important; font-size: var(--fs-ui) !important; font-weight: 500 !important; }
.app-inner > .nav-header h1 {
  font-family: var(--sans) !important; font-size: var(--fs-cat) !important; font-weight: 700 !important; line-height: 1.3 !important;
  color: #FFFFFF !important; margin: 0 !important; text-align: center !important; text-shadow: 0 2px 18px rgba(0,0,0,.25);
  animation: av-title 1.3s var(--ease-out) .15s both;
}
.app-inner > .nav-header nav.breadcrumbs, .app-inner > .nav-header .s-breadcrumb-wrapper { display: flex !important; justify-content: center !important; width: auto !important; }
.app-inner > .nav-header nav.breadcrumbs { animation: av-fade-up .8s var(--ease-out) .6s both; }
.app-inner > .nav-header .s-breadcrumb-wrapper, .app-inner > .nav-header .s-breadcrumb-item { font-size: var(--fs-sm) !important; line-height: 18px !important; color: rgba(255,255,255,.78) !important; }
.app-inner > .nav-header .s-breadcrumb-wrapper a { color: #FFFFFF !important; text-decoration: none !important; border-bottom: 1px solid rgba(255,255,255,.45); }
.app-inner > .nav-header .s-breadcrumb-wrapper a:hover { color: #FFD9DC !important; border-color: #FFD9DC; }
.app-inner > .nav-header .s-breadcrumb-arrow svg { width: 10px !important; height: 10px !important; fill: rgba(255,255,255,.6) !important; }
.prdoucts-list-filters {
  min-height: 0 !important; margin: 22px 0 20px !important; padding: 0 0 16px !important; border-bottom: 1px solid var(--line);
  animation: av-fade-up .8s var(--ease-out) .4s both;
}
.prdoucts-list-filters .prod-filter > div { justify-content: flex-end !important; align-items: center !important; }
.prdoucts-list-filters .prod-filter .flex.items-center { gap: 10px; }
.prdoucts-list-filters label { color: var(--muted) !important; font-size: var(--fs-ui) !important; font-weight: 500 !important; margin: 0 0 0 12px !important; }
#product-filter {
  -webkit-appearance: none !important; appearance: none !important; cursor: pointer;
  width: 210px !important; height: 42px !important; padding: 0 14px 0 52px !important;
  border: 1px solid #DCE5D6 !important; border-radius: 12px !important; box-shadow: none !important;
  color: var(--ink) !important; font-size: var(--fs-ui) !important; font-weight: 600 !important; background-color: #FFFFFF !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E"), linear-gradient(#347D20, #347D20) !important;
  background-repeat: no-repeat !important; background-size: 16px 16px, 42px 100% !important;
  background-position: left 13px center, left top !important;
}
.s-infinite-scroll-btn {
  border-radius: 999px !important; background: var(--pale) !important; color: var(--green-dark) !important;
  border: 1px solid var(--pale-line) !important; font-weight: 700 !important; padding-left: 28px !important; padding-right: 28px !important;
}

/* ---------- 13ب. المدونة والمقالات والصفحات ---------- */
body.blog-index .app-inner > .container nav.shrink-0 {
  margin-top: 28px !important; top: 96px !important; padding: 14px 18px !important; box-sizing: border-box !important;
  background: #FFFFFF !important; border: 1px solid var(--line) !important; border-radius: var(--radius) !important; box-shadow: var(--shadow-sm) !important;
}
body.blog-index .app-inner > .container nav.shrink-0 *:not(i) { font-size: var(--fs-ui) !important; }
body.blog-index .app-inner > .container nav.shrink-0 > div:first-child, body.blog-index .app-inner > .container nav.shrink-0 > div:first-child * { font-size: var(--fs-md) !important; font-weight: 700 !important; color: var(--ink) !important; }
body.blog-index .blog-slider { border-radius: 18px !important; box-shadow: 0 18px 40px rgba(16,24,40,.14); margin-bottom: 0 !important; }
.blog-articles { gap: 28px !important; padding-top: 32px !important; align-items: stretch !important; }
.blog-articles > .post-entry { align-self: stretch !important; height: auto !important; justify-content: flex-start !important; }
.post-entry > div:last-child { flex: 1 1 auto !important; }
.post-entry {
  background: #FFFFFF; border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow-sm);
  transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out);
}
.post-entry:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.post-entry > div:first-child { width: 100% !important; margin: 0 !important; padding: 12px 12px 0 !important; box-sizing: border-box !important; }
.post-entry .post-entry__image { border-radius: 12px !important; box-shadow: none !important; }
.post-entry .post-entry__image > div { transition: transform .9s var(--ease-out) !important; }
.post-entry:hover .post-entry__image > div { transform: scale(1.05); }
.post-entry .post-entry__title, .post-entry .post-entry__title a { font-size: var(--fs-lg) !important; line-height: 1.55 !important; font-weight: 700 !important; color: var(--ink) !important; }
.post-entry .post-entry__title a:hover { color: var(--green) !important; }
.post-entry p.line-clamp-3 { font-size: var(--fs-ui) !important; line-height: 1.8 !important; color: var(--muted) !important; margin-bottom: 10px !important; }
.post-entry .border-t { align-items: center !important; padding-top: 12px !important; margin-top: auto !important; border-color: var(--line) !important; }
.post-entry .border-t > a:not(.underlined) .flex-col > span:not(.text-xs) { display: none !important; }
.post-entry .border-t .text-xs { font-size: var(--fs-sm) !important; color: var(--muted) !important; }
.post-entry .underlined, .post-entry .underlined * { font-size: var(--fs-ui) !important; font-weight: 700 !important; color: var(--green) !important; }

body.blog-single .app-inner > .nav-header { background-size: cover !important; background-repeat: no-repeat !important; background-position: center !important; animation: none !important; }
body.blog-single .app-inner > .nav-header .overlay { background: linear-gradient(rgba(25,63,16,.82), rgba(18,48,15,.92)) !important; opacity: 1 !important; }
body.blog-single .app-inner > .nav-header h1 { font-size: var(--fs-h1) !important; max-width: 920px; }
body.blog-single .main-content .post-entry__image { border-radius: 16px !important; box-shadow: 0 16px 36px rgba(16,24,40,.14); }
body.blog-single .main-content > .border-b { align-items: center !important; padding: 12px 0 !important; border-color: var(--line) !important; }
body.blog-single .main-content > .border-b > a { display: none !important; }
body.blog-single .main-content > .border-b span { font-size: var(--fs-sm) !important; color: var(--muted) !important; }
body.blog-single .main-content > p.text-2xl { font-size: var(--fs-h1) !important; line-height: 1.5 !important; font-weight: 700 !important; color: var(--ink) !important; margin: 18px 0 12px !important; }
body.blog-single article { font-size: var(--fs-md) !important; line-height: 1.95 !important; color: var(--text) !important; }
body.blog-single article p, body.blog-single article li, body.blog-single article span, body.blog-single article strong { font-size: inherit !important; line-height: inherit !important; }
body.blog-single article h2, body.blog-single article h2 * { font-size: calc(var(--fs-lg) + 2px) !important; line-height: 1.5 !important; font-weight: 700 !important; color: var(--ink) !important; }
body.blog-single article h2 { margin: 26px 0 8px !important; }
body.blog-single article h3, body.blog-single article h3 * { font-size: var(--fs-lg) !important; line-height: 1.5 !important; font-weight: 700 !important; color: var(--ink) !important; }
body.blog-single .app-inner > .container nav { font-size: var(--fs-ui) !important; }
body.blog-single .app-inner > .container nav h2 { font-size: var(--fs-lg) !important; font-weight: 700 !important; color: var(--ink) !important; }
body.blog-single .app-inner > .container nav h3, body.blog-single .app-inner > .container nav h3 a { font-size: var(--fs-ui) !important; line-height: 1.6 !important; font-weight: 700 !important; color: var(--ink) !important; }
body.blog-single .app-inner > .container nav h3 a:hover { color: var(--green) !important; }
body.blog-single .app-inner > .container nav time { font-size: var(--fs-xs) !important; color: var(--muted) !important; }

body.page-single .content--single-page.opt-text {
  max-width: 880px !important; margin: 36px auto 0 !important; padding: 32px 36px !important; box-sizing: border-box !important;
  background: #FFFFFF; border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow-sm);
  font-size: var(--fs-md) !important; line-height: 1.95 !important; color: var(--text) !important;
}
body.page-single .content--single-page.opt-text p, body.page-single .content--single-page.opt-text li,
body.page-single .content--single-page.opt-text span, body.page-single .content--single-page.opt-text strong { font-size: inherit !important; line-height: inherit !important; }
body.page-single .content--single-page.opt-text h2, body.page-single .content--single-page.opt-text h3 { font-size: var(--fs-lg) !important; line-height: 1.5 !important; color: var(--ink) !important; margin: 18px 0 6px !important; }

/* ---------- 14. صفحة المنتج ---------- */
@media (min-width: 768px) {
  body.product-single .app-inner > .bg-gray-100 > .container,
  body.product-single .md\:container,
  body.product-single .sticky-product-bar > .container {
    max-width: var(--container) !important; margin-left: auto !important; margin-right: auto !important;
    padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box !important;
  }
  body.product-single .sidebar.md\:sticky {
    top: 92px !important; width: 46% !important; flex: 0 0 46% !important; margin-inline: 0 40px !important;
  }
  body.product-single .main-content { flex: 1 1 0% !important; width: auto !important; min-width: 0 !important; }
}
body.product-single section.details { padding-left: 0 !important; padding-right: 0 !important; background: transparent !important; }
/* «قد يعجبك أيضاً»: شبكة متوازنة بعرض الصفحة بدل شريط يترك فراغاً على اليسار */
body.product-single .main-content { padding-bottom: 8px !important; }
body.product-single .s-block--payment { padding-top: 8px !important; padding-bottom: 8px !important; }
@media (min-width: 768px) {
  body.product-single salla-products-slider .swiper { overflow: visible !important; padding: 0 !important; margin: 0 !important; }
  body.product-single salla-products-slider .swiper-wrapper {
    display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 20px !important;
    transform: none !important; height: auto !important; align-items: stretch !important;
  }
  body.product-single salla-products-slider .swiper-slide { width: auto !important; height: auto !important; margin: 0 !important; display: flex !important; }
  body.product-single salla-products-slider .swiper-slide > .s-product-card-entry { flex: 1 1 auto; }
  body.product-single salla-products-slider .s-slider-block__title-nav { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  body.product-single salla-products-slider .swiper-wrapper { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; }
}
body.product-single salla-gifting .s-list-tile-item {
  align-items: center !important; gap: 12px; padding: 14px 18px !important; border-radius: 16px !important;
  background: linear-gradient(135deg, #FFF4F5, #FFFFFF 70%) !important; border: 1px solid #F6D3D8 !important;
}
body.product-single .tabs__product {
  display: flex !important; gap: 6px !important; width: max-content; max-width: 100%; margin-bottom: 12px !important; padding: 5px !important;
  background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 14px !important;
}
body.product-single .tabs__product .tab-trigger {
  height: 40px !important; padding: 0 18px !important; gap: 6px; border-radius: 10px !important; font-size: var(--fs-base) !important;
  background: transparent !important; color: var(--muted) !important; font-weight: 700 !important; box-shadow: none !important;
  transition: background-color .25s ease, color .25s ease, box-shadow .25s ease !important;
}
body.product-single .tabs__product .tab-trigger i { color: inherit !important; }
body.product-single .tabs__product .tab-trigger:hover { color: var(--red) !important; }
body.product-single .tabs__product .tab-trigger.is-active,
body.product-single .tabs__product .tab-trigger:first-child:not(.inactive) {
  background: #FFFFFF !important; color: var(--green-dark) !important; box-shadow: 0 4px 12px rgba(25,63,16,.12) !important;
}
body.product-single .tabs-wrapper__product { border: 1px solid var(--line) !important; border-radius: 16px !important; }
body.product-single .details-slider {
  padding: 6px !important; border-radius: 18px !important; background: var(--mat) !important; overflow: hidden !important;
  box-shadow: 0 18px 44px rgba(25,63,16,.10) !important;
}
body.product-single .details-slider .swiper, body.product-single .details-slider .swiper-slide { border-radius: 13px !important; overflow: hidden; }
body.product-single .details-slider img { transition: transform .9s var(--ease-out); }
body.product-single .details-slider:hover img { transform: scale(1.04); }
body.product-single h1 { font-size: var(--fs-h1) !important; line-height: 1.45 !important; font-weight: 700 !important; color: var(--ink) !important; }
body.product-single .total-price, body.product-single .price-wrapper .total-price {
  color: var(--red) !important; font-family: var(--num) !important; font-size: var(--fs-pprice) !important; font-weight: 700 !important; line-height: 1.3 !important;
}
body.product-single .before-price { color: #9AA096 !important; font-family: var(--num) !important; font-size: var(--fs-md) !important; font-weight: 500 !important; text-decoration-color: rgba(229,0,25,.6); }
body.product-single .s-rating-stars-reviews { font-size: var(--fs-ui) !important; font-weight: 600 !important; color: var(--muted) !important; }
body.product-single .product-availablity strong { font-size: var(--fs-ui) !important; font-weight: 700 !important; }
body.product-single .main-categoty p, body.product-single .main-categoty a, body.product-single .details__title, body.product-single .details__title span { font-size: var(--fs-ui) !important; }
body.product-single .short__description p { font-size: var(--fs-base) !important; line-height: 1.8 !important; color: var(--text) !important; }
body.product-single .tabs-wrapper__product, body.product-single .tabs-wrapper__product p, body.product-single .tabs-wrapper__product li,
body.product-single .tabs-wrapper__product span, body.product-single .tabs-wrapper__product strong { font-size: var(--fs-md) !important; line-height: 1.85 !important; }
body.product-single .tabs-wrapper__product h1, body.product-single .tabs-wrapper__product h2, body.product-single .tabs-wrapper__product h3,
body.product-single .tabs-wrapper__product h2 *, body.product-single .tabs-wrapper__product h3 * { font-size: var(--fs-lg) !important; line-height: 1.5 !important; font-weight: 700 !important; color: var(--ink) !important; }
body.product-single salla-gifting h3, body.product-single salla-gifting .s-list-tile-item-title * { font-size: var(--fs-lg) !important; line-height: 1.5 !important; }
body.product-single salla-gifting .s-list-tile-item-subtitle, body.product-single salla-gifting .s-list-tile-item-subtitle * { font-size: var(--fs-sm) !important; line-height: 1.6 !important; }
body.product-single nav.breadcrumbs, body.product-single .s-breadcrumb-wrapper, body.product-single .s-breadcrumb-item { font-size: var(--fs-sm) !important; }
body.product-single .sticky-product-bar .line-clamp-1 { font-size: var(--fs-md) !important; font-weight: 700 !important; line-height: 1.5 !important; }
body.product-single .sticky-product-bar .total-price { font-size: 22px !important; }
body.product-single .sticky-product-bar .before-price { font-size: var(--fs-sm) !important; }
body.product-single .sticky-product-bar .s-button-element, body.product-single .sticky-product-bar .s-button-text { font-size: var(--fs-ui) !important; }
body.product-single .details__wrapper { border-radius: 12px !important; background: var(--pale) !important; border: 1px solid var(--pale-line) !important; }
body.product-single .sticky-product-bar { box-shadow: 0 -10px 28px rgba(16,24,40,.08) !important; border-top: 1px solid var(--line) !important; }
.s-quantity-input-container { border-radius: 12px !important; border-color: #DCE5D6 !important; overflow: hidden; }
.s-quantity-input-button { color: var(--green) !important; }

/* ---------- 15. الفوتر ---------- */
.store-footer, .store-footer__inner { --footer-bg: #173D13 !important; }
.store-footer, .store-footer > div, .store-footer__inner, footer.store-footer .store-footer__inner.da-bgm.has-custom-bg {
  background-color: #173D13 !important; color: rgba(255,255,255,.78) !important;
}
.store-footer { position: relative; overflow: hidden; margin-top: 48px; border-top: 0; }
body.index .store-footer { margin-top: 0; }
.store-footer::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; z-index: 3;
  background: linear-gradient(90deg, #347D20, #E50019, #8BC34A, #347D20) 0 0 / 200% 100%;
  animation: av-flow 6s linear infinite;
}
.store-footer::after {
  content: "أغنام الوادي"; position: absolute; left: 50%; bottom: 64px; translate: -50% 0; z-index: 0; pointer-events: none;
  font-family: var(--sans); font-weight: 800; font-size: clamp(90px, 14vw, 220px); line-height: 1; white-space: nowrap; color: rgba(255,255,255,.035);
}
.store-footer .to-top { display: none !important; }
.store-footer .container { position: relative; z-index: 1; max-width: var(--container) !important; padding-left: 16px !important; padding-right: 16px !important; }
.store-footer .footer-top {
  min-height: 0; padding: 22px 20px !important; border: 0 !important;
  background: #12300F !important; box-shadow: 0 0 0 100vmax #12300F; clip-path: inset(0 -100vmax);
}
.store-footer .footer-middle {
  display: grid !important; grid-template-columns: 1.3fr 1.1fr 1.4fr 1.1fr; gap: 32px 40px !important;
  padding: 48px 0 40px !important; border: 0 !important; align-items: start !important;
}
.store-footer .footer-middle > div { min-width: 0 !important; max-width: none !important; width: auto !important; flex-shrink: 1 !important; }
.store-footer .footer-profile { align-items: flex-start !important; text-align: start !important; }
.store-footer .footer-profile p, .store-footer .footer-description { text-align: start !important; }
.store-footer .footer-profile .logo-footer img { max-height: 64px !important; width: auto !important; }
.store-footer .footer-description { margin-top: 14px !important; max-width: 320px; }
.store-footer .footer-title, .store-footer h2, .store-footer h3, .store-footer h4, .store-footer .s-contacts-title {
  font-family: var(--sans) !important; color: #FFFFFF !important; font-size: var(--fs-md) !important; font-weight: 700 !important; line-height: 1.5 !important; margin: 0 0 18px !important;
}
.store-footer a, .store-footer p, .store-footer span, .store-footer li { color: rgba(255,255,255,.78) !important; font-size: var(--fs-ui) !important; line-height: 1.6 !important; font-weight: 400 !important; }
.store-footer i { color: rgba(255,255,255,.78) !important; }
.store-footer a:hover { color: #FFFFFF !important; }
.store-footer .footer-list { display: flex !important; flex-direction: column !important; gap: 0 !important; columns: auto !important; }
.store-footer .footer-list a { margin-bottom: 12px !important; transition: color .25s ease, translate .3s var(--ease-back) !important; }
.store-footer .footer-list a:hover { translate: -4px 0; }
.store-footer .s-contacts-list { display: flex !important; flex-direction: column !important; gap: 10px !important; }
.store-footer .s-contacts-list > div { width: 100% !important; }
.store-footer .s-contacts-item {
  display: flex !important; align-items: center; gap: 10px; width: 100% !important; padding: 9px 12px !important; overflow: hidden;
  background: rgba(255,255,255,.06) !important; border: 1px solid rgba(255,255,255,.14) !important; border-radius: 12px !important;
  transition: border-color .25s ease, background-color .25s ease, translate .35s var(--ease-back) !important;
}
.store-footer .s-contacts-item:hover { border-color: var(--red) !important; background: rgba(255,255,255,.10) !important; translate: -4px 0; }
.store-footer .s-contacts-item .unicode { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.store-footer .footer-vat { flex-wrap: wrap; justify-content: flex-start !important; padding: 0 !important; gap: 16px !important; }
.store-footer .s-apps-icons-list { justify-content: flex-start !important; }
.store-footer .footer-bottom {
  padding: 18px 0 !important; border: 0 !important; background: #0F2A0C !important; box-shadow: 0 0 0 100vmax #0F2A0C; clip-path: inset(0 -100vmax);
}
.store-footer .footer-bottom p, .store-footer .copyrights p { font-size: var(--fs-sm) !important; color: rgba(255,255,255,.65) !important; margin: 0 !important; }
.store-footer .s-payments-list-item { transition: translate .35s var(--ease-back) !important; }
.store-footer .s-payments-list-item:hover { translate: 0 -3px; }
.store-footer .s-social-link a { background: rgba(255,255,255,.1) !important; transition: background-color .25s ease, translate .35s var(--ease-back) !important; }
.store-footer .s-social-link a:hover { background: var(--red) !important; translate: 0 -4px; }
.store-footer .s-social-link svg, .store-footer .s-social-link svg path { fill: #FFFFFF !important; }

/* ---------- 16. واتساب + شريط التقدّم + انتقال الصفحات ---------- */
.wa-angel { border-radius: 50%; animation: av-ring-wa 2.4s ease-out 3s infinite, av-float 4s ease-in-out 3s infinite; }
@supports (animation-timeline: scroll()) {
  body::before {
    content: ""; position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 10000; pointer-events: none;
    background: linear-gradient(270deg, var(--red), #FF7A85 55%, var(--green)); transform-origin: right center;
    animation: av-progress linear both; animation-timeline: scroll(root block);
  }
  body.index .app-inner > salla-hook[name="index:start"]::before {
    animation: av-title 1.5s var(--ease-out) .2s both, av-text-shine 7s ease-in-out 2.2s infinite, av-parallax linear both;
    animation-timeline: auto, auto, scroll(root block); animation-range: normal, normal, 0px 420px;
  }
  body.index .app-inner > salla-hook[name="index:start"]::after {
    animation: av-fade-up .9s var(--ease-out) .8s both, av-line-draw 1.1s var(--ease-io) 1.1s both, av-parallax linear both;
    animation-timeline: auto, auto, scroll(root block); animation-range: normal, normal, 0px 420px;
  }
}
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: av-vt-out .3s var(--ease-io) both; }
::view-transition-new(root) { animation: av-vt-in .55s var(--ease-out) both; }

/* ---------- 17. الظهور مع التمرير ---------- */
@supports (animation-timeline: view()) {
  .s-product-card-entry { animation: av-card-in linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
  .swiper-slide:nth-child(4n+2) > .s-product-card-entry, .s-products-list-wrapper > .s-product-card-entry:nth-child(4n+2) { animation-range: entry 6% entry 46%; }
  .swiper-slide:nth-child(4n+3) > .s-product-card-entry, .s-products-list-wrapper > .s-product-card-entry:nth-child(4n+3) { animation-range: entry 12% entry 52%; }
  .swiper-slide:nth-child(4n+4) > .s-product-card-entry, .s-products-list-wrapper > .s-product-card-entry:nth-child(4n+4) { animation-range: entry 18% entry 58%; }
  .s-product-card-image img { animation: av-img-in linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }
  .s-slider-block__title h2, .s-block .s-block__title h2 { animation: av-fade-up linear both; animation-timeline: view(); animation-range: entry 0% entry 70%; }
  .s-block .s-block__title h2::after { animation: av-scale-x linear both; animation-timeline: view(); animation-range: entry 20% cover 30%; }
  .s-slider-block__title-right::after { animation: av-scale-x linear both; animation-timeline: view(); animation-range: entry 10% cover 35%; }
  .s-slider-block__display-all { animation: av-fade-up linear both; animation-timeline: view(); animation-range: entry 20% entry 90%; }
  .s-block--features .angel-feature { animation: av-card-in linear both; animation-timeline: view(); animation-range: entry 0% entry 60%; }
  .s-block--features .angel-feature:nth-child(2) { animation-range: entry 8% entry 68%; }
  .s-block--features .angel-feature:nth-child(3) { animation-range: entry 16% entry 76%; }
  .s-block--features .angel-feature:nth-child(4) { animation-range: entry 24% entry 84%; }
  .s-block--banners .banner-square > div { animation: av-card-in linear both; animation-timeline: view(); animation-range: entry 0% entry 70%; }
  .s-block--testimonials .swiper-slide > div { animation: av-card-in linear both; animation-timeline: view(); animation-range: entry 0% entry 60%; }
  .store-footer .footer-middle > div { animation: av-fade-up linear both; animation-timeline: view(); animation-range: entry 0% entry 60%; }
}
@supports not (animation-timeline: view()) {
  .s-product-card-entry { animation: av-card-in .9s var(--ease-out) both; }
  .swiper-slide:nth-child(4n+2) > .s-product-card-entry, .s-products-list-wrapper > .s-product-card-entry:nth-child(4n+2) { animation-delay: .08s; }
  .swiper-slide:nth-child(4n+3) > .s-product-card-entry, .s-products-list-wrapper > .s-product-card-entry:nth-child(4n+3) { animation-delay: .16s; }
  .swiper-slide:nth-child(4n+4) > .s-product-card-entry, .s-products-list-wrapper > .s-product-card-entry:nth-child(4n+4) { animation-delay: .24s; }
}

/* ---------- 18. الشاشات الكبيرة والتابلت ---------- */
@media (min-width: 1600px) {
  :root, html, body { --container: 1392px; }
  .store-header .header-container.container { max-width: 1408px !important; }
}
@media (max-width: 1100px) {
  .s-block--features .angel-feature { flex-direction: column !important; align-items: center !important; text-align: center; gap: 8px; padding: 16px 12px; }
  .s-block--features .angel-feature > div:last-child { align-items: center !important; }
  .s-block--features .angel-feature p { text-align: center !important; }
  .s-block--features .angel-feature p:first-child { font-size: var(--fs-ui) !important; }
  .s-block--banners .banner-square .box-img { width: 104px; height: 104px; }
  .s-block--banners .banner-square p { font-size: var(--fs-ui) !important; }
}
@media (max-width: 1023px) {
  :root, html, body { --fs-price: 18px; --fs-h2: 24px; --fs-cat: 34px; --fs-h1: 26px; --fs-pprice: 28px; }
  .s-products-list-wrapper.s-products-list-vertical-cards,
  .s-block--best-offers .swiper-wrapper { gap: 18px 14px !important; }
}
@media (max-width: 859px) {
  .s-products-list-wrapper.s-products-list-vertical-cards,
  .s-block--best-offers .swiper-wrapper { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .store-footer .footer-middle { grid-template-columns: 1fr 1fr; }
}

/* ---------- 19. الجوال ---------- */
@media (max-width: 767px) {
  :root, html, body {
    --hero-h: 312px;
    --fs-xs: 11px; --fs-sm: 12px; --fs-ui: 13px; --fs-base: 14px; --fs-md: 15px; --fs-lg: 16px;
    --fs-price: 17px; --fs-h2: 20px; --fs-h1: 22px; --fs-pprice: 24px; --fs-cat: 28px;
    --fs-hero: 28px; --fs-hero-sub: 15px;
    --sec-gap: 28px;
  }
  .app-inner::before { min-height: 34px; }
  .store-header .header-container, .store-header .header-container > .flex { height: 64px !important; min-height: 64px !important; }
  .store-header .fixed-pinned .header-container, .store-header .fixed-pinned .header-container > .flex { height: 60px !important; min-height: 60px !important; }
  .store-header .navbar-brand img, .store-header .fixed-pinned .navbar-brand img { height: 48px !important; max-height: 48px !important; }

  body.index .app-inner > salla-hook[name="index:start"] {
    justify-content: flex-end; padding: 0 16px 22px; gap: 4px; background-color: #F3F6E9;
    background-image:
      radial-gradient(circle at 23% 67%, rgba(255,255,255,.75) 0 1.2px, transparent 2.2px),
      radial-gradient(circle at 71% 19%, rgba(255,240,200,.6) 0 1.8px, transparent 3px),
      linear-gradient(105deg, transparent 42%, rgba(255,255,255,.22) 50%, transparent 58%),
      linear-gradient(180deg, rgba(243,246,233,0) 0, rgba(243,246,233,0) 118px, #F3F6E9 166px),
      var(--hero-img);
    background-size: 157px 211px, 233px 179px, 260% 100%, auto, 125% auto;
    background-position: 0 0, 0 0, 130% 0, 0 0, 50% 0;
    animation: av-hero-m 26s linear infinite;
  }
  body.index .app-inner > salla-hook[name="index:start"]::after { padding-top: 12px; }
  body.index .app-inner > salla-hook[name="index:start"] + section::before { right: 12px; width: 78px; padding: 12px 4px 22px; font-size: 13px; }
  body.index .app-inner > salla-hook[name="index:start"] + section.s-block--features { --overlap: 0px; margin-top: 0 !important; }

  body .s-block--features, body .s-block--features.dark, body .s-block--features.bg-gray-100 { padding: 16px 0 0 !important; }
  .s-block--features .grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0 !important; align-items: stretch !important;
    background: #FFFFFF; border: 1px solid #E6EDE1; border-radius: 16px; box-shadow: 0 10px 26px rgba(25,63,16,.08); overflow: hidden;
  }
  .s-block--features .angel-feature {
    flex-direction: column !important; justify-content: flex-start !important; align-items: center !important; text-align: center; gap: 7px;
    padding: 12px 4px 11px; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important;
  }
  .s-block--features .angel-feature + .angel-feature { border-inline-start: 1px solid #EDF2E9 !important; }
  .s-block--features .angel-feature:hover { transform: none; box-shadow: none !important; }
  .s-block--features .angel-feature > div:first-child { width: 40px !important; height: 40px !important; }
  .s-block--features .angel-feature > div:first-child > div { width: 23px !important; height: 23px !important; }
  .s-block--features .angel-feature > div:last-child { align-items: center !important; margin: 0 !important; }
  .s-block--features .angel-feature p { text-align: center !important; }
  .s-block--features .angel-feature p:first-child { font-size: var(--fs-sm) !important; line-height: 1.35 !important; font-weight: 700 !important; }
  .s-block--features .angel-feature p + p { display: none !important; }

  .s-block--banners .swiper-wrapper { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 4px !important; }
  .s-block--banners .banner-square .box-img { width: 92px; height: 92px; padding: 3px; }
  .s-block--banners .banner-square .box-img::after { inset: 3px; }
  .s-block--banners .banner-square p { font-size: var(--fs-ui) !important; }

  body.index .s-block--best-offers { padding: var(--sec-gap) 14px 0 !important; }
  .app-inner > .container { padding-left: 14px !important; padding-right: 14px !important; }
  .s-products-list-wrapper.s-products-list-vertical-cards,
  .s-block--best-offers .swiper-wrapper { gap: 12px 10px !important; }

  .s-product-card-entry { padding: 8px !important; border-radius: 14px !important; }
  .s-product-card-entry:hover { transform: none !important; }
  .s-product-card-image { padding: 4px !important; border-radius: 12px !important; }
  .s-product-card-image > a { border-radius: 9px !important; }
  .s-product-card-image::after { inset: 4px; border-radius: 9px; }
  .s-product-card-promotion-title { top: 8px !important; right: 8px !important; padding: 3px 8px !important; }
  .s-product-card-actions { bottom: 9px !important; left: 9px !important; }
  .s-product-card-image .s-product-card-rating { right: 5px !important; bottom: 9px !important; height: 22px !important; padding: 0 7px !important; }
  .s-product-card-image .s-product-card-rating i { font-size: 10px !important; }
  .s-product-card-entry .s-product-card-wishlist .s-button-element { width: 30px !important; height: 30px !important; }
  .s-product-card-entry .s-product-card-wishlist .s-button-element i { font-size: 14px !important; }
  .s-product-card-content { padding: 10px 2px 0 !important; }
  .s-product-card-content-subtitle { font-size: var(--fs-sm) !important; }
  .s-product-card-content-sub { padding: 8px 0 10px !important; gap: 2px 8px; }
  .s-product-card-entry .s-product-card-content-footer .s-button-element { height: 40px !important; min-height: 40px !important; border-radius: 10px !important; box-shadow: none !important; }
  .s-product-card-content-footer .s-button-text { gap: 6px !important; }
  .s-product-card-content-footer .s-button-element i { font-size: 15px !important; }

  .s-slider-block__title { gap: 12px; padding-bottom: 14px !important; }
  .s-slider-block__title-right { gap: 10px; }
  .s-slider-block__title-right h2::before { height: 20px; width: 5px; margin-inline-end: 8px; }
  .s-slider-block__display-all { padding: 5px 10px !important; }


  .app-inner > .nav-header { min-height: 150px !important; padding: 28px 14px !important; }
  .prdoucts-list-filters { margin: 14px 0 !important; padding-bottom: 12px !important; }
  #product-filter { width: 175px !important; }

  .store-footer .footer-middle { grid-template-columns: 1fr; padding: 32px 4px !important; gap: 28px !important; }
  .store-footer .footer-middle > div, .store-footer .footer-middle > div > *, .store-footer .footer-list {
    align-items: flex-start !important; justify-content: flex-start !important; text-align: start !important;
  }
  .store-footer .footer-title, .store-footer .footer-middle h3, .store-footer .footer-middle h4 { text-align: start !important; width: 100%; }
  .s-block--testimonials .swiper-wrapper { align-items: flex-start !important; }
  .blog-articles { gap: 20px !important; padding-top: 24px !important; }
  body.page-single .content--single-page.opt-text { margin-top: 20px !important; padding: 22px 18px !important; }
  body.page-single .content--single-page.opt-text p, body.blog-single article p,
  body.product-single .tabs-wrapper__product p, body.product-single .short__description p { text-align: start !important; }
  body.product-single .sticky-product-bar .total-price { font-size: 19px !important; }
}
@media (max-width: 599px) {
  .s-products-list-wrapper.s-products-list-vertical-cards,
  .s-block--best-offers .swiper-wrapper { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* ---------- 20. احترام «تقليل الحركة» ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none !important; }
}