/* ==================================================
   ثيم اليوم الوطني – روائع جنيفا
================================================== */

:root {
    --national-green: #0F5A43;
    --national-green-dark: #123943;
    --national-green-light: #DDE9E2;
    --national-mint: #E3EFE8;
    --national-champagne: #D8C3A5;
    --national-ivory: #F7F5F0;
    --national-text: #103438;
    --national-text-secondary: #4E5B57;
    --national-white: #FFFFFF;
}
/* =====================================================
   اليوم الوطني 96 + إصلاح زر القائمة — نسخة كاملة
===================================================== */

/* ---------- 1) رابط اليوم الوطني — الكمبيوتر ---------- */
@media (min-width: 1024px) {
  li[data-selia="header-menu-item-desktop"][id="114830895"]
  > a[data-selia="header-menu-item-desktop-link"]
  > span {
    position: relative !important;
    display: inline-block !important;
    color: #C0392B !important;
    font-size: 20px !important;
    font-weight: 900 !important;
    line-height: 1.4 !important;
    text-shadow: 0 1px 2px rgba(192, 57, 43, 0.18) !important;
  }

  /* الخط الذهبي = العنصر الوحيد المتحرك */
  li[data-selia="header-menu-item-desktop"][id="114830895"]
  > a[data-selia="header-menu-item-desktop-link"]
  > span::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -6px;
    width: 100%;
    height: 3px;
    background: linear-gradient(
      90deg, transparent, #D8C3A5, #F3E3BD, #D8C3A5, transparent
    );
    border-radius: 999px;
    opacity: 0.55;
    transform: scaleX(0.35) translateZ(0);
    transform-origin: center;
    will-change: transform, opacity;
    backface-visibility: hidden;
    pointer-events: none;
    animation: n96Line 3.2s ease-in-out infinite;
  }

  /* النقطة الذهبية — ثابتة */
  li[data-selia="header-menu-item-desktop"][id="114830895"]
  > a[data-selia="header-menu-item-desktop-link"]
  > span::before {
    content: "";
    position: absolute;
    right: -10px;
    top: 50%;
    width: 5px;
    height: 5px;
    background: #D8C3A5;
    border-radius: 50%;
    transform: translateY(-50%);
    pointer-events: none;
  }
}

/* ---------- 2) رابط اليوم الوطني — الجوال ---------- */
@media (max-width: 1023px) {
  li[data-selia="header-menu-item"][id*="114830895"]
  > span[data-selia="header-menu-parent-label"] {
    color: #C0392B !important;
    font-size: 18px !important;
    font-weight: 900 !important;
  }
  li[data-selia="header-menu-item"][id*="114830895"]
  > span[data-selia="header-menu-parent-label"]::before,
  li[data-selia="header-menu-item"][id*="114830895"]
  > span[data-selia="header-menu-parent-label"]::after {
    content: none !important;
  }
}

/* ---------- 3) زر القائمة: ظهور فوري + مساحة ضغط ---------- */
i.sicon-menu {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 25px;
  line-height: 1;
  padding: 10px;          /* يوسّع مساحة اللمس */
  margin: -10px;          /* دون إزاحة التصميم */
  box-sizing: content-box;
}

/* هامبرغر احتياطي بـ CSS خالص — يظهر قبل تحميل الخط */
i.sicon-menu::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 20px;
  height: 2px;
  background: currentColor;
  box-shadow: 0 -6px 0 currentColor, 0 6px 0 currentColor;
  pointer-events: none;
}

/* يختفي فور جاهزية خط الأيقونات */
html.fonts-ready i.sicon-menu::after {
  display: none;
}

/* ---------- 4) الحركة ---------- */
@keyframes n96Line {
  0%, 100% { transform: scaleX(0.35) translateZ(0); opacity: 0.55; }
  50%      { transform: scaleX(1)    translateZ(0); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  li[data-selia="header-menu-item-desktop"][id="114830895"]
  > a[data-selia="header-menu-item-desktop-link"]
  > span::after {
    animation: none !important;
    transform: scaleX(1) !important;
    opacity: 0.8 !important;
    will-change: auto !important;
  }
}
/* ==================================================
   زر اشترِ الآن – ثيم اليوم الوطني
================================================== */

button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center {
    width: 100% !important;
    min-width: 100% !important;

    height: 42px !important;
    min-height: 42px !important;

    padding: 0 !important;
    margin-top: 10px !important;

    background: var(--national-green) !important;
    border: 1px solid var(--national-green) !important;
    border-radius: 4px !important;

    box-shadow:
        0 3px 10px rgba(15, 90, 67, 0.12) !important;

    color: var(--national-white) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    overflow: hidden !important;

    transition:
        background-color 0.20s ease,
        border-color 0.20s ease,
        box-shadow 0.20s ease,
        transform 0.15s ease !important;
}


/* العنصر الحامل للنص */

button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center
.s-button-text {
    width: 100% !important;
    height: 100% !important;

    padding: 0 !important;
    margin: 0 !important;

    background: transparent !important;
    color: var(--national-white) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


/* ترتيب المحتوى الداخلي */

button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center
.product-card__enhanced-mini-cart__btn--inner {
    width: 100% !important;
    height: 100% !important;

    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


/* إخفاء أيقونة الإضافة للسلة */

button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center
.enhanced-icon {
    display: none !important;
}


/* إخفاء النص الأصلي */

button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center
.enhanced-label {
    margin: 0 !important;
    padding: 0 !important;

    font-size: 0 !important;
    line-height: 0 !important;

    color: transparent !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


/* النص الجديد */

button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center
.enhanced-label::after {
    content: "اشترِ الآن";

    display: inline-block;

    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    color: var(--national-white) !important;
}


/* Hover */

button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center:hover {
    background: var(--national-green-dark) !important;
    border-color: var(--national-green-dark) !important;
    color: var(--national-white) !important;

    box-shadow:
        0 5px 14px rgba(18, 57, 67, 0.18) !important;

    transform: translateY(-1px);
}


/* Active */

button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center:active {
    background: #0E2C25 !important;
    border-color: #0E2C25 !important;

    box-shadow: none !important;

    transform: scale(0.985);
}


/* إزالة التأثيرات الافتراضية */

button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center:focus,
button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center:focus-visible {
    outline: none !important;

    box-shadow:
        0 0 0 3px rgba(216, 195, 165, 0.35) !important;
}


/* الزر في الجوال */

@media (max-width: 768px) {

    button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center {
        height: 40px !important;
        min-height: 40px !important;

        margin-top: 8px !important;
        border-radius: 3px !important;
    }

    button.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline.s-button-loader-center
    .enhanced-label::after {
        font-size: 13px !important;
    }
}