:root{--primary-color:#603da1;--primary-color2:#ff0088;--primary-color3:#770ed9;--primary-color4:#000000;--primary-color5:#000000;--primary-color6:#ff01fbc4;--primary-color7:#ffffff;--primary-color8:#9a01ff8c;--primary-color9:#ffffff45;--primary-color10:#e57e7e;--primary-color11:#000000;--primary-color12:#ff0101;--primary-color13:#9a01ff;--primary-color14:#6600ff00;--primary-color15:#3c00ff;--primary-color16:#ff0404;--primary-color17:#dd00ff;--primary-color18:#ff0000;}










/* TIP4SERV-ADDITIONAL-CSS DONT TOUCH ME */
/* =========================================================
   MonstersARK Tip4Serv Neon Theme - SAFE POLISH A8
   Full replacement CSS.

   هدف A8:
   - الحفاظ على Layout الثيم الأصلي بدون نقل أو إخفاء أقسام.
   - لا يغير Home/Ranks/Points layout.
   - لا يلمس كلمة MonstersARK في الهيدر حتى ترجع على شكل الثيم الافتراضي.
   - يثبت فقط:
     1) إخفاء Important Note المكرر فوق إذا ظهر.
     2) زر Add اللامع.
     3) زر Continue Shopping بتدرج MonstersARK.
     4) توضيح السعر داخل صفحة المنتج.
     5) تحسين بسيط لأيقونات الهيدر فقط بدون تغيير عنوان MonstersARK.
   ========================================================= */


/* ---------- A7.1 Hide duplicated top Important Note only ---------- */
.flat-title-page.home_background.home_cover .tip4serv-store-description,
.flat-title-page.home_background.home_cover .tip4serv-editable-html,
.flat-title-page.home_background.home_cover .tip4serv-home-description,
.flat-title-page.home_background.home_cover .description-bg,
.flat-title-page.home_background.home_cover .panel-container,
.flat-title-page.home_background.home_cover section.mg-b-30.description-bg,
.flat-title-page.home_background.home_cover p.tip4serv-store-description {
  display: none !important;
}


/* ---------- A7.2 Header icons visibility only
   Important:
   - No MonstersARK title styling here.
   - The title stays controlled by the original Neon theme.
   ---------- */
header.header-navbar-fixed i,
header.header-navbar-fixed svg,
#header_admin .notification.icon.cart,
#header_admin .header_avatar,
#header_admin .mobile-button {
  color: #ffffff !important;
  opacity: 1 !important;
  filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.45)) !important;
}


/* ---------- A7.3 Add-to-cart button glossy shimmer ---------- */
.addtocart_card_btn,
.addtocart_btn,
a.addtocart_card_btn,
a.addtocart_btn,
button.addtocart_card_btn,
button.addtocart_btn,
.product-detail .addtocart_btn,
.product-detail .addtocart_card_btn,
.product-details .addtocart_btn,
.product-details .addtocart_card_btn {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  border: 1px solid rgba(255, 0, 204, 0.90) !important;
  background:
    linear-gradient(135deg, #7b00ff 0%, #b000ff 38%, #ff00cc 100%) !important;
  box-shadow:
    0 0 8px rgba(255, 0, 204, 0.38),
    0 0 18px rgba(123, 0, 255, 0.26) !important;
  text-shadow: none !important;
}

/* Shimmer layer */
.addtocart_card_btn::before,
.addtocart_btn::before,
a.addtocart_card_btn::before,
a.addtocart_btn::before,
button.addtocart_card_btn::before,
button.addtocart_btn::before,
.product-detail .addtocart_btn::before,
.product-detail .addtocart_card_btn::before,
.product-details .addtocart_btn::before,
.product-details .addtocart_card_btn::before {
  content: "" !important;
  position: absolute !important;
  top: -120% !important;
  left: -65% !important;
  width: 55% !important;
  height: 340% !important;
  z-index: -1 !important;
  transform: rotate(24deg) translateX(-120%) !important;
  background:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(255, 255, 255, 0.18) 35%,
      rgba(255, 255, 255, 0.82) 50%,
      rgba(0, 217, 255, 0.26) 65%,
      transparent 100%
    ) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Hover: pink -> purple -> deep blue/cyan glossy animation */
.addtocart_card_btn:hover,
.addtocart_btn:hover,
a.addtocart_card_btn:hover,
a.addtocart_btn:hover,
button.addtocart_card_btn:hover,
button.addtocart_btn:hover,
.product-detail .addtocart_btn:hover,
.product-detail .addtocart_card_btn:hover,
.product-details .addtocart_btn:hover,
.product-details .addtocart_card_btn:hover {
  color: #ffffff !important;
  border-color: #00d9ff !important;
  background:
    linear-gradient(135deg, #ff00cc 0%, #9b00ff 34%, #1626b8 68%, #00d9ff 100%) !important;
  box-shadow:
    0 0 12px rgba(0, 217, 255, 0.66),
    0 0 24px rgba(255, 0, 204, 0.38),
    inset 0 0 12px rgba(255, 255, 255, 0.10) !important;
  transform: translateY(-2px) scale(1.03) !important;
}

.addtocart_card_btn:hover::before,
.addtocart_btn:hover::before,
a.addtocart_card_btn:hover::before,
a.addtocart_btn:hover::before,
button.addtocart_card_btn:hover::before,
button.addtocart_btn:hover::before,
.product-detail .addtocart_btn:hover::before,
.product-detail .addtocart_card_btn:hover::before,
.product-details .addtocart_btn:hover::before,
.product-details .addtocart_card_btn:hover::before {
  opacity: 1 !important;
  animation: monstersark-btn-shimmer 0.92s ease-in-out forwards !important;
}

@keyframes monstersark-btn-shimmer {
  0% {
    transform: rotate(24deg) translateX(-150%) !important;
  }
  100% {
    transform: rotate(24deg) translateX(360%) !important;
  }
}

/* Keep cart icon readable inside Add buttons */
.addtocart_card_btn i,
.addtocart_btn i,
a.addtocart_card_btn i,
a.addtocart_btn i,
button.addtocart_card_btn i,
button.addtocart_btn i,
.product-detail .addtocart_btn i,
.product-detail .addtocart_card_btn i,
.product-details .addtocart_btn i,
.product-details .addtocart_card_btn i {
  color: #ffffff !important;
  text-shadow: none !important;
  filter: drop-shadow(0 0 4px rgba(255,255,255,0.45)) !important;
}


/* ---------- A7.4 Continue Shopping button - MonstersARK gradient ---------- */
.product-detail a.sc-button.style-2.fl-button.pri-3,
.product-detail .back-home-btn,
.product-details a.sc-button.style-2.fl-button.pri-3,
.product-details .back-home-btn,
a.sc-button.style-2.fl-button.pri-3[href*="/category"],
a.sc-button.style-2.fl-button.pri-3[href*="category"] {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  color: #ffffff !important;
  opacity: 1 !important;
  font-weight: 900 !important;
  text-shadow: none !important;
  border: 1px solid rgba(255, 0, 204, 0.95) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, #7b00ff 0%, #b000ff 34%, #ff00cc 68%, #00d9ff 100%) !important;
  box-shadow:
    0 0 10px rgba(255, 0, 204, 0.46),
    0 0 22px rgba(0, 217, 255, 0.20),
    inset 0 0 12px rgba(255, 255, 255, 0.08) !important;
}

.product-detail a.sc-button.style-2.fl-button.pri-3 *,
.product-detail .back-home-btn *,
.product-details a.sc-button.style-2.fl-button.pri-3 *,
.product-details .back-home-btn *,
a.sc-button.style-2.fl-button.pri-3[href*="/category"] *,
a.sc-button.style-2.fl-button.pri-3[href*="category"] * {
  color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

/* Continue Shopping shimmer */
.product-detail a.sc-button.style-2.fl-button.pri-3::before,
.product-detail .back-home-btn::before,
.product-details a.sc-button.style-2.fl-button.pri-3::before,
.product-details .back-home-btn::before,
a.sc-button.style-2.fl-button.pri-3[href*="/category"]::before,
a.sc-button.style-2.fl-button.pri-3[href*="category"]::before {
  content: "" !important;
  position: absolute !important;
  top: -130% !important;
  left: -55% !important;
  width: 50% !important;
  height: 360% !important;
  z-index: -1 !important;
  transform: rotate(24deg) translateX(-130%) !important;
  background:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(255, 255, 255, 0.18) 35%,
      rgba(255, 255, 255, 0.82) 50%,
      rgba(0, 217, 255, 0.26) 65%,
      transparent 100%
    ) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.product-detail a.sc-button.style-2.fl-button.pri-3:hover,
.product-detail .back-home-btn:hover,
.product-details a.sc-button.style-2.fl-button.pri-3:hover,
.product-details .back-home-btn:hover,
a.sc-button.style-2.fl-button.pri-3[href*="/category"]:hover,
a.sc-button.style-2.fl-button.pri-3[href*="category"]:hover {
  color: #ffffff !important;
  border-color: #00d9ff !important;
  background:
    linear-gradient(135deg, #ff00cc 0%, #9b00ff 34%, #1626b8 68%, #00d9ff 100%) !important;
  box-shadow:
    0 0 12px rgba(0, 217, 255, 0.66),
    0 0 24px rgba(255, 0, 204, 0.38),
    inset 0 0 12px rgba(255, 255, 255, 0.10) !important;
}

.product-detail a.sc-button.style-2.fl-button.pri-3:hover::before,
.product-detail .back-home-btn:hover::before,
.product-details a.sc-button.style-2.fl-button.pri-3:hover::before,
.product-details .back-home-btn:hover::before,
a.sc-button.style-2.fl-button.pri-3[href*="/category"]:hover::before,
a.sc-button.style-2.fl-button.pri-3[href*="category"]:hover::before {
  opacity: 1 !important;
  animation: monstersark-btn-shimmer 0.92s ease-in-out forwards !important;
}


/* ---------- A7.5 Product page price readability ----------
   Make the price inside product page match the clearer neon-white style
   visible in product cards.
   ---------- */
.product-detail .price,
.product-detail .price *,
.product-detail .price_format,
.product-detail .price_format *,
.product-detail .new_price,
.product-detail .new_price *,
.product-detail h5.price,
.product-detail h5.price *,
.product-detail [class*="price"],
.product-detail [class*="price"] *,
.product-details .price,
.product-details .price *,
.product-details .price_format,
.product-details .price_format *,
.product-details .new_price,
.product-details .new_price *,
.product-details h5.price,
.product-details h5.price *,
.product-details [class*="price"],
.product-details [class*="price"] *,
.product-infor .price,
.product-infor .price *,
.product-infor .price_format,
.product-infor .price_format *,
.product-infor [class*="price"],
.product-infor [class*="price"] *,
.product-info .price,
.product-info .price *,
.product-info .price_format,
.product-info .price_format *,
.product-info [class*="price"],
.product-info [class*="price"] *,
.product-content .price,
.product-content .price *,
.product-content .price_format,
.product-content .price_format *,
.product-content [class*="price"],
.product-content [class*="price"] *,
.tf-product-detail .price,
.tf-product-detail .price *,
.tf-product-detail .price_format,
.tf-product-detail .price_format *,
.tf-product-detail [class*="price"],
.tf-product-detail [class*="price"] *,
.sc-product-detail .price,
.sc-product-detail .price *,
.sc-product-detail .price_format,
.sc-product-detail .price_format *,
.sc-product-detail [class*="price"],
.sc-product-detail [class*="price"] * {
  color: #ffffff !important;
  opacity: 1 !important;
  font-weight: 900 !important;
  text-shadow:
    0 0 4px rgba(255, 255, 255, 0.52),
    0 0 8px rgba(255, 0, 204, 0.52),
    0 0 14px rgba(255, 0, 204, 0.28) !important;
}

/* Product cards price stays clear too */
.sc-card-product .price,
.sc-card-product .price *,
.sc-card-product .price_format,
.sc-card-product .price_format *,
.sc-card-product .new_price,
.sc-card-product .new_price *,
.sc-card-product h5.price,
.sc-card-product h5.price *,
.sc-card-product [class*="price"],
.sc-card-product [class*="price"] * {
  color: #ffffff !important;
  opacity: 1 !important;
  font-weight: 900 !important;
  text-shadow:
    0 0 4px rgba(255, 255, 255, 0.50),
    0 0 8px rgba(255, 0, 204, 0.46) !important;
}


/* ---------- A7.6 Mobile safety: no layout changes ---------- */
@media (max-width: 767px) {
  .addtocart_card_btn:hover,
  .addtocart_btn:hover,
  a.addtocart_card_btn:hover,
  a.addtocart_btn:hover,
  button.addtocart_card_btn:hover,
  button.addtocart_btn:hover,
  .product-detail .addtocart_btn:hover,
  .product-detail .addtocart_card_btn:hover,
  .product-details .addtocart_btn:hover,
  .product-details .addtocart_card_btn:hover {
    transform: none !important;
  }
}


/* =========================================================
   A8 Extra: Category / Ranks product listing price fix
   Purpose:
   - Some Tip4Serv listing pages use price wrappers outside product-detail.
   - This targets visible product listing prices without changing layout.
   ========================================================= */

.category-products .price,
.category-products .price *,
.products-list .price,
.products-list .price *,
.product-list .price,
.product-list .price *,
.products .price,
.products .price *,
.products-grid .price,
.products-grid .price *,
.shop-products .price,
.shop-products .price *,
.store-products .price,
.store-products .price *,
.sc-card-product .price,
.sc-card-product .price *,
.sc-card-product .price_format,
.sc-card-product .price_format *,
.sc-card-product .new_price,
.sc-card-product .new_price *,
.sc-card-product [class*="price"],
.sc-card-product [class*="price"] *,
.card-product .price,
.card-product .price *,
.card-product .price_format,
.card-product .price_format *,
.card-product .new_price,
.card-product .new_price *,
.card-product [class*="price"],
.card-product [class*="price"] *,
[class*="product"] .price_format,
[class*="product"] .price_format *,
[class*="product"] .new_price,
[class*="product"] .new_price * {
  color: #ffffff !important;
  opacity: 1 !important;
  font-weight: 900 !important;
  text-shadow:
    0 0 4px rgba(255, 255, 255, 0.58),
    0 0 8px rgba(255, 0, 204, 0.54),
    0 0 14px rgba(255, 0, 204, 0.26) !important;
}

/* Arabic/RTL price spans sometimes render as generic text in the card body */
.sc-card-product h5,
.sc-card-product h5 *,
.sc-card-product .card-price,
.sc-card-product .card-price *,
.card-product h5,
.card-product h5 *,
.card-product .card-price,
.card-product .card-price * {
  opacity: 1 !important;
}

/* Avoid changing product names while still catching price rows */
.sc-card-product h5:not(.card-title):not([class*="title"]),
.card-product h5:not(.card-title):not([class*="title"]) {
  color: #ffffff !important;
  font-weight: 900 !important;
  text-shadow:
    0 0 4px rgba(255, 255, 255, 0.52),
    0 0 8px rgba(255, 0, 204, 0.46) !important;
}

/* TIP4SERV-ADDITIONAL-CSS DONT TOUCH ME */