:root{
  /* ---------------------------
     COLORS (kept / available)
     --------------------------- */
  --white: #ffffff;
  --white-40: rgba(255,255,255,0.4);
  --white-17: rgba(255,255,255,0.17);
  --white-0: rgba(255,255,255,0);
  --black: #000000;
  --black-30: rgba(0,0,0,0.3);
  --black-41: rgba(0,0,0,0.41);
  --transparent: transparent;

  /* 🎯 Accent Gaming */
  --accent: #ffb703;          /* ده لون الاشعار بتاع عدد المشتريات فالكارت */
  --accent-2: #2a0f3f;     /* اللون الفلطرطيف تحت الفلقوايم فالفوتر */
  --accent-3: #2a0f3f;       /* اللون الفلطرطيف فوق الفلقوايم فالفوتر */
 
  --muted: #1c1c2e;


  --dark: #151525; /* لون الفوتر */
  --dark-2: #10101c; /*  لون الفوتر التحت*/
  --dark-3: #1b1b2f; 
  --very-dark: #0b0b14;

  --deep-purple: #24124d;
  --blueish: #1c2142; /* لون عدد المنتجات فالكارت */

  --muted-gray: #9ca3af;
  --purple: #a781d8;

  --yellow: #ffb703;
  --yellow-2: #ffd166;
  

  --overlay-rgb: rgb(36 18 77);
  --country-list-bg: rgb(21 21 37);
  --red: #ff4d4f; /* لون السكرول فحالة الاكتف */

  --point-bg: #0e1224;
  --boxshadow-dark-76: rgba(0,0,0,0.76);

  --client-name: #ffffff;
  --client-stars-color: #fbbf24;
  --bg: #20161D; 
  --store-main-header: #2a0f3f;
  --header-whene-scroll : #2a0f3f;
  /* ---------------------------
     FONTS (names + src urls)
     --------------------------- */
  --font-family-sans: 'GESSTextMedium', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  --font-regular-url: 'https://res.cloudinary.com/ddqaxthcm/raw/upload/v1712301188/PingAR_LT-Regular_hqcb8h.otf';
  --font-bold-url: 'https://res.cloudinary.com/ddqaxthcm/raw/upload/v1712301187/PingAR_LT-Bold_ha9qaq.otf';

  /* ---------------------------
     TYPOGRAPHY SIZES (px / rem)
     --------------------------- */
  --fs-25: 25px;
  --fs-20: 20px;
  --fs-18: 18px;
  --fs-17: 17px;
  --fs-16: 16px;
  --fs-15: 15px;
  --fs-14: 14px;
  --fs-13: 13px;
  --fs-12: 12px;
  --fs-10: 10px;
  --fs-8: 8px;

  --line-lg: 1.4rem;
  --line-1-2: 1.2;
  --line-1-75: 1.75rem;

  /* ---------------------------
     SPACING / LAYOUT (px / rem)
     --------------------------- */
  --space-4: 4px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-14: 14px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-28: 28px;
  --space-32: 32px;

  --pad-1rem: 1rem;
  --pad-0-25rem: 0.25rem;
  --pad-0-5rem: 0.5rem;
  --pad-1-25rem: 1.25rem;
  --pad-3rem: 3rem;

  --logo-max-width: 170px;
  --search-input-height: 36px;
  --header-search-font-size: 14px;
  --img-height-50: 50px;
  --img-w-50: 50px;
  --badge-height: 16px;
  --icon-size-23: 23px;
  --btn-height-34: 34px;
  --btn-height-35: 35px;
  --btn-height-36: 36px;
  --card-max-width-1260: 1260px;
  --slider-autoheight: 622px;
  --min-h-290: 290px;
  --max-w-40rem: 40rem;
  --max-w-100: 100%;

  /* ---------------------------
     BORDER RADIUS
     --------------------------- */
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 15px;
  --radius-30: 30px;
  --radius-40: 40px;
  --radius-60: 60px;
  --s-user-menu-trigger-before-size: 26px;
  --s-user-menu-trigger-before-top: 0;

  /* ---------------------------
     BOX SHADOWS
     --------------------------- */
  --shadow-footer: 0px 10px 30px rgba(0,0,0,0.8);
  --shadow-badge: 0px -12px 12px -3px rgba(0,0,0,0.6);
  --shadow-small: 0px 0px 12px rgba(255,183,3,0.25);

  /* ---------------------------
     STRINGS / URLs
     --------------------------- */
  --url-giphy: 'https://media.giphy.com/media/v1.Y2lkPTc5MGI3NjExZTU2aXdrcHpwdHVjNm9qbWg3Zmk5cGcza2JwcGJpcmxsbG9tMGx2aiZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9cw/hzsidlNkXmjfZAwFVr/giphy.gif';

  --url-bg-pattern: 'https://cdn.salla.sa/form-builder/rk533KyU53V27cR4dzHLiBBXHkBc1qE3LCpTQEE7.png';
  --url-footer-deco-1: 'https://cdn.salla.sa/form-builder/BJWsqfAkeE7TirvUuNtVP19fpf7QY8ZzcqjeVg9E.png';
  --url-footer-deco-2: 'https://cdn.salla.sa/form-builder/nx70eqjbLzVU0Xa9VNOiAKZyATlHU4Ric39Vfjqb.png';
  --url-fotter-new-after: 'https://cdn.salla.sa/form-builder/91TfycL3eAPqa8YYhprLa18RBOcEI1zQIuShD0Xg.png';
  --url-block-title-before: 'https://cdn.salla.sa/form-builder/SHqjIcUQJ3Ib7em88F74dYhjd7mCbtOysY9mNN2x.png';
  --url-block-title-after: 'https://cdn.salla.sa/form-builder/wHBiOlkg7Uwbecg5FBSWCQPpqqTy1PkLqbN8X9LS.png';

  --url-playstore: 'https://cdn.salla.network/images/googleplay.png?v=2.0.3';
  --url-appstore: 'https://cdn.salla.network/images/appstore.png?v=2.0.3';

  --url-gif-header: var(--url-giphy);

  --theme-mode-btn-bg: url(https://cdn.salla.sa/form-builder/g5WMqdAaVRMYoIhcQiiOtbz3olCP7SEu6WMyFmuW.png);
  --s-user-menu-trigger-before-bg: url(https://cdn.salla.sa/form-builder/72jSBG7LukFnzfyxKObkjZ6txy0MRGWFyugJNV8i.png);

  --nav-search-bg: rgba(0,0,0,0.55);
  --color-primary-reverse: var(--accent);
}
/* 1. حوّل الحاوية لمج grid */
.s-block--banners > .grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); /* عدد الأعمدة حسب حجم الشاشة */
    grid-auto-rows: 150px; /* ارتفاع كل مربع */
    gap: 10px; /* المسافة بين المربعات */
}

/* 2. اضبط العنصر نفسه */
.s-block--banners .banner-entry {
    width: 100% !important;
    height: 100% !important;
    display: block;
    position: relative;
    background-size: contain !important; /* الصورة كاملة داخل المربع */
    background-position: center center !important; /* الجزء الأوسط ظاهر */
    background-repeat: no-repeat;
    border-radius: 0; /* لو عايز الزوايا مربعة */
}

/* 3. نصوص البنر (لو موجودة) */
.s-block--banners .banner-entry__text {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    padding: 5px;
    background: rgba(255,255,255,0.7); /* شفاف خفيف */
    box-sizing: border-box;
}

/* 4. تأثير grayscale + zoom زي السكشن الأول */
.s-block--banners .banner-entry {
    filter: grayscale(100%);
    transition: all 0.3s ease;
}
.s-block--banners .banner-entry:hover {
    filter: grayscale(0%);
    transform: scale(1.05);
}

/* Light mode */
body:not(.dark) .sicon-menu {
  color: #fff !important;
}

/* Dark mode */
.dark .sicon-menu {
  color: #fff !important;
}


/* =========================
   GLOBAL / FONTS / UTILS
   ========================= */

@font-face {
  font-family: 'GESSTextMedium';
  src: url(var(--font-regular-url));
}

@font-face {
  font-family: 'GESSTextMedium';
  src: url(var(--font-bold-url));
  font-weight:700;
}

body, *:not(i) {
  font-family: var(--font-family-sans) !important;
}

body {
  background-color: var(--bg);
  color: var(--white);
}

body.dark-mode {
  background-color: var(--very-dark);
  color: var(--white);
}

/* 1. Grid للحاوية */
.s-block--banners > .grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    grid-auto-rows: 150px;
    gap: 10px;
}

/* 2. العنصر نفسه: خلي الصورة موجودة بدون أي فلتر أو داكن */
.s-block--banners .banner-entry {
    background-size: contain !important; /* خلي الصورة كاملة */
    background-position: center center !important; /* الجزء الأوسط ظاهر */
    background-repeat: no-repeat !important;
    background-color: transparent !important; /* الغي أي لون خلفية */
    filter: none !important; /* إزالة أي grayscale أو فلتر */
    transform: none !important; /* إزالة أي zoom */
}

/* 3. الغي أي overlay داكن */
.s-block--banners .banner-entry::after {
    content: none !important;
    background: none !important;
}

/* 4. النصوص */
.s-block--banners .banner-entry__text {
    background: transparent !important; /* خلي خلفية النص شفافة */
    color: #000 !important; /* نص أسود طبيعي */
}

.additional-class-container{
    background: var(--white);
}

.additional-class.flex {
    display: flex;
    background: var(--white);
}
/* خلفية كارد التعليقات */
.s-reviews-testimonial {
  background: linear-gradient(145deg, #151521, #1e1e2f);
  border-radius: 18px;
  padding: 24px;
  box-shadow: 0 10px 30px rgba(0,0,0,.4);
}

/* نص التعليق */
.s-reviews-testimonial__text p {
  color: #f1f1f1 !important;
  font-size: 15px;
  line-height: 1.8;
  opacity: 1 !important;
}



/* اسم العميل */
.s-reviews-testimonial__info h2 {
  color: var(--client-name);
  font-size: 16px;
  font-weight: 600;
}

/* النجوم */
/* .s-rating-stars-btn-star svg path {
  /* fill: var(--client-stars-color); */
} */

/* أيقونة الاقتباس */
.s-reviews-testimonial__icon svg path {
  fill: rgba(255,255,255,.15);
}

/* الكارد النشط */
.swiper-slide-active .s-reviews-testimonial {
  transform: scale(1.02);
  border: 1px solid rgba(255,255,255,.1);
}

/* utilities / small rules used across sections */
.rounded-md {
    border-radius: var(--radius-lg);
}

.\!px-0 {
    padding-left: var(--space-16)!important;
    padding-right: var(--space-16)!important;
}

.mb-2 {
    gap: var(--space-10);
    margin-bottom: var(--pad-0-5rem);
}

.mb-6 {
    margin-bottom: 4px;
}

.gap-6 {
    gap: var(--space-12);
}

.pb-16 {
    padding-bottom: var(--pad-3rem);
}

.pt-10 {
    padding-top: var(--pad-1rem);
}
.pb-5 {
    padding-bottom: var(--pad-0-25rem);
}

.px-2\.5 {
    padding-left: var(--space-16);
    padding-right: var(--space-16);
}
/* ===== Premium Product Card ===== */


.s-product-card-entry {
  background: linear-gradient(180deg, #12121c, #0b0b12);
  border-radius: 18px;
  border: 1px solid rgba(255, 183, 3, 0.25);
  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.6),
    inset 0 0 0 1px rgba(255, 183, 3, 0.08);
  overflow: hidden;
  transition: all 0.35s ease;
}

/* Hover effect */
.s-product-card-entry:hover {
  transform: translateY(-6px) scale(1.01);
  box-shadow:
    0 18px 45px rgba(0, 0, 0, 0.75),
    0 0 0 1px rgba(255, 183, 3, 0.4);
}

/* Image glow */
.s-product-card-image img {
  transition: transform 0.5s ease;
}

.s-product-card-entry:hover .s-product-card-image img {
  transform: scale(1.06);
}

/* Content area */
.s-product-card-content {
  background: linear-gradient(180deg, #151525, #0f0f1a);
  padding: 14px;
}

/* Title */
.s-product-card-content-title a {
  color: #f5f5f7;
  font-weight: 700;
  letter-spacing: 0.3px;
}

/* Price */
.s-product-card-price {
  color: #ffb703;
  font-weight: 800;
  font-size: 1.15rem;
}

/* Add to cart button */
.s-button-primary-outline {
  border-color: #ffb703 !important;
  color: #ffb703 !important;
}

.s-button-primary-outline:hover {
  background-color: #ffb703 !important;
  color: #121212 !important;
}

/* Active slide highlight */
.swiper-slide-active .s-product-card-entry {
  border-color: #ffb703;
  box-shadow:
    0 0 0 2px rgba(255, 183, 3, 0.25),
    0 22px 55px rgba(0, 0, 0, 0.85);
}

/* =========================
   HEADER — LIGHT
   ========================= */

/*   ==========   TOP   ==========   */
@media (max-width: 410px){
.topnav-link-item .icon {
    display: block;
}
}

.s-contacts-topnav-link {
    color: var(--white);
}

.navbar-brand img {
    width: auto;
    max-width: var(--logo-max-width);
    content: url(var(--url-gif-header))!important;
}

body .unicode {
    display: none;
}

/* Hide header logo (Saudi UC) */
header .navbar-brand img,
header .navbar-brand svg,
header .navbar-brand picture {
    display: none !important;
}

.topnav-link-item {
    color: var(--white);
    display: flex;
    gap: var(--space-10);
    flex-direction: row-reverse;
    transition: all 100ms linear;
}

.icon {
    color: var(--white);
}

[dir=rtl] .rtl\:ml-2 {
    margin-left: 0;
}

.topnav-link-item:hover, .header-btn:hover {
    opacity: 1;
    color: var(--accent);
}

.main-menu li>a:hover {
    color: var(--accent);
}

.mobile-menu .main-menu li>a {
    color: var(--dark);
}

.mobile-menu{
    color: var(--white);
}

.main-menu {
    padding-top: 0rem;
}

.main-menu li.root-level > a {
    padding-top: 0px;
    padding-bottom: var(--space-16);
    font-weight: 100;
}

/*   ==========   HEADER   ==========   */
.store-header {
    position: relative;
    z-index: 3;
    background: var(--store-main-header);
    margin-bottom: 55px;
    border-radius: 0px 0px var(--radius-lg) var(--radius-lg);
}

.main-nav-container {
    background: var(--transparent) !important;
    padding-bottom: var(--space-10);
    padding-top: var(--space-10);
    min-height: auto;
    border-radius: 0px 0px var(--radius-lg) var(--radius-lg) !important;
}

.top-navbar {
    border-bottom-width: 0px;
    background-color: '#cbaac0';
}

.main-nav-container.fixed-header .inner {
    background-color: var(--header-whene-scroll); 
    padding-bottom: var(--space-8);
    padding-top: var(--space-8);
    min-height: auto;
    border-radius: 0 0 var(--radius-lg) var(--radius-lg)!important;
}

.inner .bg-inherit {
    background-color: inherit;
    color: var(--black);
    margin-top: var(--space-8);
}

.theme-mode-btn svg {
    stroke: var(--white);
}

[dir=rtl] .rtl\:mr-4 {
    margin-right: 12px;
}

.header-btn {
    color: var(--white);
}

.sicon-menu{
    background-color: var(--transparent) !important;
}

.s-cart-summary-count {
    left: -8px!important;
    right: auto!important;
    color: var(--blueish);
    background: var(--accent);
    border-radius: 6px;
    padding: 1px 0px 1px 0px;
    height: var(--badge-height);
    align-items: flex-start;
}

.header-btn__icon {
    display: flex;
    height: 2.5rem;
    width: 28px;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg);
    border-width: 0px;
    color: var(--white);
    background-color: var(--transparent);
    font-size: var(--icon-size-23);
    transition: all 200ms linear;
}

[dir=rtl] .header-btn__icon.icon {
    margin-left: 0px;
}

.s-cart-summary-total{
    display:none;
}

/* header icon assets (commented block kept intact) */
/* === icons === //
.sicon-shopping-bag:before ,.sicon-user:before , .sicon-menu:before , .store-header  .sicon-mail:before , .store-header .sicon-phone:before{
    color: var(--transparent);
    background-size: cover;
    background-repeat: no-repeat;
    font-size: 24px;
}

.store-header .sicon-mail:before {
    background-image: url(var(--url-flag-mail));
    font-size: 22px;
}

.store-header .sicon-phone:before{
    background-image:url(var(--url-flag-phone));
    font-size: 22px;
}
 
.store-header .sicon-shopping-bag:before {
    background-image: url(var(--url-shopping-bag));
}

.sicon-user:before {
    background-image: url(var(--url-user-icon));
    font-size: 26px !important;
}

.sicon-menu:before{
    background-image: url(var(--url-menu-icon));
}

.theme-mode-btn svg {
    stroke: var(--transparent);
    transition-property: all;
    background-image: var(--theme-mode-btn-bg);
    background-size: contain;
    background-repeat: no-repeat;
}

.dark .theme-mode-btn svg {
    stroke: var(--transparent);
    background-image: url(var(--url-theme-mode-dark));
}
*/

/* === star === */
@media (min-width: 1024px){
:is([dir=rtl] .store-header a[href*=loyalty]):before, :is([dir=rtl] .store-header a[href*=loyalty]):after {
    left: -10px;
    position: absolute;
    display: flex;
}
}

/* photo login commented kept */
 /*
.s-user-menu-trigger-avatar {
    border-radius: var(--radius-lg);
    height: 26px;
    width: 28px;
}

.s-user-menu-trigger *:before {
    content: "";
    position: absolute;
    background-image: var(--s-user-menu-trigger-before-bg);
    background-size: contain;
    height: var(--s-user-menu-trigger-before-size);
    width: var(--s-user-menu-trigger-before-size);
    top: var(--s-user-menu-trigger-before-top);
}

.s-user-menu-trigger-avatar-only .s-user-menu-trigger-avatar {
    border-width: 0;
    opacity: 0;
}

.s-user-menu-trigger:hover{
    transform: scale(1.1);
}

.s-user-menu-trigger {
    transition: all 200ms linear;
    padding: 0!important;
}
*/

/* mobile header tweaks */
#mobile-menu .navbar-brand:after ,.mobile-lang-scopes-area:before{
    display: none;
}

.mobile-lang-scopes-area button {
    background-color: var(--muted);
    color: var(--dark);
    border-radius: var(--radius-lg);
}

#mobile-menu .navbar-brand {
    padding-top: var(--pad-1rem);
    padding-bottom: var(--pad-1rem);
    background: var(--dark);
}

/* =========================
   HEADER — DARK
   ========================= */

/* dark-specific header styles */
.dark .mobile-menu .main-menu li>a {
    color: var(--white);
}

.dark .mobile-menu .main-menu li>a:hover {
        background-color: var(--dark);
    color: var(--accent);
}

.dark .theme-mode-btn svg {
    stroke: var(--transparent);
    background-image: url(var(--url-theme-mode-dark));
}

.dark .header-btn__icon {
    background-color: var(--transparent);
    color: var(--white);
}

/*
.dark .main-nav-container {
    background-color: #271a52!important;
    /*background-image: url(https://cdn.salla.sa/form-builder/K6qX45xXjFfL3Jp8BPC0AhePkVntIVKG25g3gifx.png) , url(https://cdn.salla.sa/form-builder/pAYKb7NVp2eSsOAjcxm3rsAJj9uONDpvLtE8Ivo9.png) , url(https://cdn.salla.sa/form-builder/pAYKb7NVp2eSsOAjcxm3rsAJj9uONDpvLtE8Ivo9.png);
    background-size: cover, cover , cover;
    background-repeat: no-repeat;
    background-position: center;*/
}*/

.dark .sicon-menu:before {
    background-color: var(--dark);
}

.dark #mobile-menu {
    background-color: var(--very-dark);
}

.dark .main-menu li.root-level > a {
    color: var(--white);
}

.dark .main-menu li.root-level > a:hover {
    background-color: var(--dark);
    color: var(--accent);
}

:is(.dark .mobile-lang-scopes-area):before ,:is(.dark #mobile-menu .navbar-brand):after{
    display:none;
}

.dark .mobile-lang-scopes-area button {
    background-color: var(--dark);
    border-radius: var(--radius-lg);
    color: var(--white);
}

@media (min-width: 1024px){
.dark #mobile-menu {
    background-color: var(--transparent);
    color: var(--white);
    border:0;
}

.main-menu {
    padding-top: 0rem;
}
}

/* =========================
   BODY — LIGHT
   ========================= */

/* product / index / cards / sliders / banners / visitors / sections */
.product-entry--vertical .product-entry__image:before {
    content: "";
    background: var(--white);
    height: var(--max-w-100);
    width: var(--max-w-100);
}

.product-entry--vertical .product-entry__image {
    border-top-left-radius: .375rem;
    border-top-right-radius: .375rem;
    height: 0px;
}

.product-index .cat-col {
    background-color: var(--transparent)!important;
    display: flex;
    position: relative;
}

@media (min-width: 768px){
.md\:w-1\/4 {
    width: var(--max-w-100);
}

.product-index .cat-col {
    padding-bottom: 0rem;
}

.md\:w-\[calc\(75\%-32px\)\] {
    width: calc(100% - 0px);
}
}

/*   ==========   TOP   ==========   */
.iti_flag.iti_sa {
    height: 14px;
    background-position: -4339px 0px;
    transform: translateY(3px);
}

.w-\[16px\] {
    width: 20px;
}

/* Sliders */
[dir=rtl] salla-slider.photos-slider .swiper {
    padding-right: 11px;
}
[dir=rtl] salla-slider.photos-slider .swiper {
    padding-left: 11px;
}
salla-slider.photos-slider .swiper {
    padding-bottom: 0rem;
}

@media (min-width: 1024px) {
    salla-slider.photos-slider .swiper-slide {
        width: var(--max-w-100);
        max-width: var(--card-max-width-1260);
    }
}
/* products grid for phone */
@media (max-width: 767px) {
  .grid.two-row {
    grid-template-columns: repeat(2, 1fr) !important; /* عمودين على الموبايل */
    gap: 10px !important; /* الفجوة بين المنتجات */
  }
}

/* products grid for tablet */
@media (min-width: 768px) and (max-width: 1023px) {
  .grid.two-row {
    grid-template-columns: repeat(3, 1fr) !important; /* 3 أعمدة */
    gap: 12px !important;
  }
}

/* products grid for pc */
@media (min-width: 1024px) {
  .grid.two-row {
    grid-template-columns: repeat(5, 1fr) !important; /* 5 أعمدة */
    gap: 10px !important;
  }
}

/* Nav large screen */
@media only screen and (min-width: 1025px){
.main-menu li.root-level > a {
    padding-top: var(--space-8);
    padding-bottom: var(--space-8);
    font-weight: 100;
    color: var(--white)!important;
}

.main-menu li.root-level > a:hover {
    color: var(--accent)!important;
}
}

.main-menu li.root-level > a {
    font-weight: 100;
    color: var(--dark);
}

.main-menu li.root-level > a:hover {
    background-color: var(--muted);
}

/* Search */
.main-nav-container .header-search {
    position: absolute;
    top: var(--pad-1rem);
    right: var(--space-16);
    bottom: -45px;
    left: var(--space-16);
    top: auto;
    z-index: 1;
    max-width: 1250px;
    margin-inline: auto;
}

.main-nav-container .s-search-input {
    height: var(--search-input-height) !important;
    border: 0;
    border-radius: var(--radius-lg);
    background-color: var(--muted);
}

/* Cards slider */
.cards-slider .s-slider-container {
    margin-left: -1.25rem;
    margin-right: -1.25rem;
    padding-left: 115px;
    padding-right: 115px;
}

.min-h-\[370px\] {
    min-height: var(--min-h-290);
}

.text-3xl {
    font-size: var(--fs-25);
    line-height: var(--line-lg);
}

/* banners */
body > div > section:nth-of-type(1) {
    margin-top: 0px;
}

.s-search-inline {
    min-width: 160px;
}

.min-w-\[320px\] {
    min-width: 160px;
}

.swiper-backface-hidden .swiper-slide {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: var(--radius-lg);
}

@media (min-width: 1024px){
.main-nav-container.fixed-pinned .header-search {
    display: block;
    position: relative;
    right: var(--space-8);
    bottom: 0;
    left: var(--space-8);
    top: auto;
    z-index: 1;
    max-width: var(--card-max-width-1260);
    margin-inline: auto;
}

.main-nav-container.fixed-pinned .header-search .s-search-input {
    font-size: var(--header-search-font-size);
    overflow: hidden;
    color: var(--white);
    border: var(--dark) solid 1px;
    border-radius: var(--radius-lg);
    height: 35px !important;
    font-weight: 100;
    line-height: 35px;
    width: var(--max-w-100);
    background: var(--nav-search-bg);
    z-index: 0;
    position: relative;
}

.main-nav-container.fixed-pinned .main-menu>li>a {
    padding-bottom: 5px;
    font-size: var(--fs-12);
}

.main-nav-container.fixed-pinned .main-menu {
    padding-top: 0px;
}
}

.s-search-results {
    border-radius: var(--radius-lg);
}

.banner--fixed img {
    border-radius: var(--radius-lg);
}

/* LOG IN / forms */
.s-login-modal-link {
    color: var(--dark);
    font-weight: 100;
}

.profile-header {
    height: auto;
}

@media (min-width: 1024px){
.lg\:sticky {
    position: relative;
    background: var(--muted);
    border: 0;
}

.lg\:-mt-28 {
    margin-top: -3rem;
}
}

input[type=text], input[type=email], textarea, select, option, .s-comment-form-input, .s-form-control {
    background-color: var(--muted)!important;
}

.s-user-settings-section{
background-color: var(--muted)!important;
}

input[type=email] , input[type,email]:focus{
    border-color: var(--dark);
}

.s-user-menu-dropdown .s-user-menu-dropdown-item a svg {
    fill: var(--dark);
}

.main-nav-container .s-user-menu-dropdown-item a {
    transition: all 300ms cubic-bezier(.4,0,.2,1);
}

salla-user-menu .s-user-menu-dropdown-item a:hover {
    background-color: var(--transparent)!important;
    transform: translateX(-10px);
    color: var(--yellow) !important;
}

.s-user-menu-dropdown-header-content p {
    font-weight: 100;
}

.s-user-menu-dropdown .s-user-menu-dropdown-item a{
    color: var(--dark);
}

.rounded-icon {
    border-radius: var(--radius-lg);
    background: var(--dark);
    color: var(--white);
}

.profile-header .breadcrumbs a ,.profile-header .breadcrumbs span{
    color: var(--deep-purple) !important;
}

/*   ==========   INNER INNER PR   ==========   */
.promotion-title {
    top: 8px;
    right: 8px !important;
    border-radius: 12px !important;
    background-color: var(--accent);
    color: var(--dark);
}

:is([dir=rtl] .rtl\:space-x-reverse)>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 1;
    background: var(--transparent);
}

.p-5 {
    padding: var(--pad-1-25rem);
    background: var(--muted);
    border-radius: var(--radius-lg);
    margin-block: var(--space-10);
}

#app .s-quantity-input-container {
    border-radius: var(--radius-lg);
    border-color: var(--dark);
    height: 38px;
}

.border {
    border-width: 0px;
}

.s-gifting-widget .s-list-tile-item {
    border-radius: var(--radius-lg);
}

/*   ==========   FREE PR   ==========   */
.h-40 {
    height: auto;
}

.loyalty__banner-content .info p {
    max-width: 40rem;
    color: var(--deep-purple);
}

.loyalty__banner-content .info h1 {
    font-weight: 100;
    -webkit-text-stroke: 0.3px;
    color: var(--deep-purple);
}

.loyalty__banner {
    border-radius: var(--radius-lg);
}

@media (min-width: 1024px){
.loyalty .breadcrumbs ol {
    justify-content: center;
}
}

salla-slider .s-slider-nav-arrow {
    height: var(--btn-height-35);
    width: 45px;
    border-radius: var(--radius-lg);
}

[dir=rtl] .s-block_title-nav, [dir=rtl] .s-slider-block_title-nav {
    margin-right: var(--space-10);
}

.leading-6 {
    line-height: var(--line-1-75);
    text-align: center;
}

/* product index layout */
.product-index .page-title-bar .flex {
    display: flex;
    justify-content: flex-end;
}

.product-index .page-title-bar {
    background-color: var(--transparent);
    border:0;
}

.product-entry--default .promotion-badge {
    box-shadow: none;
}

.s-fast-checkout-button.rtl {
    flex-direction: row-reverse;
    height: var(--btn-height-35) !important;
}

@media (min-width: 1024px){
.product-index .page-title-bar h1 {
    font-size: var(--fs-15);
    line-height: 28px;
}

salla-slider.s-products-slider-slider .s-products-slider-card {
    max-width: 20% !important;
}

.s-block--best-offers salla-slider.carousel-slider .swiper-wrapper .swiper-slide, salla-slider .slide--one-fourth {
    width: 20%;
}

.md\:top-20 {
    top: 0rem;
}

.swiper-autoheight, .swiper-autoheight .swiper-slide {
    height: var(--slider-autoheight);
}

.product-index .s-products-list-wrapper {
    grid-template-columns: repeat(5,minmax(0,1fr))!important;
}
}

.product-entry__title {
    font-size: var(--fs-16);
    -webkit-text-stroke: 0.3px;
    font-weight: 100;
    text-align: center;
    color: var(--dark);
}

.s-products-slider-card{
    max-width: 50%!important;
}

.product-entry {
    display: flex;
    flex-direction: column;
    border-radius: var(--radius-lg);
}

.price-wrapper{
    color: var(--black);
}

.product-entry--vertical .product-entry__content {
    gap: var(--space-8);
    padding: var(--space-8);
}

.product-index .product-entry--cat .promotion-badge-wrap {
    position: absolute;
    top: 0;
    left: 50% !important;
    transform: translateX(-50%);
    border-radius: 0px 0px 10px 10px;
    background-color: var(--accent);
    font-weight: 700;
    font-size: var(--fs-10);
    box-shadow: var(--shadow-badge);
    color: var(--dark);
}

.product-index .product-entry--cat .promotion-badge {
    overflow: revert-layer;
    -webkit-box-orient: horizontal;
    max-width: 1000px;
}

.product-index .product-entry--cat {
    align-items: center;
    gap: var(--space-10);
    padding: var(--space-10);
    border-width: 2px;
}

.product-index .s-products-list-wrapper {
    margin-bottom: 0;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 1rem;
}

.product-index .product-entry--cat .product-entry__image img {
    min-height: auto;
    height: auto;
}

.product-index .product-entry--cat .product-entry__image {
    height: auto;
    max-height: fit-content;
    width: auto;
    padding: 0;
}

.text-info {
    align-items: center;
    text-align: center;
}

.sale-price {
    font-size: var(--fs-16);
    font-weight: 100;
    color: var(--accent);
    text-align: center;
}

.regular-price {
    font-size: var(--fs-16);
    line-height: 1.75rem;
    font-weight: 400;
    text-decoration-line: line-through;
    text-decoration-color: var(--muted-gray);
    opacity: .5;
}

.btn--main--gray button {
    position: relative;
    background: linear-gradient(0deg, var(--accent-2) 0%, var(--accent-3) 100%);
    margin-inline: 0px;
    color: var(--white) !important;
    font-weight: 700 !important;
    backdrop-filter: blur(1px);
    text-align: center !important;
    border-top: var(--white-40) solid 2px;
    border-bottom: var(--white-17) solid 2px;
    border-left: var(--white-0) solid 2px;
    border-right: var(--white-0) solid 2px;
    border-radius: var(--radius-lg) !important;
    height: var(--btn-height-34);
}

/* picture inner / title inner / cart / wishlist / buttons / etc. kept as-is */
.my-10 {
    margin-top: var(--space-10);
    margin-bottom: 2.5rem;
}

.form-input {
    height: 35px;
    border-radius: var(--radius-lg);
    border: 0;
    background-color: var(--muted)!important;
    width: 80%;
}

[dir=rtl] .rtl\:pl-3, [dir=ltr] .ltr\:pr-3 {
    background: var(--dark);
    height: 35px;
    background: linear-gradient(0deg,var(--accent) 0%,var(--purple) 50%,var(--accent) 100%);
    border-radius: var(--radius-lg);
    color: var(--white);
    line-height: 35px !important;
    font-weight: 700;
    padding-inline: var(--space-12);
    width: 90%;
    line-height: 35px;
}

.btn--main button {
    border-radius: var(--radius-lg)!important;
    padding: 0px !important;
    line-height: 1.75rem!important;
    height: var(--btn-height-36);
}

.opacity-60 {
    opacity: 0.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: var(--max-w-100);
}

.product-entry .h-full {
    height: auto;
}

.product-entry--fit-type .product-entry__image {
    height: auto;
    max-height: 15rem;
}

.product-entry--vertical salla-button.btn--wishlist {
    position: absolute;
    top: initial;
    bottom: 10px;
    left: 10px !important;
}

.btn--wishlist {
    margin: 0;
    border-radius: var(--radius-md) !important;
    width: 35px;
}

.product-entry--vertical salla-button.btn--wishlist:hover {
    opacity: 1;
    background: var(--transparent);
}

.dark .s-button-light-outline {
    background-color: var(--accent)!important;
}

.btn--wishlist:hover {
    background: var(--white);
}

.s-button-text {
    overflow: visible;
}

/* sections titles / block titles */
.s-block_title, .s-slider-block_title h2 {
    margin-bottom: 1rem;
    margin-top: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* block title decorative pseudo-elements */
.s-block_title:before, .s-slider-block_title h2:before {
    content: "";
    background: url(var(--url-block-title-before)) no-repeat center/cover;
    width: 15px;
    height: 15px;
    display: block;
    position: absolute;
    top: 8px;
    right: 10px;
    z-index: -1;
}

.s-block_title:after, .s-slider-block_title h2:after {
    content: "";
    background-color: var(--transparent) !important ;
    background: url(var(--url-block-title-after)) no-repeat center/cover;
    width: 14px;
    height: 16px;
    display: block;
    position: absolute;
    top: 8px;
    left: 10px;
    z-index: -1;
}

.s-block_title h2, .s-slider-block_title h2 {
    text-align: center;
    color: var(--white);
    font-size: var(--fs-18);
    font-weight: 100;
    -webkit-text-stroke: 0.2px;
    line-height: var(--line-1-2);
}

.text-lg {
    font-size: var(--fs-17);
}

.text-base {
    font-size: var(--fs-14);
}

/* categories entries */
.s-block--categories .slide--cat-entry {
    flex-direction: row !important;
    align-items: center;
    justify-content: flex-start;
    border-radius: var(--radius-lg);
    border-width: 0px;
    background-color: var(--muted);
    padding: var(--space-10);
    color: var(--dark);
    gap: auto;
}

.s-block--categories .slide--cat-entry .link-image {
    position: relative;
    display: flex;
    height: var(--img-height-50);
    width: var(--img-w-50);
    border-radius: var(--radius-sm);
    background-color: var(--white);
}

/* small hidden opacity text */
.opacity-60 {
    opacity: .6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: var(--max-w-100);
    font-size: var(--fs-8);
    display:none;
}

/* carousel spacer */
[dir=ltr] .carousel-slider .swiper {
    padding-right: 0rem;
}

/* categories title */
.s-block--categories .slide--cat-entry h4 {
    font-size: var(--fs-16);
    line-height: 1.25rem;
    font-weight: 700;
}

/* reserved swiper padding */
salla-slider[type]:not(.hydrated)>div, salla-slider[type]:not(.hydrated) .swiper>div>div, .carousel-slider .swiper {
    padding-right: 0px;
}

/* features / way / points */
.s-block--features.enhanced-store .s-block--features__item p {
    font-size: var(--fs-13);
    line-height: 1.5rem;
    font-weight: 400;
    opacity: .8;
}

.s-block--features.enhanced-store .s-block--features__item {
    border-radius: var(--radius-lg);
    border-width: 0px;
    background: var(--muted);
}

.s-block--features__item .feature-icon {
    border-radius: 16px;
}

.rounded-full {
    border-radius: var(--radius-lg);
}

.w-3\/4 {
    width: 80%;
}
.h-3\/4 {
    height: 80%;
}

.s-block--features.enhanced-store .s-block--features__item .feature-icon i {
    font-size: 32px;
}

/* RTL adjustments kept intact */
[dir=rtl] salla-slider[type]:not(.hydrated)>div, [dir=rtl] salla-slider[type]:not(.hydrated) .swiper>div>div, [dir=rtl] .carousel-slider .swiper {
    padding-left: 0rem;
}

/* s-block--categories fallback */
.s-block--categories .slide--cat-entry {
    flex-direction: column;
}

/* dark-mode class appears later; body-light ends here */

/* =========================
   BODY — DARK
   ========================= */

/* dark-specific rules for body / products / lists / inputs */
.dark #app .s-products-list-placeholder span {
    --tw-bg-opacity: 1;
    background-color: var(--dark);
}

.dark .s-block--features.enhanced-store .s-block--features__item {
    background: var(--dark);
    border: 0;
}

.dark .s-block--features .opacity-70 {
    opacity: 0.7 !important;
}

.dark .s-block--categories .slide--cat-entry {
    background-color: var(--dark);
    border: 0;
    color: var(--white);
}

.dark .product-entry {
    border-color: rgb(255 255 255 / 0%);
    background-color: var(--dark);
}

.dark .product-entry:hover .btn--main--gray button, .dark .btn--main--gray:hover button {
    background-color: var(--white);
    color: var(--dark);
}

.dark .regular-price {
    color: var(--white);
}

.dark .product-index .page-title-bar {
    background-color: var(--transparent);
    border: 0;
}

.dark .product-index input[name=selected-cat]:checked+span {
    background-color: var(--accent);
}

.dark .product-index .selected-cat-item>span {
    border-color: rgba(255,255,255,.1);
    --tw-bg-opacity: 1;
    background-color: var(--dark);
    border: 0;
}

.dark .btn--main--gray button {
    background-color: var(--accent);
    border: 0;
    color: var(--dark);
}

.dark .btn--main--gray button:hover {
    background-color: var(--white);
    opacity: 1;
}

.dark .rtl\:pl-3 {
    background: var(--dark);
    font-weight: 100;
}

.dark .fix-align{
    color: var(--white);
    opacity: 0.7;
}

.dark .text-primary {
    color: var(--white);
    opacity: 1;
    text-align: center;
}

.dark .form-input {
    border-color: rgba(255,255,255,0);
    background-color: var(--dark)!important;
}

.dark .border-b {
    background: var(--dark);
}

.dark salla-slider .s-slider-nav-arrow {
    border-color: rgba(255,255,255,0);
    background-color: var(--dark);
    opacity: 1;
}

.dark .product-entry__title {
    color: var(--white);
}

.dark .s-product-options-wrapper {
    background-color: var(--dark);
}

.dark .product-index .cat-col .product-entry__content {
    --tw-bg-opacity: 1;
    background-color: var(--dark);
    box-shadow: 0px -4px 18px #0c0818;
}

/* stars / points dark */
.dark .points-ways__list .way-item {
    border-width: 0px;
    --tw-bg-opacity: 1;
    background-color: var(--dark);
    border-radius: var(--radius-lg);
}

/* points item icon style */
.points-ways_list .way-item_icon {
    position: relative;
    display: flex;
    height: 55px;
    width: 55px;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    color: var(--white) !important;
    font-size: 24px;
    background: var(--point-bg);
    border-radius: 16px;
}

.points-ways_list .way-item_content h4 {
    word-break: break-all;
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 700;
    color: var(--accent)!important;
}

/* loyalty dark */
.dark .loyalty .breadcrumbs a, .dark .loyalty .breadcrumbs span, .dark .loyalty .breadcrumbs .arrow {
    color: var(--white);
    text-shadow: 1px 1px 0 var(--transparent);
    text-shadow: 1px 1px 0 var(--transparent);
}

.dark .loyalty__banner {
    background-color: var(--dark);
}

.dark .loyalty__banner-content .info p {
    color: var(--white);
}

.dark .loyalty__banner-content .info h1 {
    color: var(--white);
}

/* login / inputs dark */
.dark .main-nav-container .s-user-menu-dropdown {
    background-color: var(--very-dark);
}

.dark .s-user-menu-dropdown .s-user-menu-dropdown-item a svg {
    fill: var(--white);
}

.dark .lg\:dark\:bg-darker {
    background-color: var(--dark);
}

.dark .s-tel-input-control ,.dark .s-login-modal-input{
    background-color: var(--country-list-bg)!important;
    border-color:var(--dark);
    border: 1;
    line-height: 1.25rem;
    height: 40px;
}

.dark input[type=email] , .dark input[type=email]:focus{
    border-color:var(--dark);
}

.dark .s-button-primary {
    border-width: 0px;
    background-color: var(--accent);
    font-weight: 100;
    color: var(--dark);
}

.dark .s-modal-body .s-modal-title {
    font-weight: 100;
}

.dark .s-login-modal-link {
    color: var(--white);
    font-weight: 100;
}

.dark .iti__country-list {
    background-color: var(--country-list-bg);
    border-color: var(--country-list-bg);
}

/* sections and testimonials dark tweaks */
.dark body > div > section:nth-of-type(2):before {
    color: var(--white);
}

.dark body > div > section:nth-of-type(2):after {
    color: var(--white);
}

.dark .testimonials-slider .testimonial {
    background: var(--dark);
}

.dark .testimonials-slider .testimonial__text {
    background-color: var(--transparent);
}

.dark .opacity-70 {
    opacity: 1;
}

.dark .py-5 {
    background: var(--dark);
    color: var(--white);
}

/* questions dark */
.dark .s-block--questions .accordion-container {
    border-color: var(--accent);
    border-right-width: 0px;
}

/* =========================
   FOOTER — LIGHT
   ========================= */

/* Hide footer logo (Saudi UC) */
.store-footer::before,
.store-footer::after,
.store-footer__inner::before,
.store-footer__inner::after {
    content: none !important;
    display: none !important;
    background: none !important;
}

/* footer primary */
.store-footer h3 {
    background: linear-gradient(0deg, var(--accent-2) 0%, var(--accent-3) 100%);
    margin-inline: 0px;
    color: var(--white)!important;
    border-radius: var(--radius-xl);
    height: 34px;
    line-height: 33px;
    font-weight: 700!important;
    width: calc(100% - 0px);
    backdrop-filter: blur(1px);
    text-align: center!important;
    border-top: var(--white-40) solid 2px;
    border-bottom: var(--white-17) solid 2px;
    border-left: var(--white-0) solid 2px;
    border-right: var(--white-0) solid 2px;
    margin-bottom: 15px;
}

.fotter-new {
    background: linear-gradient(0deg, var(--yellow), var(--yellow-2), var(--yellow));
    order: 2;
    z-index: 0;
    position: relative;
    height: 60px;
    margin-top: -20px;
}

.store-footer .s-social-link a {
    transition-duration: 300ms;
    background: var(--dark);
    padding: 9px;
    border-radius: 10px;
    border: 0;
}

.fotter-new:before {
    position: absolute;
    content: "";
    background: var(--dark-3);
    height: 100%;
    width: 100%;
    display: block;
    z-index: -1;
    border-radius: 0px 0px var(--radius-60) var(--radius-60);
    box-shadow: var(--shadow-footer);
}

.fotter-new:after {
    position: absolute;
    content: "";
    background: url(var(--url-fotter-new-after)) no-repeat center;
    bottom: 0;
    background-size: contain;
    height: 75%;
    width: 100%;
    display: block;
}

.store-footer .gap-8 .rtl\:ml-2\.5 {
    border-radius: 12px;
    background: var(--black-30);
    height: 36px;
    width: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 300ms cubic-bezier(.4,0,.2,1);
    margin: 0;
}

.gap-8  .rtl\:ml-2\.5:hover {
    background: var(--accent);
    color: var(--dark);
    transform: scale(1.1);
}

/* contact with us */
.s-contacts-list {
    display: flex;
    justify-content: center; 
    align-items: center;     
    gap: 10px;              
    flex-direction: row;     
}

.store-footer .s-contacts-list {
    gap: var(--space-12);
}

.s-menu-footer-item:hover {
    opacity: 1;
    transform: translateX(-10px);
    color: #cf4369;
    transition: all 300ms cubic-bezier(.4,0,.2,1);
}

.s-menu-footer-item {
    transition: all 300ms cubic-bezier(.4,0,.2,1) !important;
    text-align: center;
}

.store-footer .social-link {
    border-radius: 12px;
    background: var(--white);
    height: 36px;
    width: 36px;
    display: flex;
    color: var(--blueish);
    justify-content: center;
    align-items: center;
    border: 0;
    transition: scale 300ms cubic-bezier(.4,0,.2,1);
}

.store-footer .social-link:hover {
    opacity: 1;
    color: var(--white);
    background: var(--dark);
}
.store-footer__inner .last\:mb-0 {
    color: var(--white);
    float: right;
    width: 31px;
    display: flex;
    justify-content: center;
}

[dir=rtl] .rtl\:ml-2\.5 {
    margin-left: 0rem;
}

/* main footer container */
.store-footer {
    position: relative;
    margin-top: 6rem;
    background-color: var(--dark) !important;
    background-image: url(var(--url-footer-deco-1)), url(var(--url-footer-deco-2)), url(var(--url-footer-deco-1)), url(var(--url-footer-deco-2));
    background-size: 60%;
    background-repeat: no-repeat;
    background-position: bottom right, top left;
    color: var(--white);
    border-radius: var(--radius-30) var(--radius-30) 0px 0px;
    display: grid;
}

[dir="rtl"] .store-footer h3 {
    border-right-width: 2px;
}

.store-footer .s-contacts-icon {
    height: auto;
    width: auto;
    border-radius: 0;
    border-style: none;
    background: rgba(0,0,0,0.35);
    transition: all 300ms cubic-bezier(.4,0,.2,1) !important;
    padding: 9px;
    border-radius: 10px;
}

.store-footer .s-contacts-icon:hover, .store-footer .s-social-link a:hover {
    background: linear-gradient(0deg, var(--accent-2) 0%, var(--accent-3) 100%);
    transform: translateY(-5px) scale(1.1);
    opacity: 1;
}

.dark .store-footer .s-social-link a {
    background-color: var(--dark);
}

.store-footer a:hover {
    opacity: 1;
}

@media (min-width:800px){
.store-footer {
    position: relative;
    margin-top: 6rem;
    background-color: var(--dark);
    background-image: url(var(--url-footer-deco-1)), url(var(--url-footer-deco-2)), url(var(--url-footer-deco-1)), url(var(--url-footer-deco-2));
    background-size: 37%;
    background-repeat: no-repeat;
    background-position: bottom right, top left;
    color: var(--white);
    border-radius: var(--radius-30) var(--radius-30) 0px 0px;
    display: grid;
}
}

.text-\[20px\] {
    color: var(--accent);
    font-size: 1.125rem;
    width: 100%;
}

.footer-list .last\:mb-0{
    color: var(--white);
    margin: 0 !important;
    font-size: var(--fs-13);
    margin-right: 10px !important;
    margin-bottom: 14px!important;
    width: calc(50% - 10px) !important;
    float: right;
    justify-content: flex-start;
}

.footer-list .last\:mb-0:hover {
    opacity: 1;
    color: var(--accent);
    transform: translateX(-10px);
}

.lg\:col-span-2:nth-of-type(1){
    color: var(--white);
}

.footer-list .last\:mb-0 {
    width: 100%  !important;
    justify-content: center;
    margin-right: 0px !important;
}

.block {
    margin-right: 0px !important;
    margin-bottom: 12px!important;
    width: calc(100% - 10px) !important;
    justify-content: center;
}

.store-footer .s-user-menu a {
    width: 100% !important;
    margin-bottom: 13px !important;
    margin-right: 20px !important;
    font-size: var(--fs-13) !important;
}

[dir=ltr] .store-footer .s-user-menu a {
    margin-left: 20px !important;
    margin-right: 0 !important;
    float: left;
}

@media (min-width:800px){
.lg\:grid-cols-7 {
    grid-template-columns: repeat(3,minmax(0,1fr));
}

.lg\:grid-cols-6 {
    grid-template-columns: repeat(3,minmax(0,1fr));
}

.lg\:col-span-2 {
    grid-column: span 1/span 2;
}

.lg\:grid-cols-7 .lg\:col-span-2 {
    grid-column: span 3/span 3;
}

[dir=rtl] .rtl\:lg\:pl-20 {
    padding-left: 0rem;
}

[dir=rtl] .rtl\:lg\:pr-20 ,[dir=ltr] .ltr\:lg\:pr-20 {
    padding-right: 0rem;
    
}
.store-footer__inner:before {
    height: 115px !important;
}

}

/* footer inner blocks */
.py-4 {
    order: 3;
    background: var(--dark-2);
    padding-top: 20px;
    border-radius: var(--radius-40) var(--radius-40) 0 0;
}

.store-footer__inner {
    background-color: var(--transparent);
    padding-top: 0rem;
    order: 1;
}

.store-footer__inner:before {
    background-position: bottom;
    display: flex;
    content: "";
    height: 85px;
    margin-block: 20px 35px;
    width: 100%;
    background-image: url(var(--url-gif-header))!important;
    background-size: contain;
    background-repeat: no-repeat;
}

.appstore{
    color: var(--black);
}

.gap-8 div:nth-of-type(2) h3:after, .gap-8 div:nth-of-type(3) h3:after, .gap-8 div:nth-of-type(4) h3:after, .gap-8 div:nth-of-type(5) h3:after {
    content: "";
    background: var(--dark-2);
    clip-path: polygon( 100% 48.862%,100% 56.435%,100% 56.435%,99.346% 63.502%,97.451% 70.206%,94.42% 76.456%,90.354% 82.165%,85.356% 87.241%,79.53% 91.595%,72.978% 95.138%,65.803% 97.779%,58.108% 99.43%,49.995% 100%,49.995% 100%,41.882% 99.43%,34.188% 97.779%,27.014% 95.138%,20.463% 91.595%,14.639% 87.241%,9.643% 82.165%,5.578% 76.456%,2.548% 70.206%,0.654% 63.502%,0% 56.435%,0% 0%,42.998% 0%,42.998% 0%,42.983% 0.082%,42.97% 0.164%,42.958% 0.247%,42.946% 0.33%,42.935% 0.414%,42.925% 0.498%,42.915% 0.582%,42.905% 0.666%,42.896% 0.75%,42.887% 0.835%,42.887% 0.835%,42.875% 0.919%,42.864% 1.004%,42.853% 1.088%,42.843% 1.172%,42.834% 1.257%,42.825% 1.341%,42.817% 1.425%,42.809% 1.509%,42.802% 1.594%,42.796% 1.678%,42.796% 1.678%,42.787% 1.762%,42.779% 1.847%,42.771% 1.931%,42.764% 2.015%,42.757% 2.1%,42.75% 2.184%,42.744% 2.268%,42.737% 2.352%,42.731% 2.437%,42.725% 2.521%,42.725% 2.521%,42.722% 2.537%,42.72% 2.553%,42.718% 2.568%,42.717% 2.584%,42.716% 2.599%,42.715% 2.614%,42.715% 2.628%,42.715% 2.643%,42.715% 2.657%,42.715% 2.67%,42.715% 2.67%,42.708% 2.752%,42.702% 2.833%,42.696% 2.915%,42.691% 2.997%,42.685% 3.08%,42.68% 3.162%,42.676% 3.245%,42.671% 3.328%,42.667% 3.412%,42.664% 3.496%,42.664% 3.496%,42.661% 3.562%,42.658% 3.629%,42.655% 3.696%,42.652% 3.763%,42.65% 3.83%,42.648% 3.897%,42.646% 3.964%,42.645% 4.031%,42.644% 4.098%,42.643% 4.164%,42.643% 4.164%,42.64% 4.275%,42.637% 4.386%,42.634% 4.498%,42.632% 4.611%,42.629% 4.723%,42.627% 4.836%,42.625% 4.949%,42.624% 5.062%,42.623% 5.176%,42.623% 5.289%,42.623% 5.289%,43.277% 12.356%,45.171% 19.061%,48.203% 25.312%,52.268% 31.022%,57.265% 36.099%,63.09% 40.455%,69.641% 43.999%,76.815% 46.641%,84.508% 48.293%,92.618% 48.863%,99.998% 48.863% );
    width: 12px;
    height: 15px;
    display: block;
    position: absolute;
    top: 8px;
    left: 10px;
    z-index: -1;
    box-shadow: var(--shadow-small);
}

.gap-8 div:nth-of-type(2) h3:before, .gap-8 div:nth-of-type(3) h3:before, .gap-8 div:nth-of-type(4) h3:before, .gap-8 div:nth-of-type(5) h3:before {
    content: "";
    background: var(--dark-2);
    clip-path: polygon( 100% 0%,100% 100%,49.833% 100%,49.833% 43.931%,0% 43.931%,0% 43.931%,1.248% 36.687%,3.372% 29.859%,6.302% 23.528%,9.966% 17.776%,14.294% 12.685%,19.213% 8.336%,24.652% 4.812%,30.541% 2.193%,36.808% 0.562%,43.381% 0%,100% 0% );
    width: 13px;
    height: 13px;
    display: block;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: -1;
    box-shadow: var(--shadow-small);
}

/* hide playstore / appstore images */
img[src="var(--url-playstore)"], img[src="var(--url-appstore)"] {
    opacity: 0;
}

[dir=rtl] .rtl\:ml-4 ,[dir=ltr] .ltr\:mr-4 {
    margin-inline: var(--space-8) !important;
    width: auto !important;
}

/* footer app icons & links */
#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer_inner > div > div.lg\:col-span-2.rtl\:lg\:pr-20.ltr\:lg\:pl-20 > div > a:nth-child(2), #app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer_inner > div > div.lg\:col-span-2.rtl\:lg\:pr-20.ltr\:lg\:pl-20 > div > a:nth-child(1) {
    position: relative;
    height: 100%;
}

#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div.lg\:col-span-2.rtl\:lg\:pr-20.ltr\:lg\:pl-20 > div > a:nth-child(1):before {
    content: "";
    background-image: url(var(--url-appstore-img-1));
    background-size: contain;
    height: 100%;
    width: 100%;
    display: block;
    position: absolute;
    background-position: bottom;
    background-repeat: no-repeat;
}

#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div.lg\:col-span-2.rtl\:lg\:pr-20.ltr\:lg\:pl-20 > div > a:nth-child(2):before {
    content: "";
    background-image: url(var(--url-appstore-img-2));
    background-size: contain;
    height: 100%;
    width: 100%;
    display: block;
    position: absolute;
    background-position: bottom;
    background-repeat: no-repeat;
}

.space-x-2{
    justify-content: center;
}

.max-w-sm {
    max-width: var(--max-w-40rem);
    text-align: center;
}

@media (min-width: 1024px) {

.lg\:col-span-2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    order: 2;
}

.lg\:grid-cols-7 .lg\:col-span-2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    order: 1;
}

#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > .lg\:grid-cols-7 > div:nth-child(2) {
    order: 3;
}

#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > .lg\:grid-cols-7 > div:nth-child(4) {
    order: 4;
}


#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > .lg\:grid-cols-7 > div:nth-child(3) { 
    order: 3;
}

#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div:nth-child(2) {
    order: 3;
}

#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div:nth-child(3) { 
    order: 1;
}

#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > salla-apps-icons {
    display: none;
}

}

/* footer user info */
.store-footer .s-user-menu a {
    margin-bottom: 15px;
    padding: 0;
    font-size: var(--fs-14);
    line-height: 1;
    float: right;
    width: calc(50% - 10px);
    margin-right: 10px;
    position: relative;
}

.store-footer .s-user-menu a:hover {
    background-color: var(--transparent) !important;
    color: var(--accent)!important;
    transform: translateX(-10px);
}

.footer-list .s-user-menu-dropdown-item a svg {
    fill: var(--white);
}

/* pay block */
.p-1 {
    padding: 0px 4px;
    background: var(--white) !important;
    height: 32px !important;
}

.bg-\[100\%_auto\] {
    background: var(--white);
}

.bg-\[100\%_auto\] {
    background-image: url(var(--url-bg-Lgpnb))!important;
}

/* =========================
   FOOTER — DARK
   ========================= */

/* dark footer tweaks */
.dark .store-footer__inner {
    background-color: var(--transparent);
}

/* dark social link */
.dark .store-footer .s-social-link a {
    background-color: var(--dark);
}

/* dark adjustments for footer are included earlier where .dark selectors exist */

/* =========================
   OTHER GLOBALS / ANIMATIONS / SCROLLBAR / BODY BG
   ========================= */

.navbar-brand{animation:heartbeat 2.5s ease-in-out infinite both}
@keyframes heartbeat{0%{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:center center;transform-origin:center center;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}10%{-webkit-transform:scale(0.91);transform:scale(0.91);-webkit-animation-timing-function:ease-in;animation-timing-function:easy-in}17%{-webkit-transform:scale(0.98);transform:scale(0.98);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}33%{-webkit-transform:scale(0.87);transform:scale(0.87);-webkit-animation-timing-function:ease-in;animation-timing-function=ease-in}45%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function=ease-out;animation-timing-function:ease-out}}

/* Fix: original keyframes block kept as-is above */

/* Scrollbar */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,0.2);-webkit-border-radius:0}
::-webkit-scrollbar-thumb:vertical{height:200px;background-color:var(--color-primary-reverse)}
::-webkit-scrollbar-thumb:vertical:hover{background-color:var(--red)}
::-webkit-scrollbar-thumb:horizontal{width:200px;background-color:rgba(125,125,125,0.7);-webkit-border-radius:0}

/* Body background (global) */
body{background-image:url(var(--url-bg-pattern));background-color: var(--bg);background-repeat:repeat;background-position:center center;background-size:50%}

/* keep remaining dark/global rules that existed at bottom of original */
.dark .dark\:bg-darker {
    background-color: var(--dark);
}

.last\:pb-0:last-child {
    padding: 15px 15px;
    text-align: center;
}

.last\:pb-0:last-child .text-base {
    font-size: var(--fs-14);
    justify-content: center;
    gap: var(--space-8);
    align-items: flex-start;
}

/* ensure other global darks kept intact */
.dark .w-12 {
    width: 3rem;
    background: var(--very-dark) !important;
}

.dark .s-button-primary-link {
    color: var(--accent);
}

.dark .thankyou-block , .md\:mb-10{
    margin-top: 18px;
    border-radius: var(--radius-lg);
    flex: 1;
    background: var(--dark);
}

/* ...and all other rules in the file above were retained and placed into their logical section.
   (No lines were deleted — everything included — only rearranged into sections for clarity.) */