/* ===================================== */
/* Navigation - شريط التنقل الرئيسي */
/* ===================================== */
.main-nav-container {
  border-bottom: 1px solid #fff;
  box-shadow: 0 1px 2px 0 #fff;
}

.main-nav-container.fixed-header .inner {
  box-shadow: 0 1px 2px 0 #fff;
}

/* ===================================== */
/* Titles (h2) - العناوين الرئيسية */
/* ===================================== */
h2.text-3xl,
h2.leading-tight {
  text-transform: uppercase;
  margin: 0 auto 80px;
  border: 2px solid #000;
  padding: 10px 20px;
  font-size: 30px;
  width: fit-content;
  position: relative;
  z-index: 1;
  transition: .3s;
}

/* نقاط قبل وبعد العنوان */
h2.text-3xl::before,
h2.text-3xl::after,
h2.leading-tight::before,
h2.leading-tight::after {
  content: "";
  width: 12px;
  height: 12px;
  background-color: #2196f3;
  position: absolute;
  border-radius: 50%;
  top: 50%;
  transform: translateY(-50%);
}

h2.text-3xl::before,
h2.leading-tight::before {
  left: -30px;
}

h2.text-3xl::after,
h2.leading-tight::after {
  right: -30px;
}

/* ===================================== */
/* Animations - حركات انتقال للنقاط */
/* ===================================== */
@keyframes left-move {
  50% { left: 0; width: 12px; height: 12px; }
  100% { left: 0; border-radius: 0; width: 50%; height: 100%; }
}

@keyframes right-move {
  50% { right: 0; width: 12px; height: 12px; }
  100% { right: 0; border-radius: 0; width: 50%; height: 100%; }
}

/* تفعيل العنوان عند الظهور */
h2.text-3xl.in-viewport,
h2.leading-tight.in-viewport {
  color: #fff;
  border-color: #fff;
  transition-delay: .5s;
}

h2.text-3xl.in-viewport::before,
h2.leading-tight.in-viewport::before {
  z-index: -1;
  animation: left-move .5s linear both;
}

h2.text-3xl.in-viewport::after,
h2.leading-tight.in-viewport::after {
  z-index: -1;
  animation: right-move .5s linear both;
}

.enhanced-title-border { display: none; }

/* ===================================== */
/* General Elements - العناصر العامة */
/* ===================================== */
.s-comments-item-content,
.s-comments-item-timestamp,
.product-single__info h2.product-entry__sub-title,
.s-rating-stars-wrapper span.s-rating-stars-reviews {
  color: #fff;
}

/* خيارات المنتج */
.s-product-options-grid-mode-span {
  background-color: rgba(255, 255, 255, 0.8);
  color: #0e0e0e;
}

.s-product-options-grid-mode input:checked+div {
  background: #2196f3;
  color: #fff;
}

.s-product-options-option .s-product-options-option-label small {
  color: #fff;
}

/* أزرار + أيقونات */
.rounded-lg button.w-full .text-store-text-primary,
.product-card__addToCart__btn salla-button button:hover,
.pie-wrapper span,
#staProductQty,
#product-filter,
.s-infinite-scroll-wrapper .s-button-primary .s-infinite-scroll-btn-text,
#cart-submit>button>span,
.btn--collapse .sicon-chat-conversation-alt::before,
.btn--collapse span.fix-align,
.btn--collapse .sicon-paperclip::before,
div.space-x-3 .btn--collapse>span {
  color: #000;
}

/* حقول الإدخال */
.s-product-options-option-content>div>.s-form-control {
  border-color: #fff;
}

/* النصوص داخل أقسام مختلفة */
.sticky-cart-single .content div>.content-bottom div>h4,
.s-block--tabs-produtcs .tab-trigger button,
#details_table {
  color: #fff;
}

/* روابط داخل جدول التفاصيل */
#details_table>p:has(>a) {
  display: inline-block;
  margin: 15px 10px;
}

#details_table>p:has(>a)>a {
  display: inline-block;
  padding: 10px 20px;
  color: #2196f3;
  text-decoration: none;
  font-size: 14px;
  cursor: pointer;
  background-color: transparent !important;
}

#details_table>p:has(>a)>a:hover {
  background-color: #0056b3;
  border-color: #0056b3;
}

.content--single-page { color: #fff; }
p.ql-align-right span { color: #fff !important; }
span.text-store-text-secondary,
small.text-store-text-secondary { color: #fff; }
.item-price { color: #fff !important; }

/* ===================================== */
/* Media Queries */
/* ===================================== */

/* --------- Small screens (≤991px) --------- */
@media (max-width: 991px) {
  .product-card__title a { color: #000; }

  h2.text-3xl,
  h2.leading-tight {
    font-size: 24px;
    margin: 0 auto 40px;
  }

  h2.text-3xl::before,
  h2.text-3xl::after,
  h2.leading-tight::before,
  h2.leading-tight::after {
    width: 8px;
    height: 8px;
  }

  h2.text-3xl::before,
  h2.leading-tight::before { left: -20px; }
  h2.text-3xl::after,
  h2.leading-tight::after { right: -20px; }

  .p-\[1\.4rem\] {
    background: transparent;
    border: 2px solid #fff;
    box-shadow: 1px 1px 5px 0 #fff;
  }

  .bg-store-bg-secondary .break-words .text-store-text-primary,
  .mx-2>.text-store-text-primary {
    color: #fff;
  }

  #product-2069880254 {
    background: transparent;
    box-shadow: -1px -1px 10px 0 #fff;
    border-radius: 10px;
  }

  .product-card__content-wrapper p,
  .starting-or-normal-price h2,
  h3.font-semibold {
    color: #fff;
  }

  .faq-btn .text-store-text-primary { color: #000; }
  .product-card--fit-height { background: transparent; }

  .product-card__addToCart__btn salla-button:hover button { color: #000; }

  salla-products-list .product-card--vertical.product-card--fit-height .product-card__content {
    box-shadow: 0 0 5px 0 #fff inset;
  }

  .product-card__content-wrapper .product-card__title a { color: #fff; }
  .before-price { color: #fff !important; }
}

/* --------- Large screens (≥992px) --------- */
@media (min-width: 992px) {
  nav .main-menu li.root-level>a:hover span,
  .sub-menu ul li>a:hover span,
  .main-menu .has-children li a:hover {
    color: #2196f3;
  }

  .p-\[1\.4rem\] {
    background: transparent;
    border: 2px solid #fff;
    box-shadow: 5px 5px 5px 0 #fff;
  }

  .feature-icon>p,
  .s-block--enhanced-features__item p,
  .bg-store-bg-secondary .break-words .text-store-text-primary,
  .quickview-single-info .content_product_detail .product-quickview_sub-title,
  .quickview-single-info .content_product_detail .product-quickview__price>div>h4,
  .s-rating-stars-reviews,
  .quickview-description>div,
  .s-product-options-option-label>small {
    color: #fff;
  }

  .product-card__content-wrapper .product-card__title a { color: #000; }
  .line-through { color: #000 !important; }
}