:root {
  --brand: #000;
  --sub-brand: #2c2a2b;
  --grad-start: #000;
  --grad-end: #2c2a2b;
}

/* header */
.top-navbar {
  background: var(--brand);
  color: #fff;
  padding-top: 10px !important;
  padding-bottom: 15px !important;
}

span.s-cart-summary-count {
  background: var(--brand);
}

a.navbar-brand {
  height: auto !important;
  width: 130px !important;
}
a.navbar-brand img {
  height: 100% !important;
  max-height: 100% !important;
  width: 100% !important;
}

custom-main-menu {
  display: flex;
  align-items: center;
}

ul.main-menu.mm-spn--open {
  color: var(--brand);
}
/* header */

/* banner */
salla-slider.photos-slider .swiper-slide {
  padding: 0;
  margin: 0;
  width: 100%;
}

section.s-block--photos-slider .swiper.s-slider-container {
  padding: 0;
}

section.s-block--fixed-banner.wide-placeholder .container,
section.s-block--fixed-banner.wide-placeholder .container * {
  border-radius: 0;
}
section.s-block--fixed-banner.wide-placeholder .container {
  padding: 0;
  margin: 0;
  max-width: 100%;
}
section.s-block--fixed-banner.wide-placeholder:nth-of-type(1) {
  margin: 0;
}

.grid.one-row.md\:grid-cols-3 * {
  border-radius: 0;
}
.grid.one-row.md\:grid-cols-3 {
  grid-template-columns: auto auto;
  gap: 0;
  grid-template-areas: "first sec" "first ther";
}

a.banner-entry.square-photos:nth-of-type(1) {
  grid-area: first;
  height: 100%;
}
a.banner-entry.square-photos:nth-of-type(2) {
  grid-area: sec;
}
a.banner-entry.square-photos:nth-of-type(3) {
  grid-area: ther;
}

@media (max-width: 600px) {
  .grid.one-row.md\:grid-cols-3 {
    display: flex;
    flex-direction: column;
  }
  a.banner-entry.square-photos:nth-of-type(1) {
    height: 222px;
  }
  a.banner-entry.square-photos:nth-of-type(2),
  a.banner-entry.square-photos:nth-of-type(3) {
    height: 113px;
  }
}
section.s-block.s-block--photos-slider {
  margin: 0;
}
/* banner */
/* cat */
.grid.one-row.md\:grid-cols-3.grid-flow-row.gap-3.sm\:gap-8 {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
}
.grid.one-row.md\:grid-cols-3.grid-flow-row.gap-3.sm\:gap-8 a {
  width: 30%;
  height: 445px;
  background: transparent;
}

@media (max-width: 600px) {
  .grid.one-row.md\:grid-cols-3.grid-flow-row.gap-3.sm\:gap-8 a {
    width: 40%;
    height: 180px;
    background: transparent;
  }
}
/* cat */
/* product */

.s-block__title {
  justify-content: center;
  margin-top: 2em;
  overflow: hidden;
}
.s-block__title .right-side {
  padding: 0;
}
.s-slider-block__title {
  margin-top: 2rem;
  justify-content: end;
}
.s-slider-block__title .s-slider-block__title-right {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  color: var(--brand);
  width: fit-content;
  padding: 0;
  text-align: center;
}

/* heading text + gradient lines before/after */
.s-slider-block__title .s-slider-block__title-right h2,
.s-block__title .right-side h2 {
  font-size: 32px !important;
  padding: 0;
  color: var(--brand);

  /* stroke around text */
  /* -webkit-text-stroke: 1.5px var(--grad-start); */
  /* paint-order: stroke fill; */

  /* layout for the lines */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  white-space: nowrap;
}

@media (max-width: 600px) {
  .s-block__title .right-side {
    position: relative;
  }
  .s-slider-block__title .s-slider-block__title-right h2,
  .s-block__title .right-side h2 {
    font-size: 18px !important;
    text-align: center;
    -webkit-text-stroke-width: 1px;
    gap: 10px;
    font-weight: 400;
  }

  .s-slider-block__title .s-slider-block__title-right {
    top: -3%;
  }
}
.s-product-card-content a,
.s-product-card-content h4 {
  color: var(--brand);
}
.s-product-card-vertical {
  border-radius: 25px;
  border: 1px solid var(--brand);
  overflow: hidden;
}
.s-button-primary-outline:hover {
  background-color: var(--sub-brand);
  color: #fff;
}
/* product */
/* footer */
.store-footer__inner {
  background-color: #2c2a2b !important;
}
.store-footer__inner *:not(a.flex.items-center.m-0) {
  color: #fff;
}

.store-footer__inner a.flex.items-center.m-0 {
  position: relative;
  color: transparent !important;
  width: 174px;
  height: 90px;
  margin-bottom: 1rem;
}
.store-footer__inner a.flex.items-center.m-0::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("https://i.ibb.co/hJyhkPhc/Mask-group-11.png") center /
    contain no-repeat;
}
/* footer */
.store-footer__inner a.flex.items-center.m-0 h3 {
  display: none;
}
.blog-single img.h-80.mb-10.w-full.object-cover.rounded-md,
a.post-entry__image.relative.overflow-hidden.hover\:opacity-90.w-full.h-56.bg-border-color.flex.items-center.justify-center {
  height: 100%;
}
.blog-single img.h-80.mb-10.w-full.object-cover.rounded-md,
a.post-entry__image.relative.overflow-hidden.hover\:opacity-90.w-full.h-56.bg-border-color.flex.items-center.justify-center {
  height: 100%;
}
.salla-multi-table {
    width: 100% !important;
    border-collapse: separate !important; /* للحفاظ على انحناء زوايا الجدول */
    border-spacing: 0 !important;
    margin: 25px 0 !important;
    font-size: 14px !important;
    direction: rtl !important;
    border: 1px solid #1c3a5e !important;
    box-shadow: 0 4px 12px rgba(28, 58, 94, 0.08) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background-color: #ffffff !important;
}

.salla-multi-table thead tr {
    background: #1c3a5e !important;
}

.salla-multi-table th {
    color: #ffffff !important;
    font-weight: bold !important;
    padding: 14px 16px !important;
    border: 1px solid #2a4a70 !important;
    border-style: solid !important;
    text-align: center !important;
}

.salla-multi-table td {
    padding: 14px 16px !important;
    border: 1px solid #d8e2ec !important;
    border-style: solid !important; /* إجبار المتصفح على إظهار الحدود */
    text-align: center !important;
    color: #1c3a5e !important;
    line-height: 1.6 !important;
}

/* عمود المواصفات (العمود الأول) */
.salla-multi-table tbody tr td:first-child {
    font-weight: bold !important;
    background-color: #f4f8fb !important;
}

/* تبديل خلفيات الصفوف */
.salla-multi-table tbody tr:nth-child(even) {
    background-color: #eef3f8 !important;
}
.salla-multi-table tbody tr:nth-child(odd) {
    background-color: #ffffff !important;
}

.salla-multi-table tbody tr:hover {
    background-color: #fde9dd !important;
}

@media (max-width: 600px) {
    .salla-multi-table {
        font-size: 12px !important;
        display: block !important;
        overflow-x: auto !important; /* سحب أفقي مريح على الموبايل */
    }
    .salla-multi-table th, .salla-multi-table td {
        padding: 10px 8px !important;
    }
}

/* ==========================================================================
   2. تنسيقات الأسئلة الشائعة (صناديق منفصلة ومستديرة بالكامل)
   ========================================================================== */
.salla-faq-container {
    width: 100% !important;
    max-width: 900px !important;
    margin: 30px auto !important;
    padding: 0 10px !important;
    direction: rtl !important;
    font-family: 'Cairo', sans-serif !important;
}

.salla-faq-item {
    background: #f7ecdf !important; /* لون خلفية ناعم متناسق مع متجرك */
    border-radius: 16px !important; /* زوايا مستديرة ناعمة تماماً كالصورة */
    margin-bottom: 16px !important; /* مسافة واضحة تفصل كل صندوق عن الآخر */
    box-shadow: 0 2px 8px rgba(28, 58, 94, 0.05) !important;
    border: 1px solid rgba(28, 58, 94, 0.05) !important;
    overflow: hidden !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* الهيدر أو السؤال */
.salla-faq-item h3.salla-faq-trigger {
    background: transparent !important; /* إلغاء الخلفية الغامقة الإجبارية */
    color: #1c3a5e !important; /* لون النص الأساسي */
    font-weight: bold !important;
    font-size: 17px !important;
    margin: 0 !important;
    padding: 18px 20px !important;
    cursor: pointer !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    transition: color 0.3s ease !important;
}

/* إضافة سهم ناعم على اليسار */
.salla-faq-item h3.salla-faq-trigger::after {
    content: '▾' !important;
    font-size: 16px !important;
    color: #e0742c !important; /* لون السهم البرتقالي الخاص بالمتجر */
    transition: transform 0.3s ease !important;
}

/* عند فتح السؤال */
.salla-faq-item.active {
    background: #f0e3d5 !important; /* تغميق خفيف جداً للخلفية عند الفتح لتمييزه */
}
.salla-faq-item.active h3.salla-faq-trigger::after {
    transform: rotate(180deg) !important;
}

/* حاوية الإجابة المخفية */
.salla-faq-content {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.3s ease-out, padding 0.3s ease !important;
    padding: 0 20px !important;
}

/* فتح الإجابة بسلاسة */
.salla-faq-item.active .salla-faq-content {
    max-height: 600px !important; /* مساحة كافية النصوص */
    padding-bottom: 18px !important;
}

.salla-faq-content p {
    font-size: 15px !important;
    line-height: 1.7 !important;
    margin: 0 !important;
    color: #334e6f !important; /* لون مريح للعين لقراءة الإجابة */
}

@media (max-width: 600px) {
    .salla-faq-item h3.salla-faq-trigger {
        font-size: 15px !important;
        padding: 14px 16px !important;
    }
    .salla-faq-content p {
        font-size: 13px !important;
    }
}