:root {
  --tb-primary: #F5B51D;
  --tb-dark: #0F0F10;
  --tb-border: #ECECEC;
  --tb-black: #111111;
  --tb-white: #ffffff;
}

/* =========================================================
1. HEADER
   البحث + القسم/الصفحة النشطة فقط
   ========================================================= */

/* تأثير البحث */
.ab-icon-btn.search-active,
.ab-icon-btn.search-active svg,
.search-btn.active-search,
.search-btn.active-search svg {
  color: #F5B51D !important;
}

.ab-icon-btn.search-active::before {
  opacity: .18 !important;
  transform: scale(1) !important;
}

.search-btn {
  transition: color .25s ease;
}

.search-btn:hover {
  color: #F5B51D !important;
}

/* العنصر النشط في صفحات/أقسام الهيدر */
.ab-nav a.tb-active,
.ab-dropdown-trigger.tb-active,
.ab-header-category a.tb-active {
  color: #F5B51D !important;
  font-weight: 700;
}

.ab-nav a.tb-active::after,
.ab-dropdown-trigger.tb-active::after,
.ab-header-category a.tb-active::after {
  width: 100% !important;
  opacity: 1 !important;
}

.ab-header-category a.tb-active::after {
  width: 70% !important;
}
/* ==================================================
   TrendBridge Header Scroll - Glass / Transparent
   ================================================== */

.ab-header {
    transition:
        background .35s ease,
        backdrop-filter .35s ease,
        -webkit-backdrop-filter .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;

    will-change: background, backdrop-filter;
}

/* عند النزول بالصفحة */
.ab-header.tb-scrolled {
    background: rgba(17, 17, 17, .72) !important;

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);

    border-bottom: 1px solid rgba(255, 255, 255, .08);

    box-shadow:
        0 8px 35px rgba(0, 0, 0, .18);
}
/* =========================================================
إلغاء تأثيرات السلة في الهيدر
========================================================= */

/* السلة لا تأخذ Hover الخاص بأيقونات الهيدر */
.ab-icon-btn.cart-btn:hover,
.cart-btn:hover {
  transform: none !important;
  background: transparent !important;
  color: inherit !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* منع دوران/تكبير أيقونة السلة */
.cart-btn:hover .tb-cart-icon {
  transform: none !important;
  color: inherit !important;
}

/* إلغاء نبضة عداد السلة */
.ab-cart-count {
  animation: none !important;
  box-shadow: none !important;
}

/* منع تأثير التكبير على عداد السلة */
.ab-icon-btn:hover .ab-cart-count,
.cart-btn:hover .ab-cart-count {
  transform: none !important;
}

/* =========================================================
2. HOME PRODUCT CARDS
العنوان + السعر + نبضة الخصم فقط
========================================================= */

/* عنوان المنتج */
.ab-pgrid-card:hover .ab-pgrid-name,
.ab-plist-card:hover .ab-plist-name,
.ab-related-card:hover .ab-related-name,
.ab-featured-card:hover .ab-featured-name,
.ab-product-card:hover .product-title,
.ab-product-item:hover .product-title,
.product-card:hover .product-title,
.product-item:hover .product-title,
.product-box:hover .product-title {
  color: #F5B51D !important;
  transition: color .25s ease;
}

/* السعر */
.ab-pgrid-card:hover .ab-pgrid-price,
.ab-plist-card:hover .ab-plist-price,
.ab-related-card:hover .ab-related-price,
.ab-featured-card:hover .ab-featured-price,
.ab-product-card:hover .product-price,
.ab-product-item:hover .product-price,
.product-card:hover .product-price,
.product-item:hover .product-price,
.product-box:hover .product-price {
  transform: scale(1.05);
  transition: transform .25s ease;
}

/* نبضة الخصم فقط */
.ab-pgrid-card .ab-sale-badge,
.ab-pgrid-card .ab-pgrid-badge,
.ab-plist-card .ab-sale-badge,
.ab-plist-card .ab-plist-badge,
.ab-related-card .ab-sale-badge,
.ab-featured-card .ab-sale-badge,
.ab-product-card .ab-sale-badge,
.product-card .ab-sale-badge {
  animation: tbSalePulse 2.5s ease-in-out infinite;
}

@keyframes tbSalePulse {
  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.08);
  }
}

/* =========================================================
3. PRODUCT PAGE
العنوان + الخصم + إضافة للسلة + الشراء فقط
========================================================= */

/* عنوان المنتج */
.ab-product-title,
.ab-pd-name {
  transition: color .25s ease;
}

.ab-pd-name:hover,
.ab-product-title:hover {
  color: #F5B51D !important;
}

/* الخصم */
.ab-product-discount,
.ab-pd-discount,
.ab-pd-discount-badge {
  animation: tbProductDiscountPulse 2.5s ease-in-out infinite;
}

@keyframes tbProductDiscountPulse {
  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.06);
  }
}

/* =========================================================
إضافة للسلة
========================================================= */

.add_to_cart_btn {
  height: 60px !important;
  border: 2px solid #111 !important;
  border-radius: 18px !important;
  background: #fff !important;
  color: #111 !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  position: relative;
  overflow: hidden;
  transition:
    background-color .35s ease,
    color .35s ease,
    transform .25s ease,
    box-shadow .35s ease;
  box-shadow: 0 10px 25px rgba(0, 0, 0, .06);
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.add_to_cart_btn::after {
  content: "🛒";
  font-size: 18px;
  transition: transform .35s ease;
}

.add_to_cart_btn:hover {
  background: #111 !important;
  color: #fff !important;
  transform: translateY(-3px);
  box-shadow: 0 18px 35px rgba(0, 0, 0, .18);
}

.add_to_cart_btn:hover::after {
  transform: rotate(-12deg) scale(1.15);
}

.add_to_cart_btn:active {
  transform: scale(.97);
}

@media (max-width: 768px) {
  .add_to_cart_btn {
    height: 56px !important;
    font-size: 17px !important;
    border-radius: 16px !important;
  }
}

/* =========================================================
الشراء
========================================================= */

.checkout_btn {
  width: 100% !important;
  height: 62px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: none !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, #111111, #2C2C2C) !important;
  color: #fff !important;
  font-size: 19px !important;
  font-weight: 900 !important;
  letter-spacing: .3px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition:
    background-color .35s ease,
    color .35s ease,
    transform .25s ease,
    box-shadow .35s ease;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .18);
}

.checkout_btn:hover {
  background: #F5B51D !important;
  color: #111 !important;
  transform: translateY(-4px);
  box-shadow: 0 28px 55px rgba(0, 0, 0, .25);
}

.checkout_btn:active {
  transform: scale(.97);
}

@media (max-width: 768px) {
  .checkout_btn {
    height: 58px !important;
    font-size: 18px !important;
    border-radius: 16px !important;
  }
}

/* =========================================================
لا يوجد إلغاء لتأثيرات الهاتف
========================================================= */

/*
   تم حذف جزء:
   @media (hover: none), (pointer: coarse)

   حتى لا يتم تعطيل تأثيرات:
   - عنوان المنتج
   - سعر المنتج
   - نبضة الخصم

   على الهاتف.
*/

/* =========================================================
تقليل الحركة عند تفعيل إعداد النظام
========================================================= */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
/* =========================================================
   TrendBridge - Mobile Product Card Typography
   ========================================================= */

@media (max-width: 768px) {

    /* Product Title */
    .ab-pgrid-name,
    .ab-plist-name,
    .ab-related-name,
    .ab-featured-name,
    .ab-product-card .product-title,
    .ab-product-item .product-title,
    .product-card .product-title,
    .product-item .product-title,
    .product-box .product-title {
        font-size: 14px !important;
        line-height: 1.4 !important;
        font-weight: 600 !important;
    }

    /* Product Price */
    .ab-pgrid-price,
    .ab-plist-price,
    .ab-related-price,
    .ab-featured-price,
    .ab-product-card .product-price,
    .ab-product-item .product-price,
    .product-card .product-price,
    .product-item .product-price,
    .product-box .product-price {
        font-size: 16px !important;
        line-height: 1.3 !important;
    }

}
/* =========================================================
   TrendBridge — Product Accordion
   Description + Customer Reviews
   Premium Centered Style
   ========================================================= */


/* =========================================================
   الزرين معًا
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-trigger {
    position: relative;

    width: 100%;
    min-height: 54px;

    display: block;

    padding: 14px 55px;

    background: #ffffff;
    color: var(--tb-black, #111111);

    border: 1px solid #e5e5e5;
    border-radius: 10px;

    font-family: "Jost", sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;

    text-align: center;
    direction: rtl;

    cursor: pointer;

    box-sizing: border-box;

    overflow: hidden;

    -webkit-appearance: none;
    appearance: none;

    transition:
        background-color 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.25s ease;
}


/* =========================================================
   الخط الذهبي الجانبي
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-trigger::before {
    content: "";

    position: absolute;

    top: 0;
    right: 0;

    width: 3px;
    height: 100%;

    background: var(--tb-primary, #F5B51D);

    transform: scaleY(0);

    transform-origin: center;

    transition: transform 0.3s ease;
}


/* =========================================================
   عناوين الزرين
   الوصف + آراء العملاء
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-title {
    position: absolute;

    top: 50%;
    left: 50%;

    display: block;

    width: max-content;

    max-width: calc(100% - 110px);

    margin: 0;
    padding: 0;

    color: inherit;

    font-family: "Jost", sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;

    text-align: center;
    direction: rtl;

    transform: translate(-50%, -50%);

    cursor: pointer;

    white-space: nowrap;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


/* =========================================================
   أيقونة + / -
   ثابتة في اليمين
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-toggle {
    position: absolute;

    top: 50%;
    right: 18px;

    width: 21px;
    height: 21px;

    display: block;

    margin: 0;

    color: var(--tb-primary, #F5B51D);

    transform: translateY(-50%);

    transition:
        transform 0.35s ease,
        color 0.3s ease;
}


/* =========================================================
   الخط الرأسي داخل +
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-toggle
.vertical {
    transition:
        opacity 0.25s ease,
        transform 0.3s ease;
}


/* =========================================================
   Hover
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-trigger:hover {
    background: #fafafa;

    border-color: var(--tb-primary, #F5B51D);

    color: var(--tb-black, #111111);

    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.08);

    transform: translateY(-1px);
}


.lq-desc-accordion-item
.lq-desc-accordion-trigger:hover::before {
    transform: scaleY(1);
}


.lq-desc-accordion-item
.lq-desc-accordion-trigger:hover
.lq-desc-accordion-toggle {
    color: var(--tb-primary, #F5B51D);

    transform:
        translateY(-50%)
        scale(1.08);
}


/* =========================================================
   الحالة المفتوحة
   الوصف + آراء العملاء
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-trigger[aria-expanded="true"] {
    background: var(--tb-black, #111111);

    color: #ffffff;

    border-color: var(--tb-black, #111111);

    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.16);

    transform: none;
}


/* =========================================================
   الخط الذهبي عند الفتح
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-trigger[aria-expanded="true"]::before {
    transform: scaleY(1);
}


/* =========================================================
   + تصبح -
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-trigger[aria-expanded="true"]
.lq-desc-accordion-toggle {
    color: var(--tb-primary, #F5B51D);

    transform:
        translateY(-50%)
        rotate(180deg);
}


/* إخفاء الخط الرأسي */

.lq-desc-accordion-item
.lq-desc-accordion-trigger[aria-expanded="true"]
.lq-desc-accordion-toggle
.vertical {
    opacity: 0;
}


/* =========================================================
   Hover أثناء الفتح
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-trigger[aria-expanded="true"]:hover {
    background: #171717;

    border-color: var(--tb-primary, #F5B51D);

    box-shadow:
        0 10px 28px rgba(0, 0, 0, 0.20);
}


/* =========================================================
   عند الضغط
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-trigger:active {
    transform: scale(0.99);

    box-shadow:
        0 3px 10px rgba(0, 0, 0, 0.10);
}


/* =========================================================
   Focus
   ========================================================= */

.lq-desc-accordion-item
.lq-desc-accordion-trigger:focus {
    outline: none;
}


.lq-desc-accordion-item
.lq-desc-accordion-trigger:focus-visible {
    outline: 2px solid var(--tb-primary, #F5B51D);

    outline-offset: 3px;
}


/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 768px) {

    .lq-desc-accordion-item
    .lq-desc-accordion-trigger {
        min-height: 48px;

        padding: 12px 45px;

        border-radius: 8px;

        font-size: 14px;
    }


    .lq-desc-accordion-item
    .lq-desc-accordion-title {
        font-size: 14px;

        max-width: calc(100% - 90px);
    }


    .lq-desc-accordion-item
    .lq-desc-accordion-toggle {
        top: 50%;
        right: 14px;

        width: 19px;
        height: 19px;
    }
}


/* =========================================================
   Small Mobile
   ========================================================= */

@media (max-width: 480px) {

    .lq-desc-accordion-item
    .lq-desc-accordion-trigger {
        min-height: 45px;

        padding: 10px 40px;

        border-radius: 7px;
    }


    .lq-desc-accordion-item
    .lq-desc-accordion-title {
        font-size: 13px;

        max-width: calc(100% - 80px);
    }


    .lq-desc-accordion-item
    .lq-desc-accordion-toggle {
        top: 50%;
        right: 12px;

        width: 18px;
        height: 18px;
    }
}