/* أكفان الرحمة — تلبيس ثيم إيزي أوردرز بهوية الديمو
   الهدف: الهيدر والفوتر وصفحة العروض وصفحة المنتج تبقى بنفس لغة التصميم
   بتاعة الديمو (نفس الألوان والخطوط والحواف والكروت).
   تغييرات مظهر فقط — مفيش تعديل على تركيب الصفحة ولا على نموذج الطلب. */

:root {
  /* لون الثيم الأساسي: أخضر الهوية زي الديمو */
  --color-primary: 14, 42, 32;
  --color-a11y: 243, 238, 225;

  --akf-page: #FFFFFF;
  --akf-soft: #F7F3EA;
  --akf-soft-2: #EFE9DA;
  --akf-ink: #1A2621;
  --akf-ink-2: #42514A;
  --akf-muted: #6B776F;
  --akf-line: #E4DDCD;
  --akf-green: #0E2A20;
  --akf-gold: #C9A45C;
  --akf-gold-2: #A87F38;
  --akf-gold-soft: #F0E3C6;
  --akf-on-green: #F3EEE1;
  --akf-on-green-2: #B3C6BA;
  --akf-shadow: 0 2px 6px rgba(20, 40, 32, .06), 0 18px 40px -26px rgba(20, 40, 32, .35);
  --akf-r: 10px;
}

/* ================= الخطوط ================= */
body,
.app_container,
.app_container input,
.app_container select,
.app_container textarea,
.app_container button {
  font-family: "Cairo", "Segoe UI", system-ui, sans-serif;
}

.product_name,
h1.product_name,
.category_name,
.category_section_header_title,
.home_section_top_title,
.page_content h1,
.page_content h2,
.page_content h3 {
  font-family: "Amiri", Georgia, serif !important;
  font-weight: 700 !important;
  color: var(--akf-ink) !important;
  letter-spacing: 0;
}

/* ================= الهيدر — زي هيدر الديمو ================= */
.default_header {
  border-bottom: 1px solid var(--akf-line);
  box-shadow: 0 1px 0 rgba(0, 0, 0, .02);
}

/* اللوجو أكبر وعلى أول السطر، والنڤ جنبه، والأيقونات في الآخر */
@media (min-width: 1024px) {
  .default_header_container {
    display: flex !important;
    align-items: center;
    gap: 26px;
    position: relative;
  }

  .default_header_container > div:first-child {
    flex: 0 0 auto;
    height: auto !important;
  }

  .default_header_logo {
    flex: 0 0 auto !important;
    justify-content: flex-start !important;
  }

  .default_header_container > div:first-child > div[class*="ms-auto"] {
    position: absolute;
    inset-inline-end: 4px;
    top: 50%;
    transform: translateY(-50%);
    flex: 0 0 auto !important;
  }

  .default_header_container > div:nth-child(2) {
    flex: 1 1 auto;
    margin-top: 0 !important;
  }

  .default_header_container > div:nth-child(2) > div {
    justify-content: flex-start !important;
    gap: 22px !important;
  }
}

.default_header_logo a > div,
.default_header_logo img {
  height: 64px !important;
  width: auto !important;
  max-width: none !important;
}

/* روابط القائمة: خط تحتي دهبي زي الديمو بدل الـ underline */
.default_header_container a[class*="font-semibold"] {
  font-family: "Cairo", sans-serif;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--akf-ink-2) !important;
  border-bottom: 3px solid transparent;
  padding-bottom: 3px;
  text-decoration: none !important;
  transition: color .16s ease, border-color .16s ease;
}

.default_header_container a[class*="font-semibold"]:hover {
  color: var(--akf-ink) !important;
  border-bottom-color: var(--akf-gold);
  text-decoration: none !important;
}

/* ================= الفوتر — زي فوتر الديمو ================= */
footer h3,
footer h4 {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: var(--akf-gold) !important;
  letter-spacing: .02em;
}

footer ul a,
footer li a {
  font-size: 15px;
  font-weight: 600;
  color: var(--akf-on-green-2);
  transition: color .16s ease;
}

footer ul a:hover,
footer li a:hover {
  color: #fff;
}

/* أزرار السوشيال كانت بلون الفوتر نفسه فمكنتش بتبان */
footer a[class*="rounded-full"][class*="bg-skin-primary"] {
  background: rgba(255, 255, 255, .07) !important;
  border: 1px solid rgba(201, 164, 92, .45);
  color: var(--akf-gold) !important;
}

footer a[class*="rounded-full"][class*="bg-skin-primary"]:hover {
  background: rgba(255, 255, 255, .14) !important;
  border-color: var(--akf-gold);
}

/* صفوف التواصل في الفوتر (بتتحقن بالسكربت) */
.akf-fcontact {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.akf-fcontact .akf-frow {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 10px;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(201, 164, 92, .3);
  border-radius: 9px;
  padding: 11px 13px;
  transition: border-color .16s ease, background .16s ease;
}

.akf-fcontact .akf-frow:hover {
  border-color: var(--akf-gold);
  background: rgba(255, 255, 255, .09);
}

.akf-fcontact .akf-fl {
  grid-column: 1;
  grid-row: 1;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(255, 255, 255, .72);
}

.akf-fcontact .akf-fn {
  grid-column: 1;
  grid-row: 2;
  font-size: 17px;
  font-weight: 900;
  letter-spacing: .05em;
  font-variant-numeric: tabular-nums;
  color: #fff;
  line-height: 1.25;
}

.akf-fcontact .akf-fa {
  grid-column: 2;
  grid-row: span 2;
  align-self: center;
  font-size: 11.5px;
  font-weight: 800;
  color: var(--akf-gold);
  white-space: nowrap;
}

/* ================= صفحة العروض — كروت زي الديمو ================= */
.category_section_header_title,
.home_section_top_title {
  font-size: clamp(23px, 4.4vw, 34px) !important;
}

/* وصف القسم (الحديث) في صندوق كريمي بشريط دهبي زي بلوك الآية في الديمو */
.akf-catdesc {
  background: var(--akf-soft);
  border: 1px solid var(--akf-line);
  border-inline-start: 4px solid var(--akf-gold);
  border-radius: var(--akf-r);
  padding: 20px 22px !important;
  margin-bottom: 26px;
}

.akf-catdesc,
.akf-catdesc * {
  font-family: "Amiri", Georgia, serif !important;
  color: var(--akf-ink) !important;
  font-weight: 700 !important;
}

.category_products_grid_container > div > div {
  border: 2px solid var(--akf-line) !important;
  border-radius: var(--akf-r) !important;
  box-shadow: var(--akf-shadow);
  transition: border-color .18s ease, transform .18s ease;
}

.category_products_grid_container > div > div:hover {
  border-color: var(--akf-gold) !important;
  transform: translateY(-3px);
}

.category_products_grid_container img {
  border-bottom: 2px solid var(--akf-gold);
}

.category_products_grid_container h3 {
  font-family: "Amiri", Georgia, serif !important;
  font-weight: 700 !important;
  color: var(--akf-ink) !important;
}

.category_products_grid_container del {
  color: var(--akf-muted) !important;
}

/* ================= صفحة المنتج ================= */
.product_description {
  font-family: "Cairo", sans-serif;
  color: var(--akf-ink-2);
  line-height: 2;
}

.product_description h2,
.product_description h3 {
  font-family: "Amiri", Georgia, serif;
  color: var(--akf-ink);
  font-weight: 700;
}

.product_description h2 {
  border-bottom: 2px solid var(--akf-gold);
  padding-bottom: 8px;
  margin: 26px 0 14px;
}

.product_description h3 {
  color: var(--akf-gold-2);
  margin: 20px 0 10px;
}

.product_description blockquote {
  font-family: "Amiri", Georgia, serif;
  background: var(--akf-soft);
  border-inline-start: 3px solid var(--akf-gold);
  border-radius: var(--akf-r);
  padding: 14px 18px;
  margin: 14px 0;
  color: var(--akf-ink);
}

.product_description ul {
  padding-inline-start: 20px;
}

/* إطار الصور: كارت بحدود الهوية بدل الصور السايبة */
.sphinx_product_active_img,
.sphinx_product_images_grid > button {
  border: 1px solid var(--akf-line) !important;
  background: #fff;
  border-radius: 14px !important;
  overflow: hidden;
}

.sphinx_product_images_grid > button {
  transition: border-color .18s ease, transform .18s ease;
}

.sphinx_product_images_grid > button:hover {
  border-color: var(--akf-gold) !important;
  transform: translateY(-2px);
}

/* صندوق السعر زي صندوق العرض في الديمو */
.akf-price-row {
  background: var(--akf-gold-soft);
  border: 2px solid var(--akf-gold);
  border-radius: var(--akf-r);
  padding: 14px 18px !important;
  gap: 16px !important;
  flex-wrap: wrap;
}

.akf-price-row .text-skin-primary,
.akf-price-row .text-skin-primary p,
.akf-price-row .text-skin-primary span {
  color: var(--akf-ink) !important;
}

.akf-price-row .text-skin-primary p {
  font-weight: 900 !important;
}

.akf-save {
  background: var(--akf-green);
  color: var(--akf-on-green);
  font-weight: 900;
  font-size: 14px;
  border-radius: 999px;
  padding: 6px 14px;
  white-space: nowrap;
}

/* شريط الطمأنة تحت زر الشراء */
.akf-assure {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.akf-assure span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--akf-ink-2);
  background: #fff;
  border: 1px solid var(--akf-line);
  border-radius: 999px;
  padding: 7px 13px;
}

.akf-assure span::before {
  content: "✓";
  color: var(--akf-gold-2);
  font-weight: 900;
}

/* عدّاد المشاهدين التقديري مش من هوية براند قايمة على الثقة */
.fake_visitors_container { display: none !important; }

/* ================= صورة مدخل الموقع ================= */
/* لقطة النسيج القريبة بدل صورة الكفن الكامل */
.akfan .hero-photo {
  background-image: url(https://files.easy-orders.net/1787618592625299943.jpg) !important;
}

/* بادچ الخصم على كروت العروض: أخضر الهوية بدل الأحمر */
.category_products_grid_container span[class*="bg-[#C4301C]"] {
  background: var(--akf-green) !important;
  color: var(--akf-on-green) !important;
  border: 1px solid var(--akf-gold);
  border-radius: 999px !important;
}

/* ================= الشريط العلوي — زي الديمو ================= */
.default_header_top_text {
  border-top: 3px solid var(--akf-gold);
  padding: 10px 14px !important;
  line-height: 1.7;
}

.akf-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px 26px;
  width: 100%;
  font-size: 14px;
  font-weight: 600;
}

.akf-top span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.akf-top svg {
  width: 17px;
  height: 17px;
  flex: none;
  color: var(--akf-gold);
}

.akf-top a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(201, 164, 92, .55);
}

.akf-top b {
  font-weight: 800;
  letter-spacing: .02em;
}

@media (max-width: 640px) {
  .akf-top { flex-direction: column; gap: 7px; font-size: 13.5px; }
}

/* ================= اسم البراند جنب اللوجو ================= */
/* اللوجو والاسم على نفس السطر زي الديمو */
.default_header_logo {
  display: flex !important;
  align-items: center;
  gap: 12px;
}

.akf-brand {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  line-height: 1.15;
}

.akf-brand b {
  font-family: "Amiri", Georgia, serif;
  font-size: 25px;
  font-weight: 700;
  color: var(--akf-ink);
}

.akf-brand i {
  font-style: normal;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--akf-muted);
}

@media (max-width: 640px) {
  .akf-brand b { font-size: 21px; }
  .akf-brand i { font-size: 11px; letter-spacing: .08em; }
}

/* ================= أزرار التواصل الطايرة ================= */
.akf-social {
  position: fixed;
  right: 14px;
  bottom: 24px;
  z-index: 60;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.akf-social a {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  box-shadow: 0 10px 22px -10px rgba(0, 0, 0, .55);
  transition: transform .16s ease;
}

.akf-social a:hover { transform: translateY(-2px); }
.akf-social svg { width: 23px; height: 23px; }
.akf-social .wa { background: #25D366; }
.akf-social .fb { background: #1877F2; }
.akf-social .ig { background: linear-gradient(45deg, #F9CE34, #EE2A7B 55%, #6228D7); }

@media (max-width: 640px) {
  .akf-social { bottom: 20px; right: 10px; }
  .akf-social--product { bottom: 104px; }
  .akf-social a { width: 42px; height: 42px; }
  .akf-social svg { width: 21px; height: 21px; }
}

/* ================= الأزرار — دهبي زي الديمو ================= */
button[class*="bg-skin-primary"],
a[class*="bg-skin-primary"]:not([class*="rounded-full"]) {
  background: var(--akf-gold) !important;
  color: #16241D !important;
  border-radius: var(--akf-r) !important;
  font-weight: 900 !important;
}

button[class*="bg-skin-primary"]:hover,
a[class*="bg-skin-primary"]:not([class*="rounded-full"]):hover {
  background: #D8B672 !important;
}

.add_to_cart_btn {
  border-color: var(--akf-gold) !important;
  color: var(--akf-gold-2) !important;
  border-radius: var(--akf-r) !important;
  font-weight: 900 !important;
}

.checkout_btn {
  background: var(--akf-gold) !important;
  color: #16241D !important;
  border-radius: var(--akf-r) !important;
  font-weight: 900 !important;
  letter-spacing: .01em;
  box-shadow: 0 12px 26px -14px rgba(201, 164, 92, .95);
}

.checkout_btn:hover { background: #D8B672 !important; }

/* ================= فراغات صفحة المنتج ================= */
/* عمود الصور كان أطول من عمود التفاصيل بكتير، فكان بيسيب فراغ كبير جنبه.
   التفاصيل بقت لاصقة فوق والصورة الرئيسية لها سقف ارتفاع. */
@media (min-width: 1024px) {
  .p_details_container {
    position: sticky !important;
    top: 16px;
    align-self: start;
  }

  .p_gallery_container {
    position: static !important;
  }
}

.sphinx_product_active_img {
  max-height: 540px;
}

.sphinx_product_active_img img {
  object-fit: contain !important;
  background: var(--akf-soft);
}

.sphinx_product_images_grid > button {
  max-height: 220px;
}

.sphinx_product_images_grid img {
  object-fit: contain !important;
  background: var(--akf-soft);
}

/* أي حاوية فاضية تمامًا بين الأقسام ما تاخدش مساحة */
.product_container div:empty,
.p_content_container > div:empty {
  display: none !important;
}

/* عرض قراءة مريح لوصف المنتج بدل ما النص يتفرد على عرض الشاشة كله */
.product_description .ql-editor,
.product_description > div {
  max-width: 980px;
  margin-inline: auto;
}

/* =====================================================================
   الوضع الداكن — أخضر داكن هو الأساس، والكريمي لمسات خفيفة
   بنعيد تعريف متغيرات التصميم نفسها بدل ما نطارد كل قاعدة لوحدها،
   فكل الأقسام والكروت بتتقلب مرة واحدة وبنفس المنطق.
   ===================================================================== */

:root,
.akfan {
  --akf-page: #16382B;
  --akf-soft: #1B4434;
  --akf-soft-2: #20513D;
  --akf-ink: #F3EEE1;
  --akf-ink-2: #D9E2DB;
  --akf-muted: #A8BBAF;
  --akf-line: rgba(201, 164, 92, .28);

  /* متغيرات ملف الديمو نفسه */
  --page: #16382B;
  --soft: #1B4434;
  --soft-2: #20513D;
  --ink: #F3EEE1;
  --ink-2: #D9E2DB;
  --muted: #A8BBAF;
  --line: rgba(201, 164, 92, .28);
  --green: #0A1D16;
  --green-2: #143528;
  --shadow: 0 2px 6px rgba(0, 0, 0, .3), 0 18px 40px -26px rgba(0, 0, 0, .8);
}

/* أرضية الموقع كلها */
html,
body,
.app_container,
main,
.container_class {
  background: #0E2A20 !important;
  color: var(--akf-ink);
}

/* الهيدر بقى أخضر بدل الأبيض */
.default_header,
.default_header > div,
div[class*="bg-white"][class*="sticky"] {
  background: #0E2A20 !important;
  border-bottom: 1px solid var(--akf-gold) !important;
}

/* شريط النڤ نفسه <nav> مش <div> فكان لسه أبيض */
.default_header_container,
nav.default_header_container,
.default_header_container > div,
.default_header nav {
  background: transparent !important;
  border-bottom: 0 !important;
}

/* أيقونات البحث والسلة وتبديل اللغة */
.default_header svg,
.default_header button,
.default_header_container button,
.default_header_container > div a:not([class*="font-semibold"]) {
  color: var(--akf-ink) !important;
}

.default_header svg path[stroke] { stroke: currentColor; }

.akf-brand b { color: var(--akf-ink) !important; }
.akf-brand i { color: var(--akf-gold) !important; }

.default_header_container a[class*="font-semibold"] {
  color: var(--akf-ink-2) !important;
}

.default_header_container a[class*="font-semibold"]:hover {
  color: #fff !important;
}

/* أي كارت أبيض في الثيم يبقى بانل أخضر */
.product_container,
.p_details_container,
.p_content_container,
.category_products_grid_container > div > div,
div[class*="bg-white"]:not([class*="sticky"]) {
  background: transparent !important;
}

.category_products_grid_container > div > div {
  background: var(--akf-page) !important;
  border-color: var(--akf-line) !important;
}

.category_products_grid_container h3,
.product_name,
h1.product_name,
.category_name,
.category_section_header_title,
.home_section_top_title {
  color: var(--akf-ink) !important;
}

.category_products_grid_container del,
.category_products_grid_container p,
.p_details_container p,
.p_details_container span:not(.akf-save):not(.akf-fa) {
  color: var(--akf-ink-2) !important;
}

/* وصف المنتج */
.product_description { color: var(--akf-ink-2) !important; }
.product_description h2,
.product_description h3 { color: var(--akf-ink) !important; }
.product_description h3 { color: var(--akf-gold) !important; }
.product_description strong { color: var(--akf-ink) !important; }

/* صندوق السعر وشريط الطمأنة */
.akf-price-row {
  background: var(--akf-page) !important;
  border-color: var(--akf-line) !important;
}

.akf-price-row .text-skin-primary,
.akf-price-row .text-skin-primary p,
.akf-price-row .text-skin-primary span { color: var(--akf-ink) !important; }

.akf-assure span {
  background: rgba(255, 255, 255, .06);
  border-color: var(--akf-line);
  color: var(--akf-ink-2);
}

/* وصف القسم في صفحة العروض */
.akf-catdesc {
  background: var(--akf-page) !important;
  border-color: var(--akf-line) !important;
}

.akf-catdesc,
.akf-catdesc * { color: var(--akf-ink) !important; }

/* إطار الصور: الأكفان بيضا فالخلفية تفضل فاتحة عشان تبان */
.sphinx_product_active_img,
.sphinx_product_images_grid > button {
  border-color: var(--akf-line) !important;
}

.sphinx_product_active_img img,
.sphinx_product_images_grid img { background: #E9E4D8; }

/* نموذج الطلب: الحقول تفضل فاتحة عشان تبقى مقروءة ومألوفة */
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="number"],
select,
textarea {
  background: #F7F3EA !important;
  color: #16241D !important;
  border-color: var(--akf-line) !important;
}

input::placeholder,
textarea::placeholder { color: #6B776F !important; }

label,
.checkout_form label,
form label { color: var(--akf-ink-2) !important; }

/* الفوتر بقى أغمق شوية عشان يفضل متميّز عن الصفحة */
footer { background: #0A1D16 !important; }

/* خط فاصل بين الأقسام بدل ما تبقى كتلة واحدة */
.akfan .sec + .sec { border-top: 1px solid rgba(201, 164, 92, .14); }

/* حاويات أقسام الهوم كانت بيضا فبتعمل شرايط بيضا جنب التصميم */
.home_section_container,
.content_container,
div[class*="home_section"] {
  background: transparent !important;
}

/* اللوجو غامق على خلفية شفافة، فمحتاج خلفية كريمي عشان يبان — زي الديمو */
.default_header_logo img {
  background: #F3EEE1;
  border: 1px solid var(--akf-gold);
  border-radius: 12px;
  padding: 5px;
  box-sizing: border-box;
}

/* =====================================================================
   قراءة النص فوق الأخضر الداكن
   ثيم إيزي أوردرز بيحط ألوان نص ثابتة (‎text-[#61758A]‎، text-gray-900…)
   كانت متظبطة على خلفية بيضا. القاعدة دي بتقلبها لكريمي، وبعدها
   بنستثني الأماكن اللي لسه فاتحة (الحقول والأزرار الدهبي).
   ===================================================================== */
.app_container [class*="text-["],
.app_container [class*="text-black"],
.app_container [class*="text-gray-"],
.app_container [class*="text-neutral-"],
.app_container [class*="text-slate-"],
.app_container [class*="text-zinc-"],
.app_container h1,
.app_container h2,
.app_container h3,
.app_container h4,
.app_container p,
.app_container span,
.app_container li,
.app_container a,
.app_container div,
footer [class*="text-"] {
  color: var(--akf-ink-2) !important;
}

/* العناوين أفتح شوية من النص العادي */
.app_container h1,
.app_container h2,
.app_container h3,
.product_name,
h1.product_name,
.category_name,
.category_section_header_title,
.home_section_top_title,
.akfan h1,
.akfan h2,
.akfan h3 {
  color: var(--akf-ink) !important;
}

/* --- الاستثناءات: الأماكن اللي لسه فاتحة --- */

/* الحقول */
input,
select,
textarea,
input[class*="text-"],
select[class*="text-"],
textarea[class*="text-"] {
  color: #16241D !important;
}

/* الأزرار الدهبي: نص غامق فوق الدهبي */
button[class*="bg-skin-primary"],
button[class*="bg-skin-primary"] *,
a[class*="bg-skin-primary"]:not([class*="rounded-full"]),
a[class*="bg-skin-primary"]:not([class*="rounded-full"]) *,
.checkout_btn,
.checkout_btn * {
  color: #16241D !important;
}

/* زر «أضف للسلة» بإطار دهبي */
.add_to_cart_btn,
.add_to_cart_btn * {
  color: var(--akf-gold) !important;
}

/* بادچ التوفير */
.akf-save,
.akf-save * {
  background: var(--akf-gold) !important;
  color: #16241D !important;
}

/* صندوق وصف القسم بيفضل نصه فاتح على البانل الأخضر */
.akf-catdesc,
.akf-catdesc * {
  color: var(--akf-ink) !important;
}

/* لمسات دهبي: الأسعار والعناوين الفرعية */
.akf-price-row .text-skin-primary,
.akf-price-row .text-skin-primary *,
.product_description h3,
.akf-brand i,
footer h3,
footer h4 {
  color: var(--akf-gold) !important;
}

/* السعر القديم المشطوب */
.line-through,
.line-through * {
  color: var(--akf-muted) !important;
}

/* الشريط العلوي نصه كريمي والأيقونات دهبي */
.default_header_top_text,
.akf-top,
.akf-top * {
  color: var(--akf-on-green) !important;
}

.akf-top svg { color: var(--akf-gold) !important; }

/* الشريط الثابت تحت في الموبايل */
div[class*="fixed"][class*="bottom-0"] {
  background: #0A1D16 !important;
  border-top: 1px solid var(--akf-line);
}

/* =====================================================================
   تبويبات المنتج (الوصف / التقييمات)
   كانت رمادي فاتح ونصها بقى كريمي فمكنش بيبان، وكمان كانت متخفية
   على الموبايل فالعميل مكانش بيشوف التقييمات أصلًا.
   ===================================================================== */
.product_tabs_elegance_container div[class*="bg-[#F3F4F8]"] {
  background: #0A1D16 !important;
  border: 1px solid var(--akf-line);
}

.product_tabs_elegance_container button {
  color: var(--akf-ink-2) !important;
}

/* التبويب المفتوح دهبي، والتاني شفاف — ‎hover:bg-white/50‎ كان بيخلي
   الاتنين يتلوّنوا لو اتفلترنا بـ ‎[class*="bg-white"]‎ */
.product_tabs_elegance_container button[aria-selected="true"] {
  background: var(--akf-gold) !important;
}

.product_tabs_elegance_container button[aria-selected="true"],
.product_tabs_elegance_container button[aria-selected="true"] * {
  color: #16241D !important;
}

.product_tabs_elegance_container button[aria-selected="false"] {
  background: transparent !important;
  border: 1px solid var(--akf-line);
}

.product_tabs_elegance_container button[aria-selected="false"],
.product_tabs_elegance_container button[aria-selected="false"] * {
  color: var(--akf-ink-2) !important;
}

/* التقييمات نفسها */
.product_tabs_elegance_container [class*="bg-white"]:not(button) {
  background: var(--akf-page) !important;
  border-color: var(--akf-line) !important;
}

/* --- تصحيحات تباين اتكشفت بفحص الألوان --- */

/* بادچ التوفير: نص غامق فوق الدهبي (محتاج أولوية أعلى من القاعدة العامة) */
.app_container .akf-save,
.app_container .akf-save * {
  color: #16241D !important;
}

/* «أضف للسلة»: كان دهبي على أبيض */
.app_container .add_to_cart_btn {
  background: transparent !important;
  border: 2px solid var(--akf-gold) !important;
}

.app_container .add_to_cart_btn,
.app_container .add_to_cart_btn * {
  color: var(--akf-gold) !important;
}


/* أزرار الكمية (+ / −) كانت رمادي فاتح وأيقوناتها بقت كريمي فاختفت */
.p_details_container button[class*="bg-gray-50"] {
  background: rgba(255, 255, 255, .08) !important;
  border: 1px solid var(--akf-line);
}

.p_details_container button[class*="bg-gray-50"],
.p_details_container button[class*="bg-gray-50"] * {
  color: var(--akf-ink) !important;
}

/* زر «شارك تقييمك» جوه لوحة التقييمات كان أبيض ونصه كريمي */
.reviews_elegance_container button {
  background: transparent !important;
  border: 2px solid var(--akf-gold) !important;
}

.reviews_elegance_container button,
.reviews_elegance_container button * {
  color: var(--akf-gold) !important;
}

/* شرايط النجوم في ملخص التقييمات */
.reviews_elegance_container [class*="bg-gray"],
.reviews_elegance_container [class*="bg-[#E"] {
  background: rgba(255, 255, 255, .12) !important;
}

/* عناصر الديمو اللي خلفيتها دهبي لازم نصها يفضل غامق
   (القاعدة العامة للنص الكريمي كانت بتغلبها) */
.app_container .akfan .btn--gold,
.app_container .akfan .btn--gold * {
  color: #16241D !important;
}


/* على صفحة المنتج فيه شريط شراء ثابت تحت، فالأزرار بتطلع فوقه */
.akf-social--product { bottom: 110px; }

/* الأسطح الكريمي الفاتحة اللي فضلت فاتحة عن قصد (لمسات الكريمي)
   لازم نصها يبقى غامق — القاعدة العامة كانت بتخليه كريمي على كريمي */
.akfan .pol-cond,
.akfan .pol-cond *,
.akfan .paybox,
.akfan .paybox *,
.akfan .pick.on,
.akfan .pick.on *,
.akfan .payopt.on,
.akfan .payopt.on *,
.akfan .soonp .badge,
.akfan .hd cite,
.akfan .sh cite,
.akfan .ft-ic {
  color: #16241D !important;
}

/* ================= سطر الثقة تحت الهيدر ================= */
.akf-trust {
  background: #0A1D16;
  border-bottom: 1px solid var(--akf-line);
  padding: 9px 14px;
  text-align: center;
}

.akf-trust span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 14px;
  font-weight: 700;
  color: var(--akf-on-green);
  line-height: 1.7;
}

.akf-trust svg {
  width: 18px;
  height: 18px;
  flex: none;
  color: var(--akf-gold);
}

@media (max-width: 640px) {
  .akf-trust { padding: 8px 12px; }
  .akf-trust span { font-size: 12.5px; gap: 7px; }
  .akf-trust svg { width: 16px; height: 16px; }
}

/* ================= إخفاء مبدّل اللغة ================= */
/* الترجمة مش شغالة فعليًا، والموقع عربي — فمفيش داعي للزرار */
#google_translate_element,
.goog-te-gadget,
.goog-te-banner-frame,
.goog-te-combo,
.skiptranslate,
iframe.goog-te-banner-frame {
  display: none !important;
}

body { top: 0 !important; }

/* ================= زرار قائمة الموبايل ================= */
/* الزرار كان class="bg-white" (خلفية بيضا) والأيقونة بقت كريمي بعد الثيم الغامق
   يعني كريمي على أبيض = مختفي تمامًا. نخلي خلفيته شفافة فوق الهيدر الأخضر. */
.default_header button[class*="bg-white"],
.default_header_container button[class*="bg-white"] {
  background-color: transparent !important;
}

/* ================= صورة كارت إيزيس دبلان في الرئيسية ================= */
/* الكارت بيستخدم var(--k-men) inline — نستبدلها بالصورة القريبة من النسيج.
   الهيرو مش متأثر لأنه بياخد الصورة من CSS مش من style inline. */
.akfan .mi[style*="--k-men"] {
  background-image: url(https://files.easy-orders.net/1787658851308401310.jpg) !important;
}

/* ================= درج قائمة الموبايل ================= */
/* البانل كان بيطلع شفاف — فالكلام يختفي والمحتوى يبان من وراه.
   نخليه بانل أخضر غامق بنفس هوية الموقع، والكلام كريمي. */
div[class*="max-w-xs"][class*="flex-col"][class*="overflow-y-auto"] {
  background: #0E2A20 !important;
  box-shadow: 0 0 0 1px var(--akf-line), -18px 0 46px rgba(0, 0, 0, .5) !important;
}

div[class*="max-w-xs"][class*="flex-col"][class*="overflow-y-auto"] a,
div[class*="max-w-xs"][class*="flex-col"][class*="overflow-y-auto"] span,
div[class*="max-w-xs"][class*="flex-col"][class*="overflow-y-auto"] button,
div[class*="max-w-xs"][class*="flex-col"][class*="overflow-y-auto"] svg {
  color: var(--akf-ink) !important;
}

/* عناوين المجموعات جوه الدرج (الأقسام / الصفحات) بالدهبي */
div[class*="max-w-xs"][class*="flex-col"][class*="overflow-y-auto"] p {
  color: var(--akf-gold) !important;
  font-weight: 800;
}

/* الفواصل الفاتحة جوه الدرج */
div[class*="max-w-xs"][class*="flex-col"][class*="overflow-y-auto"] [class*="border"] {
  border-color: var(--akf-line) !important;
}

/* الخلفية اللي ورا الدرج تبقى أغمق عشان الفصل يبان */
div[class*="inset-0"][class*="bg-black"][class*="bg-opacity"] {
  background-color: rgba(0, 0, 0, .55) !important;
}

/* ================= اللوجو ================= */
/* width:auto مع lazy-load كان بيعمل قفلة: عرض صفر → المتصفح يعتبرها
   بره الشاشة → ما بيحمّلهاش → تفضل صفر. الـ aspect-ratio بتديها عرض فورًا. */
.default_header_logo img {
  aspect-ratio: 792 / 944;
  min-width: 48px;
  flex: 0 0 auto !important;
  object-fit: contain;
}

/* ================= درج سلة التسوق ================= */
/* نفس مشكلة درج القائمة: البانل ‎bg-white‎ فبقى شفاف والكلام رمادي غامق
   على خلفية شفافة — يعني مش باين وبيتلخبط مع محتوى الصفحة ورا. */
div[class*="max-w-md"][class*="pointer-events-auto"] > div,
div[class*="max-w-md"][class*="pointer-events-auto"] > div[class*="bg-white"] {
  background: #0E2A20 !important;
  box-shadow: 0 0 0 1px var(--akf-line), 18px 0 46px rgba(0, 0, 0, .5) !important;
}

div[class*="max-w-md"][class*="pointer-events-auto"] h2,
div[class*="max-w-md"][class*="pointer-events-auto"] h3,
div[class*="max-w-md"][class*="pointer-events-auto"] p,
div[class*="max-w-md"][class*="pointer-events-auto"] span,
div[class*="max-w-md"][class*="pointer-events-auto"] li,
div[class*="max-w-md"][class*="pointer-events-auto"] a:not([class*="bg-"]),
div[class*="max-w-md"][class*="pointer-events-auto"] button[class*="text-gray"],
div[class*="max-w-md"][class*="pointer-events-auto"] button[class*="text-gray"] svg {
  color: var(--akf-ink) !important;
}

/* عنوان «سلة التسوق» دهبي عشان يبان كعنوان */
div[class*="max-w-md"][class*="pointer-events-auto"] h2 {
  color: var(--akf-gold) !important;
  font-weight: 800 !important;
}

div[class*="max-w-md"][class*="pointer-events-auto"] [class*="border"] {
  border-color: var(--akf-line) !important;
}

/* أي زرار أساسي (إتمام الطلب) يفضل دهبي بنص غامق */
div[class*="max-w-md"][class*="pointer-events-auto"] .bg-skin-primary,
div[class*="max-w-md"][class*="pointer-events-auto"] a[class*="bg-skin"],
div[class*="max-w-md"][class*="pointer-events-auto"] button[class*="bg-skin"] {
  background: var(--akf-gold) !important;
  color: #0A1D16 !important;
}

div[class*="max-w-md"][class*="pointer-events-auto"] .bg-skin-primary *,
div[class*="max-w-md"][class*="pointer-events-auto"] a[class*="bg-skin"] *,
div[class*="max-w-md"][class*="pointer-events-auto"] button[class*="bg-skin"] * {
  color: #0A1D16 !important;
}

/* الخلفية اللي ورا السلة كانت رمادي فاتح — بتغسل الصفحة كلها */
div[class*="bg-gray-500"][class*="bg-opacity"],
div[class*="inset-0"][class*="bg-gray-500"] {
  background-color: rgba(0, 0, 0, .55) !important;
}

/* الإجمالي كان ‎<dt>/<dd>‎ مش ‎<p>/<span>‎ فما اتغطاش، و«متابعة التسوق»
   ‎text-skin-primary‎ اللي بقى نفس لون البانل — يعني مختفي تمامًا */
div[class*="max-w-md"][class*="pointer-events-auto"] dt,
div[class*="max-w-md"][class*="pointer-events-auto"] dd,
div[class*="max-w-md"][class*="pointer-events-auto"] dd *,
div[class*="max-w-md"][class*="pointer-events-auto"] b,
div[class*="max-w-md"][class*="pointer-events-auto"] strong {
  color: var(--akf-ink) !important;
}

div[class*="max-w-md"][class*="pointer-events-auto"] dd,
div[class*="max-w-md"][class*="pointer-events-auto"] dd * {
  font-weight: 800 !important;
}

div[class*="max-w-md"][class*="pointer-events-auto"] .text-skin-primary,
div[class*="max-w-md"][class*="pointer-events-auto"] [class*="text-skin-primary"],
div[class*="max-w-md"][class*="pointer-events-auto"] [class*="text-skin-primary"] * {
  color: var(--akf-gold) !important;
}

/* ================= صفحة إتمام الطلب ================= */
/* البانل كان ‎bg-[#F7F7FA]‎ (فاتح) والنص بقى كريمي بعد الثيم الغامق —
   يعني كريمي على فاتح = مش باين خالص. نخليه بانل أخضر زي باقي الموقع. */
section[class*="contact-info-heading"] {
  background: #16382B !important;
  border: 1px solid var(--akf-line) !important;
}

section[class*="contact-info-heading"] h2,
section[class*="contact-info-heading"] label,
section[class*="contact-info-heading"] > div > span,
section[class*="contact-info-heading"] p {
  color: var(--akf-ink) !important;
}

/* الحقول تفضل فاتحة بنص غامق — أوضح للكتابة */
section[class*="contact-info-heading"] input:not([type="file"]),
section[class*="contact-info-heading"] textarea,
section[class*="contact-info-heading"] select,
.global_input, .global_textarea, .global_select {
  background: #F7F3EA !important;
  color: #16241D !important;
  border: 1px solid var(--akf-line) !important;
}

section[class*="contact-info-heading"] input::placeholder,
section[class*="contact-info-heading"] textarea::placeholder,
.global_input::placeholder, .global_textarea::placeholder {
  color: #55655B !important;
  opacity: 1;
}

/* كروت وسيلة الدفع كانت بيضا والنص كريمي */
.payment_card {
  background: #1B4434 !important;
  border: 1px solid var(--akf-line) !important;
}

.payment_card_name { color: var(--akf-ink) !important; }
.payment_card_description { color: var(--akf-ink-2) !important; }

.payment_card[class*="selected"],
.payment_card[class*="active"],
.payment_card[aria-checked="true"] {
  border-color: var(--akf-gold) !important;
  background: #22553F !important;
}

/* الحقول دي كانت لسه كريمي على كريمي — نرفع التخصيص عشان تكسب أي قاعدة تانية */
html body section[class*="contact-info-heading"] textarea,
html body section[class*="contact-info-heading"] textarea.global_textarea,
html body section[class*="contact-info-heading"] input,
html body section[class*="contact-info-heading"] input.global_input,
html body textarea.global_textarea,
html body input.global_input {
  color: #16241D !important;
}

html body section[class*="contact-info-heading"] input[type="file"] {
  background: #F7F3EA !important;
  color: #16241D !important;
  border: 1px solid var(--akf-line) !important;
  padding: 10px 12px;
  border-radius: 10px;
}

/* زرار اختيار الملف: كان بيطلع بشكل المتصفح الافتراضي بالإنجليزي */
html body section[class*="contact-info-heading"] input[type="file"]::file-selector-button {
  background: var(--akf-gold);
  color: #0A1D16;
  border: 0;
  border-radius: 8px;
  padding: 8px 16px;
  font-family: "Cairo", sans-serif;
  font-weight: 800;
  font-size: 14px;
  cursor: pointer;
  margin-inline-end: 12px;
}

html body section[class*="contact-info-heading"] input[type="file"]::-webkit-file-upload-button {
  background: var(--akf-gold);
  color: #0A1D16;
  border: 0;
  border-radius: 8px;
  padding: 8px 16px;
  font-family: "Cairo", sans-serif;
  font-weight: 800;
  font-size: 14px;
  cursor: pointer;
  margin-inline-end: 12px;
}

/* لابل عربي فوق حقل رفع الصورة (بيتحط بالـ JS) */
.akf-filelabel {
  display: block;
  font-size: 14px;
  font-weight: 800;
  color: var(--akf-ink);
  margin-bottom: 6px;
}

/* ================= أي نافذة منبثقة (كويك فيو / مودالز) ================= */
/* القاعدة العامة اللي بتخلي bg-white شفاف كانت بتفضّي بانلات النوافذ كمان،
   فالمحتوى اللي وراها كان بيبان من خلالها. أي بانل جوه أوفرلاي يبقى أخضر. */
div[class*="inset-0"] div[class*="bg-white"][class*="rounded"],
div[class*="inset-0"] div[class*="bg-white"][class*="shadow"],
div[class*="max-w-5xl"][class*="rounded-3xl"] {
  background: #16382B !important;
  box-shadow: 0 0 0 1px var(--akf-line), 0 30px 80px rgba(0, 0, 0, .55) !important;
}

div[class*="max-w-5xl"][class*="rounded-3xl"] h1,
div[class*="max-w-5xl"][class*="rounded-3xl"] h2,
div[class*="max-w-5xl"][class*="rounded-3xl"] h3,
div[class*="max-w-5xl"][class*="rounded-3xl"] p,
div[class*="max-w-5xl"][class*="rounded-3xl"] span,
div[class*="max-w-5xl"][class*="rounded-3xl"] li,
div[class*="max-w-5xl"][class*="rounded-3xl"] a:not([class*="bg-"]),
div[class*="max-w-5xl"][class*="rounded-3xl"] button[class*="text-gray"],
div[class*="max-w-5xl"][class*="rounded-3xl"] div {
  color: var(--akf-ink) !important;
}

div[class*="max-w-5xl"][class*="rounded-3xl"] del,
div[class*="max-w-5xl"][class*="rounded-3xl"] s,
div[class*="max-w-5xl"][class*="rounded-3xl"] [class*="line-through"] {
  color: var(--akf-muted) !important;
}

div[class*="max-w-5xl"][class*="rounded-3xl"] [class*="border"] {
  border-color: var(--akf-line) !important;
}

/* الخلفية ورا النافذة كانت فاتحة جدًا (24%) */
div[class*="inset-0"][class*="bg-[#1F1D2B"] {
  background-color: rgba(0, 0, 0, .6) !important;
}

/* ================= عمود ملخص الطلب في صفحة إتمام الطلب ================= */
/* كان bg-gray-50 وبيعتمد إنه شفاف عشان الأخضر اللي وراه يبان — ولو القاعدة
   دي ما اشتغلتش لأي سبب بيطلع أبيض والكلام الكريمي عليه يختفي. نخليه صريح. */
.checkout_container,
.checkout_container > div,
.checkout_order_summary {
  background: #0E2A20 !important;
}

.checkout_order_summary h2,
.checkout_order_summary h3,
.checkout_order_summary p,
.checkout_order_summary span,
.checkout_order_summary div,
.checkout_order_summary li,
.checkout_order_summary dt,
.checkout_order_summary dd,
.checkout_order_summary dd * {
  color: var(--akf-ink) !important;
}

.checkout_order_summary [class*="border"],
.checkout_order_summary hr {
  border-color: var(--akf-line) !important;
}

/* سطر الإجمالي يبقى أوضح من باقي السطور */
.checkout_order_summary dl > div:last-child dt,
.checkout_order_summary dl > div:last-child dd,
.checkout_order_summary dl > div:last-child dd * {
  color: var(--akf-gold) !important;
  font-weight: 800 !important;
}

/* ================= بلوك العرض (ordersum) ================= */
/* خلفيته كانت --gold-soft (كريمي فاتح) من الثيم الفاتح، والكلام كريمي —
   يعني كريمي على كريمي = مش باين. نخليه بانل أخضر بإطار دهبي زي باقي الموقع. */
.akfan .ordersum {
  background: var(--akf-soft) !important;
  border: 2px solid var(--akf-gold) !important;
}

.akfan .ordersum .os-k { color: var(--akf-gold) !important; }
.akfan .ordersum .os-l b { color: var(--akf-ink) !important; }
.akfan .ordersum .os-mix { color: var(--akf-ink-2) !important; }
.akfan .ordersum .os-price { color: var(--akf-ink-2) !important; }
.akfan .ordersum .os-price b { color: var(--akf-ink) !important; }
.akfan .ordersum .os-price s { color: var(--akf-muted) !important; }

/* على الموبايل الزرار كان بيركب على الكلام — نخليهم فوق بعض */
@media (max-width: 700px) {
  .akfan .ordersum {
    flex-direction: column;
    align-items: stretch !important;
    gap: 16px;
    text-align: center;
  }
  .akfan .ordersum .os-l {
    align-items: center !important;
    gap: 4px;
  }
  .akfan .ordersum .os-r {
    align-items: center !important;
    margin-inline-start: 0 !important;
    width: 100%;
    gap: 12px;
  }
  .akfan .ordersum .os-r .btn { width: 100%; }
  .akfan .ordersum .os-price { display: block; }
}

/* ================= تصحيح لون الـ kick ================= */
/* الـ kick اللي جوه .head عليه بادج دهبي فنصه لازم يبقى غامق،
   واللي بره .head خلفيته شفافة فنصه كان غامق على أخضر = مختفي. */
.app_container .akfan .kick,
.app_container .akfan .kick * {
  color: var(--akf-gold) !important;
}

.app_container .akfan .head .kick,
.app_container .akfan .head .kick * {
  color: #16241D !important;
}

/* زرار واتساب: كريمي على أخضر واتساب كان 4.01 — نخليه أبيض */
.akfan .btn--wa,
.akfan .btn--wa * {
  color: #fff !important;
}

/* بادج حالة الخط في كروت الخامات: كريمي على أخضر فاتح كان 3.92 */
.akfan .matc .tag,
.akfan .tag {
  color: #FFFFFF !important;
  font-weight: 800 !important;
}

/* ===== خريطة روابط الفوتر — عشان جوجل يلاقي صفحات المنتجات ===== */
.akf-sitemap {
  margin: 26px 0 0;
  padding: 18px 0 4px;
  border-top: 1px solid rgba(201, 164, 92, .28);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.akf-sitemap .akf-smrow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px 14px;
  padding: 0 78px;
}
.akf-sitemap .akf-smlabel {
  color: var(--akf-gold) !important;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .2px;
  flex: 0 0 100%;
  margin-bottom: -2px;
  text-align: center;
}
.akf-sitemap a.akf-smlink {
  color: rgba(243, 238, 225, .78) !important;
  font-size: 13px;
  line-height: 1.7;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .15s ease, border-color .15s ease;
}
.akf-sitemap a.akf-smlink:hover {
  color: #F3EEE1 !important;
  border-bottom-color: rgba(201, 164, 92, .6);
}
@media (max-width: 640px) {
  .akf-sitemap .akf-smrow { gap: 6px 12px; padding: 0 8px; }
}