/* ==============================================
   POSitive ERP Desk Theme (Combined)
   - Global theme, navbar, search, icons, layout
   - Vuexy-like dark sidebar for Workspaces
   ============================================== */


/* 1️⃣ تعريف خط Tajawal واستخدامه في كل الواجهة */
@font-face {
  font-family: 'Tajawal';
  src: url('/assets/positive_erp/fonts/Tajawal-Regular.ttf') format('truetype'),
    url('/assets/positive_erp/fonts/Tajawal-Medium.ttf') format('truetype'),
    url('/assets/positive_erp/fonts/Tajawal-Bold.ttf') format('truetype'),
    url('/assets/positive_erp/fonts/Tajawal-Black.ttf') format('truetype'),
    url('/assets/positive_erp/fonts/Tajawal-Light.ttf') format('truetype'),
    url('/assets/positive_erp/fonts/Tajawal-ExtraBold.ttf') format('truetype'),
    url('/assets/positive_erp/fonts/Tajawal-ExtraLight.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* ---- POS: compact cards + denser grid (Tailwind override) ---- */
.grid.grid-cols-2.md\:grid-cols-3.lg\:grid-cols-4.xl\:grid-cols-5.gap-4 {
  gap: 12px !important;
}

.interactive-card.h-60 {
  height: 12rem !important;
}

.interactive-card .p-4,
.interactive-card .p-3 {
  padding: 10px !important;
}

.interactive-card .text-base {
  font-size: 0.9rem !important;
  line-height: 1.2 !important;
}

.interactive-card .text-sm {
  font-size: 0.82rem !important;
  line-height: 1.2 !important;
}

.interactive-card {
  border-radius: 12px !important;
}




/* 2️⃣ خلفية عامة هادئة */
html {
  background-color: #f7f9f7;
}

/* 3️⃣ فرض خط Tajawal على أهم عناصر الواجهة */
body,
.desk-container,
.desk-sidebar,
.page-wrapper,
.standard-sidebar-section,
.sidebar-item,
.sidebar-item-label,
.navbar,
.btn,
button {
  font-family: 'Tajawal', sans-serif !important;
}

/* 4️⃣ إزالة خلفية الـ page-head والـ shadow الافتراضي */
.page-head {
  background: transparent !important;
  box-shadow: none !important;
}

/* 5️⃣ خلفية عامة للجسم باستخدام متغيّر brand-bg */
.page-container,
body {
  /* background: #ffffff !important; */
  background: var(--brand-bg) !important;
}

/* 6️⃣ متغيّرات الثيم العامة (ألوان وتحجيم التخطيط) */
:root,
[data-theme="light"] {
  --control-bg: #fdcb0112;
  --disabled-control-bg: #fdcb0112;
  --card-shadow: #ffffff;
  --control-bg-on-gray: #fdcb0112;
  --bg-color: #ffffff;
  --dark-green-avatar-color: #091239;
  --primary-color: #081c09;

  /* مقاسات تخطيط سطح المكتب */
  --sidebar-w: 260px;
  /* عرض السايدبار */
  --layout-pad-x: 24px;
  /* الهوامش يمين/يسار المحتوى */

  [data-theme="light"] {
    --brand-bg: #02150c;
    /* الخلفية الغامقة الأساسية */
    --brand-accent: #00c853;
    /* الأخضر الأساسي */
    --brand-soft: #eaffe9;
    /* الأخضر الفاتح للكروت */
  }

  /* 7️⃣ تنسيق الحقول (inputs) في الفورمات */
  .form-control {
    border: 1px solid #d1d8dd;
    border-radius: 20px;
    padding: 5px 20px;
    font-size: 14px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  }

  .form-control:focus {
    color: var(--text-color);
    background-color: var(--control-bg);
    outline: 0;
    border-color: #80bdff;
    box-shadow:
      inset 0 1px 2px rgba(0, 0, 0, 0.075),
      0 0 8px rgba(128, 189, 255, 0.6);
  }

  /* 8️⃣ عدد الوثائق/التقارير في form links كـ badge صغيرة */
  .form-links .document-link .document-link-badge .count,
  .form-links .document-link .report-link-badge .count {
    font-size: var(--text-xs);
    background-color: #114871;
    border-radius: var(--border-radius-sm);
    color: var(--gray-50);
    padding: 0 var(--padding-xs);
    margin-right: var(--margin-xs);
  }

  /* ================================
     Navbar – Positive Identity
     ================================ */

  /* 9️⃣ إعدادات عامة للـ Navbar (خلفية شفافة + بدون shadow) */
  header.navbar.navbar-expand {
    background: transparent !important;
    border-bottom: none !important;
    box-shadow: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 16px !important;
    margin-left: 0 !important;
    /* ما في margin يسار ثابت */
    margin-right: 0 !important;
  }

  /* 🔟 صندوق أبيض يحتضن محتوى الـ Navbar */
  header.navbar.navbar-expand>.container {
    background: #ffffff !important;
    border-radius: 6px !important;
    height: 64px !important;
    box-shadow: 0px 2px 8px rgb(47 43 61 / 0.12);
  }

  /* 1️⃣1️⃣ توحيد عرض الـ Navbar مع الـ Page Body على الشاشات الكبيرة */
  @media (min-width: 1200px) {

    /* نفس المقاس والموقع للمحتوى والنافبار:
       - يبدأ بعد السايدبار
       - ينتهي قبل حافة الشاشة بنفس المسافة */
    .container.page-body,
    header.navbar.navbar-expand>.container {
      max-width: none !important;
      width: calc(100% - var(--sidebar-w) - (2 * var(--layout-pad-x))) !important;
      margin-left: calc(var(--sidebar-w) + var(--layout-pad-x)) !important;
      margin-right: var(--layout-pad-x) !important;
    }
  }

  /* 1️⃣2️⃣ بطاقات الـ Workspaces (مربعات بيضاء بظل خفيف) */
  [data-page-route=Workspaces] .layout-main .layout-main-section {
    padding: var(--padding-md);
    margin-bottom: var(--margin-sm);
    box-shadow: 0px 3px 12px rgb(47 43 61 / 0.14);
    border-radius: 6px;
  }

  /* 1️⃣3️⃣ إخفاء اللوجو الافتراضي في الهيدر */
  header.navbar.navbar-expand .navbar-brand.navbar-home {
    display: none !important;
  }

  /* 1️⃣4️⃣ توزيع شريط البحث + الأيقونات داخل الـ Navbar */
  header.navbar .collapse.navbar-collapse {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }

  /* 1️⃣5️⃣ جعل الفورم (البحث) يأخذ أغلب عرض الـ Navbar */
  header.navbar form[role="search"].form-inline.fill-width {
    flex: 1 1 auto;
    margin-right: 24px;
  }

  /* 1️⃣6️⃣ حاوية شريط البحث بدون حدود أو خلفية إضافية */
  header.navbar .search-bar {
    position: relative;
    width: 100%;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
  }

  /* 1️⃣7️⃣ حقل البحث – طويل ومستدير مع ظل */
  #navbar-search {
    width: 100%;
    height: 44px !important;
    border-radius: 999px !important;
    border: none !important;
    outline: none !important;
    padding-left: 44px !important;
    padding-right: 16px !important;
    font-size: 14px;
    color: #02150c;
    background-color: #ffffff !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.14);
  }

  #navbar-search::placeholder {
    color: #7c8a80;
  }

  /* 1️⃣8️⃣ أيقونة البحث داخل خانة البحث */
  header.navbar .search-bar .search-icon {
    position: absolute;
    left: 14px !important;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    color: #4b5c52;
  }

  header.navbar .search-bar .search-icon .icon-sm {
    width: 18px;
    height: 18px;
  }

  /* 1️⃣9️⃣ إزالة ستايل awesomplete الداخلي من input */
  header.navbar .search-bar .awesomplete input.form-control {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  .search-bar input[type="text"] {
    padding-left: 42px !important;
  }

  /* ================================
     Navbar Icons (لغة، ثيم، جرس...)
     ================================ */

  /* 2️⃣0️⃣ تنسيق مجموعة الأيقونات في يمين الـ Navbar */
  header.navbar .nav {
    display: flex !important;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding-right: 8px;
    flex: 0 0 20% !important;
    margin-left: 3.5% !important;
  }


  /* 2️⃣1️⃣ شكل الأيقونات الدائرية */
  header.navbar .navbar-nav .nav-item>.nav-link,
  header.navbar .navbar-nav .nav-item>button.nav-link {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0 2px;
    background: transparent;
    border: none;
    color: #02150c !important;
  }

  header.navbar .navbar-nav .es-icon.icon-sm,
  header.navbar .navbar-nav .icon.icon-sm {
    width: 18px;
    height: 18px;
    filter: none !important;
    color: #02150c;
  }

  header.navbar .navbar-nav .vertical-bar {
    width: 1px;
    height: 22px;
    background: rgba(2, 21, 12, 0.28);
    margin: 0 4px;
  }

  /* ================================
     User Avatar in Navbar
     ================================ */

  /* 2️⃣2️⃣ شكل صورة المستخدم في الـ Navbar */
  .dropdown-navbar-user .avatar.avatar-medium {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    position: relative;
    box-shadow: 0 0 0 2px var(--brand-accent);
  }

  .dropdown-navbar-user .avatar-frame.standard-image {
    width: 100%;
    height: 100%;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    background: radial-gradient(circle at 30% 0, #1aff7a, #00c853);
    color: #ffffff !important;
    position: relative;
  }

  .dropdown-navbar-user .avatar-frame.standard-image::after {
    content: "";
    position: absolute;
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: #00c853;
    border: 2px solid #ffffff;
    bottom: 0;
    right: -1px;
  }

  /* 2️⃣3️⃣ إخفاء بعض عناصر المساعدة غير الضرورية */
  .nav-item.dropdown.dropdown-help.dropdown-mobile.d-none.d-lg-block,
  .dropdown-help.dropdown-mobile {
    display: none !important;
  }

  .nav.navbar-nav li a::before {
    filter: none !important;
  }

  /* ================================
     Page-head alignment
     ================================ */

  /* 2️⃣4️⃣ محاذاة محتوى رأس الصفحة لليسار مع مساحة داخلية */
  .row.flex.align-center.page-head-content.justify-between {
    justify-content: flex-start !important;
    padding-left: 2rem !important;
    width: 100% !important;
  }

  .page-head>.container {
    max-width: 100% !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
  }

  /* ================================
     Sidebar Icons (Modules icons)
     ================================ */

  /* 2️⃣5️⃣ أيقونة لكل عنصر في السايدبار بدلاً من SVG الافتراضي */
  .desk-sidebar .sidebar-item-icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin-right: var(--margin-sm);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }

  .desk-sidebar .sidebar-item-icon svg {
    display: none !important;
  }

  /* 2️⃣6️⃣ تخصيص أيقونات الوورك سبيس المختلفة */
  .desk-sidebar .sidebar-item-container[item-name="Dashboards"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/dashboard.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Home"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/mansion.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Projects"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/mansion.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Accounting"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/accounting.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Stock"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/ready-stock.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Buying"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/shopping.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Selling"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/sell.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="POS Advanced"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/checkout.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Assets"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/asset-management.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Reports"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/seo-report.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Healthcare"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/healthcare.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="Management"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/task-management.png") !important;
  }

  .desk-sidebar .sidebar-item-container[item-name="HR"] .sidebar-item-icon {
    background-image: url("/assets/positive_erp/icons/hiring.png") !important;
  }

  .desk-sidebar .desk-sidebar-item .item-anchor {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    gap: 6px !important;
    line-height: 1.1 !important;
  }

  .desk-sidebar .sidebar-item-label {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #222 !important;
    display: inline-block;
    line-height: 1;
    margin-top: 1px;
  }

  /* ================================
     Fix: content width on Doctype pages
     ================================ */
  @media (min-width: 1200px) {

    /* 2️⃣7️⃣ تخصيص عرض الوورك سبيس فقط */
    body[data-route^="Workspaces/"] .container.page-body,
    body[data-route^="Workspaces/"] header.navbar.navbar-expand>.container {
      max-width: none !important;
      width: calc(100% - var(--sidebar-w) - (2 * var(--layout-pad-x))) !important;
      margin-left: calc(var(--sidebar-w) + var(--layout-pad-x)) !important;
      margin-right: var(--layout-pad-x) !important;
    }

    /* 2️⃣8️⃣ صفحات الدوكتايب (List / Form / Report ...) بعرض متساوي يمين ويسار */
    body:not([data-route^="Workspaces/"]) .container.page-body,
    body:not([data-route^="Workspaces/"]) header.navbar.navbar-expand>.container {
      max-width: 100% !important;
      width: calc(100% - 2 * var(--layout-pad-x)) !important;
      margin-left: var(--layout-pad-x) !important;
      margin-right: var(--layout-pad-x) !important;
    }

    /* 2️⃣9️⃣ جعل الـ layout-main-section يستخدم عرض الكونتينر بالكامل */
    body .layout-main-section {
      width: 100% !important;
    }

    /* 3️⃣0️⃣ إزالة ::before القديم للّوجو (علشان نعتمد على العنصر الحقيقي) */
    header.navbar.navbar-expand>.container::before {
      content: none !important;
    }

    /* 3️⃣1️⃣ اللوجو الحقيقي في الهيدر (معتمد على .positive-logo-hit-area من الجافاسكربت) */
    header.navbar.navbar-expand>.container .positive-logo-hit-area {
      position: absolute;
      top: 50%;
      left: 40px !important;
      /* عدّل الرقم لزيادة المسافة عن اليسار */
      transform: translateY(-50%);
      width: 40px;
      height: 40px;
      background: url("/assets/positive_erp/icons/POSitive-logo.png") no-repeat center;
      background-size: contain;
      z-index: 10;
      cursor: pointer;
    }

  }

}

/* نهاية بلوك :root / [data-theme="light"] */


/* ==========================================================
   3️⃣2️⃣ Vuexy-like Dark Sidebar (Workspaces only) – from custom_sidebar.css
   - سايدبار داكن ثابت بطول الصفحة على بعض الـ Workspaces
   ========================================================== */
@media (min-width: 992px) {

  /* ✅ حصر التأثير فقط على قائمة Workspaces المحددة */
  body[data-route^="Workspaces/"],
  body[data-route="Workspaces"] {

    /* 3️⃣3️⃣ متغيّرات الثيم للسايدبار الداكن */
    --top-offset: 0;
    --sidebar-w: 280px;

    /* Brand */
    --p-green: #00C853;
    --p-green-2: #00B84B;

    /* ✅ خلفية داكنة للسايدبار */
    --sb-bg: #081c09;

    /* Text on dark */
    --text: rgba(255, 255, 255, 0.92);
    --muted: rgba(255, 255, 255, 0.68);
    --muted-2: rgba(255, 255, 255, 0.52);

    /* Hover + separators */
    --hover-bg: rgba(255, 255, 255, 0.07);
    --group-sep: rgba(255, 255, 255, 0.08);

    /* Shapes */
    --radius: 14px;
    --radius-pill: 16px;
    --t: 0.22s ease;

    --sb-font: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

    /* 3️⃣4️⃣ إخفاء زر توسيع السايدبار وعنوان الصفحة في الـ header داخل الوورك سبيس */
    & .page-head .btn-reset.sidebar-toggle-btn,
    & .page-head .ellipsis.title-text {
      display: none !important;
    }

    /* 3️⃣5️⃣ ضمان أن الـ layout يمتد بارتفاع الشاشة بالكامل */
    & .page-container,
    & .page-container .layout-main {
      min-height: 100vh !important;
      align-items: stretch !important;
    }

    /* 3️⃣6️⃣ السايدبار: position fixed من أعلى لأسفل مع خلفية داكنة */
    & .layout-side-section {
      position: fixed !important;
      left: 0 !important;
      top: 0 !important;
      bottom: 0 !important;
      height: auto !important;

      z-index: 1000000 !important;

      width: var(--sidebar-w) !important;
      max-width: var(--sidebar-w) !important;

      background: var(--sb-bg) !important;

      padding: 4px 12px 4px 25px;
      overflow-y: auto !important;
      overflow-x: hidden !important;

      box-sizing: border-box;
      font-family: var(--sb-font) !important;
    }

    /* 3️⃣7️⃣ المحتوى الرئيسي يتحرك يمين بحيث يترك مساحة للسايدبار */
    & .layout-main-section {
      flex: 1 1 auto;
      /* margin-left: var(--sidebar-w) !important; */
      transition: margin-left var(--t);
    }

    /* 3️⃣8️⃣ لوجو في أعلى السايدبار على طريقة Vuexy */
    & .layout-side-section::before {
      content: "";
      display: block;
      height: 80px;
      /* ارتفاع مساحة اللوجو */
      width: 100%;
      background-image: url("/assets/positive_erp/icons/logo new.png");
      background-repeat: no-repeat;
      background-position: left center;
      background-size: 100px auto;
      /* عرض اللوجو */
      opacity: 0.95;
    }

    /* 3️⃣9️⃣ عناوين الأقسام في السايدبار (SECTION headers) */
    & .standard-sidebar-label,
    & .standard-sidebar-label .section-title {
      color: var(--muted-2) !important;
      font-family: var(--sb-font) !important;
    }

    & .standard-sidebar-label {
      display: flex;
      align-items: center;
      justify-content: space-between;

      width: 100%;
      padding: 0.35rem 0.35rem;
      margin: 0.95rem 0 0.25rem;

      font-size: 0.74rem;
      text-transform: uppercase;
      letter-spacing: 1.4px;

      background: none !important;
      border: 0 !important;
      opacity: 1 !important;
      visibility: visible !important;
    }

    & .standard-sidebar-label svg {
      color: var(--muted-2) !important;
    }

    /* 4️⃣0️⃣ العناصر الأساسية في السايدبار (شكل Vuexy) */
    & .desk-sidebar-item {
      display: flex;
      align-items: center;

      width: 100%;
      margin: 0.18rem 0;

      border-radius: 6px;
      padding: 8px 12px;

      cursor: pointer;
      position: relative;
      box-sizing: border-box;

      transition: background-color var(--t), transform var(--t), box-shadow var(--t);
    }

    & .desk-sidebar-item .item-anchor {
      display: flex;
      align-items: center;
      width: 100%;

      text-decoration: none;
      gap: 0.85rem;

      color: var(--text) !important;
      font-family: var(--sb-font) !important;
    }

    /* 4️⃣1️⃣ أيقونات العناصر في السايدبار الداكن */
    & .sidebar-item-icon {
      display: inline-flex;
      width: 2.05rem;
      height: 2.05rem;

      align-items: center;
      justify-content: center;

      color: var(--muted) !important;
      flex: 0 0 auto;

      border-radius: 12px;
      transition: background-color var(--t), color var(--t), opacity var(--t);

      opacity: 1 !important;
    }

    /* 4️⃣2️⃣ نص التسمية لكل عنصر */
    & .sidebar-item-label {
      flex: 1;
      font-size: 14px;
      font-weight: 500;
      letter-spacing: 0.2px;

      color: var(--text) !important;
      opacity: 1 !important;
    }

    /* 4️⃣3️⃣ عناصر فرعية (إن وجدت) */
    & .sidebar-child-item,
    & .sidebar-child-item a {
      color: var(--muted) !important;
      opacity: 1 !important;
    }

    /* 4️⃣4️⃣ حالة hover للعناصر */
    & .desk-sidebar-item:hover:not(.selected) {
      background-color: var(--hover-bg);
      transform: translateY(-1px);
    }

    & .desk-sidebar-item:hover:not(.selected) .sidebar-item-icon {
      background-color: rgba(255, 255, 255, 0.10);
      color: #fff !important;
    }

    /* 4️⃣5️⃣ حالة العنصر المختار (Gradient أخضر) */
    & .desk-sidebar-item.selected {
      background: linear-gradient(90deg, var(--p-green), var(--p-green-2));
      box-shadow: 0 14px 26px rgba(0, 200, 83, 0.22);
    }

    & .desk-sidebar-item.selected :is(.item-anchor, .sidebar-item-label, .sidebar-item-icon) {
      color: #fff !important;
    }

    /* 4️⃣6️⃣ فرض الخط والألوان على كل النصوص داخل السايدبار */
    & .layout-side-section :is(.sidebar-item-label,
      & .standard-sidebar-label,
      & .standard-sidebar-label .section-title,
      & .sidebar-child-item,
      & .sidebar-child-item a,
      & .item-anchor) {
      font-family: var(--sb-font) !important;
    }

    & .layout-side-section a.item-anchor,
    & .layout-side-section a.item-anchor span,
    & .layout-side-section .sidebar-item-label {
      color: rgba(255, 255, 255, 0.92) !important;
      opacity: 1 !important;
    }

    & .layout-side-section .desk-sidebar-item:not(.selected) .sidebar-item-label {
      color: rgba(255, 255, 255, 0.88) !important;
    }

    & .layout-side-section .desk-sidebar-item:hover .sidebar-item-label {
      color: #ffffff !important;
    }

    & .layout-side-section .desk-sidebar-item.selected,
    & .layout-side-section .desk-sidebar-item.selected .item-anchor,
    & .layout-side-section .desk-sidebar-item.selected .sidebar-item-label {
      color: #ffffff !important;
    }

    & .layout-side-section .desk-sidebar-item .sidebar-item-icon {
      color: rgba(255, 255, 255, 0.85) !important;
    }

    & .layout-side-section .desk-sidebar-item.selected .sidebar-item-icon {
      color: #ffffff !important;
    }

    /* 4️⃣7️⃣ إخفاء زر label القديم وبعض الأيقونات في وضع التعديل */
    & .btn-reset.standard-sidebar-label {
      display: none !important;
    }

    & .btn-reset.drop-icon.show-in-edit-mode svg {
      filter: invert(1);
    }

    /* 4️⃣8️⃣ إخفاء ::before القديم للّوجو في الـ Navbar داخل الوورك سبيس فقط */
    & header.navbar.navbar-expand>.container::before {
      display: none !important;
    }

    & .standard-sidebar .standard-sidebar-item:focus-within,
    & .desk-sidebar .standard-sidebar-item:focus-within,
    & .search-dialog .search-results .search-sidebar .standard-sidebar-item:focus-within {
      background-color: rgb(255 255 255 / 0.88) !important;
    }

    /* إخفاء زر Toggle Full Width */
    & button.btn-reset.dropdown-item[onclick*="toggle_full_width"] {
      display: none !important;
    }

    /* إخفاء زر Toggle Theme */
    & button.btn-reset.dropdown-item[onclick*="ThemeSwitcher"] {
      display: none !important;
    }




  }

}

/* ================================
   RTL Adjustments – نقل السايدبار لليمين في العربي
   ================================ */
@media (min-width: 992px) {

  /* السايدبار نفسه يرجع يمين */
  html[dir="rtl"] body[data-route^="Workspaces/"] .layout-side-section {
    left: auto !important;
    right: 0 !important;
    padding: 4px 25px 4px 12px;
  }

  /* المحتوى الرئيسي يتحرك عكسه */
  html[dir="rtl"] body[data-route^="Workspaces/"] .layout-main-section {
    margin-left: var(--layout-pad-x) !important;
    /* margin-right: var(--sidebar-w) !important; */
  }

  /* النافبار + الـ page body يوازوا السايدبار من جهة اليمين */
  html[dir="rtl"] body[data-route^="Workspaces/"] header.navbar.navbar-expand>.container,
  html[dir="rtl"] body[data-route^="Workspaces/"] .container.page-body {
    margin-left: var(--layout-pad-x) !important;
    margin-right: calc(var(--sidebar-w) + var(--layout-pad-x)) !important;
  }


  html[dir="rtl"] header.navbar.navbar-expand>.container::before {
    content: none !important;
  }

  /* 3️⃣1️⃣ اللوجو الحقيقي في الهيدر (معتمد على .positive-logo-hit-area من الجافاسكربت) */
  html[dir="rtl"] header.navbar.navbar-expand>.container .positive-logo-hit-area {
    position: absolute;
    top: 50%;
    right: 40px !important;
    /* عدّل الرقم لزيادة المسافة عن اليسار */
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: url("/assets/positive_erp/icons/POSitive-logo.png") no-repeat center;
    background-size: contain;
    z-index: 10;
    cursor: pointer;
  }

  html[dir="rtl"] header.navbar .nav {

    margin-right: 3.5% !important;
  }
}