/* ===============================
   Ghaim Premium UX Enhancement
   =============================== */

:root{
  --gh-bg:#FAF8F3;
  --gh-navy:#0E1F33;
  --gh-gold:#C9A66B;
  --gh-sand:#E8DDC7;
  --gh-bronze:#8A6A3F;
  --gh-white:#FFFFFF;
  --gh-text:#243044;
  --gh-muted:#667085;
  --gh-shadow:0 14px 38px rgba(14,31,51,.08);
  --gh-shadow-soft:0 8px 22px rgba(14,31,51,.06);
  --gh-radius:22px;
}

html{
  scroll-behavior:smooth;
}

body.theme-raed{
  background:var(--gh-bg)!important;
  color:var(--gh-text);
  font-family:'DINNextLTArabic-Regular', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Global containers */
.container{
  max-width:1240px;
}

/* Header */
.store-header{
  position:relative;
  z-index:50;
}

.top-navbar{
  background:var(--gh-navy)!important;
  color:#fff!important;
  border:0!important;
  font-size:13px;
}

.top-navbar a,
.top-navbar button,
.top-navbar salla-contacts,
.top-navbar salla-menu{
  color:#fff!important;
}

.main-nav-container{
  background:rgba(255,255,255,.92)!important;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(201,166,107,.22);
  box-shadow:0 8px 26px rgba(14,31,51,.05)!important;
  transition:all .25s ease;
}

body.ghaim-scrolled .main-nav-container{
  box-shadow:0 12px 34px rgba(14,31,51,.10)!important;
}

.navbar-brand{
  padding:10px 0;
}

.navbar-brand img{
  max-height:58px!important;
  width:auto!important;
  object-fit:contain!important;
  transition:transform .25s ease;
}

.navbar-brand:hover img{
  transform:scale(1.03);
}

.header-btn__icon,
.sicon-shopping-bag,
.sicon-menu{
  color:var(--gh-navy)!important;
}

salla-cart-summary,
salla-user-menu{
  transition:transform .2s ease;
}

salla-cart-summary:hover,
salla-user-menu:hover{
  transform:translateY(-2px);
}

/* Search */
.header-search{
  max-width:520px;
}

salla-search{
  --color-primary:var(--gh-navy);
}

/* Section spacing */
main .s-block{
  position:relative;
  margin:0!important;
  padding-top:34px;
  padding-bottom:34px;
}

main .s-block:first-of-type{
  padding-top:0;
}

/* Custom section wrappers */
.s-block--bundle-hero-ghaim,
.s-block--bundle-categories-ghaim,
.s-block--bundle-products-slider-ghaim,
.s-block--bundle-why-ghaim,
.s-block--bundle-testimonials-ghaim{
  overflow:hidden;
}

.s-block--bundle-hero-ghaim{
  background:
    radial-gradient(circle at 12% 20%, rgba(201,166,107,.14), transparent 28%),
    linear-gradient(180deg,#fff 0%, var(--gh-bg) 100%);
  border-bottom:1px solid rgba(201,166,107,.18);
}

.s-block--bundle-categories-ghaim,
.s-block--bundle-why-ghaim{
  background:var(--gh-bg);
}

.s-block--bundle-products-slider-ghaim,
.s-block--bundle-testimonials-ghaim{
  background:#fff;
}

/* General headings inside blocks */
.s-block h1,
.s-block h2,
.s-block h3,
.s-block .s-block__title{
  color:var(--gh-navy)!important;
  letter-spacing:-.02em;
}

.s-block p{
  color:var(--gh-muted);
  line-height:1.9;
}

/* Premium card treatment */
.s-block a,
.s-block button{
  transition:all .22s ease;
}

.s-block img{
  border-radius:18px;
}

/* Standard product cards */
.s-product-card-entry,
.product-entry,
.product-card,
salla-product-card{
  border-radius:var(--gh-radius)!important;
  background:#fff!important;
  border:1px solid rgba(232,221,199,.9)!important;
  box-shadow:var(--gh-shadow-soft)!important;
  overflow:hidden!important;
  transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}

.s-product-card-entry:hover,
.product-entry:hover,
.product-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--gh-shadow)!important;
  border-color:rgba(201,166,107,.75)!important;
}

.s-product-card-image,
.product-entry__image{
  background:linear-gradient(180deg,#fff,var(--gh-bg));
}

.s-product-card-content{
  padding:16px!important;
}

.s-product-card-content-title,
.s-product-card-content h3,
.product-entry__title{
  color:var(--gh-navy)!important;
  font-weight:800!important;
  line-height:1.5!important;
}

.s-product-card-price,
.product-entry__price{
  color:var(--gh-bronze)!important;
  font-weight:900!important;
}

/* Buttons */
.s-button-primary,
button.s-button-primary,
.s-button-btn,
.btn--primary,
a[class*="btn"],
button[class*="btn"]{
  border-radius:999px!important;
}

.s-button-primary,
button.s-button-primary,
.btn--primary{
  background:var(--gh-navy)!important;
  border-color:var(--gh-navy)!important;
  color:#fff!important;
  box-shadow:0 10px 24px rgba(14,31,51,.16);
}

.s-button-primary:hover,
button.s-button-primary:hover,
.btn--primary:hover{
  background:#132a46!important;
  transform:translateY(-2px);
}

/* Category images/cards */
.s-block--bundle-categories-ghaim img{
  aspect-ratio:1/1;
  object-fit:cover;
  box-shadow:var(--gh-shadow-soft);
  border:1px solid rgba(201,166,107,.22);
}

.s-block--bundle-categories-ghaim a:hover img{
  transform:translateY(-4px) scale(1.015);
  box-shadow:var(--gh-shadow);
}

/* Testimonials */
.s-block--bundle-testimonials-ghaim{
  border-top:1px solid rgba(201,166,107,.16);
  border-bottom:1px solid rgba(201,166,107,.16);
}

/* Footer */
.store-footer{
  background:var(--gh-navy)!important;
  color:#fff!important;
  margin-top:30px;
}

.store-footer__inner{
  background:
    radial-gradient(circle at 20% 10%, rgba(201,166,107,.16), transparent 28%),
    var(--gh-navy)!important;
  border-top:1px solid rgba(201,166,107,.35);
}

.store-footer h3{
  color:#fff!important;
  font-weight:900;
}

.store-footer a,
.store-footer p,
.store-footer div,
.store-footer span{
  color:rgba(255,255,255,.82)!important;
}

.store-footer a:hover{
  color:var(--gh-gold)!important;
}

/* Back to top button */
.ghaim-backtop{
  position:fixed;
  left:18px;
  bottom:22px;
  width:46px;
  height:46px;
  border-radius:50%;
  background:var(--gh-navy);
  color:#fff;
  border:1px solid rgba(201,166,107,.45);
  box-shadow:0 12px 28px rgba(14,31,51,.24);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:90;
  opacity:0;
  transform:translateY(14px);
  pointer-events:none;
  transition:all .25s ease;
}

.ghaim-backtop.is-visible{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

.ghaim-backtop:hover{
  background:var(--gh-bronze);
}

/* Scroll reveal */
.ghaim-reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .55s ease, transform .55s ease;
}

.ghaim-reveal.is-inview{
  opacity:1;
  transform:translateY(0);
}

/* Product page polish */
.product-single,
.product-details,
.product-main{
  background:transparent!important;
}

.product-single .container,
.product-details .container{
  border-radius:var(--gh-radius);
}

.quantity,
salla-product-availability,
salla-add-product-button{
  border-radius:16px!important;
}

/* Mobile UX */
@media (max-width:768px){
  .top-navbar{
    display:none!important;
  }

  .main-nav-container{
    min-height:66px;
  }

  .navbar-brand img{
    max-height:48px!important;
  }

  .header-search{
    display:block!important;
    order:10;
    width:100%;
    max-width:100%;
    margin-top:8px;
  }

  main .s-block{
    padding-top:24px;
    padding-bottom:24px;
  }

  .s-block--bundle-hero-ghaim{
    padding-top:10px!important;
  }

  .s-product-card-entry,
  .product-entry,
  .product-card{
    border-radius:18px!important;
  }

  .store-footer{
    text-align:center;
  }

  .ghaim-backtop{
    left:14px;
    bottom:18px;
    width:42px;
    height:42px;
  }
}

/* Accessibility */
a:focus-visible,
button:focus-visible{
  outline:3px solid rgba(201,166,107,.55)!important;
  outline-offset:3px;
}

/* Reduce motion */
@media (prefers-reduced-motion:reduce){
  *{
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important;
  }
}
/* =========================
   Features Section بداية شغل المهندس محمد
========================= */

.s-block--features {
  padding-top: 30px;
  padding-bottom: 30px;
}

/* Grid cards */
.s-block--features .s-block--features__item {
  position: relative;
  overflow: hidden;
  min-height: 230px;
  padding: 28px 22px;
  text-align: center;
  background: #ffffff;
  border: 1px solid rgba(201, 166, 107, 0.28);
  border-radius: 22px;
  box-shadow: 0 10px 35px rgba(14, 31, 51, 0.07);
  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease,
    border-color 0.35s ease;
}

/* Decorative background */
.s-block--features .s-block--features__item::before {
  content: "";
  position: absolute;
  width: 130px;
  height: 130px;
  top: -75px;
  right: -65px;
  border-radius: 50%;
  background: rgba(201, 166, 107, 0.12);
  transition:
    transform 0.4s ease,
    background 0.4s ease;
}

/* Small bottom line */
.s-block--features .s-block--features__item::after {
  content: "";
  position: absolute;
  right: 50%;
  bottom: 0;
  width: 0;
  height: 4px;
  border-radius: 10px 10px 0 0;
  background: #c9a66b;
  transform: translateX(50%);
  transition: width 0.35s ease;
}

/* Hover effect */
.s-block--features .s-block--features__item:hover {
  transform: translateY(-8px);
  border-color: rgba(201, 166, 107, 0.65);
  box-shadow: 0 18px 45px rgba(14, 31, 51, 0.13);
}

.s-block--features .s-block--features__item:hover::before {
  transform: scale(1.25);
  background: rgba(201, 166, 107, 0.18);
}

.s-block--features .s-block--features__item:hover::after {
  width: 70%;
}

/* Icon */
.s-block--features .feature-icon {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 66px;
  height: 66px;
  margin: 0 auto 20px;
  color: #c9a66b;
  background: #faf8f3;
  border: 1px solid rgba(201, 166, 107, 0.35);
  border-radius: 20px;
  font-size: 30px;
  box-shadow: 0 8px 22px rgba(201, 166, 107, 0.15);
  transition:
    transform 0.35s ease,
    color 0.35s ease,
    background 0.35s ease;
}

.s-block--features .s-block--features__item:hover .feature-icon {
  color: #ffffff;
  background: #c9a66b;
  transform: translateY(-4px) rotate(-4deg);
}

/* Title */
.s-block--features .s-block--features__item h2 {
  position: relative;
  z-index: 2;
  margin: 0 0 12px;
  color: #0e1f33;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.5;
}

/* Description */
.s-block--features .s-block--features__item p {
  position: relative;
  z-index: 2;
  margin: 0;
  color: #647083;
  font-size: 14px;
  line-height: 1.9;
}

/* =========================
   Scroll Reveal Animation
========================= */

.s-block--features.ghaim-reveal
.s-block--features__item {
  opacity: 0;
  transform: translateY(35px) scale(0.97);
  transition:
    opacity 0.7s ease,
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s ease,
    border-color 0.35s ease;
}

/* Animate when section is visible */
.s-block--features.ghaim-reveal.is-inview
.s-block--features__item {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Stagger animation */
.s-block--features.ghaim-reveal.is-inview
.s-block--features__item:nth-child(1) {
  transition-delay: 0.08s;
}

.s-block--features.ghaim-reveal.is-inview
.s-block--features__item:nth-child(2) {
  transition-delay: 0.18s;
}

.s-block--features.ghaim-reveal.is-inview
.s-block--features__item:nth-child(3) {
  transition-delay: 0.28s;
}

/* =========================
   Responsive
========================= */

@media (max-width: 767px) {
  .s-block--features {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .s-block--features .s-block--features__item {
    min-height: 210px;
    padding: 23px 16px;
    border-radius: 18px;
  }

  .s-block--features .feature-icon {
    width: 56px;
    height: 56px;
    margin-bottom: 15px;
    border-radius: 17px;
    font-size: 25px;
  }

  .s-block--features .s-block--features__item h2 {
    font-size: 16px;
  }

  .s-block--features .s-block--features__item p {
    font-size: 12px;
    line-height: 1.75;
  }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .s-block--features .s-block--features__item,
  .s-block--features .feature-icon,
  .s-block--features .s-block--features__item::before,
  .s-block--features .s-block--features__item::after {
    transition: none !important;
    animation: none !important;
  }

  .s-block--features.ghaim-reveal
  .s-block--features__item {
    opacity: 1;
    transform: none;
  }
}
/* إصلاح توسيط قسم المميزات وآراء العملاء */
main .s-block--features.container,
main .ghaim-testimonials-section.container {
  width: 100%;
  max-width: 1240px;
  margin-right: auto !important;
  margin-left: auto !important;
  box-sizing: border-box;
}

/* مسافة آمنة على جانبي الشاشة */
@media (max-width: 1279px) {
  main .s-block--features.container,
  main .ghaim-testimonials-section.container {
    width: calc(100% - 32px);
  }
}

@media (max-width: 767px) {
  main .s-block--features.container,
  main .ghaim-testimonials-section.container {
    width: calc(100% - 24px);
  }
}
/* إصلاح توسيط قسم الأسئلة الشائعة */
main .ghaim-faq-section.container {
  width: 100%;
  max-width: 1240px;
  margin-right: auto !important;
  margin-left: auto !important;
  box-sizing: border-box;
}

/* مسافة آمنة على جانبي الشاشة */
@media (max-width: 1279px) {
  main .ghaim-faq-section.container {
    width: calc(100% - 32px);
  }
}

@media (max-width: 767px) {
  main .ghaim-faq-section.container {
    width: calc(100% - 24px);
  }
}


/* =========================================
   تكبير شعار الهيدر
========================================= */

.navbar-brand {
    display: flex;
    align-items: center;
}

.navbar-brand img {
    width: auto !important;
    height: 72px !important;
    max-height: 72px !important;
    transition: all .3s ease;
    object-fit: contain;
}

/* عند تصغير الهيدر أثناء التمرير */
body.ghaim-scrolled .navbar-brand img {
    height: 64px !important;
}

/* اللابتوب */
@media (max-width: 991px) {
    .navbar-brand img {
        height: 60px !important;
        max-height: 60px !important;
    }

    body.ghaim-scrolled .navbar-brand img {
        height: 54px !important;
    }
}

/* الجوال */
@media (max-width: 767px) {
    .navbar-brand img {
        height: 52px !important;
        max-height: 52px !important;
    }

    body.ghaim-scrolled .navbar-brand img {
        height: 48px !important;
    }
}
/* =========================================
   خلفية متجر غيم
========================================= */

html,
body,
main {
    background:
        radial-gradient(circle at top right,
            rgba(201,166,107,.08),
            transparent 28%),
        radial-gradient(circle at bottom left,
            rgba(14,31,51,.05),
            transparent 35%),
        #FAF8F3 !important;
}

/* جميع الأقسام */
main .s-block {
    background: transparent !important;
}

/* بطاقات المنتجات والأقسام */
.s-product-card,
.category-card,
.s-block--features__item,
.ghaim-testimonial-card,
.ghaim-faq-item{
    background:#fff;
    border:1px solid rgba(201,166,107,.15);
    box-shadow:0 10px 30px rgba(14,31,51,.05);
}
/* ==========================================================
   تحسين بطاقات المنتجات - متجر غيم
   ========================================================== */

.s-product-card-entry,
.s-product-card {
    background: #fff;
    border: 1px solid rgba(201,166,107,.15);
    border-radius: 20px;
    overflow: hidden;
    transition: .35s ease;
    box-shadow: 0 8px 25px rgba(14,31,51,.05);
}

.s-product-card-entry:hover,
.s-product-card:hover{
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(14,31,51,.10);
    border-color: rgba(201,166,107,.45);
}

/* حاوية الصورة */
.s-product-card-image{
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    padding:18px;
    height:280px;
}

/* إظهار الصورة كاملة */
.s-product-card-image img,
.s-product-card-image-cover{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center;
    transition:.35s ease;
}

/* تكبير بسيط عند المرور */
.s-product-card:hover .s-product-card-image img,
.s-product-card-entry:hover .s-product-card-image img{
    transform:scale(1.04);
}

/* عنوان المنتج */
.s-product-card-content-title{
    min-height:56px;
}

.s-product-card-content-title a{
    color:#0E1F33;
    font-size:15px;
    font-weight:800;
    line-height:1.8;
}

/* السعر */
.s-product-card-price{
    color:#C9A66B;
    font-size:22px;
    font-weight:900;
}

/* زر السلة */
.s-product-card .s-button-element,
.s-product-card-entry .s-button-element{
    border-radius:12px;
    font-weight:700;
}

/* الجوال */
@media(max-width:768px){

    .s-product-card-image{
        height:220px;
        padding:14px;
    }

    .s-product-card-content-title a{
        font-size:14px;
    }

}
/* =========================================
   أنيميشن نبض لأيقونة الواتساب
========================================= */

a[aria-label="Go to whatsapp"] {
  position: relative;
  animation: whatsappHeartbeat 1.6s ease-in-out infinite;
  transform-origin: center;
  will-change: transform, box-shadow;
}

/* هالة النبض */
a[aria-label="Go to whatsapp"]::before,
a[aria-label="Go to whatsapp"]::after {
  content: "";
  position: absolute;
  inset: -6px;
  border: 2px solid rgba(77, 194, 71, 0.45);
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
  animation: whatsappPulseRing 1.8s ease-out infinite;
}

a[aria-label="Go to whatsapp"]::after {
  animation-delay: 0.6s;
}

/* نبض القلب */
@keyframes whatsappHeartbeat {
  0%,
  100% {
    transform: scale(1);
    box-shadow: 0 8px 25px rgba(77, 194, 71, 0.25);
  }

  14% {
    transform: scale(1.12);
  }

  28% {
    transform: scale(1);
  }

  42% {
    transform: scale(1.08);
  }

  70% {
    transform: scale(1);
    box-shadow: 0 12px 34px rgba(77, 194, 71, 0.4);
  }
}

/* انتشار الهالة */
@keyframes whatsappPulseRing {
  0% {
    transform: scale(0.85);
    opacity: 0.7;
  }

  100% {
    transform: scale(1.55);
    opacity: 0;
  }
}

/* إيقاف الحركة عند المرور */
a[aria-label="Go to whatsapp"]:hover {
  animation-play-state: paused;
  transform: scale(1.08);
}

/* تقليل الحركة لمن يفضل ذلك */
@media (prefers-reduced-motion: reduce) {
  a[aria-label="Go to whatsapp"],
  a[aria-label="Go to whatsapp"]::before,
  a[aria-label="Go to whatsapp"]::after {
    animation: none !important;
  }
}