/* ============================================================
   SAVAGE REDESIGN — ظ…ظ„ظپ CSS ظ…ط®طµطµ ظ„ط«ظٹظ… ab-theme (EasyOrders)
   ط§ظ„ظ‡ظˆظٹط©: ط¯ط§ظƒظ† ظپط§ط­ظ… + ظˆط±ط¯ظٹ #E11D48 (ظ…ط³طھط®ط±ط¬ ظ…ظ† طھطµظ…ظٹظ… Visily)
   ط§ظ„ط±ظپط¹: seller.easy-orders.net/#/upload-assets ط«ظ… header-code
   ============================================================ */

/* ======= 1. ظ„ظˆط­ط© ط§ظ„ط£ظ„ظˆط§ظ† ط§ظ„ط£ط³ط§ط³ظٹط© (طھط¬ط§ظˆط² ط¥ط¹ط¯ط§ط¯ط§طھ ط§ظ„ظ…طھط¬ط±) ======= */
:root {
  --color-primary: 236, 0, 140;           /* وردي سافاج CTA #EC008C */
  --color-a11y: 255, 255, 255;

  --body-bg: #000000;
  --body-text: #FFFFFF;

  --hd-bg: #000000;
  --hd-text: #FFFFFF;

  --ann-bg: #000000;
  --ann-text: #FFFFFF;

  --ft-bg: #000000;
  --ft-text: #FFFFFF;

  --buy-btn-bg: #EC008C;
  --buy-btn-text: #FFFFFF;
  --buy-btn-border: #EC008C;

  --crt-btn-bg: #EC008C;
  --crt-btn-text: #FFFFFF;
  --crt-btn-border: #EC008C;

  --product-name-text: #000000;
  --product-price-text: #000000;
  --product-sale-price-text: #EC008C;

  --input-bg: #000000;
  --input-text: #FFFFFF;
  --input-border: #333333;

  --checkout-form-bg: #000000;
  --checkout-heading-text: #FFFFFF;
}

/* ======= 1b. لوحة ألوان Unity للثيم =======
   الخلفية: سوداء تمامًا — الكتابة: بيضاء —
   كروت المنتجات: خلفية بيضاء + كتابة سوداء —
   الأزرار: #EC008C — حواف حادة — بدون حدود */
:root {
  --sav-primary: #EC008C;
  --sav-primary-dark: #C50073;
  --sav-black: #000000;
  --sav-white: #FFFFFF;
  --sav-card-bg: #FFFFFF;
  --sav-card-text: #000000;
  --sav-muted: #8a8a9a;
  --sav-border: #222222;
  --sav-line: #e5e5e5;
}

/* ======= 2. ظ…طھط؛ظٹط±ط§طھ ط§ظ„ط«ظٹظ… (ط£ط¨ط¹ط§ط¯ ط§ظ„ط´ط¹ط§ط± ظˆط§ظ„ط´ط§ط±ط§طھ ظˆط§ظ„ط£ط­ط¬ط§ظ…) ======= */
:root {
  --product-badge-bg: #EC008C;
  --product-badge-text: #ffffff;
  --logo-height-desktop: 90px;
  --logo-height-mobile: 100px;
  --home-logo-filter: brightness(0) invert(1);
  --header-height-desktop: 96px;
  --header-height-mobile: 60px;
  --ann-height: 35px;
  --price-size-mobile: 14px;
  --name-product-size-mobile: 14px;
  --pgrid-media-aspect-ratio: auto;
  --pgrid-media-object-fit: cover;
  --plist-media-aspect-ratio: auto;
  --plist-media-object-fit: cover;
  --featured-media-aspect-ratio: 4 / 5;
  --featured-media-object-fit: cover;
  --featured-hero-img-object-fit: cover;
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--body-bg);
  color: var(--body-text);
}

::selection {
  background: #EC008C;
  color: #ffffff;
}

/* ======= 3. ظ„ظ„ط´ط±ظٹط· ط§ظ„ط¥ط¹ظ„ط§ظ†ظٹ (Announcement Bar) ======= */
.ab-announce {
  background: var(--ann-bg) !important;
  border-bottom: none;
}
.ab-ann-slide {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ann-text);
  font-weight: 600;
}

/* ======= 4. ط§ظ„ظ‡ظٹط¯ط± ======= */
.ab-header {
  background: var(--hd-bg) !important;
  border-bottom: none;
}
.ab-header-inner {
  max-width: 1320px;
  margin: 0 auto;
}
.ab-logo img {
  filter: var(--home-logo-filter, brightness(0) invert(1));
}
.ab-hamburger,
.ab-icon-btn,
.search-btn,
.cart-btn {
  color: var(--hd-text) !important;
}
.ab-cart-count {
  background: #EC008C !important;
  color: #ffffff !important;
  border-color: #EC008C !important;
}
.ab-nav a {
  color: var(--hd-text);
  font-weight: 600;
}
.ab-nav a:hover {
  color: #EC008C;
}

/* ======= 5. ط§ظ„ط£ط²ط±ط§ط± (ط¥ط¶ط§ظپط© ط³ط±ظٹط¹ط© / ط´ط±ط§ط، / ط¹ط±ط¶ ط§ظ„ظƒظ„) ======= */
.ab-pgrid-add-btn,
.ab-plist-add-btn,
.ab-featured-add-btn,
.ab-fixed-buy-btn {
  background: #EC008C !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 0;
  font-weight: 700;
  transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.ab-pgrid-add-btn:hover,
.ab-plist-add-btn:hover,
.ab-featured-add-btn:hover,
.ab-fixed-buy-btn:hover {
  background: #C50073 !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(236, 0, 140, 0.35);
}
.ab-pgrid-viewall-btn,
.ab-plist-viewall-btn {
  color: #EC008C !important;
  border: 1px solid #EC008C !important;
  border-radius: 0;
  background: transparent !important;
  transition: background 0.15s ease, color 0.15s ease;
}
.ab-pgrid-viewall-btn:hover,
.ab-plist-viewall-btn:hover {
  background: #EC008C !important;
  color: #ffffff !important;
}
.ab-featured-hero-cta {
  background: #EC008C !important;
  color: #ffffff !important;
  border-radius: 0;
  font-weight: 700;
}
.ab-featured-hero-cta:hover {
  background: #C50073 !important;
}

/* ======= 6. ط¨ط·ط§ظ‚ط§طھ ط§ظ„ظ…ظ†طھط¬ط§طھ (ط´ط¨ظƒط© / ظ‚ط§ط¦ظ…ط© / ظ…ظ…ظٹط²ط©) =======
   الخلفية: بيضاء — الكتابة: سوداء — حواف حادة — بلا حدود */
.ab-pgrid-card,
.ab-plist-card,
.ab-featured-card {
  background: #FFFFFF !important;
  color: #000000 !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ab-pgrid-card:hover,
.ab-plist-card:hover,
.ab-featured-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.45);
}
.ab-pgrid-name,
.ab-plist-name,
.ab-featured-name {
  color: #000000 !important;
  font-weight: 400;
}
.ab-pgrid-name a,
.ab-plist-name a,
.ab-featured-name a {
  color: #000000 !important;
}
.ab-pgrid-name a:hover,
.ab-plist-name a:hover,
.ab-featured-name a:hover {
  color: #EC008C !important;
}
.ab-pgrid-price-row,
.ab-plist-price-row,
.ab-featured-price-row {
  align-items: baseline;
}

/* ط§ظ„ط³ط¹ط± ط§ظ„ط­ط§ظ„ظٹ: ط£ط³ظˆط¯ ط³ظ…ظٹظƒ — ط§ظ„ط³ط¹ط± ط§ظ„ظ‚ط¯ظٹظ…: ط±ظ…ط§ط¯ظٹ ظ…ط´ط·ظˆط¨ — ط³ط¹ط± ط§ظ„ط¹ط±ط¶: ظˆط±ط¯ظٹ */
.ab-price-old {
  color: #EC008C;
  text-decoration: line-through;
}
.ab-price-sale,
.ab-pgrid-price,
.ab-plist-price,
.ab-featured-price {
  color: #000000 !important;
  font-weight: 400;
}
.ab-price-sale {
  color: #EC008C !important;
}

/* ======= 7. ط´ط§ط±ط§طھ ط§ظ„ط¹ط±ظˆط¶ ظˆط§ظ„ط®طµظ… ======= */
.ab-sale-badge,
.ab-pgrid-badge,
.ab-plist-badge,
.ab-featured-badge {
  background: #EC008C !important;
  color: #ffffff !important;
  border-radius: 0;
  font-weight: 700;
}
.ab-pgrid-badge--custom,
.ab-plist-badge--custom,
.ab-featured-badge--custom {
  background: #C50073 !important;
  border-radius: 0;
}
.ab-out-of-stock-badge {
  background: #000000 !important;
  color: #8a8a9a !important;
  border: none;
  border-radius: 0;
}

/* ط§ظ„ط²ط± ط§ظ„ط¹ط§ط¦ظ… "ط§ط·ظ„ط¨ ط§ظ„ط¢ظ†" ظˆطµظپط­ط© ط§ظ„ظ…ظ†طھط¬ */
.ab-fixed-buy-btn {
  background: #EC008C !important;
  color: #ffffff !important;
  border-radius: 0 !important;
}
.ab-fixed-buy-btn:hover {
  background: #C50073 !important;
}
.ab-fixed-buy-price,
.ab-fixed-buy-price-row {
  color: #ffffff;
}
.ab-fixed-buy-price-old {
  color: #8a8a9a;
  text-decoration: line-through;
}
.ab-fixed-buy-price-sale {
  color: #EC008C;
}

/* ======= 8. ط¹ظ†ط§ظˆظٹظ† ط§ظ„ط£ظ‚ط³ط§ظ… ======= */
.ab-pgrid-title,
.ab-plist-title,
.ab-featured-hero-title,
.ab-categories-title {
  color: #ffffff;
  font-weight: 800;
}
.ab-featured-hero-eyebrow {
  background: #EC008C;
  color: #ffffff;
  border-radius: 0;
  font-weight: 700;
  padding: 4px 12px;
}

/* ======= 9. ط§ظ„ط³ظ„ط§ظٹط¯ط± (Hero) ======= */
.ab-slider .ab-slider-slide img {
  object-fit: cover;
}
.ab-slider-controls .ab-slider-progress-bar {
  background: #EC008C;
}

/* ======= 10. ط¨ط·ط§ظ‚ط§طھ ط§ظ„ظپط¦ط§طھ ======= */
.ab-cat-card {
  background: #FFFFFF !important;
  color: #000000 !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ab-cat-card:hover {
  transform: translateY(-3px);
}
.ab-cat-label {
  color: #000000 !important;
  font-weight: 700;
}

/* ======= 11. ط§ظ„ظپظˆطھط± ظˆط§ظ„ظ†ط´ط±ط© ط§ظ„ط¨ط±ظٹط¯ظٹط© ======= */
.ab-footer {
  background: var(--ft-bg) !important;
  border-top: none;
}
.ab-footer-heading {
  color: #ffffff;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.ab-footer-links a,
.ab-footer-contact,
.ab-footer-contact-item {
  color: #B0B0B0;
}
.ab-footer-links a:hover {
  color: #EC008C;
}
.ab-footer-subscribe-btn {
  background: #EC008C !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: 700;
}
.ab-footer-subscribe-btn:hover {
  background: #C50073 !important;
}
.ab-footer-input-wrapper input,
.ab-footer-input-wrapper input[type="email"] {
  background: #000000 !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 10px 16px;
}
.ab-footer-input-wrapper input::placeholder {
  color: #8a8a9a;
}
.ab-footer-copy,
.ab-footer-powered {
  color: #6a6a7a;
}
.ab-footer-bottom {
  border-top: none;
}

/* ======= 12. إزالة الفوالق/الحدود البيضاء حول الأقسام =======
   المنصة (EasyOrders) تفرض body#fff وتلف كل قسم بـ .home_section_container
   ببادينغ وحواف دائرية = خلفية بيضاء تظهر حول الأقسام الداكنة. */
html,
body,
#__next,
body > #__next,
.app_container {
  background-color: var(--body-bg) !important;
}

.home_section_container {
  padding: 0 !important;
  margin-block: 0 !important;
  border-radius: 0 !important;
  background: var(--body-bg) !important;
}

.home_section_container .content_container,
.content_container {
  background: var(--body-bg) !important;
}

/* ======= 13. شبكة المنتجات: 4 في الصف (دسكتوب) — 2 في الصف (موبايل) =======
   يعيد تخطيط الكروت كشبكة عادية بدلًا من الكاروسيل الأفقي،
   مع إبقاء الكروت بيضاء/نص أسود وحواف حادة بلا حدود. */
.ab-pgrid-wrap {
  display: grid;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 18px !important;
}

/* قائمة plist: تحويلها من كاروسيل أفقي إلى شبكة حقيقية */
.ab-plist-track {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 18px !important;
  overflow: visible !important;
  padding-bottom: 0 !important;
  width: 100% !important;
}

.ab-plist.ab-plist--related .ab-plist-track {
  grid-template-columns: repeat(4, 1fr) !important;
}

.ab-plist-card {
  flex: none !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
}

.ab-pgrid-card,
.ab-plist-card,
.ab-featured-card {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
}

/* موبايل: منتجان في كل صف (2 تحت 2) */
@media (max-width: 820px) {
  .ab-pgrid-wrap,
  .ab-plist-track,
  .ab-plist.ab-plist--related .ab-plist-track {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  .ab-plist-card {
    flex: none !important;
    min-width: 0 !important;
    width: 100% !important;
  }
}

/* بلا حدود أفقية بين الكروت */
.ab-pgrid-card div,
.ab-plist-card div,
.ab-featured-card div {
  border-radius: 0;
}

/* ======= 13b. كرت منتج مضغوط يتسع لمحتواه مهما كان طوله =======
   الكارت أصغر ما يمكن: لا تمديد ولا تثبيت للصف (align start) —
   كل كارت يأخذ ارتفاع محتواه تمامًا (صورة مربعة + نصوص) وينمو
   تلقائيًا إذا كان نصه/سواتشه أكبر. */
body .ab-pgrid-card,
body .ab-plist-card,
body .ab-featured-card {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
}
/* لا تمديد: كل كارت بارتفاع محتواه فقط */
body .ab-pgrid-wrap,
body .ab-plist-track,
body .ab-plist.ab-plist--related .ab-plist-track {
  align-items: start !important;
}
/* 1) الصورة: ثابتة (مربع 1:1) لا تتمدد — وتوضع كل زيادة طول في النص */
body .ab-pgrid-card .ab-pgrid-media,
body .ab-plist-card .ab-plist-media,
body .ab-featured-card .ab-featured-media {
  flex: 0 0 auto !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  background: #f0f0ef !important;
  overflow: hidden !important;
}
body .ab-pgrid-card .ab-pgrid-media img,
body .ab-plist-card .ab-plist-media img,
body .ab-featured-card .ab-featured-media img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center !important;
}
body .ab-pgrid-card .ab-pgrid-img-hover {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
/* 2) منطقة النص: ثابتة في أسفل الكارت */
body .ab-pgrid-card .ab-pgrid-info,
body .ab-plist-card .ab-plist-info,
body .ab-featured-card .ab-featured-info {
  flex: 0 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  padding: 10px 12px 12px !important;
  gap: 6px !important;
}
body .ab-pgrid-card .ab-pgrid-name,
body .ab-plist-card .ab-plist-name,
body .ab-featured-card .ab-featured-name {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 2.4em !important;
  max-height: 2.4em !important;
  line-height: 1.2 !important;
  font-size: 15px !important;
  margin: 0 !important;
  word-break: break-word;
}
/* 3) تقييماتي الفارغ: لا يترك فراغًا */
body .ab-pgrid-card .ab-pgrid-info .ab-plist-rating-slot:empty,
body .ab-plist-card .ab-plist-info .ab-plist-rating-slot:empty {
  display: none !important;
}
/* صف السعر: حجم مضغوط بسطر واحد في الوضع العادي — وإن ضاق الكرت/الهاتف
   يكسر السعر الحالي والسعر قبل الخصم إلى سطرين دون خروج من الشاشة */
body .ab-pgrid-card .ab-pgrid-price-row,
body .ab-plist-card .ab-plist-price-row,
body .ab-featured-card .ab-featured-price-row {
  display: flex !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  white-space: normal !important;
  gap: 6px !important;
  margin: 0 !important;
  max-width: 100% !important;
}
body .ab-pgrid-card .ab-pgrid-price,
body .ab-plist-card .ab-plist-price,
body .ab-featured-card .ab-featured-price {
  font-size: 15px !important;
  font-weight: 400 !important;
}
body .ab-pgrid-card .ab-pgrid-price-row .ab-price-old,
body .ab-plist-card .ab-plist-price-row .ab-price-old,
body .ab-featured-card .ab-featured-price-row .ab-price-old {
  font-size: 13px !important;
}
/* الهاتف: تصغير إضافي للأسعار عند ضيق الشاشة */
@media (max-width: 820px) {
  body .ab-pgrid-card .ab-pgrid-price,
  body .ab-plist-card .ab-plist-price,
  body .ab-featured-card .ab-featured-price {
    font-size: 13px !important;
  }
}
/* السواتش: لا يضيف هوامش عشوائية */
body .ab-pgrid-card .ab-pgrid-swatches,
body .ab-plist-card .ab-plist-swatches,
body .ab-featured-card .ab-featured-swatches {
  margin: 0 !important;
  padding: 0 !important;
}
/* الكرت: تدوير بسيط للحواف — مع بقاء بقية العناصر حادة (0) */
body .ab-pgrid-card,
body .ab-plist-card,
body .ab-featured-card {
  border-radius: 10px !important;
}
body .ab-pgrid-card *,
body .ab-plist-card *,
body .ab-featured-card * {
  border-radius: 0 !important;
}
/* كل كتابة / خط داخل الكرت سوداء — بما فيها السعر القديم الذي كان أبيضًا
   غير مرئي على الخلفية البيضاء للكارت */
body .ab-pgrid-card,
body .ab-pgrid-card *,
body .ab-plist-card,
body .ab-plist-card *,
body .ab-featured-card,
body .ab-featured-card *,
body .ab-pgrid-card .line-through,
body .ab-plist-card .line-through,
body .ab-featured-card .line-through,
body .ab-pgrid-card .ab-price-old,
body .ab-plist-card .ab-price-old,
body .ab-featured-card .ab-price-old {
  color: #000000 !important;
}
/* توحيد الأسعار: كل أسعار الكرت #EC008C مهما كان نوعها (الحالي/القديم/العرض) */
body .ab-pgrid-card .ab-pgrid-price,
body .ab-pgrid-card .ab-pgrid-price-row,
body .ab-plist-card .ab-plist-price,
body .ab-plist-card .ab-plist-price-row,
body .ab-featured-card .ab-featured-price,
body .ab-featured-card .ab-featured-price-row,
body .ab-pgrid-card .ab-price,
body .ab-pgrid-card .ab-price-old,
body .ab-pgrid-card .ab-price-sale,
body .ab-plist-card .ab-price,
body .ab-plist-card .ab-price-old,
body .ab-plist-card .ab-price-sale,
body .ab-featured-card .ab-price,
body .ab-featured-card .ab-price-old,
body .ab-featured-card .ab-price-sale,
body .ab-pgrid-card .line-through,
body .ab-plist-card .line-through,
body .ab-featured-card .line-through,
body .ab-pgrid-card [class*="price"],
body .ab-plist-card [class*="price"],
body .ab-featured-card [class*="price"] {
  color: #EC008C !important;
}

/* ======= 14. كل حقول الإدخال: حواف حادة تمامًا (بدون أي دورانات) =======
   يشمل صفحة الدفع (checkout) وكل الحقول العامة selects / textareas.
   specificity مرتفع للتغلب على border-radius:8px!important من الثيم.
   ملاحظة: حتى لو بقيت أي دورانات ظاهرة من React-select، تم ضبطها هنا. */
body .checkout_form input.global_input,
body .checkout_form textarea.global_textarea,
body .product_form_checkout input.global_input,
body .product_form_checkout textarea.global_textarea,
body input.global_input,
body textarea.global_textarea,
body .ab-review-input,
body .ab-footer-subscribe-input {
  border-radius: 0 !important;
  border: none !important;
  outline: none !important;
  background: #111111 !important;
  color: #FFFFFF !important;
  padding: 12px 14px !important;
  box-shadow: none !important;
}

/* إلغاء الخط الأحمر/الخطأ خارج الحقل وإبقاء الحواف حادة */
body .checkout_form input.global_input.border-red-500,
body .checkout_form textarea.global_textarea.border-red-500,
body input.global_input.border-red-500,
body textarea.global_textarea.border-red-500,
body input.border-red-500,
body textarea.border-red-500 {
  border-radius: 0 !important;
  border: none !important;
  background: #111111 !important;
  color: #FFFFFF !important;
}

body .checkout_form input.global_input:focus,
body .checkout_form textarea.global_textarea:focus,
body input.global_input:focus,
body textarea.global_textarea:focus {
  background: #111111 !important;
  color: #FFFFFF !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(236, 0, 140, 0.25) !important;
}

/* React-select في الدفع والمنتج (ملاحظة: هو سلة منسدلة، وحدودها حادة) */
body .checkout_form .select__control,
body .product_form_checkout .select__control,
body .select__control {
  border-radius: 0 !important;
  border: none !important;
  background: #111111 !important;
  min-height: 48px !important;
  box-shadow: none !important;
}
body .checkout_form .select__control:hover,
body .product_form_checkout .select__control:hover,
body .select__control--is-focused {
  background: #111111 !important;
  border-color: transparent !important;
}
body .checkout_form .select__menu,
body .product_form_checkout .select__menu,
body .select__menu {
  border-radius: 0 !important;
  border: none !important;
  background: #111111 !important;
}
body .checkout_form .select__menu-list,
body .product_form_checkout .select__menu-list,
body .select__menu-list {
  background: #111111 !important;
}
body .select__option {
  background: #111111 !important;
  color: #FFFFFF !important;
}
body .select__option--is-focused {
  background: #EC008C !important;
  color: #FFFFFF !important;
}
body .checkout_form input[name="full_name"],
body .checkout_form input[name="phone"],
body .checkout_form input[name="email"],
body .checkout_form input[name="city"],
body .checkout_form input[name="sa_national_address"],
body .checkout_form textarea[name="address1"] {
  border-radius: 0 !important;
}
body .checkout_form .select__input,
body .checkout_form .select__single-value,
body .product_form_checkout .select__single-value,
body .checkout_form .select__placeholder {
  color: #FFFFFF !important;
}
body .checkout_form input.global_input::placeholder,
body .checkout_form textarea.global_textarea::placeholder,
body input.global_input::placeholder,
body textarea.global_textarea::placeholder {
  color: #8a8a9a !important;
}

/* ======= 15. صفحة الدفع: بطاقات الدفع + خيارات الشحن + زر التأكيد =======
   كلها حواف حادة تمامًا (بدون أي استدارة) لتعميم الثيم على checkout. */
body .checkout_form .payment_card,
body .product_form_checkout .payment_card,
button.payment_card,
body button.shipping_option_card,
button.shipping_option_card,
body button.shipping_option_card.flex.cursor-pointer,
body .checkout_form .shipping_option_card {
  border-radius: 0 !important;
  border: 1px solid #333333;
  background: #111111 !important;
  color: #FFFFFF !important;
}

body .checkout_form .payment_card:hover,
body .product_form_checkout .payment_card:hover,
button.payment_card:hover,
body button.shipping_option_card:hover {
  border-color: #EC008C !important;
  background: #1a1a1a !important;
}

body .checkout_form .payment_card.border-blue-600,
body .product_form_checkout .payment_card.border-blue-600,
button.shipping_option_card.border-blue-600 {
  border-color: #EC008C !important;
  border-width: 1px !important;
  border-radius: 0 !important;
}

/* زر التأكيد في الدفع: خلفية المقترح الوردية وحواف حادة */
body .checkout_buy_now,
body .checkout_form button[type="submit"],
.form_checkout_btn {
  background: #EC008C !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: 700;
  cursor: pointer;
}
body .checkout_buy_now:hover,
body .checkout_form button[type="submit"]:hover,
.form_checkout_btn:hover {
  background: #C50073 !important;
}

body .checkout_form .shipping_cost_container,
body .product_form_checkout .shipping_cost_container {
  border-radius: 0 !important;
}

/* الأزرار والكروت المحددة بكلاسات tailwind rounded داخل الدفع — حواف حادة */
body .checkout_form button.rounded-md,
body .checkout_form button.rounded-full,
body .checkout_form button.rounded-xl,
body .checkout_form button.rounded-lg,
body .checkout_form .payment_card,
body .checkout_form .shipping_option_card,
body .checkout_form .select__control {
  border-radius: 0 !important;
}

/* ======= 15b. صفحة الشيك أوت: خلفية سوداء شاملة =======
   يتحكم في عمودي صفحة الدفع بالنمط الليل. لأجل خيار
   "Order Summary أبيض" فقط: ألغِ السطرين المعلقين أدناه. */
body:has(.checkout_form) {
  background: #000000 !important;
}
body:has(.checkout_order_summary) {
  background: #000000 !important;
}
.checkout_bg_left.checkout_bg_left {
  background: #000000 !important;
}
.checkout_bg_right.checkout_bg_right,
.checkout_order_summary.checkout_order_summary {
  background: #000000 !important;
}
/* الخيار البديل: Order Summary بخلفية بيضاء لليلة/نص أسود — فك التعليق:
.checkout_bg_right.checkout_bg_right,
.checkout_order_summary.checkout_order_summary {
  background: #FFFFFF !important;
}
.checkout_order_summary h2,
.checkout_order_summary .checkout_cart_items_container *,
.checkout_order_summary dd,
.checkout_order_summary dt,
.checkout_order_summary p,
.checkout_order_summary div {
  color: #000000 !important;
}
.checkout_order_summary .line-through,
.checkout_order_summary .text-red-500,
.checkout_order_summary .text-red-600 {
  color: #EC008C !important;
}
*/

/* ======= 15c. ملخص الطلب (Order Summary) على الخلفية السوداء =======
   نص فاتح لجميع عناصر الملخص بعد تغيير خلفيته إلى الأسود. */
body .checkout_order_summary,
body .checkout_order_summary *:not(svg) {
  color: #FFFFFF !important;
}
body .checkout_order_summary .text-gray-400,
body .checkout_order_summary .text-gray-500,
body .checkout_order_summary .text-gray-600,
body .checkout_order_summary .text-gray-700,
body .checkout_order_summary .text-gray-900,
body .checkout_order_summary dt.text-gray-600,
body .pointer-events-none.fixed dt.text-gray-600 {
  color: #C9C9D1 !important;
}
/* إجمالي الطلب بارز بالفريم الشنكلي الفاتح */
body .checkout_order_summary .flex.justify-between.text-base.font-medium.text-gray-900,
body .checkout_order_summary .flex.items-center.justify-between.text-base.font-medium.text-gray-900,
body .checkout_order_summary .total_price,
body .pointer-events-none.fixed .flex.justify-between.text-base.font-medium.text-gray-900 {
  color: #FFFFFF !important;
  font-weight: 700;
}
/* قيمة السعر الإجمالي — وردية بارزة */
body .checkout_order_summary .total_price,
body .pointer-events-none.fixed .total_price,
body .checkout_order_summary dl + div strong,
body .pointer-events-none.fixed dl + div strong,
body .checkout_order_summary .line-through,
body .pointer-events-none.fixed .line-through {
  color: #EC008C !important;
}
/* ملخص الطلب على الموبايل: التبويب العلوي الذي يفتح الملخص */
body #checkout-order-summary-toggle span,
body .checkout_mobile_total_toggle span,
body .checkout_mobile_total_toggle .font-semibold.text-gray-900,
body .mt-2 span.text-lg.font-bold.text-gray-700,
body .checkout_order_summary h2 {
  color: #FFFFFF !important;
}

/* ======= 15d. حقل كوبون الخصم في الشيك أوت =======
   نص "Enter Coupon" وزر "Apply" بالأسود — استثناء من القاعدة البيضاء 15c.
   تغطية عالمية: أي عنصر داخل ملخص الطلب أو به سمة placeholder / class /
   name متعلقة بالكوبون أو الخصم، تحسبًا لطرق حقن ديناميكية من React. */
body .checkout_order_summary input,
body .pointer-events-none.fixed input,
body input[placeholder*="oupon" i],
body input[placeholder*="code" i],
body input[placeholder*="discount" i],
body input[class*="coupon" i],
body input[class*="discount" i],
body input[name*="coupon" i] {
  color: #000000 !important;
  background: #FFFFFF !important;
  border: none !important;
  border-radius: 0 !important;
}
body .checkout_order_summary input::placeholder,
body .pointer-events-none.fixed input::placeholder,
body input[placeholder*="oupon" i]::placeholder,
body input[placeholder*="code" i]::placeholder,
body input[placeholder*="discount" i]::placeholder {
  color: #000000 !important;
  opacity: 1;
}
/* زر Apply بجوار حقل الكوبون (قبل بعده أو سبقه) — نص أسود وخلفية بيضاء */
body .checkout_order_summary input + button,
body .pointer-events-none.fixed input + button,
body input[placeholder*="oupon" i] + button,
body input[placeholder*="coupon" i] + button,
body .checkout_order_summary button + input,
body button + input[placeholder*="oupon" i],
body button[class*="apply" i],
body button[class*="coupon" i],
body button:has(+ input[placeholder*="oupon" i]),
body button:has(~ input[placeholder*="oupon" i]) {
  color: #000000 !important;
  background: #FFFFFF !important;
  border: 1px solid #000000 !important;
  border-radius: 0 !important;
  font-weight: 700;
}
body .checkout_order_summary button,
body .pointer-events-none.fixed button:not(.ab-slider-arrow) {
  color: #000000 !important;
}

/* ======= 15e. كوبون الخصم — حكم قاطع بـ data-invoice (يغلب أي ثيم / أي إعادة بناء من React) =======
   حاوية الكوبون الحقيقية في كود المنصة هي dl[data-invoice="invoice"] داخل ملخص
   الطلب. صفوفه الثلاثة:
     · input "Enter Coupon" + زر "Apply"    (div.mt-2.flex.items-end.justify-between)
     · "Do you have coupon code?" + زر       (div.mt-2.flex.justify-between)
     · "discount: X" + زر "Cancel"           (div.mt-2.flex.items-center.justify-between)
   نُصبّ الأسود فقط على عناصر هذه الصفوف، دون لمس إجمالي الطلب الوردي.
   كل القواعد !important وبأعلى خصوصية (html body + [data-invoice] + class مضاعف)
   لتجاوز style.css القديم الذي يُحمَّل بعد ملفنا. */
html body dl[data-invoice="invoice"] input,
html body .checkout_order_summary dl[data-invoice="invoice"] input,
html body .pointer-events-none.fixed dl[data-invoice="invoice"] input {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: #FFFFFF !important;
  border: none !important;
  border-radius: 0 !important;
}
html body dl[data-invoice="invoice"] input::placeholder,
html body .checkout_order_summary dl[data-invoice="invoice"] input::placeholder,
html body .pointer-events-none.fixed dl[data-invoice="invoice"] input::placeholder {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  opacity: 1 !important;
}
html body dl[data-invoice="invoice"] button,
html body .checkout_order_summary dl[data-invoice="invoice"] button,
html body .pointer-events-none.fixed dl[data-invoice="invoice"] button {
  color: #000000 !important;
  background: #FFFFFF !important;
  border: 1px solid #000000 !important;
  border-radius: 0 !important;
  font-weight: 700;
}
html body dl[data-invoice="invoice"] button span,
html body dl[data-invoice="invoice"] label {
  color: #000000 !important;
}
/* Product Total / Shipping / "Do you have coupon code?" / "discount: X" — نص فاتح على الخلفية السوداء */
html body dl[data-invoice="invoice"] .text-gray-600,
html body .checkout_order_summary dl[data-invoice="invoice"] p,
html body .pointer-events-none.fixed dl[data-invoice="invoice"] p {
  color: #FFFFFF !important;
}

/* ======= 16. درج سلة التسوق (الدرج الجانبي) =======
   تعميم الثيم: خلفية سوداء، نص أبيض، حواف حادة، وردي للعناصر التفاعلية. */
body .checkout_cart_items_container,
ul.checkout_cart_items_container {
  border: none !important;
  background: #000000 !important;
}
.checkout_cart_items_container li.cart-item,
.checkout_cart_items_container .cart-item {
  border-bottom: none !important;
  background: #000000 !important;
}
.checkout_cart_items_container .cart-item img,
.checkout_cart_items_container img {
  border-radius: 0 !important;
}

/* زر إتمام الطلب في السلة: وردي وحواف حادة (كان كبسولة 40px) */
body .checkout_btn,
.checkout_btn {
  background: #EC008C !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: 700;
  font-size: 16px;
}
body .checkout_btn:hover,
.checkout_btn:hover {
  background: #C50073 !important;
  opacity: 1 !important;
}

/* عداد الكمية في السلة: حواف حادة */
body .quantity_container,
.quantity_container,
body .quantity_btn_container,
.quantity_btn_container {
  border-radius: 0 !important;
  border: 1px solid #333333 !important;
  background: #111111 !important;
}
.quantity_container button,
.quantity_btn_container button {
  background: #111111 !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 0 !important;
}

/* زر إزالة المنتج: يبقى رمادي ثم وردي عند المرور */
body .custom-trash-btn,
.custom-trash-btn {
  color: #8a8a9a !important;
}
body .custom-trash-btn:hover,
.custom-trash-btn:hover {
  color: #EC008C !important;
  transform: scale(1.1);
}

/* نصوص السلة والأسعار داخل الدرج — أبيض */
body .checkout_cart_items_container,
body .checkout_cart_items_container * {
  color: #FFFFFF !important;
}
body .checkout_cart_items_container .text-gray-500,
body .checkout_cart_items_container .text-gray-400,
body .checkout_cart_items_container .text-gray-600 {
  color: #8a8a9a !important;
}
/* سعر العرض/الخصم داخل السلة — وردي */
body .checkout_cart_items_container .text-red-600,
body .checkout_cart_items_container .text-red-500,
body .checkout_cart_items_container .line-through {
  color: #EC008C !important;
}

/* ======= 17. بطاقة الشحن المجاني (Free Shipping Progress) =======
   المكوّن: MinValueToFreeShippingWidget (chunk 9071). يستهدف كارت الأداة
   نفسه فقط (لا سلَف الصفحة الذين سيرثون الحدود) عبر فئاته الثابتة مع :has.
   التصميم: أسود، بلا أي حدود، مضغوط، بدون التفاف أو تكسر للمحتوى. */
/* كارت الأداة — أسود، بلا حدود، حواف مريحة */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) {
  background: #000000 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-top: 20px !important;
  padding: 10px 8px 4px 8px !important;
}
/* محو كل الحدود والتدوير والظلال داخل الأداة */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) * {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
/* نص الرسالة ("المتبقي للشحن المجاني" / "تهانينا") — أبيض بمقاس مريح */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) span[class*="202223"] {
  color: #FFFFFF !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}
/* تقليل حشوة كتلة الرسالة */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) .p-4 {
  padding: 4px 2px 8px 2px !important;
}
/* شريط التقدم — أنحف وأوضح: مسار داكن، ملء وردي */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) div[class*="c5d2de"] {
  background: #2A2A2A !important;
  height: 6px !important;
}
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) div[class*="202223"] {
  background: #EC008C !important;
  height: 6px !important;
}
/* تقليم حشوة صف الكاروسيل (الأزرار + الكروت) */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) .mt-2.pb-4 {
  margin-top: 2px !important;
  padding-bottom: 4px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* كرت المنتج المصغّر — أسود لا يتكسر لسطرين: صفّ واحد أُفقي دائمًا */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) .bg-white,
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) [class*="bg-white"] {
  background: #111111 !important;
}
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) [class*="flex-col"] {
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px !important;
}
/* زر إضافة/اختيار — ثابت العرض جنب المحتوى بدلًا من سطر ثانٍ */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) [class*="self-center"] {
  width: auto !important;
  flex-shrink: 0 !important;
}
/* اسم المنتج — سطر واحد مقطوع، صغير، أبيض */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) h3 {
  color: #FFFFFF !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  margin-bottom: 2px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* السعر القديم — رمادي باهت وصغير */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) [class*="text-gray-500"][class*="line-through"] {
  color: #8a8a9a !important;
  font-size: 11px !important;
}
/* السعر الرئيسي في كرت المنتج — وردي وصغير */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) [class*="gap-1"] {
  color: #EC008C !important;
  font-size: 12px !important;
}
/* شارة الخصم — وردية */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) [class*="bg-red-500"] {
  background: #EC008C !important;
}
/* زر "إضافة للسلة / اختيار الخيارات" — أبيض بنص أسود عالٍ التباين ليظهر بوضوح
   على الخلفية الداكنة ولا يذوب في اللون الوردي */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) button[class*="whitespace-nowrap"] {
  background: #FFFFFF !important;
  color: #000000 !important;
  border: none !important;
  padding: 6px 10px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
/* أزرار التنقل (prev/next) — داكنة بلا حدود */
div.bg-white.rounded-lg.border.border-gray-300:has(.min_value_carousel) [class*="min_value_swiper_button"] {
  background: #111111 !important;
  color: #FFFFFF !important;
  border: none !important;
}

/* ======= 18. صفحة الشكر (Thank You) — بعد إتمام الطلب =======
   تستخدم هذه الصفحة مكوّنات مختلفة عن الكروت الأساسية:
   - فاتورة الطلب: OrderInvoice (خلفية بيضاء)
   - شبكة "المنتجات المشابهة": ProductsGrid > ProductCardElegance (كروت bg-white)
   كلاسات text-heading/text-body هنا ترث لون النص الأبيض من الثيم الداكن
   فتختفي النصوص على الخلفية البيضاء → نعيدها بالألوان الداكنة. */
/* المكوّنات داخل صفحة الشكر ذات النص المتغيّر — سوداء على الخلفية البيضاء */
body .thanks_container .text-body,
body .thanks_container .text-heading {
  color: #111111 !important;
}
/* فاتورة الطلب — بطاقة بيضاء بنص أسود */
body .order_invoice_container {
  background: #FFFFFF !important;
  color: #111111 !important;
}
body .order_invoice_container .text-gray-900 {
  color: #111111 !important;
}
body .order_invoice_container .text-gray-500,
body .order_invoice_container .text-gray-600,
body .order_invoice_container .text-gray-400 {
  color: #8a8a9a !important;
}
body .order_invoice_container .border-gray-200 {
  border-color: #E5E5E5 !important;
}
/* أزرار الفاتورة (نسخ رابط التتبع وغيرها) — وردي */
body .order_invoice_container button {
  background: #EC008C !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 0 !important;
}
/* زر العودة للرئيسية / "اذهب للرئيسية" — بلون الثيم الوردي ونص أبيض، حواف حادة
   (في الثيم المخصص يكون الزر الفعلي .ab-thanks-home-btn) */
body .thanks_container a[class*="bg-skin-primary"],
body .ab-thanks-home-btn {
  background: #EC008C !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 12px 30px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer;
}
/* رابط "عرض أحدث العروض" — وردي (في الثيم المخصص يكون <p .ab-thanks-offers>) */
body .thanks_container .text-skin-primary,
body .ab-thanks-offers {
  color: #EC008C !important;
}
/* عنوان قسم المنتجات المشابهة — أبيض على الخلفية السوداء */
body .thanks_container .home_section_top_title {
  color: #FFFFFF !important;
}
/* ===== كروت المنتجات في صفحة الشكر (ProductCardElegance) =====
   نطابقها مع كروتنا الأساسية: أبيض، نص أسود، أسعار وردية، تدوير 10px */
body .home_products_grid_card,
body .products_grid_card {
  background: #FFFFFF !important;
  border: 1px solid #E5E5E5 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
body .home_products_grid_card:hover,
body .products_grid_card:hover {
  transform: none !important;
  box-shadow: none !important;
}
/* كل نصوص الكرت — سوداء وخط عادي (مطابقة للكروت الأخرى) */
body .home_products_grid_card h3,
body .home_products_grid_card .text-heading,
body .products_grid_card h3,
body .products_grid_card .text-heading {
  color: #111111 !important;
  font-weight: 400 !important;
}
/* صورة المنتج — مربعة وأبعاد ثابتة كالكروت الأساسية */
body .home_products_grid_card .relative img,
body .products_grid_card .relative img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover !important;
  border-radius: 0 !important;
}
/* سعر العرض/السعر الرئيسي — وردي */
body .home_products_grid_card span[class*="131316"],
body .home_products_grid_card span[class*="gap-1"]:not([class*="line-through"]),
body .products_grid_card span[class*="131316"] {
  color: #EC008C !important;
}
/* السعر القديم — وردي */
body .home_products_grid_card del,
body .products_grid_card del {
  color: #EC008C !important;
}
/* اسم التصنيف — رمادي خفيف بدلًا من لون الخط الأبيض */
body .home_products_grid_card [class*="61758A"],
body .products_grid_card [class*="61758A"] {
  color: #8a8a9a !important;
}
/* شارة الخصم — وردية بدلًا من الحمراء */
body .home_products_grid_card [class*="C4301C"],
body .products_grid_card [class*="C4301C"] {
  background: #EC008C !important;
}
/* الشرائح الدائرية لسلة التسوق فوق الصورة — وردية بأيقونة بيضاء */
body .home_products_grid_card [class*="rounded-full"],
body .products_grid_card [class*="rounded-full"] {
  background: #EC008C !important;
}
body .home_products_grid_card [class*="rounded-full"] svg,
body .products_grid_card [class*="rounded-full"] svg {
  color: #FFFFFF !important;
}
body .home_products_grid_card [class*="rounded-full"]:hover,
body .products_grid_card [class*="rounded-full"]:hover {
  background: #EC008C !important;
}

/* ============================================================
   القسم 19 — صفحة الشكر الاحترافية (الثيم المخصص)
   تُستخدم هذه التنسيقات مع كتلة HTML الاحترافية التي تُلصق في
   لوحة التحكم > التصميم > قسم "صفحة الشكر" > حقل المحتوى المخصص.
   ============================================================ */
body .ab-thanks-content {
  text-align: center;
  padding: 20px 16px 8px;
}
body .tp-thanks {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  max-width: 640px;
  margin: 0 auto;
  animation: tp-fade 0.6s ease both;
}
@keyframes tp-fade {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
body .tp-check-hold { position: relative; width: 96px; height: 96px; margin-bottom: 4px; }
body .tp-check-ring {
  position: absolute;
  inset: 0;
  border: 2px solid #EC008C;
  border-radius: 50%;
  animation: tp-pulse 2s ease-out infinite;
}
@keyframes tp-pulse {
  0% { transform: scale(0.6); opacity: 1; }
  100% { transform: scale(1.12); opacity: 0; }
}
body .tp-check { position: relative; width: 96px; height: 96px; }
body .tp-title {
  color: #FFFFFF !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  line-height: 1.3;
  margin: 0;
}
body .tp-title,
body .tp-sub,
body .tp-note { text-align: center !important; }
body .tp-sub {
  color: #C9C9CE !important;
  font-size: 16px !important;
  line-height: 1.8;
  max-width: 480px;
  margin: 0;
}
body .tp-steps {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 4px 0 2px;
}
body .tp-step {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #111111 !important;
  border: 1px solid #2A2A2A !important;
  border-radius: 8px;
  padding: 9px 14px;
  color: #EAEAEA !important;
  font-size: 14px !important;
}
body .tp-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #EC008C;
  color: #FFFFFF !important;
  font-size: 12px !important;
  font-weight: 700;
  flex: none;
}
body .tp-contact {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
}
body .tp-contact a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 11px 20px;
  border-radius: 4px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  color: #FFFFFF !important;
}
body .tp-contact .tp-phone { background: #EC008C !important; }
body .tp-contact .tp-wa { background: #25D366 !important; color: #000000 !important; }
body .tp-contact .tp-mail { background: transparent !important; border: 1px solid #FFFFFF !important; }
body .tp-note {
  color: #8B8B93 !important;
  font-size: 13px !important;
  margin: 2px 0 0;
}
body .tp-step span { text-align: center; }

/* عند استخدام كتلة التصميم الاحترافية (شكرًا) نُخفي زر الثيم القديم لأن الكتلة تتضمن زرًا خاصًا بها */
body .thanks_container .ab-thanks-home-btn { display: none !important; }