/**
 * طبقة التحسينات البصرية — "نيون هادي"
 *
 * الفلسفة: الوهج له معنى فقط لو نادر. الحواف بتولّع عند التفاعل بس، مش طول
 * الوقت، والعناصر بتظهر بهدوء مع النزول بدل ما تنطّ. كل الألوان من التوكنز
 * فتتبع براند أي متجر.
 *
 * كل شيء هنا يحترم prefers-reduced-motion.
 */

/* ---------------------------------------------------------------------
   1) الظهور التدريجي مع النزول — CSS خالص
   مبني على scroll-driven animations، وكله داخل @supports.
   ليه كده؟ لأن أي طريقة بتخفي المحتوى أولًا وتعتمد على جافاسكريبت في
   إظهاره معناها إن أي خلل = محتوى مش ظاهر للعميل. هنا لو المتصفح
   ما بيدعمش الخاصية، القاعدة كلها مش بتتقري أصلًا والمحتوى ظاهر طبيعي.
--------------------------------------------------------------------- */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    #fp .fp-card,
    #fp .fp-review,
    .review-card,
    .woocommerce ul.products li.product,
    .product-related__card {
      animation: f5rRise linear both;
      animation-timeline: view();
      /* يبدأ وهو داخل من تحت ويخلص وهو لسه في أول ثلث الشاشة */
      animation-range: entry 0% entry 42%;
    }
  }
}

/* الحركة على transform وحده — بدون opacity عن قصد.
   السبب: أي أنيميشن بيبدأ من opacity:0 معناه إن المحتوى مخفي لحد ما
   الأنيميشن يكتمل. ولو الجدول الزمني اتعطّل (عنصر طويل على الموبايل،
   حاوية عندها overflow:hidden، متصفح بيتصرف بشكل مختلف) العنصر بيفضل
   مخفي بجد. مع transform وحده، أسوأ حالة إن العنصر يقف مزحزح ٢٢ بكسل —
   حاجة محدش هيلاحظها، بدل قسم مختفي. */
@keyframes f5rRise {
  from { transform: translateY(22px); }
  to   { transform: none; }
}

/* ---------------------------------------------------------------------
   2) حافة نيون بتتبع الماوس
   بدل وهج ثابت حوالين الكارت، الضوء بيتحرك مع مكان المؤشر — الإحساس
   إن الكارت بيرد على الحركة، وده أرقى من glow دايم.
--------------------------------------------------------------------- */
.f5r-glow {
  position: relative;
  isolation: isolate;
}
.f5r-glow::after {
  position: absolute;
  inset: -1px;
  z-index: -1;
  content: '';
  border-radius: inherit;
  opacity: 0;
  pointer-events: none;
  background: radial-gradient(
    240px circle at var(--gx, 50%) var(--gy, 50%),
    color-mix(in srgb, var(--f5r-primary) 45%, transparent),
    transparent 70%
  );
  transition: opacity .35s ease;
}
.f5r-glow:hover::after,
.f5r-glow:focus-within::after { opacity: 1; }

/* ---------------------------------------------------------------------
   3) كروت المنتجات — رفعة خفيفة وحدّ بيولّع، والصورة بتقرب بهدوء
--------------------------------------------------------------------- */
.woocommerce ul.products li.product,
.product-related__card {
  transition: transform .35s cubic-bezier(.22,.8,.3,1), border-color .35s ease, box-shadow .35s ease;
}
.woocommerce ul.products li.product:hover,
.product-related__card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--f5r-primary) 55%, var(--f5r-border));
  box-shadow: 0 18px 42px -18px color-mix(in srgb, var(--f5r-primary) 55%, transparent),
              0 0 0 1px color-mix(in srgb, var(--f5r-primary) 22%, transparent);
}
.woocommerce ul.products li.product a img,
.product-related__media img {
  transition: transform .5s cubic-bezier(.22,.8,.3,1);
}
.woocommerce ul.products li.product:hover a img,
.product-related__card:hover .product-related__media img {
  transform: scale(1.04);
}

/* ---------------------------------------------------------------------
   4) الأزرار — لمعة بتعدّي مرة واحدة عند المرور
--------------------------------------------------------------------- */
.f5r-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.single_add_to_cart_button,
#fp .fp-btn--primary {
  position: relative;
  overflow: hidden;
}
.f5r-btn::after,
.woocommerce a.button::after,
.woocommerce button.button::after,
.single_add_to_cart_button::after,
#fp .fp-btn--primary::after {
  position: absolute;
  top: 0;
  bottom: 0;
  inset-inline-start: -140%;
  width: 55%;
  content: '';
  pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent);
  transform: skewX(-18deg);
}
.f5r-btn:hover::after,
.woocommerce a.button:hover::after,
.woocommerce button.button:hover::after,
.single_add_to_cart_button:hover::after,
#fp .fp-btn--primary:hover::after {
  animation: f5rSheen .75s ease;
}
@keyframes f5rSheen { to { inset-inline-start: 140%; } }

/* ---------------------------------------------------------------------
   5) التقييمات — الجزء اللي طلبته بالتحديد
--------------------------------------------------------------------- */

/* 5-أ) كروت تقييمات الصفحة الرئيسية */
#fp .fp-review {
  transition: transform .4s cubic-bezier(.22,.8,.3,1), border-color .4s ease, box-shadow .4s ease;
}
#fp .fp-review:hover {
  transform: translateY(-5px);
  border-color: color-mix(in srgb, var(--primary2) 45%, transparent);
  box-shadow: 0 22px 48px -20px color-mix(in srgb, var(--primary2) 55%, transparent);
}
/* النجوم بتلمع واحدة ورا التانية، دورة هادية كل ٦ ثواني */
#fp .fp-review__stars,
.review-card__stars {
  position: relative;
  background: linear-gradient(90deg,
    var(--f5r-warning, #ffb23f) 0%,
    #fff6d8 18%,
    var(--f5r-warning, #ffb23f) 36%,
    var(--f5r-warning, #ffb23f) 100%);
  background-size: 280% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: f5rStarSweep 6s ease-in-out infinite;
}
@keyframes f5rStarSweep {
  0%, 70%, 100% { background-position: 100% 50%; }
  85%           { background-position: 0% 50%; }
}

/* 5-ب) كروت تقييمات المتجر (الرئيسية + صفحة المنتج) */
.review-card {
  position: relative;
  overflow: hidden;
  transition: transform .4s cubic-bezier(.22,.8,.3,1), border-color .4s ease, box-shadow .4s ease;
}
.review-card:hover {
  transform: translateY(-5px);
  border-color: color-mix(in srgb, var(--f5r-primary) 50%, var(--f5r-border));
  box-shadow: 0 22px 48px -20px color-mix(in srgb, var(--f5r-primary) 50%, transparent);
}
/* خط نيون رفيع بيتمدّ على حافة الكارت العلوية عند المرور */
.review-card::before {
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  width: 100%;
  height: 2px;
  content: '';
  transform: scaleX(0);
  transform-origin: var(--f5r-edge-origin, right);
  background: linear-gradient(90deg,
    transparent,
    color-mix(in srgb, var(--f5r-primary) 90%, transparent),
    color-mix(in srgb, var(--f5r-primary-light, var(--f5r-primary)) 90%, transparent),
    transparent);
  transition: transform .45s cubic-bezier(.22,.8,.3,1);
}
.review-card:hover::before { transform: scaleX(1); }

/* حلقة نيون حوالين صورة صاحب التقييم */
.review-card__avatar {
  position: relative;
  transition: box-shadow .4s ease;
}
.review-card:hover .review-card__avatar {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--f5r-primary) 60%, transparent),
              0 0 18px -2px color-mix(in srgb, var(--f5r-primary) 70%, transparent);
}

/* 5-ج) بلوك مراجعات ووكومرس في صفحة المنتج */
.single-product .product-reviews-block__body ol.commentlist .comment_container {
  transition: transform .35s cubic-bezier(.22,.8,.3,1), border-color .35s ease, box-shadow .35s ease;
}
.single-product .product-reviews-block__body ol.commentlist .comment_container:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--f5r-primary) 45%, var(--f5r-border));
  box-shadow: 0 16px 36px -18px color-mix(in srgb, var(--f5r-primary) 50%, transparent);
}
.single-product .product-reviews-block__body .star-rating span::before,
.single-product .product-reviews-block__body .stars a { color: var(--f5r-warning, #ffb23f); }

/* ---------------------------------------------------------------------
   6) عناوين الأقسام — الخط تحت العنوان بيتمدّ مع النزول
--------------------------------------------------------------------- */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    #fp .fp-head .fp-u,
    .f5r-section__head h2::after {
      animation: f5rUnderline linear both;
      animation-timeline: view();
      animation-range: entry 10% entry 55%;
    }
  }
}
@keyframes f5rUnderline {
  from { transform: scaleX(.2); }
  to   { transform: scaleX(1); }
}

/* ---------------------------------------------------------------------
   7) الفوكس — حلقة نيون واضحة للكيبورد (وصولية + شكل أنضف)
--------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--f5r-primary) 85%, transparent);
  outline-offset: 3px;
  border-radius: 6px;
}

/* ---------------------------------------------------------------------
   8) أيقونات الهيدر + السلة
--------------------------------------------------------------------- */
.f5r-header-icon,
.f5r-fixed-cart,
.f5r-header-menu { transition: color .25s ease, filter .25s ease, transform .25s ease; }
.f5r-header-icon:hover,
.f5r-fixed-cart:hover,
.f5r-header-menu:hover {
  filter: drop-shadow(0 0 8px color-mix(in srgb, var(--f5r-primary) 65%, transparent));
  transform: translateY(-1px);
}

/* ---------------------------------------------------------------------
   9) الأسئلة الشائعة — رقم السؤال بيولّع لما يتفتح
--------------------------------------------------------------------- */
#fp .f5r-acc__item { transition: border-color .35s ease, box-shadow .35s ease; }
#fp .f5r-acc__item.is-open {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary2) 30%, transparent),
              0 18px 40px -22px color-mix(in srgb, var(--primary2) 60%, transparent);
}
#fp .f5r-acc__num { transition: color .3s ease, text-shadow .3s ease; }
#fp .f5r-acc__item.is-open .f5r-acc__num {
  color: var(--primary2);
  text-shadow: 0 0 14px color-mix(in srgb, var(--primary2) 70%, transparent);
}

/* ---------------------------------------------------------------------
   احترام تقليل الحركة: كل شيء يوقف، ولا شيء يفضل مخفي
--------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  #fp .fp-review__stars, .review-card__stars { animation: none; }
  .f5r-btn::after, .woocommerce a.button::after, .woocommerce button.button::after,
  .single_add_to_cart_button::after, #fp .fp-btn--primary::after { display: none; }
  .woocommerce ul.products li.product,
  .product-related__card,
  .review-card,
  #fp .fp-review { transition: none; }
  .woocommerce ul.products li.product:hover,
  .product-related__card:hover,
  .review-card:hover,
  #fp .fp-review:hover { transform: none; }
}

/* =====================================================================
   نيون خفي دائم + توحيد شكل التقييمات
   ===================================================================== */

/* ---------------------------------------------------------------------
   10) الهيدر — خيط نيون رفيع على الحافة السفلية + هالة خافتة تحته.
   دايم بس خافت جدًا: بيدي إحساس إن الهيدر طايف فوق الصفحة من غير ما
   ياخد انتباه من المحتوى.
--------------------------------------------------------------------- */
.f5r-fixed-header {
  position: sticky;
}
.f5r-fixed-header::before {
  position: absolute;
  inset-inline: 0;
  bottom: -1px;
  height: 1px;
  z-index: 2;
  content: '';
  pointer-events: none;
  background: linear-gradient(90deg,
    transparent,
    color-mix(in srgb, var(--f5r-primary) 55%, transparent) 22%,
    color-mix(in srgb, var(--f5r-primary-light, var(--f5r-primary)) 75%, transparent) 50%,
    color-mix(in srgb, var(--f5r-primary) 55%, transparent) 78%,
    transparent);
  opacity: .55;
}
/* الهالة الخافتة تحت الخط — بتزيد شوية لما الصفحة تنزل */
.f5r-fixed-header::after {
  display: block !important;
  position: absolute;
  inset-inline: 0;
  bottom: -18px;
  height: 18px;
  content: '';
  pointer-events: none;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--f5r-primary) 16%, transparent),
    transparent);
  opacity: .5;
  transition: opacity .4s ease;
}
.f5r-fixed-header.is-sticky::after { opacity: 1; }

/* ---------------------------------------------------------------------
   11) الفوتر — نفس الخيط على الحافة العلوية + توهج خفيف من تحت الصفحة
--------------------------------------------------------------------- */
.f5r-footer-shell,
.f5r-footer {
  position: relative;
}
.f5r-footer-shell::before,
.f5r-footer::before {
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 1px;
  content: '';
  pointer-events: none;
  background: linear-gradient(90deg,
    transparent,
    color-mix(in srgb, var(--f5r-primary) 50%, transparent) 25%,
    color-mix(in srgb, var(--f5r-primary-light, var(--f5r-primary)) 70%, transparent) 50%,
    color-mix(in srgb, var(--f5r-primary) 50%, transparent) 75%,
    transparent);
  opacity: .5;
}
/* ضوء واسع جدًا وخافت جاي من أسفل الصفحة — بيدي عمق من غير ما يبان كتأثير */
.f5r-footer::after {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 55%;
  z-index: 0;
  content: '';
  pointer-events: none;
  background: radial-gradient(120% 100% at 50% 100%,
    color-mix(in srgb, var(--f5r-primary) 12%, transparent),
    transparent 70%);
}
.f5r-footer > * { position: relative; z-index: 1; }

/* أيقونات السوشيال في الفوتر */
.f5r-footer .f5r-social a,
.f5r-footer .f5r-social a {
  transition: transform .25s ease, box-shadow .3s ease, border-color .3s ease;
}
.f5r-footer .f5r-social a:hover,
.f5r-footer .f5r-social a:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--f5r-primary) 60%, transparent);
  box-shadow: 0 0 18px -4px color-mix(in srgb, var(--f5r-primary) 70%, transparent);
}

/* ---------------------------------------------------------------------
   12) نيون خفي دائم على كروت التقييمات (مش عند المرور بس)
--------------------------------------------------------------------- */
#fp .fp-review,
.review-card {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--f5r-primary) 10%, transparent),
              0 14px 34px -22px color-mix(in srgb, var(--f5r-primary) 45%, transparent);
}
#fp .fp-review:hover,
.review-card:hover {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--f5r-primary) 30%, transparent),
              0 22px 48px -20px color-mix(in srgb, var(--f5r-primary) 60%, transparent);
}

/* ---------------------------------------------------------------------
   13) توحيد شكل التقييمات: كروت صفحة المنتج تاخد نفس لغة الرئيسية
   نفس التدرّج، نفس علامة التنصيص الكبيرة، نفس المثلث في الركن،
   ونفس فاصل السطر فوق اسم صاحب التقييم.
--------------------------------------------------------------------- */
.review-card {
  position: relative;
  overflow: hidden;
  padding: 26px 22px 20px;
  border-radius: 18px;
  border-color: color-mix(in srgb, var(--f5r-border) 85%, var(--f5r-primary));
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--f5r-surface) 92%, var(--f5r-primary)),
    var(--f5r-surface-2));
  display: flex;
  flex-direction: column;
  gap: 12px;
}
/* علامة التنصيص الكبيرة */
.review-card::after {
  position: absolute;
  top: 2px;
  inset-inline-end: 20px;
  content: '\201D';
  font: 700 54px/1 Georgia, "Times New Roman", serif;
  color: var(--f5r-primary-light, var(--f5r-primary));
  opacity: .22;
  pointer-events: none;
}
/* المثلث في الركن — نفس اللي في الرئيسية */
.review-card > p {
  position: relative;
  margin: 0;
  color: var(--f5r-text);
  font-size: 14.5px;
  line-height: 1.9;
}
/* بيانات صاحب التقييم تنزل تحت النص وياخد فاصل فوقه */
.review-card__top {
  order: 2;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--f5r-border);
  gap: 11px;
}
.review-card__avatar {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border: 0;
  color: var(--f5r-on-primary, #fff);
  font-weight: 800;
  font-size: 15px;
  background: linear-gradient(180deg,
    var(--f5r-primary-light, var(--f5r-primary)),
    var(--f5r-primary-dark, var(--f5r-primary)));
}
.review-card__top strong { font-size: 14.5px; }
.review-card__stars { font-size: 15px; letter-spacing: 3px; }

@media (max-width: 700px) {
  .review-card { padding: 22px 18px 18px; }
  .review-card::after { font-size: 44px; }
}

/* ---------------------------------------------------------------------
   14) تجاوز طبقة liquid-glass
   الملف ده بيفرض box-shadow و border-radius بـ!important على كروت
   التقييمات وكروت المنتجات، فبيمسح النيون الخفي. القواعد دي بتاخد نفس
   السلاح عشان النيون يفضل ظاهر مع الحفاظ على لمعة الزجاج الداخلية.
--------------------------------------------------------------------- */
.f5r-liquid-glass .review-card,
.f5r-liquid-glass #fp .fp-review {
  border-radius: 18px !important;
  box-shadow:
    inset 0 1px rgba(255, 255, 255, .10),
    0 0 0 1px color-mix(in srgb, var(--f5r-primary) 12%, transparent),
    0 14px 34px -22px color-mix(in srgb, var(--f5r-primary) 50%, transparent) !important;
}
.f5r-liquid-glass .review-card:hover,
.f5r-liquid-glass #fp .fp-review:hover {
  border-color: color-mix(in srgb, var(--f5r-primary) 55%, var(--f5r-border)) !important;
  box-shadow:
    inset 0 1px rgba(255, 255, 255, .14),
    0 0 0 1px color-mix(in srgb, var(--f5r-primary) 32%, transparent),
    0 22px 48px -20px color-mix(in srgb, var(--f5r-primary) 65%, transparent) !important;
}

/* نفس المعالجة لكروت المنتجات عشان الحد بتاعها يولّع فعلًا عند المرور */
.f5r-liquid-glass .woocommerce ul.products li.product:hover,
.f5r-liquid-glass .product-related__card:hover {
  border-color: color-mix(in srgb, var(--f5r-primary) 55%, var(--f5r-border)) !important;
  box-shadow:
    inset 0 1px rgba(255, 255, 255, .12),
    0 0 0 1px color-mix(in srgb, var(--f5r-primary) 26%, transparent),
    0 20px 44px -20px color-mix(in srgb, var(--f5r-primary) 60%, transparent) !important;
}

/* === F5R CATEGORY — Cloud Plus layout (2026-09-25): head panel, sections, six cards per row; F5R colours === */
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-content{width:calc(100% - 20px)!important;max-width:none!important;padding-top:0!important;padding-bottom:32px!important;line-height:1.65}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) main#primary.f5r-main{padding:0!important}
/* head panel */
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-cl-head{box-sizing:border-box;min-height:156px;margin:0 -10px 16px;padding:24px 16px;background:#111c30;text-align:start}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-cl-head__title{margin:0 0 4px!important;padding:0!important;font-size:20px!important;font-weight:700!important;line-height:28px!important;color:#fff!important;display:block!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-cl-head__crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:0;margin:0!important;font-size:14px!important;line-height:20px!important;color:#fff!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-cl-head__crumbs a{color:#fff!important;text-decoration:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-cl-head__sep{display:inline-block;margin:0 12px;font-size:14px;color:rgba(255,255,255,.7)}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-cl-head__subs{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:20px;margin-top:12px;padding:0 10px}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-cl-head__subs a{display:flex;align-items:center;justify-content:center;text-align:center;font-size:15px;font-weight:700;line-height:20px;color:#fff!important;text-decoration:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-cl-head__subs a:hover{color:#54b8ff!important}
/* Sanad-style parts that Cloud doesn't have */
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-catnav,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .woocommerce-result-count,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .woocommerce-breadcrumb:not(.f5r-cl-head__crumbs),html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .snd-loop-desc,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .f5r-loop-category{display:none!important}
/* ordering (leaf categories): «ترتيب حسب:» + select, on the right */
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .woocommerce-ordering{float:none!important;display:flex!important;align-items:center;justify-content:flex-start;gap:12px;width:auto!important;height:auto!important;margin:32px 0 16px!important;padding:0!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .woocommerce-ordering::before{content:"ترتيب حسب:";font-size:15px;line-height:26px;color:#fff}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .woocommerce-ordering select{box-sizing:border-box!important;width:auto!important;min-width:110px;height:40px!important;min-height:0!important;margin:0!important;padding:0 12px 4px 32px!important;border:1px solid rgba(75,85,99,.2)!important;border-radius:6px!important;background-color:#111c30!important;color:#fff!important;font-size:16px!important;line-height:normal!important;box-shadow:none!important}
/* sections */
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-catsection{margin:0 0 16px!important;padding:0!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-catsection__head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px;margin:24px 0 18px!important;padding:0!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-catsection__title{margin:0!important;padding:0!important;font-size:18px!important;font-weight:700!important;line-height:1.2!important;color:#54b8ff!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-catsection__all{display:inline-flex!important;flex-direction:column;align-items:center;gap:6px;padding:0 0 8px!important;font-size:14px!important;font-weight:400!important;line-height:20px!important;color:#fff!important;text-decoration:none!important;border:0!important;background:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) .f5r-catsection__all::after{content:"";display:block;width:29px;height:3px;border-radius:9999px;background:#54b8ff}
/* grid: 2 → 3 → 4 → 6 like Cloud's Salla theme */
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin:0 0 16px!important;padding:0!important;list-style:none!important;clear:both!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products::before,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products::after{display:none!important}
@media (min-width:640px){html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products{gap:16px!important}}
@media (min-width:768px){html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important}}
@media (min-width:1024px){html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media (min-width:1280px){html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:8px!important}}
/* card */
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product{position:relative!important;display:flex!important;flex-direction:column!important;float:none!important;width:auto!important;min-width:0!important;height:auto!important;margin:0!important;padding:0!important;overflow:hidden!important;border:2px solid #2e528a!important;border-radius:8px!important;background:#111c30!important;background-image:none!important;box-shadow:none!important;text-align:center!important;transform:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product a.woocommerce-LoopProduct-link{display:flex!important;flex-direction:column!important;flex:1 1 auto;min-width:0;margin:0!important;padding:0!important;gap:0!important;text-decoration:none!important;color:inherit!important;background:none!important;border:0!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .f5r-cl-media{position:relative;display:block;width:100%;aspect-ratio:1/1;overflow:hidden;background:#070b14}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .f5r-cl-media img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;object-fit:contain!important;aspect-ratio:auto!important;box-shadow:none!important;background:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .f5r-cl-rate{position:absolute;left:4px;bottom:4px;z-index:2;display:inline-flex;flex-direction:row-reverse;align-items:center;gap:2px;padding:4px 6px;border-radius:9999px;background:#111c30;font-size:14px;line-height:14px;color:#fff}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .f5r-cl-rate i{font-style:normal;color:rgb(250,204,21)}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .f5r-cl-rate b{font-weight:400}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .onsale{position:absolute!important;top:0!important;right:0!important;left:auto!important;bottom:auto!important;z-index:2!important;display:block!important;width:auto!important;min-width:0!important;height:auto!important;min-height:0!important;margin:0!important;padding:4px 8px!important;border:0!important;border-radius:0 0 0 12px!important;background:#0b4f9c!important;background-image:none!important;box-shadow:none!important;font-size:12px!important;font-weight:400!important;line-height:16px!important;color:#fff!important;white-space:nowrap!important;transform:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .woocommerce-loop-product__title{display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;margin:0!important;padding:8px 8px 0!important;font-size:14px!important;font-weight:700!important;line-height:20px!important;color:#fff!important;text-align:center!important;min-height:0!important;height:auto!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price{display:flex!important;flex-direction:row!important;flex-wrap:wrap;align-items:center;justify-content:center!important;gap:8px!important;margin:4px 8px 0!important;padding:0!important;font-size:14px!important;font-weight:700!important;line-height:20px!important;color:#fff!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price ins{order:0;background:none!important;text-decoration:none!important;color:rgb(248,113,113)!important;font-weight:700!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price ins .amount{color:rgb(248,113,113)!important;font-size:14px!important;font-weight:700!important;line-height:20px!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price del{order:1;opacity:1!important;color:#fff!important;font-size:14px!important;font-weight:400!important;text-decoration:line-through!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price del .amount{color:#fff!important;font-size:14px!important;font-weight:400!important;line-height:20px!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price > .amount{color:#fff!important;font-size:14px!important;font-weight:700!important}
/* outlined «أضف للسلة» */
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;box-sizing:border-box!important;width:auto!important;height:40px!important;min-height:0!important;margin:8px!important;padding:0 10px!important;border:1px solid rgba(255,255,255,.85)!important;border-radius:8px!important;background:transparent!important;background-image:none!important;box-shadow:none!important;font-size:14px!important;font-weight:400!important;line-height:1!important;color:#fff!important;text-decoration:none!important;white-space:nowrap!important;animation:none!important;transform:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button::before{content:"";flex:0 0 16px;width:16px;height:16px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 8h13l-1.1 12H6.6z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 8h13l-1.1 12H6.6z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E") center/contain no-repeat}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button::after{display:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button:hover{background:#fff!important;color:#111c30!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .added_to_cart{display:none!important}
@media (max-width:639px){html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button{height:36px!important;font-size:13px!important}}

/* === F5R PRODUCT CARD — Sanad's card everywhere (2026-09-25): home, shop/categories, «قد يعجبك أيضًا»; F5R colours === */
/* --- card --- */
html body :is(.fp-marquee,.product-related) .fp-card,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product,html body.single-product .product-related .product-related__grid .product-related__card{position:relative!important;display:flex!important;flex-direction:column!important;box-sizing:border-box!important;overflow:hidden!important;margin:0!important;padding:0!important;border:1px solid rgba(22,140,255,.2)!important;border-radius:8px!important;background:linear-gradient(165deg,#16243d 0%,#0f192b 45%,#080d18 100%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 26px rgba(0,0,0,.5)!important;color:#f6f9ff!important;text-align:center!important;clip-path:none!important;animation:none!important;transform:none!important;translate:none!important}
html body :is(.fp-marquee,.product-related) .fp-card::before,html body :is(.fp-marquee,.product-related) .fp-card::after,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product::before,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product::after,html body.single-product .product-related .product-related__grid .product-related__card::before,html body.single-product .product-related .product-related__grid .product-related__card::after,html body :is(.fp-marquee,.product-related) .fp-card .fp-card__edge{display:none!important;content:none!important}
/* --- discount badge (top right) --- */
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__badge,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .onsale{position:absolute!important;top:0!important;right:0!important;left:auto!important;bottom:auto!important;z-index:3!important;display:block!important;box-sizing:border-box!important;width:auto!important;min-width:0!important;height:24px!important;min-height:0!important;margin:0!important;padding:4px 8px!important;border:0!important;border-radius:0 0 0 12px!important;background:linear-gradient(135deg,#54b8ff,#168cff)!important;box-shadow:none!important;font-size:12px!important;font-weight:700!important;line-height:16px!important;color:#fff!important;white-space:nowrap!important;transform:none!important;clip-path:none!important;animation:none!important}
/* --- image --- */
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__img,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .f5r-cl-media,html body.single-product .product-related .product-related__grid .product-related__card .product-related__media{position:relative!important;display:block!important;width:100%!important;height:auto!important;aspect-ratio:1/1!important;margin:0!important;padding:0!important;overflow:hidden!important;border:0!important;border-radius:0!important;background:#080d18!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__pic,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .f5r-cl-media img,html body.single-product .product-related .product-related__grid .product-related__card .product-related__media img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;object-fit:cover!important;aspect-ratio:auto!important;box-shadow:none!important;transform:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .f5r-cl-rate{display:none!important}
/* --- body --- */
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__body,html body.single-product .product-related .product-related__grid .product-related__card .product-related__body{display:flex!important;flex:1 1 auto!important;flex-direction:column!important;align-items:center!important;gap:0!important;margin:0!important;padding:8px!important;text-align:center!important;background:none!important;border:0!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product a.woocommerce-LoopProduct-link{display:flex!important;flex-direction:column!important;align-items:stretch!important;flex:1 1 auto!important;gap:0!important;margin:0!important;padding:0!important;text-decoration:none!important;color:inherit!important;background:none!important;border:0!important}
/* title: 14px/800, two lines */
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__title,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .woocommerce-loop-product__title,html body.single-product .product-related .product-related__grid .product-related__card .product-related__name{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;min-height:40px!important;height:auto!important;margin:0!important;padding:0!important;font-size:14px!important;font-weight:800!important;line-height:20px!important;color:#fff!important;text-align:center!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .woocommerce-loop-product__title{margin:8px 8px 0!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__title a,html body.single-product .product-related .product-related__grid .product-related__card .product-related__name a{color:#fff!important;font-size:inherit!important;font-weight:inherit!important;line-height:inherit!important;text-decoration:none!important}
/* tag line: 12px/500, one line */
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__desc,html body :is(.fp-marquee,.product-related) .fp-card .fp-card__tag,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .snd-loop-desc{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:1!important;overflow:hidden!important;text-overflow:ellipsis!important;width:100%!important;height:16px!important;min-height:16px!important;max-height:16px!important;margin:4px 0 0!important;padding:0!important;font-size:12px!important;font-weight:500!important;line-height:16px!important;color:rgb(147,166,196)!important;text-align:center!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .snd-loop-desc{width:auto!important;margin:4px 8px 0!important}
/* price: current (blue) then old (struck) */
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__price,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price,html body.single-product .product-related .product-related__grid .product-related__card .product-related__price{display:flex!important;flex-direction:row-reverse!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-height:20px!important;height:auto!important;margin:6px 0!important;padding:0!important;font-size:14px!important;font-weight:800!important;line-height:20px!important;color:#fff!important;background:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price{margin:6px 8px!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__price .sale-price{display:contents!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__price ins,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price ins,html body.single-product .product-related .product-related__grid .product-related__card .product-related__price ins{order:0!important;display:block!important;margin:0!important;background:none!important;text-decoration:none!important;font-size:14px!important;font-weight:800!important;line-height:20px!important;color:#54b8ff!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__price ins .amount,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price ins .amount,html body.single-product .product-related .product-related__grid .product-related__card .product-related__price ins .amount,html body :is(.fp-marquee,.product-related) .fp-card .fp-card__price > .amount,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price > .amount,html body.single-product .product-related .product-related__grid .product-related__card .product-related__price > .amount{font-size:14px!important;font-weight:800!important;line-height:20px!important;color:#54b8ff!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__price del,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price del,html body.single-product .product-related .product-related__grid .product-related__card .product-related__price del{order:1!important;display:block!important;margin:0!important;opacity:1!important;text-decoration:line-through!important;font-size:14px!important;font-weight:400!important;line-height:20px!important;color:rgb(147,166,196)!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-card__price del .amount,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .price del .amount,html body.single-product .product-related .product-related__grid .product-related__card .product-related__price del .amount{font-size:14px!important;font-weight:400!important;line-height:20px!important;color:rgb(147,166,196)!important}
/* button: outlined pill with the bag icon */
html body :is(.fp-marquee,.product-related) .fp-card .fp-btn,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button,html body.single-product .product-related .product-related__grid .product-related__card .product-related__btn{display:flex!important;flex-direction:row-reverse!important;align-items:center!important;justify-content:center!important;gap:6px!important;box-sizing:border-box!important;width:100%!important;height:30px!important;min-height:0!important;margin:auto 0 0!important;padding:4px!important;border:1px solid rgba(22,140,255,.4)!important;border-radius:13px!important;background:transparent!important;background-image:none!important;box-shadow:none!important;font-size:14px!important;font-weight:900!important;line-height:20px!important;color:#54b8ff!important;text-decoration:none!important;white-space:nowrap!important;animation:none!important;transform:none!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button{width:auto!important;margin:0 8px 8px!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-btn svg,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button svg{display:none!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-btn .fp-btn__label{color:inherit!important;font:inherit!important}
html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button::before,html body.single-product .product-related .product-related__grid .product-related__card .product-related__btn::before{display:none!important;content:none!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-btn::after,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button::after,html body.single-product .product-related .product-related__grid .product-related__card .product-related__btn::after{content:""!important;display:block!important;position:static!important;flex:0 0 16px!important;width:16px!important;height:16px!important;margin:0!important;background:currentColor!important;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 8h13l-1.1 12H6.6z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E") center/contain no-repeat!important;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 8h13l-1.1 12H6.6z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E") center/contain no-repeat!important;animation:none!important}
html body :is(.fp-marquee,.product-related) .fp-card .fp-btn:hover,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .button:hover,html body.single-product .product-related .product-related__grid .product-related__card .product-related__btn:hover{background:rgba(22,140,255,.12)!important;color:#9fd4ff!important}
/* mobile: title 13px/19px like Sanad */
@media (max-width:600px){html body :is(.fp-marquee,.product-related) .fp-card .fp-card__title,html body:is(.tax-product_cat,.tax-product_tag,.post-type-archive-product) ul.products li.product .woocommerce-loop-product__title,html body.single-product .product-related .product-related__grid .product-related__card .product-related__name{min-height:38px!important;font-size:13px!important;line-height:19px!important}}
/* Sanad's rail card size in «الأكثر مبيعًا» */
html body .fp-marquee .fp-card{flex:0 0 231px!important;width:231px!important;max-width:231px!important;min-width:0!important}
@media (max-width:600px){html body .fp-marquee .fp-card{flex-basis:165px!important;width:165px!important;max-width:165px!important}}
/* F5R RAIL GAP: Sanad's 8px between the «الأكثر مبيعًا» cards */
html body .fp-marquee .fp-marquee__track,html body .fp-marquee .fp-marquee__group{gap:8px!important;column-gap:8px!important}
