/* =========================================================================
   MekaStore Storefront — "Warm Modern Retail"
   تصميم متجر التقسيط: لوحة دافئة، برتقالي العلامة كنداء فعل، والقسط الشهري بطل البطاقة.
   كل القواعد مُنطّقة تحت body.mks-styled لتجنّب التعارض.
   ========================================================================= */

body.mks-styled {
  --mks-bg: #fbf7f2;
  --mks-surface: #ffffff;
  --mks-ink: #241a15;
  --mks-muted: #8a7b72;
  --mks-line: #ece3da;
  --mks-primary: #e55a3a;
  --mks-primary-dark: #c4452a;
  --mks-primary-soft: #fff1ec;
  --mks-wa: #25d366;
  --mks-wa-dark: #1da851;
  --mks-gold: #b8862a;
  --mks-radius: 14px;
  --mks-radius-sm: 10px;
  --mks-radius-btn: 10px;
  /* تصميم سطحي: ظلال خفيفة جداً بدل العمق ثلاثي الأبعاد */
  --mks-shadow: 0 1px 2px rgba(36, 26, 21, .05);
  --mks-shadow-lg: 0 6px 20px -10px rgba(36, 26, 21, .14);

  background: var(--mks-bg);
  color: var(--mks-ink);
  font-family: "Tajawal", system-ui, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.mks-styled h1,
body.mks-styled h2,
body.mks-styled h3,
body.mks-styled .product_title,
body.mks-styled .woocommerce-loop-product__title {
  font-family: "Cairo", system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: -.01em;
  color: var(--mks-ink);
}

/* ----- تخطيط بعرض كامل بعد إزالة الشريط الجانبي ----- */
body.mks-styled .content-area {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
body.mks-styled #secondary,
body.mks-styled .widget-area { display: none !important; }
/* إخفاء حقوق القالب الإنجليزية تلقائية التوليد */
body.mks-styled .site-info .site-info__credits .storefront-credit__links { display: none; }

/* ----- Page header / breadcrumb ----- */
body.mks-styled .woocommerce-breadcrumb {
  font-size: .82rem;
  color: var(--mks-muted);
  margin-bottom: 1.25rem;
}
body.mks-styled .woocommerce-products-header__title,
body.mks-styled .entry-title {
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  position: relative;
  padding-bottom: .5rem;
  margin-bottom: 1.5rem;
}
body.mks-styled .woocommerce-products-header__title::after,
body.mks-styled .entry-title::after {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  bottom: 0;
  width: 64px;
  height: 4px;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--mks-primary), var(--mks-gold));
}

/* ----- Result count / ordering ----- */
body.mks-styled .woocommerce-result-count { color: var(--mks-muted); font-size: .85rem; }
body.mks-styled .woocommerce-ordering select {
  border: 1px solid var(--mks-line);
  border-radius: 999px;
  padding: .5rem 1rem;
  background: var(--mks-surface);
  color: var(--mks-ink);
  font-family: inherit;
}

/* =========================================================================
   شبكة المنتجات (Shop archive)
   ========================================================================= */
body.mks-styled ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 290px));
  justify-content: center;
  gap: 1.5rem;
  margin: 0 0 2rem !important;
  padding: 0 !important;
}
body.mks-styled ul.products::before,
body.mks-styled ul.products::after { content: none !important; }

body.mks-styled ul.products li.product {
  width: auto !important;
  margin: 0 !important;
  float: none !important;
  background: var(--mks-surface);
  border: 1px solid var(--mks-line);
  border-radius: var(--mks-radius);
  padding: 0 !important;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: none;
  transition: box-shadow .25s ease, border-color .25s ease;
  animation: mks-rise .4s both;
}
body.mks-styled ul.products li.product:hover {
  box-shadow: var(--mks-shadow-lg);
  border-color: #f0d4c8;
}
/* صعود متدرّج لأول صف */
body.mks-styled ul.products li.product:nth-child(1) { animation-delay: .02s; }
body.mks-styled ul.products li.product:nth-child(2) { animation-delay: .08s; }
body.mks-styled ul.products li.product:nth-child(3) { animation-delay: .14s; }
body.mks-styled ul.products li.product:nth-child(4) { animation-delay: .20s; }

@keyframes mks-rise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* صورة المنتج */
body.mks-styled ul.products li.product > a img,
body.mks-styled ul.products li.product img {
  margin: 0 !important;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: #f3ece5;
  transition: transform .6s cubic-bezier(.2, .7, .2, 1);
}
body.mks-styled ul.products li.product:hover img { transform: scale(1.06); }

body.mks-styled ul.products li.product > a {
  display: block;
  overflow: hidden;
}

body.mks-styled ul.products li.product .woocommerce-loop-product__title {
  font-size: 1rem;
  line-height: 1.4;
  padding: .9rem 1rem 0 !important;
  min-height: 2.8em;
}

/* السعر — كامل ثم القسط الشهري كبطل */
body.mks-styled ul.products li.product .price {
  display: block;
  padding: .25rem 1rem 0 !important;
  color: var(--mks-muted) !important;
  font-size: .9rem !important;
}
body.mks-styled ul.products li.product .price ins { text-decoration: none; }
body.mks-styled ul.products li.product .price del { color: #c2b4aa; font-size: .85em; }

/* سطر القسط الشهري داخل البطاقة */
body.mks-styled .mks-loop-plan {
  margin: .5rem 1rem 0;
  padding: .5rem .7rem;
  background: var(--mks-primary-soft);
  border-radius: var(--mks-radius-sm);
  display: flex;
  align-items: baseline;
  gap: .35rem;
}
body.mks-styled .mks-loop-plan b {
  font-family: "Cairo", sans-serif;
  font-weight: 800;
  color: var(--mks-primary-dark);
  font-size: 1.05rem;
}
body.mks-styled .mks-loop-plan span { color: var(--mks-primary-dark); font-size: .72rem; opacity: .85; }

/* زر الإضافة في البطاقة */
body.mks-styled ul.products li.product .button {
  margin: .8rem 1rem 1rem !important;
  margin-top: auto !important;
}

/* شارة التخفيض */
body.mks-styled span.onsale {
  position: absolute;
  inset-block-start: 12px;
  inset-inline-end: 12px;
  inset-inline-start: auto;
  background: var(--mks-primary);
  color: #fff;
  border-radius: 999px;
  padding: .25rem .7rem;
  font-family: "Cairo", sans-serif;
  font-weight: 700;
  font-size: .72rem;
  min-height: 0;
  min-width: 0;
  line-height: 1.6;
  box-shadow: none;
}

/* نفاد المخزون */
body.mks-styled ul.products li.product.outofstock { opacity: .85; }
body.mks-styled .stock.out-of-stock { color: var(--mks-primary-dark); font-weight: 700; }

/* =========================================================================
   الأزرار
   ========================================================================= */
body.mks-styled .woocommerce a.button,
body.mks-styled .woocommerce button.button,
body.mks-styled .woocommerce input.button,
body.mks-styled .woocommerce #respond input#submit,
body.mks-styled a.button,
body.mks-styled button.button {
  background: var(--mks-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--mks-radius-btn) !important;
  font-family: "Cairo", sans-serif !important;
  font-weight: 700 !important;
  padding: .72rem 1.4rem !important;
  letter-spacing: 0;
  box-shadow: none !important;
  transition: background-color .18s ease;
  cursor: pointer;
}
body.mks-styled .woocommerce a.button:hover,
body.mks-styled .woocommerce button.button:hover,
body.mks-styled .woocommerce input.button:hover,
body.mks-styled .woocommerce #respond input#submit:hover,
body.mks-styled a.button:hover,
body.mks-styled button.button:hover {
  background: var(--mks-primary-dark) !important;
}
body.mks-styled .woocommerce a.button.added::after { display: none; }

/* أزرار ثانوية (مفرغة سطحية) */
body.mks-styled .woocommerce a.button.wc-backward,
body.mks-styled .woocommerce button.button[name="update_cart"] {
  background: var(--mks-surface) !important;
  color: var(--mks-primary-dark) !important;
  border: 1px solid var(--mks-line) !important;
  box-shadow: none !important;
}
body.mks-styled .woocommerce a.button.wc-backward:hover,
body.mks-styled .woocommerce button.button[name="update_cart"]:hover {
  background: var(--mks-primary-soft) !important;
}

/* زر واتساب (منتج) — رفع التخصيص ليتغلّب على قاعدة الأزرار العامة */
body.mks-styled .woocommerce a.button.mks-wa-btn,
body.mks-styled a.button.mks-wa-btn,
body.mks-styled .mks-wa-btn {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  width: 100%;
  margin-top: .75rem;
  background: var(--mks-wa) !important;
  color: #fff !important;
  box-shadow: none !important;
}
body.mks-styled .woocommerce a.button.mks-wa-btn:hover,
body.mks-styled a.button.mks-wa-btn:hover,
body.mks-styled .mks-wa-btn:hover { background: var(--mks-wa-dark) !important; }
body.mks-styled .woocommerce a.button.mks-wa-btn::before,
body.mks-styled .mks-wa-btn::before {
  content: "";
  width: 20px; height: 20px;
  background: center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M.057 24l1.687-6.163a11.867 11.867 0 01-1.587-5.945C.16 5.335 5.495 0 12.05 0a11.82 11.82 0 018.413 3.488 11.82 11.82 0 013.48 8.414c-.003 6.557-5.338 11.892-11.893 11.892a11.9 11.9 0 01-5.688-1.448L.057 24zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884a9.86 9.86 0 001.51 5.26l-.999 3.648 3.488-.927z'/%3E%3C/svg%3E");
}

/* =========================================================================
   صفحة المنتج المفرد
   ========================================================================= */
body.mks-styled .single-product div.product {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: 2.5rem;
  align-items: start;
}
body.mks-styled .single-product div.product .woocommerce-product-gallery {
  width: 100% !important;
  margin: 0 !important;
  border-radius: var(--mks-radius);
  overflow: hidden;
  box-shadow: var(--mks-shadow);
  background: var(--mks-surface);
}
body.mks-styled .single-product div.product .summary { margin: 0 !important; width: auto !important; }
body.mks-styled .single-product .product_title { font-size: clamp(1.5rem, 2.6vw, 2.2rem); margin-bottom: .75rem; }
body.mks-styled .single-product div.product p.price,
body.mks-styled .single-product div.product .price {
  color: var(--mks-ink);
  font-size: 1.5rem;
  font-weight: 700;
  font-family: "Cairo", sans-serif;
}
body.mks-styled .single-product div.product .price del { color: var(--mks-muted); font-size: 1rem; }
body.mks-styled .woocommerce-product-details__short-description { color: #5d5048; line-height: 1.9; }

body.mks-styled .single-product form.cart {
  margin: 1.25rem 0 0;
  padding: 1.25rem;
  background: var(--mks-surface);
  border: 1px solid var(--mks-line);
  border-radius: var(--mks-radius);
}
body.mks-styled .single-product form.cart .quantity input.qty {
  border: 1px solid var(--mks-line);
  border-radius: var(--mks-radius-sm);
  padding: .6rem;
  background: var(--mks-bg);
  color: var(--mks-ink);
  font-family: inherit;
}
body.mks-styled .single_add_to_cart_button { width: auto; }

/* تبويبات المنتج */
body.mks-styled .woocommerce-tabs ul.tabs { padding: 0 !important; }
body.mks-styled .woocommerce-tabs ul.tabs::before { border-color: var(--mks-line); }
body.mks-styled .woocommerce-tabs ul.tabs li {
  background: transparent;
  border: none;
  border-radius: 999px;
  margin-inline-end: .5rem;
}
body.mks-styled .woocommerce-tabs ul.tabs li.active {
  background: var(--mks-primary-soft);
}
body.mks-styled .woocommerce-tabs ul.tabs li.active a { color: var(--mks-primary-dark); font-weight: 700; }
body.mks-styled .woocommerce-tabs ul.tabs li::before,
body.mks-styled .woocommerce-tabs ul.tabs li::after { display: none !important; }

/* =========================================================================
   صندوق خطة التقسيط (.mks-plan) — البطل
   ========================================================================= */
body.mks-styled .mks-plan {
  margin: 1.25rem 0;
  padding: 1.1rem 1.25rem;
  border: 1px solid var(--mks-line);
  border-inline-start: 4px solid var(--mks-primary);
  border-radius: var(--mks-radius);
  background: var(--mks-primary-soft);
}
body.mks-styled .mks-plan__label {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-family: "Cairo", sans-serif;
  font-weight: 700;
  color: var(--mks-primary-dark);
  font-size: .9rem;
  margin-bottom: .4rem;
}
body.mks-styled .mks-plan__price {
  font-family: "Cairo", sans-serif;
  font-weight: 900;
  font-size: 2rem;
  line-height: 1.1;
  color: var(--mks-ink);
}
body.mks-styled .mks-plan__price small { font-size: .9rem; font-weight: 500; color: var(--mks-muted); }
body.mks-styled .mks-plan__sub { margin-top: .35rem; color: #6f6058; font-size: .9rem; }
body.mks-styled .mks-plan__sub b { color: var(--mks-primary-dark); }

/* =========================================================================
   السلة
   ========================================================================= */
body.mks-styled .woocommerce-cart-form table.cart {
  border: 1px solid var(--mks-line);
  border-radius: var(--mks-radius);
  overflow: hidden;
  background: var(--mks-surface);
  border-collapse: separate;
  border-spacing: 0;
}
body.mks-styled table.cart thead th {
  background: var(--mks-bg);
  font-family: "Cairo", sans-serif;
  color: var(--mks-ink);
  border: none;
  padding: 1rem;
}
body.mks-styled table.cart td {
  border-top: 1px solid var(--mks-line);
  padding: 1rem;
  vertical-align: middle;
}
body.mks-styled table.cart img { border-radius: var(--mks-radius-sm); }
body.mks-styled .cart_totals {
  background: var(--mks-surface);
  border: 1px solid var(--mks-line);
  border-radius: var(--mks-radius);
  padding: 1.25rem;
  box-shadow: var(--mks-shadow);
}
body.mks-styled .cart_totals h2 { font-family: "Cairo", sans-serif; }
body.mks-styled .cart_totals table { border: none; }
body.mks-styled .cart_totals .order-total .amount { color: var(--mks-primary-dark); font-size: 1.3rem; }
body.mks-styled .wc-proceed-to-checkout .checkout-button { display: flex; align-items: center; justify-content: center; font-size: 1.05rem !important; }

/* كوبون */
body.mks-styled .coupon input.input-text {
  border: 1px solid var(--mks-line);
  border-radius: 999px;
  padding: .6rem 1rem;
  background: var(--mks-bg);
}

/* =========================================================================
   الدفع / إتمام الطلب
   ========================================================================= */
body.mks-styled form.checkout .col2-set .col-1,
body.mks-styled form.checkout #order_review_heading,
body.mks-styled form.checkout #order_review {
  background: var(--mks-surface);
  border: 1px solid var(--mks-line);
  border-radius: var(--mks-radius);
  padding: 1.5rem;
}
body.mks-styled form.checkout #order_review_heading { border-bottom: none; border-radius: var(--mks-radius) var(--mks-radius) 0 0; margin-bottom: 0; }
body.mks-styled form.checkout #order_review { border-radius: 0 0 var(--mks-radius) var(--mks-radius); border-top: none; }
body.mks-styled .woocommerce form .form-row input.input-text,
body.mks-styled .woocommerce form .form-row textarea,
body.mks-styled .woocommerce form .form-row select,
body.mks-styled .select2-container--default .select2-selection--single {
  border: 1px solid var(--mks-line) !important;
  border-radius: var(--mks-radius-sm) !important;
  padding: .7rem .9rem !important;
  background: var(--mks-bg);
  color: var(--mks-ink);
  font-family: inherit;
  min-height: 44px;
}
body.mks-styled .woocommerce form .form-row input.input-text:focus,
body.mks-styled .woocommerce form .form-row textarea:focus {
  outline: none;
  border-color: var(--mks-primary) !important;
  box-shadow: 0 0 0 3px var(--mks-primary-soft);
}
body.mks-styled #payment, body.mks-styled .woocommerce-checkout #payment {
  background: var(--mks-bg) !important;
  border-radius: var(--mks-radius);
}
body.mks-styled #payment ul.payment_methods { border-bottom: 1px solid var(--mks-line); }
body.mks-styled #place_order { width: 100%; font-size: 1.1rem !important; }

/* =========================================================================
   رسائل / تنبيهات
   ========================================================================= */
body.mks-styled .woocommerce-message,
body.mks-styled .woocommerce-info,
body.mks-styled .woocommerce-error {
  border-radius: var(--mks-radius-sm);
  border: 1px solid var(--mks-line);
  background: var(--mks-surface);
  box-shadow: var(--mks-shadow);
}
body.mks-styled .woocommerce-message { border-inline-start: 4px solid var(--mks-wa); }
body.mks-styled .woocommerce-info { border-inline-start: 4px solid var(--mks-primary); }
body.mks-styled .woocommerce-error { border-inline-start: 4px solid #dc2626; }
body.mks-styled .woocommerce-message .button,
body.mks-styled .woocommerce-info .button { padding: .4rem 1rem !important; }

/* =========================================================================
   زر واتساب العائم
   ========================================================================= */
body.mks-styled .mks-wa-float {
  position: fixed;
  inset-block-end: 22px;
  inset-inline-start: 22px;
  z-index: 9999;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: var(--mks-wa);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px -4px rgba(36, 26, 21, .22);
  text-decoration: none;
  transition: background-color .18s ease;
}
body.mks-styled .mks-wa-float:hover { background: var(--mks-wa-dark); }
body.mks-styled .mks-wa-float svg { width: 28px; height: 28px; fill: #fff; }

/* =========================================================================
   نموذج تسجيل المهتمين
   ========================================================================= */
body.mks-styled .mks-lead-form {
  max-width: 520px;
  margin: 1rem auto;
  padding: 1.75rem;
  background: var(--mks-surface);
  border: 1px solid var(--mks-line);
  border-radius: var(--mks-radius);
}
body.mks-styled .mks-lead-field { margin-bottom: 1.1rem; }
body.mks-styled .mks-lead-field label {
  display: block;
  font-family: "Cairo", sans-serif;
  font-weight: 700;
  font-size: .92rem;
  margin-bottom: .4rem;
  color: var(--mks-ink);
}
body.mks-styled .mks-lead-field input {
  width: 100%;
  border: 1px solid var(--mks-line);
  border-radius: var(--mks-radius-sm);
  padding: .8rem .9rem;
  background: var(--mks-bg);
  color: var(--mks-ink);
  font-family: inherit;
  font-size: 1rem;
  transition: border-color .15s ease, box-shadow .15s ease;
}
body.mks-styled .mks-lead-field input:focus {
  outline: none;
  border-color: var(--mks-primary);
  box-shadow: 0 0 0 3px var(--mks-primary-soft);
}
body.mks-styled .mks-lead-btn {
  width: 100%;
  border: none;
  background: var(--mks-primary);
  color: #fff;
  font-family: "Cairo", sans-serif;
  font-weight: 700;
  font-size: 1.05rem;
  padding: .9rem;
  border-radius: var(--mks-radius-btn);
  cursor: pointer;
  transition: background-color .18s ease;
}
body.mks-styled .mks-lead-btn:hover { background: var(--mks-primary-dark); }
body.mks-styled .mks-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
body.mks-styled .mks-lead-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  border-radius: var(--mks-radius-sm);
  padding: .7rem .9rem;
  margin-bottom: 1rem;
  font-size: .9rem;
}
body.mks-styled .mks-lead-success {
  max-width: 520px;
  margin: 1rem auto;
  padding: 2.25rem 1.75rem;
  text-align: center;
  background: var(--mks-surface);
  border: 1px solid var(--mks-line);
  border-inline-start: 4px solid var(--mks-wa);
  border-radius: var(--mks-radius);
}
body.mks-styled .mks-lead-success__icon {
  width: 56px; height: 56px;
  margin: 0 auto 1rem;
  border-radius: 50%;
  background: var(--mks-wa);
  color: #fff;
  font-size: 1.8rem;
  display: flex; align-items: center; justify-content: center;
}
body.mks-styled .mks-lead-success h3 { margin: 0 0 .4rem; }
body.mks-styled .mks-lead-success p { margin: 0; color: var(--mks-muted); }

/* =========================================================================
   استجابة (موبايل)
   ========================================================================= */
@media (max-width: 900px) {
  body.mks-styled .single-product div.product { grid-template-columns: 1fr; gap: 1.5rem; }
}
@media (max-width: 600px) {
  body.mks-styled ul.products { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  body.mks-styled ul.products li.product .woocommerce-loop-product__title { font-size: .9rem; }
  body.mks-styled .mks-plan__price { font-size: 1.6rem; }
}

@media (prefers-reduced-motion: reduce) {
  body.mks-styled * { animation: none !important; transition: none !important; }
}

/* ============================================================================
   شريط تنقّل المتجر
   ----------------------------------------------------------------------------
   القوالب البلوكية لا تقرأ مواقع القوائم الكلاسيكية، فيخرج الرأس باسم المتجر
   وحده بلا مدخل للمتجر ولا للمكتبة ولا سلّة. هذا الشريط يُرسم من الإضافة فوق
   رأس القالب أياً كان، ويُلصق أعلى الشاشة ليبقى الطريق مفتوحاً في كل صفحة.
   ========================================================================== */
body.mks-styled .mks-nav {
  position: sticky;
  top: 0;
  z-index: 999;
  background: var(--mks-surface);
  border-bottom: 1px solid var(--mks-line);
  box-shadow: 0 1px 12px rgba(36, 26, 21, .05);
}
body.mks-styled .mks-nav__inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: .6rem 1.1rem;
  display: flex;
  align-items: center;
  gap: 1.1rem;
  flex-wrap: wrap;
}
body.mks-styled .mks-nav__brand {
  font-family: 'Cairo', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.05rem;
  color: var(--mks-ink);
  text-decoration: none;
  white-space: nowrap;
}
body.mks-styled .mks-nav__links {
  display: flex;
  align-items: center;
  gap: .35rem;
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1 1 auto;
  flex-wrap: wrap;
}
body.mks-styled .mks-nav__links a {
  display: inline-block;
  padding: .42rem .8rem;
  border-radius: 999px;
  font-weight: 600;
  font-size: .92rem;
  color: var(--mks-ink);
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
}
body.mks-styled .mks-nav__links a:hover,
body.mks-styled .mks-nav__links a:focus-visible {
  background: var(--mks-primary-soft);
  color: var(--mks-primary-dark);
}
body.mks-styled .mks-nav__cart {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .45rem .95rem;
  border-radius: 999px;
  background: var(--mks-primary);
  color: #fff;
  font-weight: 700;
  font-size: .9rem;
  text-decoration: none;
  white-space: nowrap;
}
body.mks-styled .mks-nav__cart:hover,
body.mks-styled .mks-nav__cart:focus-visible { background: var(--mks-primary-dark); color: #fff; }
body.mks-styled .mks-nav__badge {
  min-width: 1.35em;
  padding: 0 .3em;
  border-radius: 999px;
  background: #fff;
  color: var(--mks-primary-dark);
  font-size: .78rem;
  line-height: 1.35em;
  text-align: center;
}
@media (max-width: 560px) {
  body.mks-styled .mks-nav__brand { font-size: .95rem; }
  body.mks-styled .mks-nav__links a { padding: .35rem .6rem; font-size: .86rem; }
  body.mks-styled .mks-nav__cart-label { display: none; }
}

/* ============================================================================
   التواصل · طلب الإصلاح · تتبّعه
   ----------------------------------------------------------------------------
   ثلاث حاجات كانت بلا مكان: الاستفسار قبل الشراء، وطلب الإصلاح بعده، ومعرفة
   أين وصل الجهاز. الصندوق الواحد لكلٍّ منها، ولا يظهر إلّا إن كانت وحدته مفعّلة.
   ========================================================================== */
body.mks-styled .mks-contact { max-width: 1100px; margin: 0 auto; }
body.mks-styled .mks-contact__direct {
  display: flex; gap: .6rem; flex-wrap: wrap;
  justify-content: center; margin-bottom: 1.6rem;
}
body.mks-styled .mks-btn--wa { background: var(--mks-wa); color: #fff; }
body.mks-styled .mks-btn--wa:hover { background: var(--mks-wa-dark); color: #fff; }

body.mks-styled .mks-contact__grid {
  display: grid; gap: 1.1rem;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  align-items: start;
}
body.mks-styled .mks-contact__box {
  background: var(--mks-surface);
  border: 1px solid var(--mks-line);
  border-radius: 14px;
  padding: 1.2rem;
}
body.mks-styled .mks-contact__box h3 {
  font-family: 'Cairo', system-ui, sans-serif;
  font-size: 1.05rem; font-weight: 800; margin: 0 0 .3rem;
}
body.mks-styled .mks-contact__hint {
  color: var(--mks-muted); font-size: .86rem; margin: 0 0 .9rem;
}

/* نموذج عام (الإصلاح) */
body.mks-styled .mks-form { display: grid; gap: .75rem; }
body.mks-styled .mks-form label { display: grid; gap: .3rem; }
body.mks-styled .mks-form label > span { font-size: .85rem; font-weight: 600; }
body.mks-styled .mks-form input,
body.mks-styled .mks-form textarea {
  width: 100%; padding: .6rem .75rem;
  border: 1px solid var(--mks-line); border-radius: 10px;
  background: var(--mks-bg); font: inherit; color: var(--mks-ink);
}
body.mks-styled .mks-form input:focus,
body.mks-styled .mks-form textarea:focus {
  outline: 2px solid var(--mks-primary); outline-offset: 1px; border-color: transparent;
}
body.mks-styled .mks-form__hint { color: var(--mks-muted); font-size: .8rem; margin: 0; }

body.mks-styled .mks-note {
  padding: .7rem .9rem; border-radius: 10px; margin-bottom: .8rem; font-size: .88rem;
}
body.mks-styled .mks-note--ok  { background: #e8f6ee; color: #0f7b52; }
body.mks-styled .mks-note--err { background: #fdecec; color: #a12525; }

/* التتبّع */
body.mks-styled .mks-track__form {
  display: flex; gap: .5rem; align-items: flex-end; flex-wrap: wrap; margin-bottom: .9rem;
}
body.mks-styled .mks-track__form label { flex: 1 1 200px; display: grid; gap: .3rem; }
body.mks-styled .mks-track__form label > span { font-size: .85rem; font-weight: 600; }
body.mks-styled .mks-track__form input {
  width: 100%; padding: .6rem .75rem; border: 1px solid var(--mks-line);
  border-radius: 10px; background: var(--mks-bg); font: inherit;
}
body.mks-styled .mks-track__card {
  border: 1px solid var(--mks-line); border-radius: 12px; padding: 1rem; background: var(--mks-bg);
}
body.mks-styled .mks-track__head {
  display: flex; gap: .6rem; align-items: baseline; flex-wrap: wrap; margin-bottom: .9rem;
}
body.mks-styled .mks-track__head strong { font-family: 'Cairo', system-ui, sans-serif; font-size: 1rem; }
body.mks-styled .mks-track__head span { color: var(--mks-muted); font-size: .86rem; }

body.mks-styled .mks-track__steps { list-style: none; margin: 0 0 1rem; padding: 0; }
body.mks-styled .mks-track__steps li {
  display: flex; align-items: center; gap: .6rem;
  padding: .35rem 0; color: var(--mks-muted); font-size: .88rem;
  position: relative;
}
body.mks-styled .mks-track__dot {
  width: 12px; height: 12px; border-radius: 50%; flex: 0 0 12px;
  background: var(--mks-line); box-shadow: 0 0 0 3px var(--mks-bg);
}
body.mks-styled .mks-track__steps li.is-done { color: var(--mks-ink); font-weight: 600; }
body.mks-styled .mks-track__steps li.is-done .mks-track__dot { background: var(--mks-wa); }
body.mks-styled .mks-track__steps li.is-next { color: var(--mks-primary-dark); font-weight: 700; }
body.mks-styled .mks-track__steps li.is-next .mks-track__dot { background: var(--mks-primary); }

body.mks-styled .mks-track__meta {
  display: grid; gap: .4rem; margin: 0 0 .6rem;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}
body.mks-styled .mks-track__meta div { display: flex; justify-content: space-between; gap: .5rem; font-size: .86rem; }
body.mks-styled .mks-track__meta dt { color: var(--mks-muted); margin: 0; }
body.mks-styled .mks-track__meta dd { margin: 0; font-weight: 700; }
body.mks-styled .mks-track__contact { font-size: .86rem; color: var(--mks-muted); margin: 0; }
