/* =============================================================
   Faker Bl3eb — storefront design system (bilingual, RTL + LTR)
   Palette pulled straight from the logo: sky blue, sunny yellow,
   leaf green, and coral-orange on a warm cream background, with
   a floating particle layer (see Views/part/particles.php) and
   bouncy, wiggly micro-interactions built for a kid audience while
   staying calm and readable enough for parents to shop in.
   Baloo 2 for headings, Poppins for body. Logical CSS properties
   throughout so the same stylesheet serves both dir="rtl" (ar) and
   dir="ltr" (en) without a separate build.
   ============================================================= */

:root{
  --rh-cream:      #FFF8EC;
  --rh-cream-dark: #FEF1DC;
  --rh-sand:       #F0DFC0;
  --rh-espresso:   #3A3226;
  --rh-espresso-dk:#241F17;

  /* logo palette */
  --rh-blue:        #2E9BE0;
  --rh-blue-dark:   #1B7DBD;
  --rh-yellow:      #FFC93C;
  --rh-yellow-dark: #EFA80F;
  --rh-green:       #7AC74F;
  --rh-green-dark:  #5CA836;
  --rh-coral:       #FF7A5C;
  --rh-coral-dark:  #F1553F;

  /* legacy aliases (kept so existing rules/vars stay in sync) */
  --rh-terracotta:   var(--rh-coral);
  --rh-terracotta-dk:var(--rh-coral-dark);
  --rh-gold:         var(--rh-yellow);
  --rh-sage:         var(--rh-green);
  --rh-teal:         #3FB6C9;
  --rh-blush:        #FFD3CC;
  --rh-rust:         #E0503C;

  --rh-white:      #FFFFFF;
  --rh-ink-soft:   #8A7A63;
  --rh-radius:     18px;
  --rh-radius-sm:  12px;
  --rh-shadow:     0 4px 18px rgba(58,50,38,.08);
  --rh-shadow-lg:  0 14px 40px rgba(58,50,38,.14);
  --rh-font-head:  'Baloo 2', sans-serif;
  --rh-font-body:  'Poppins', sans-serif;
}

*{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }
html,body{
  color:var(--rh-espresso-dk);
  font-family:var(--rh-font-body);
  font-size:16px;
  line-height:1.75;
}
/* Background lives on body ONLY (not html) so the UA promotes it to the
   canvas layer (CSS background-propagation rule) — that's what makes it
   paint behind position:fixed/z-index:-1 content like .fb-particles.
   Putting the same background on both html and body (as before) makes
   body's box paint its own background as a normal descendant, which is
   ordered AFTER negative-z-index content and hides the particles entirely,
   regardless of cache — this isn't a caching issue. */
body{
  background:
    radial-gradient(circle at 12% 18%, rgba(255,201,60,.22), transparent 40%),
    radial-gradient(circle at 88% 12%, rgba(46,155,224,.18), transparent 42%),
    radial-gradient(circle at 80% 85%, rgba(255,122,92,.16), transparent 45%),
    radial-gradient(circle at 10% 90%, rgba(122,199,79,.18), transparent 40%),
    var(--rh-cream);
  background: #ffd25c;
  /* overflow-x:hidden (not "clip") on body/html forces the browser to treat
     overflow-y as an implicit scroll container too, which then breaks
     position:sticky elsewhere on the page (its containing block changes and
     it can stop sticking, most noticeably on mobile browsers). "clip" hides
     horizontal overflow the same way without creating a scroll container. */
  background: #3d467f;
  overflow-x:clip;
}

h1,h2,h3,h4,h5,h6{
  font-family:var(--rh-font-head);
  color:var(--rh-espresso-dk);
  font-weight:700;
  line-height:1.35;
}

a{ color:var(--rh-espresso); text-decoration:none; transition:color .15s ease; }
a:hover{ color:var(--rh-coral-dark); }

::selection{ background:var(--rh-coral); color:#fff; }

/* ---------------- Floating particle background ---------------- */
.fb-particles{ position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
.fb-p-bubble{
  position:absolute; border-radius:50%; background:var(--c);
  opacity:.55; filter:blur(2px);
  animation-name:fbDrift; animation-timing-function:ease-in-out; animation-iteration-count:infinite;
}
.fb-p-star{
  position:absolute; line-height:1; opacity:0;
  animation-name:fbTwinkle; animation-timing-function:ease-in-out; animation-iteration-count:infinite;
  text-shadow:0 0 6px currentColor;
}
.fb-p-block{
  position:absolute; width:16px; height:16px; background:var(--c);
  border-radius:5px; opacity:.4;
  animation-name:fbSpin; animation-timing-function:ease-in-out; animation-iteration-count:infinite;
}
@keyframes fbDrift{
  0%,100%{ transform:translateY(0) translateX(0) rotate(0deg); }
  50%{ transform:translateY(-30px) translateX(15px) rotate(180deg); }
}
@keyframes fbTwinkle{
  0%,100%{ opacity:0; transform:scale(.6) rotate(0deg); }
  50%{ opacity:.8; transform:scale(1.15) rotate(20deg); }
}
@keyframes fbSpin{
  0%,100%{ transform:translateY(0) rotate(0deg); }
  50%{ transform:translateY(-16px) rotate(35deg); }
}

/* Home-page-only fun emoji shapes (cars, animals, toys...) — see
   Views/part/particles-emoji.php, included only from home.php. */
.fb-particles-emoji{ position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
.fb-p-emoji{
  position:absolute; line-height:1; opacity:.7;
  filter:drop-shadow(0 4px 8px rgba(58,50,38,.18));
  animation-name:fbFloatEmoji; animation-timing-function:ease-in-out; animation-iteration-count:infinite;
}
@keyframes fbFloatEmoji{
  0%,100%{ transform:translateY(0) rotate(-6deg); }
  50%{ transform:translateY(-24px) rotate(6deg); }
}
@media (max-width:576px){
  .fb-p-emoji{ display:none; }
}

/* ---------------- Buttons ---------------- */
.rh-btn, button.rh-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  background:var(--rh-espresso); color:var(--rh-cream);
  border:2px solid var(--rh-espresso);
  border-radius:999px;
  padding:.7rem 1.7rem;
  font-family:var(--rh-font-head);
  font-weight:700; font-size:.95rem;
  transition:background .15s ease, transform .15s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease;
}
.rh-btn:hover{ background:var(--rh-espresso-dk); color:var(--rh-cream); transform:translateY(-3px) scale(1.03); box-shadow:var(--rh-shadow-lg); }
.rh-btn:active{ transform:scale(.96); }
.rh-btn-accent{ background:var(--rh-coral); border-color:var(--rh-coral); color:#fff; box-shadow:0 6px 0 0 var(--rh-coral-dark); }
.rh-btn-accent:hover{ background:var(--rh-coral); border-color:var(--rh-coral); color:#fff; box-shadow:0 8px 0 0 var(--rh-coral-dark); transform:translateY(-4px) scale(1.03); }
.rh-btn-accent:active{ transform:translateY(1px) scale(.97); box-shadow:0 3px 0 0 var(--rh-coral-dark); }
.rh-btn-outline{ background:transparent; color:var(--rh-espresso); border:2px solid var(--rh-espresso); }
.rh-btn-outline:hover{ background:var(--rh-espresso); color:var(--rh-cream); }
.rh-btn-sm{ padding:.45rem 1.1rem; font-size:.85rem; }
.rh-btn-block{ width:100%; }
.rh-btn:disabled, .rh-btn.disabled{ opacity:.5; cursor:not-allowed; transform:none !important; box-shadow:none !important; }
.rh-btn-whatsapp{ background:#25A55C; border-color:#25A55C; box-shadow:0 6px 0 0 #1C8449; }
.rh-btn-whatsapp:hover{ background:#25A55C; border-color:#25A55C; box-shadow:0 8px 0 0 #1C8449; }
.rh-btn-whatsapp:active{ box-shadow:0 3px 0 0 #1C8449; }

/* ---------------- Header ---------------- */
.rh-topbar{
    background: linear-gradient(45deg, #246d9d, #959595, #497526);
    background: #3d467f;
    background: #ffd25c;
    background: #3d467f;
    color: #ffffff;
    font-size:.82rem;
    }
.rh-topbar a{color: #ffffff;}
.rh-topbar a:hover{ color:#fff; }
.rh-topbar-inner{ display:flex; justify-content:space-between; align-items:center; padding:.45rem 0; flex-wrap:wrap; gap:.5rem; }
.rh-topbar-inner i{ margin-inline-end:.4em; color:var(--rh-yellow); }
.rh-lang-switch{ display:inline-flex; align-items:center; gap:.35rem; font-weight:700; }
.rh-lang-switch a{ opacity:.65; }
.rh-lang-switch a.active{opacity:1;color: #dbaf40;}

.rh-navbar{
  /* background:
    linear-gradient(rgba(36,31,23,.16), rgba(36,31,23,.16)),
    linear-gradient(100deg, var(--rh-blue) 0%, var(--rh-coral) 38%, var(--rh-yellow) 68%, var(--rh-green) 100%); */
  background: #3d467f;
  background: #ffcc00;
  padding:.7rem 0;
  box-shadow:0 4px 18px rgba(58,50,38,.18);
  position:sticky;
  top:0;
  z-index:1030;
}
.rh-brand img{
  height:54px; border-radius:12px; background:#fff; padding:4px;
  box-shadow:0 3px 10px rgba(36,31,23,.25);
  transition:transform .3s cubic-bezier(.34,1.56,.64,1);
}
.rh-brand:hover img{ transform:rotate(-6deg) scale(1.08); }
.rh-nav-links .nav-link{
  color:#fff;
  text-shadow:0 1px 3px rgba(36,31,23,.35);
  font-family:var(--rh-font-head); font-weight:700;
  padding:.5rem 1rem; position:relative;
}
.rh-nav-links .nav-link::after{
  content:""; position:absolute; inset-inline:1rem; bottom:.2rem; height:3px;
  background:#fff; border-radius:2px;
  transform:scaleX(0); transition:transform .18s ease;
}
.rh-nav-links .nav-link:hover{ color:#fff; }
.rh-nav-links .nav-link:hover::after{ transform:scaleX(1); }
.dropdown-menu{
  border:2px solid var(--rh-sand); border-radius:var(--rh-radius-sm);
  box-shadow:var(--rh-shadow-lg); padding:.5rem;
}
.dropdown-item{ border-radius:8px; padding:.5rem .9rem; font-weight:500; }
.dropdown-item:hover{ background:var(--rh-cream-dark); color:var(--rh-espresso-dk); }

.rh-search{ align-items:center; margin-inline-end:1rem; }
.rh-search input{
  border:2px solid rgba(255,255,255,.6); background:rgba(255,255,255,.92);
  border-start-start-radius:999px; border-end-start-radius:999px; border-inline-end:none; padding-inline-start:1.1rem; min-width:210px;
}
.rh-search input:focus{ border-color:#fff; box-shadow:none; }
.rh-search button{
  border:2px solid var(--rh-espresso-dk); background:var(--rh-espresso-dk); color:#fff;
  border-start-end-radius:999px; border-end-end-radius:999px; padding:0 1.1rem;
}
.rh-search button:hover{ background:var(--rh-espresso); }

.rh-cart-link{ position:relative; font-size:1.35rem; color:#fff; padding:.3rem .5rem; transition:transform .2s cubic-bezier(.34,1.56,.64,1); display:inline-block; text-shadow:0 1px 3px rgba(36,31,23,.35); }
.rh-cart-link:hover{ transform:scale(1.15) rotate(-8deg); color:#fff; }
.rh-cart-badge{
  position:absolute; top:-4px; inset-inline-start:-6px; background:var(--rh-espresso-dk); color:#fff;
  font-size:.65rem; font-weight:700; border-radius:50%; min-width:19px; height:19px;
  display:flex; align-items:center; justify-content:center; padding:0 4px;
  box-shadow:0 0 0 2px #fff;
}
.navbar-toggler{ border-color:rgba(255,255,255,.7); background:rgba(255,255,255,.15); }
.navbar-toggler-icon{ filter:brightness(0) invert(1); }

/* ---------------- Hero ---------------- */
.rh-hero{
  position:relative; border-radius:calc(var(--rh-radius) + 8px); overflow:hidden;
  margin:1.75rem 0; box-shadow:var(--rh-shadow-lg);
  border:4px solid var(--rh-white);
  animation:fbPopIn .5s cubic-bezier(.34,1.56,.64,1) both;
}
.rh-hero img, .rh-hero video{ width:100%; display:block; max-height:560px; object-fit:cover; }
.rh-hero-caption{
  position:absolute; inset:0; display:flex; flex-direction:column;
  justify-content:flex-end; align-items:flex-start; padding:2.5rem;
  background:linear-gradient(25deg, rgba(36,31,23,.72) 8%, rgba(36,31,23,.25) 45%, transparent 75%);
  color:#fff;
}
.rh-hero-caption h1{
  color:#fff; font-size:clamp(1.7rem, 4vw, 3rem); font-weight:800;
  text-shadow:0 2px 14px rgba(0,0,0,.25); margin-bottom:.75rem; max-width:22ch;
}
.rh-hero-caption p{ font-size:1.05rem; max-width:48ch; color:rgba(255,255,255,.9); }
@keyframes fbPopIn{
  0%{ opacity:0; transform:scale(.96) translateY(10px); }
  100%{ opacity:1; transform:scale(1) translateY(0); }
}

/* ---------------- USP strip ---------------- */
.rh-usp{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem;
  margin:2rem 0;
}
.rh-usp-item{
  display:flex; align-items:center; gap:.9rem;
  background:var(--rh-white); border:2px solid var(--rh-sand);
  border-radius:var(--rh-radius); padding:1rem 1.2rem;
  transition:transform .2s ease, border-color .2s ease;
}
.rh-usp-item:hover{ transform:translateY(-3px); border-color:var(--rh-coral); }
.rh-usp-item i{
  font-size:1.35rem; color:#fff;
  background:var(--rh-coral); width:48px; height:48px; flex:0 0 48px;
  border-radius:14px; display:flex; align-items:center; justify-content:center;
}
.rh-usp-item:nth-child(4n+2) i{ background:var(--rh-blue); }
.rh-usp-item:nth-child(4n+3) i{ background:var(--rh-green); }
.rh-usp-item:nth-child(4n+4) i{ background:var(--rh-yellow-dark); }
.rh-usp-item strong{ display:block; font-family:var(--rh-font-head); font-size:.95rem; }
.rh-usp-item small{ color:var(--rh-ink-soft); }

/* ---------------- Sections ---------------- */
.rh-section{ padding:3rem 0; position:relative; }
.rh-section-head{
  display:flex; align-items:baseline; justify-content:space-between;
  margin-bottom:1.75rem; gap:1rem; flex-wrap:wrap;
}
.rh-section-head h2{
  font-size:1.7rem; margin:0; font-weight:800; position:relative; padding-inline-start:1rem;
}
.rh-section-head h2::before{
  content:"★"; position:absolute; inset-inline-start:0; top:50%; transform:translateY(-52%);
  font-size:1rem; color:var(--rh-yellow); -webkit-text-stroke:.5px var(--rh-coral-dark);
}
.rh-section-head a{ font-weight:700; font-family:var(--rh-font-head); white-space:nowrap; color:var(--rh-coral-dark); }
.rh-section-alt{
  background:var(--rh-cream-dark); border-radius:calc(var(--rh-radius) + 8px);
  padding:2.5rem 2rem; margin:1.5rem 0;
  border:2px dashed var(--rh-sand);
}

/* ---------------- Category carousel (horizontal scroll, image-based) ---------------- */
.rh-category-carousel{
  display:flex; gap:1.1rem; overflow-x:auto; padding:.25rem .25rem 1.15rem;
  scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;
  scrollbar-width:thin; scrollbar-color:var(--rh-coral) var(--rh-cream-dark);
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%);
}
.rh-category-carousel::-webkit-scrollbar{ height:8px; }
.rh-category-carousel::-webkit-scrollbar-track{ background:var(--rh-cream-dark); border-radius:999px; }
.rh-category-carousel::-webkit-scrollbar-thumb{
  background:linear-gradient(90deg, var(--rh-blue), var(--rh-coral), var(--rh-yellow));
  border-radius:999px; border:2px solid var(--rh-cream);
}
.rh-category-carousel::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(90deg, var(--rh-blue-dark), var(--rh-coral-dark), var(--rh-yellow-dark));
}
.rh-category-card{
  flex:0 0 auto;
  width: 144PX;
  scroll-snap-align:start;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.55rem;
  text-align:center;
  color:var(--rh-espresso-dk);
}
.rh-category-card-img{
  width: 150PX;
  height: 150PX;
  border-radius: 50%;
  overflow:hidden;
  background:var(--rh-cream-dark);
  border:3px solid var(--rh-sand);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.8rem;
  color:var(--rh-coral-dark);
  transition:border-color .18s ease, transform .18s cubic-bezier(.34,1.56,.64,1);
}
.rh-category-card-img img{width: 120%;height: 120%;object-fit:cover;}
.rh-category-card-name{
  max-width:100%; padding:.28rem .58rem; border-radius:999px;
  background:rgba(255,255,255,.14); color:#fff;
  font-family:var(--rh-font-head); font-size:.9rem; font-weight:800; line-height:1.35;
  text-shadow:0 1px 3px rgba(0,0,0,.65); text-wrap:balance;
}
.rh-category-all .rh-category-card-img{ background:linear-gradient(135deg,var(--rh-blue),var(--rh-yellow)); color:var(--rh-espresso-dk); }
.rh-category-card:hover .rh-category-card-img{ border-color:var(--rh-coral); transform:translateY(-4px) scale(1.05); }
.rh-category-card.active .rh-category-card-img{ border-color:var(--rh-coral); box-shadow:0 0 0 3px rgba(255,122,92,.25); }
@media (max-width:576px){
  .rh-category-card{width: 117px;}
  .rh-category-card-img{width: 125px;height: 125px;font-size:1.4rem;}
  .rh-category-card-name{font-size:.92rem;line-height:1.4;min-height:2.6em;display:flex;align-items:center;justify-content:center;padding:.35rem .5rem;}
}

/* ---------------- Product grid / cards ---------------- */
.rh-product-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:1.5rem; }
.rh-product-card{
  background:var(--rh-white); border:2px solid var(--rh-sand); border-radius:var(--rh-radius);
  overflow:hidden; display:flex; flex-direction:column;
  transition:box-shadow .2s ease, transform .2s cubic-bezier(.34,1.56,.64,1), border-color .2s ease;
}
.rh-product-card:hover{ box-shadow:var(--rh-shadow-lg); transform:translateY(-6px); border-color:var(--rh-coral); }
.rh-product-card-media{ position:relative; display:block; aspect-ratio:1/1; background:var(--rh-cream-dark); overflow:hidden; }
.rh-product-card-media img{ width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.rh-product-card:hover .rh-product-card-media img{ transform:scale(1.08) rotate(1deg); }
.rh-product-card-noimg{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:var(--rh-sand); font-size:2.5rem; }
.rh-product-card-body{ padding:1rem 1.1rem 1.2rem; display:flex; flex-direction:column; gap:.4rem; flex:1; }
.rh-product-card-title{
  font-family:var(--rh-font-head); font-weight:700; color:var(--rh-espresso-dk);
  font-size:.95rem; line-height:1.5;
}
.rh-card-stock{
  display:flex; align-items:center; gap:.4rem; font-size:.76rem; color:var(--rh-green-dark); font-weight:600;
}
.rh-product-card-price{ display:flex; align-items:center; gap:.6rem; margin-top:auto; }
.rh-price-now{
  font-weight:800; font-size:1.05rem; color:#0b0b0b;
  text-shadow:0 0 6px rgba(140,226,139,.7), 0 0 14px rgba(46,158,63,.45);
}
.rh-price-old{ text-decoration:line-through; color:var(--rh-ink-soft); font-size:.85rem; font-weight:500; text-shadow:none; }

.rh-card-add-cart{
  position:relative; z-index:1; margin-inline-start:auto; flex:0 0 auto;
  width:38px; height:38px; border-radius:50%; border:none; background:#fff; color:#0b0b0b;
  font-size:1rem; display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:transform .15s ease, background .15s ease, color .15s ease;
}
.rh-card-add-cart::before{
  content:''; position:absolute; inset:-6px; z-index:-1; border-radius:50%;
  background:linear-gradient(135deg, #8CE28B, #2E9E3F); filter:blur(9px); opacity:.65;
  transition:opacity .15s ease;
}
.rh-card-add-cart:hover{ transform:scale(1.1); }
.rh-card-add-cart:hover::before{ opacity:.9; }
.rh-card-add-cart.added{ background:#0b0b0b; color:#fff; }
.rh-card-add-cart:disabled{ opacity:.35; cursor:not-allowed; transform:none; }
.rh-card-add-cart:disabled::before{ opacity:.15; }

.rh-badge{
  position:absolute; top:.7rem; inset-inline-start:.7rem; padding:.25rem .7rem;
  border-radius:999px; font-size:.72rem; font-weight:700; color:#fff; font-family:var(--rh-font-head);
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.rh-badge-new{ background:var(--rh-green); }
.rh-badge-oos{ background:var(--rh-rust); top:auto; bottom:.7rem; }
.rh-badge-category{ background:var(--rh-blue); }
.rh-badge-sale{ inset-inline-end:.7rem; inset-inline-start:auto; background:var(--rh-rust); color:#fff; }

/* ---------------- Breadcrumbs ---------------- */
.rh-breadcrumb{ font-size:.85rem; color:var(--rh-ink-soft); margin-bottom:1.5rem; }
.rh-breadcrumb a{ color:var(--rh-ink-soft); }
.rh-breadcrumb a:hover{ color:var(--rh-espresso); }

/* ---------------- Shop / filters ---------------- */
/* Mobile-only trigger: filters stay visible by default on desktop (no
   toggle needed there), but start collapsed on phones/tablets so the
   product grid is the first thing visible — tap to reveal. */
.rh-filters-toggle{
  display:none; align-items:center; gap:.5rem; font-weight:700; font-family:var(--rh-font-head);
  background:var(--rh-white); border:2px solid var(--rh-sand); border-radius:999px;
  padding:.55rem 1.2rem; color:var(--rh-espresso-dk); margin-bottom:1.25rem; cursor:pointer;
}
.rh-filters-toggle:hover{ border-color:var(--rh-coral); color:var(--rh-coral-dark); }
.rh-filters-toggle.active{ background:var(--rh-espresso-dk); border-color:var(--rh-espresso-dk); color:var(--rh-cream); }
.rh-shop-layout{ display:grid; grid-template-columns:250px 1fr; gap:2rem; align-items:start; }
.rh-filters{
  background:var(--rh-white); border:2px solid var(--rh-sand);
  border-radius:var(--rh-radius); padding:1.4rem; position:sticky; top:92px;
  max-height:calc(100vh - 110px); overflow-y:auto;
}
.rh-filters h6{
  font-weight:800; margin:1.25rem 0 .6rem; font-size:.8rem;
  letter-spacing:.02em; color:var(--rh-ink-soft); font-family:var(--rh-font-head);
}
.rh-filters h6:first-child{ margin-top:0; }
.rh-toolbar{
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:1.25rem; flex-wrap:wrap; gap:.75rem;
  background:var(--rh-white); border:2px solid var(--rh-sand);
  border-radius:var(--rh-radius-sm); padding:.7rem 1.1rem;
}
.rh-toolbar-right{ display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; white-space:nowrap; }

.rh-view-toggle{ display:flex; gap:.25rem; flex:0 0 auto; }
.rh-view-toggle button{
  width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  border:2px solid var(--rh-sand); border-radius:8px; background:var(--rh-white);
  color:var(--rh-ink-soft); font-size:.85rem; cursor:pointer; transition:all .15s ease;
}
.rh-view-toggle button:hover{ border-color:var(--rh-coral); color:var(--rh-coral-dark); }
.rh-view-toggle button.active{ background:var(--rh-espresso-dk); border-color:var(--rh-espresso-dk); color:var(--rh-cream); }

.rh-view-all-btn{
  display:flex; align-items:center; gap:.4rem; height:34px; flex:0 0 auto;
  border:2px solid var(--rh-sand); border-radius:8px; background:var(--rh-white);
  color:var(--rh-ink-soft); font-size:.82rem; font-weight:600; font-family:var(--rh-font-head);
  padding:0 .8rem; cursor:pointer; transition:all .15s ease;
}
.rh-view-all-btn:hover{ border-color:var(--rh-coral); color:var(--rh-coral-dark); }

/* List view: single column, cards laid out as a row (image left, details right). */
.rh-product-grid.rh-view-list{ grid-template-columns:1fr; gap:.75rem; }
.rh-view-list .rh-product-card{ flex-direction:row; }
.rh-view-list .rh-product-card:hover{ transform:none; }
.rh-view-list .rh-product-card-media{ width:120px; flex:0 0 120px; aspect-ratio:1/1; }
.rh-view-list .rh-product-card-body{
  flex-direction:row; flex-wrap:wrap; align-items:center; gap:.5rem 1rem;
  padding:.75rem 1.1rem;
}
.rh-view-list .rh-product-card-title{ flex:1 1 200px; }
.rh-view-list .rh-card-stock{ flex:0 0 auto; }
.rh-view-list .rh-product-card-price{ margin-top:0; flex:0 0 auto; }
@media (max-width:576px){
  .rh-view-list .rh-product-card-media{ width:88px; flex-basis:88px; }
  .rh-view-list .rh-product-card-body{ padding:.6rem .8rem; }
}

.rh-live-search{
  display:flex; align-items:center; gap:.6rem; flex:1 1 260px; max-width:420px;
  background:var(--rh-cream-dark); border:2px solid transparent; border-radius:999px;
  padding:.5rem 1rem; transition:border-color .15s ease;
}
.rh-live-search:focus-within{ border-color:var(--rh-blue); }
.rh-live-search i{ color:var(--rh-ink-soft); }
.rh-live-search input{
  border:none; background:none; outline:none; width:100%; font-family:var(--rh-font-body);
  color:var(--rh-espresso-dk); font-size:.92rem;
}
.rh-sort-select{flex:0 0 220px;width:220px;min-height:44px;border:2px solid var(--rh-sand);border-radius:999px;padding-inline:1rem;background-color:var(--rh-white);}

/* Contained infinite scroll: only scrolling THIS panel loads more — the rest
   of the page scrolling normally never triggers the IntersectionObserver. */
.rh-product-scroll{
  max-height: 140vh;
  overflow-y:auto;
  padding:.25rem .75rem .25rem .25rem;
  border:2px solid var(--rh-sand);
  border-radius:var(--rh-radius);
  background:var(--rh-cream-dark);
}
.rh-product-scroll .rh-product-grid{ padding:1rem; }
.rh-product-scroll::-webkit-scrollbar{ width:8px; }
.rh-product-scroll::-webkit-scrollbar-thumb{ background:var(--rh-sand); border-radius:999px; }

.rh-scroll-sentinel{ height:1px; }
.rh-scroll-loading{
  display:flex; justify-content:center; align-items:center; gap:.6rem;
  padding:1rem; color:var(--rh-ink-soft); font-weight:700; font-family:var(--rh-font-head);
}

/* ---------------- Product detail ---------------- */
.rh-product-carousel{position:relative;border:2px solid var(--rh-sand);border-radius:var(--rh-radius);overflow:hidden;background:var(--rh-white);aspect-ratio:1/1}
.rh-product-carousel-track{direction:ltr;display:flex;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x pinch-zoom}
.rh-product-carousel-track::-webkit-scrollbar{display:none}
.rh-product-carousel-slide{flex:0 0 100%;width:100%;height:100%;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center;background:var(--rh-white)}
.rh-product-carousel-slide img,.rh-product-carousel-slide video{width:100%;height:100%;object-fit:contain}
.rh-carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--rh-espresso-dk);box-shadow:var(--rh-shadow);display:grid;place-items:center}
.rh-carousel-prev{inset-inline-start:.75rem}.rh-carousel-next{inset-inline-end:.75rem}.rh-carousel-arrow:disabled{opacity:.3;cursor:default}
.rh-carousel-dots{position:absolute;z-index:2;bottom:.7rem;left:50%;transform:translateX(-50%);display:flex;gap:.4rem;padding:.35rem .5rem;border-radius:999px;background:rgba(255,255,255,.8)}
.rh-carousel-dots button{width:9px;height:9px;padding:0;border:0;border-radius:50%;background:var(--rh-sand)}.rh-carousel-dots button.active{background:var(--rh-coral);transform:scale(1.25)}

.rh-product-title{ font-size:1.9rem; margin-bottom:.4rem; font-weight:800; }
.rh-product-sku{ color:var(--rh-ink-soft); font-size:.85rem; margin-bottom:1rem; }
.rh-product-price{ display:flex; align-items:baseline; gap:.65rem; font-size:1.65rem; font-weight:800; color:var(--rh-coral-dark); margin-bottom:.25rem; font-family:var(--rh-font-head); }
.rh-product-price .rh-price-old{ font-size:1rem; }
.rh-stock{ font-weight:700; font-size:.9rem; margin-bottom:1.25rem; }
.rh-stock.in{ color:var(--rh-green-dark); }
.rh-stock.low{ color:var(--rh-coral-dark); }
.rh-stock.out{ color:var(--rh-rust); }

.rh-qty-input{
  display:flex; align-items:center; border:2px solid var(--rh-sand);
  border-radius:999px; width:fit-content; overflow:hidden; background:var(--rh-white);
}
.rh-qty-input button{ background:none; border:none; width:40px; height:44px; font-size:1.15rem; color:var(--rh-espresso); }
.rh-qty-input button:hover{ background:var(--rh-cream-dark); }
.rh-qty-input input{ width:52px; border:none; text-align:center; font-weight:700; background:transparent; }
.rh-qty-input input:focus{ outline:none; }

.rh-tabs{ margin-top:3rem; border-bottom:2px solid var(--rh-sand); }
.rh-tabs .nav-link{
  color:var(--rh-espresso-dk); font-weight:700; font-family:var(--rh-font-head);
  border:none; border-bottom:3px solid transparent; border-radius:0; background:none;
}
.rh-tabs .nav-link.active{ color:var(--rh-coral-dark); border-bottom-color:var(--rh-coral); background:none; }
.rh-tab-content-body{ padding:1.5rem 0; }

/* ---------------- Product detail dialog (home page) ---------------- */
.rh-modal{
  border:none; border-radius:var(--rh-radius); padding:0;
  width:min(920px, 92vw); max-height:88vh; margin:auto;
  background:var(--rh-white); box-shadow:var(--rh-shadow-lg);
}
.rh-modal::backdrop{ background:rgba(36,31,23,.55); backdrop-filter:blur(2px); }
.rh-modal-close{
  position:sticky; float:inline-end; top:.9rem; inset-inline-end:.9rem; z-index:2;
  width:38px; height:38px; border-radius:50%; border:none; background:var(--rh-white);
  box-shadow:var(--rh-shadow); color:var(--rh-espresso-dk); font-size:1.1rem;
  display:flex; align-items:center; justify-content:center; margin-inline-start:auto;
}
.rh-modal-close:hover{ background:var(--rh-coral); color:#fff; }
.rh-modal-body{ padding:1.75rem; overflow-y:auto; max-height:88vh; clear:both; }
.rh-modal-loading{ display:flex; align-items:center; justify-content:center; padding:4rem 0; font-size:1.6rem; color:var(--rh-ink-soft); }
body.rh-modal-open{overflow:hidden;overscroll-behavior:none}
body.rh-product-view-open .fb-particles,body.rh-product-view-open .fb-particles-emoji{display:none!important;animation-play-state:paused!important}
@media (max-width:576px){
  .rh-modal{ width:100vw; max-height:100vh; height:100vh; border-radius:0; }
  .rh-modal-body{ max-height:100dvh; height:100dvh; padding:calc(4.5rem + env(safe-area-inset-top)) 1.1rem calc(1.1rem + env(safe-area-inset-bottom)); }
  .rh-modal-close{position:fixed;top:calc(.75rem + env(safe-area-inset-top));inset-inline-end:.75rem;z-index:10002;width:46px;height:46px;background:#fff;border:2px solid var(--rh-sand)}
  .rh-carousel-arrow{width:40px;height:40px}.rh-carousel-prev{inset-inline-start:.45rem}.rh-carousel-next{inset-inline-end:.45rem}
}

/* ---------------- Cart / checkout ---------------- */
.rh-cart-list{ display:flex; flex-direction:column; gap:1rem; }
.rh-cart-row{
  display:flex; gap:1rem; background:var(--rh-white); border:2px solid var(--rh-sand);
  border-radius:var(--rh-radius); padding:1rem;
}
.rh-cart-row-media{
  width:76px; height:76px; flex:0 0 76px; border-radius:var(--rh-radius-sm); overflow:hidden;
  background:var(--rh-cream-dark); display:flex; align-items:center; justify-content:center;
  color:var(--rh-sand); font-size:1.5rem;
}
.rh-cart-row-media-img{ width:100%; height:100%; object-fit:cover; }
.rh-cart-row-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:.5rem; }
.rh-cart-row-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:.75rem; }
.rh-cart-row-top a{ font-weight:700; font-family:var(--rh-font-head); color:var(--rh-espresso-dk); }
.rh-cart-row-remove{ background:none; border:none; color:var(--rh-rust); font-size:1rem; padding:.25rem; flex:0 0 auto; }
.rh-cart-row-remove:hover{ color:var(--rh-espresso-dk); }
.rh-cart-row-meta{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; flex-wrap:wrap; }
.rh-cart-row-price{ color:var(--rh-ink-soft); font-size:.9rem; }
.rh-cart-row-total{ font-weight:800; color:var(--rh-coral-dark); font-family:var(--rh-font-head); min-width:4.5em; text-align:end; }
.rh-cart-summary{
  background:var(--rh-white); border:2px solid var(--rh-sand);
  border-radius:var(--rh-radius); padding:1.6rem; box-shadow:var(--rh-shadow);
}
.rh-cart-summary h5{ font-weight:800; margin-bottom:1rem; }
.rh-cart-summary-row{ display:flex; justify-content:space-between; padding:.4rem 0; gap:1rem; }
.rh-cart-summary-row.total{
  font-weight:800; font-size:1.15rem; border-top:2px dashed var(--rh-sand);
  margin-top:.5rem; padding-top:.85rem; color:var(--rh-coral-dark);
}
.rh-empty-state{ text-align:center; padding:4rem 1rem; color:var(--rh-ink-soft); }
.rh-empty-state i{ font-size:3rem; color:var(--rh-sand); margin-bottom:1rem; display:block; }

.rh-form label{ font-weight:700; margin-bottom:.35rem; font-size:.9rem; font-family:var(--rh-font-head); }
.rh-form .form-control{ border-color:var(--rh-sand); border-width:2px; border-radius:var(--rh-radius-sm); padding:.65rem 1rem; background:var(--rh-white); }
.rh-form .form-control:focus{ border-color:var(--rh-blue); box-shadow:0 0 0 .2rem rgba(46,155,224,.15); }

/* ---------------- Static content pages ---------------- */
.rh-content-page h1{ margin-bottom:1.5rem; font-weight:800; }
.rh-content-page h2{ font-size:1.3rem; margin-top:2rem; font-weight:800; }
.rh-content-page p, .rh-content-page li{ color:var(--rh-espresso-dk); }
.rh-faq-item{
  background:var(--rh-white); border:2px solid var(--rh-sand);
  border-radius:var(--rh-radius); padding:1.3rem 1.5rem; margin-bottom:1rem;
  transition:border-color .2s ease;
}
.rh-faq-item:hover{ border-color:var(--rh-blue); }
.rh-faq-item h3{ font-size:1.05rem; margin:0 0 .5rem; font-weight:800; color:var(--rh-coral-dark); }
.rh-faq-item h3 i{ margin-inline-end:.5rem; color:var(--rh-yellow-dark); }

/* ---------------- Auth (login/reset — admin-adjacent, stays Arabic/RTL) ---------------- */
.rh-auth-card{
  background:var(--rh-white); border:2px solid var(--rh-sand);
  border-radius:var(--rh-radius); padding:2rem; box-shadow:var(--rh-shadow);
}

/* ---------------- Footer ---------------- */
.rh-footer{
    background: #3a3d68;
    background: linear-gradient(rgba(36, 31, 23, .16), rgba(36, 31, 23, .16)), linear-gradient(100deg, #093653 0%, #532419 38%, #654d10 68%, #2e5f13 100%);
    color: #e5d3c7;
    background: #3d467f;
    margin-top:4rem;
    position:relative;
    }
.rh-footer::before{
  content:"";
  display:block;
  height:10px;
  width:100%;
  /* background:repeating-linear-gradient(-45deg,
    var(--rh-coral) 0 10px, var(--rh-yellow) 10px 20px,
    var(--rh-green) 20px 30px, var(--rh-blue) 30px 40px); */
}
.rh-footer-grid{ display:flex; justify-content:center; padding:3rem 0 2rem; }
.rh-footer-contact-col{ display:flex; flex-direction:column; align-items:center; text-align:center; max-width:420px; }
.rh-footer-col h6{
  color:#fff; font-size:.95rem; margin-bottom:1rem; font-family:var(--rh-font-head); font-weight:800;
}
.rh-footer-col ul{ list-style:none; padding:0; margin:0; }
.rh-footer-col li{ margin-bottom:.6rem; }
.rh-footer-col a{ color:var(--rh-cream-dark); }
.rh-footer-col a:hover{ color:#fff; }
.rh-footer-contact{ display:inline-flex; flex-direction:column; align-items:flex-start; }
.rh-footer-contact li{ display:flex; gap:.6rem; align-items:flex-start; margin-bottom:.85rem; }
.rh-footer-contact i{ margin-top:.4rem; width:1.1em; text-align:center; color:var(--rh-yellow); }
.rh-footer-social{
  display:flex; gap:.75rem; justify-content:center; margin-top:1.5rem; padding-top:1.5rem;
  border-top:1px solid rgba(255,255,255,.12); width:100%;
}
.rh-footer-social a{
  width:38px; height:38px; border-radius:50%; border:2px solid rgba(255,255,255,.25);
  display:flex; align-items:center; justify-content:center; transition:all .2s cubic-bezier(.34,1.56,.64,1);
  color:var(--rh-cream-dark);
}
.rh-footer-social a:nth-child(3n+1):hover{ background:var(--rh-coral); border-color:var(--rh-coral); }
.rh-footer-social a:nth-child(3n+2):hover{ background:var(--rh-blue); border-color:var(--rh-blue); }
.rh-footer-social a:nth-child(3n+3):hover{ background:var(--rh-green); border-color:var(--rh-green); }
.rh-footer-social a:hover{ transform:translateY(-3px) scale(1.1); color:#fff; }
.rh-footer-bottom{ border-top:1px solid rgba(255,255,255,.12); padding:1rem 0; font-size:.8rem; text-align:center; color:#b8a894; }

/* ---------------- Floating WhatsApp ---------------- */
.rh-wa-float{
  position:fixed; bottom:1.4rem; inset-inline-start:1.4rem; z-index:1040;
  width:56px; height:56px; border-radius:50%; background:#25A55C; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.7rem;
  box-shadow:0 8px 24px rgba(0,0,0,.25); transition:transform .15s ease, background .15s ease;
  animation:fbPulseRing 2.6s ease-out infinite;
}
.rh-wa-float:hover{ transform:scale(1.1); background:#1C8449; color:#fff; }
@keyframes fbPulseRing{
  0%{ box-shadow:0 8px 24px rgba(0,0,0,.25), 0 0 0 0 rgba(37,165,92,.55); }
  70%{ box-shadow:0 8px 24px rgba(0,0,0,.25), 0 0 0 14px rgba(37,165,92,0); }
  100%{ box-shadow:0 8px 24px rgba(0,0,0,.25), 0 0 0 0 rgba(37,165,92,0); }
}

/* ---------------- Floating cart (mobile only — desktop already has the
   always-visible navbar cart icon) ---------------- */
.rh-cart-float{
  display:none; position:fixed; bottom:1.4rem; inset-inline-end:1.4rem; z-index:1040;
  width:56px; height:56px; border-radius:50%; background:var(--rh-espresso-dk); color:#fff;
  align-items:center; justify-content:center; font-size:1.5rem;
  box-shadow:0 8px 24px rgba(0,0,0,.25); transition:transform .15s ease, background .15s ease;
}
.rh-cart-float:hover{ transform:scale(1.1); background:var(--rh-espresso); color:#fff; }
.rh-cart-float-badge{ inset-inline-start:auto; inset-inline-end:-4px; top:-4px; background:var(--rh-coral-dark); }
@media (max-width:991px){
  .rh-cart-float{ display:flex; }
}

/* ---------------- Reduced motion ---------------- */
@media (prefers-reduced-motion: reduce){
  .fb-particles{ display:none; }
  .rh-wa-float{ animation:none; }
  .rh-hero{ animation:none; }
  *{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
}

/* ---------------- Responsive ---------------- */
@media (max-width:991px){
  .rh-shop-layout{ grid-template-columns:1fr; }
  .rh-filters-toggle{ display:inline-flex; }
  .rh-filters{ position:static; max-height:none; display:none; margin-bottom:1.5rem; }
  .rh-shop-layout.rh-filters-open .rh-filters{ display:block; }
  .rh-section{ padding:2rem 0; }
  .rh-toolbar{ gap:.6rem; }
  .rh-toolbar form.d-flex{ width:100%; }
  .rh-toolbar select{ flex:1; }
}
@media (max-width:576px){
  .rh-footer-contact-col{ max-width:100%; padding:0 1rem; }
  .rh-hero-caption{ padding:1.4rem; }
  .rh-hero-caption h1{ font-size:1.4rem; }
  .rh-product-grid{ grid-template-columns:repeat(2,1fr); gap:.75rem; }
  .rh-product-card-body{ padding:.75rem .8rem .9rem; }
  .rh-section-alt{ padding:1.75rem 1.25rem; }
  .rh-topbar-inner{ justify-content:center; }
  .fb-p-bubble, .fb-p-star, .fb-p-block{ display:none; }
  .rh-product-card-price{flex-wrap:wrap;}
  .rh-card-add-cart{flex:0 0 100%;width:100%;height:40px;margin:.35rem 0 0;border-radius:10px;font-size:.95rem;}
  .rh-card-add-cart::before{inset:-3px;border-radius:12px;}
  .rh-cart-row{ flex-wrap:wrap; }
  .rh-cart-row-media{ width:64px; height:64px; flex-basis:64px; }
  .rh-cart-row-meta{ justify-content:space-between; }
  .rh-qty-input button{ width:36px; height:40px; }
  .rh-product-scroll{max-height: 800px;}
  .rh-toolbar{flex-wrap:nowrap;align-items:stretch;}
  .rh-live-search{flex:1 1 auto;min-width:0;max-width:none;}
  .rh-toolbar .rh-sort-select{flex:0 0 42%;width:42%;min-width:120px;}
}
.banner{
  display:block;
  width:100%;
  aspect-ratio:3/1;
  object-fit:cover;
  object-position:center;
}
.header-jumb{
  overflow:hidden;
  border-radius:var(--rh-radius);
  margin:1.25rem 0;
}
.rh-nav-mobile-banner{display:none;}
@media(max-width:991px){
  .rh-desktop-jumb{display:none;}
  .rh-nav-mobile-banner{display:block;flex:1 1 auto;min-width:0;max-width: 150px;margin-inline-end:.65rem;}
  .rh-nav-mobile-banner .header-jumb{margin:0;border-radius:9px;/* box-shadow:0 3px 12px rgba(36,31,23,.2); */}
  .rh-nav-mobile-banner .banner{width:100%;height:52px;aspect-ratio:auto;border-radius:9px;object-fit:cover;}
  .rh-navbar>.container{flex-wrap:nowrap;}
}
@media(max-width:380px){.rh-nav-mobile-banner .banner{height:46px}.rh-nav-mobile-banner{margin-inline-end:.35rem}}