/* =========================
   Settings v2 — RTL Final CSS
   ========================= */

/* أساسيات و RTL */
.settings-v2{
  direction: rtl; text-align: right;
  --brand:#0baa68; --brand-600:#079155; --ink:#0b2239; --line:#e7edf3;
  --card-bg:#eaf4ff; --card-border:#cfe4ff; --card-shadow:0 6px 20px rgba(10,23,41,.06);
  --radius-lg:16px;
}

/* =========================
   Sentiments page styles
   ========================= */
.sentiment-table{
  width:100%;
  table-layout: fixed; /* allow predictable column sizing so long names don't push row height */
  border-collapse: separate; /* show gaps between headers to feel like 'separate tabs' */
  border-spacing: 6px 6px;
}

.sentiment-table thead th {
  
  color: #212529;
  background: #fff;
  padding: 10px 12px;
  font-weight: 700;
  border: none;
  text-align: center;
  border-radius: 0;
  box-shadow: none;
}

.sentiment-table thead th + th { /* keep a subtle separation */
  /* visual separation handled by border-spacing */
}

.sentiment-table tbody td {
  vertical-align: middle;
  padding: 14px;
  background: #fff;
  border-top: 1px solid #f1f1f1;
}

/* Make the name column wider and scalable, but keep text in one line with ellipsis */
.sentiment-table thead th:nth-child(2),
.sentiment-table tbody td:nth-child(2) {
  width: 40%; /* prefer wider name column */
  min-width: 180px;
}

.sentiment-name-cell .sentiment-name {
  display:block; width:100%; max-width:100%;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}

.sentiment-table .btn { padding: 6px 10px; }

/* Add a subtle divider under the header row (visual grouping) */
.sentiment-table thead { display: table-header-group; }
.sentiment-table thead th { position: relative; }
.sentiment-table thead th::after{
  content: '';
  position: absolute; left: 8px; right: 8px; bottom: -10px; height: 8px;
  background: transparent;
}

/* asset-tabs tweaks for sentiments page (separate & nicer colors) */
.profile-sentiments .asset-tabs .nav{ display:flex; justify-content:center; gap:10px; }
.profile-sentiments .asset-tabs .nav-link{ background:#fff; border:1px solid #e8f3f0; color:#0b3b35; padding:7px 14px; border-radius:999px; box-shadow:0 1px 0 rgba(11,122,92,0.06); }
.profile-sentiments .asset-tabs .nav-link.active{ background:linear-gradient(90deg,#e6fff3,#e6f9ff); color:#0b7a6b; border-color:rgba(11,170,104,.12); }
.profile-sentiments .asset-tabs .nav-link:hover{ background:#f3fff9; }

/* Sidebar small refinement */
.side-panel .side-card{ background:#f7f9fb; border-radius:8px; padding:18px; box-shadow:0 2px 6px rgba(0,0,0,.03); text-align:right; }
.side-panel .side-card__title{ font-weight:700; margin-bottom:12px; color:#0b7a6b; }

@media (max-width:991px){
  .sentiment-table{ table-layout: auto; border-spacing:4px 4px; }
  .sentiment-name-cell .sentiment-name{ max-width:180px; white-space:nowrap; }
  .sentiment-table thead th{ font-size:13px; padding:8px 10px }
}

/* Sidebar/stats alignment: keep it visually aligned with the table and sticky */
.side-panel{ display:flex; align-items:flex-start; }
.side-panel .side-card{ width:100%; box-shadow:0 6px 20px rgba(10,23,41,.04); }
.side-panel .side-card{ position: sticky; top: 100px; }
.side-panel .side-card__title{ font-size:15px; color:var(--brand); }
.side-panel .side-card__list li{ margin:8px 0; font-weight:600; color:#16323b }

/* spacing between table card and sidebar */
.profile-sentiments { display:block; }
.profile-sentiments .table-responsive{ margin-top:18px }
.settings-card{ padding:22px }

/* small helper to keep header cells more separated from the table body */
.sentiment-table thead th{ margin-bottom:6px }


/* =========================
   Sentiments Page: Table & Tabs
   ========================= */

/* ============================================
   Sentiments Table: Force name to scale horizontally
   ============================================ */
.sentiment-table {
  table-layout: fixed !important;
  width: 100% !important;
  border-collapse: collapse !important;
}

/* Make name column take wider space (40% of table width) */
.sentiment-table thead th:nth-child(2),
.sentiment-table tbody td:nth-child(2) {
  width: 40% !important;
  min-width: 280px !important;
}

/* Force name cell to NOT wrap — stays on one line with ellipsis */
.sentiment-name-cell {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  padding: 14px !important;
}

.sentiment-name-cell .sentiment-name {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* ============================================
   Table Header Styling
   ============================================ */
.sentiment-table thead th {
  
  color: #212529 !important;
  background: #fff !important;
  padding: 14px 12px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-align: center !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ============================================
   Asset Tabs: Professional Pill Design
   ============================================ */
.asset-tabs {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  margin-top: 16px !important;
  margin-bottom: 20px !important;
  padding: 12px 0 !important;
  border-bottom: 2px solid #e8f1ed !important;
}

.asset-tabs .nav {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center !important;
  justify-content: center !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.asset-tabs .nav-item {
  margin: 0 !important;
  padding: 0 !important;
}

.asset-tabs .nav-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 18px !important;
  background: #ffffff !important;
  color: #0b7a6b !important;
  border: 1.5px solid #d0e8e3 !important;
  border-radius: 25px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 2px 8px rgba(11, 122, 92, 0.06) !important;
}

.asset-tabs .nav-link:hover {
  background: #f0fdfb !important;
  border-color: #0b7a6b !important;
  box-shadow: 0 6px 16px rgba(11, 122, 92, 0.12) !important;
  transform: translateY(-3px) !important;
}

.asset-tabs .nav-link.active {
  background: linear-gradient(135deg, #0b7a6b 0%, #079155 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 8px 24px rgba(11, 122, 92, 0.2) !important;
  transform: none !important;
  font-weight: 700 !important;
}

/* ============================================
   Sidebar Stats Card
   ============================================ */
.side-panel .side-card {
  padding: 20px !important;
  border-radius: 12px !important;
  background: #f8fafb !important;
  border: 1px solid #e7edf3 !important;
  box-shadow: 0 4px 12px rgba(11, 122, 92, 0.05) !important;
}

.side-panel .side-card__title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0b7a6b !important;
  margin-bottom: 12px !important;
}

.side-panel .side-card__list li {
  font-weight: 600 !important;
  color: #16323b !important;
  margin: 8px 0 !important;
}

/* ============================================
   Responsive Design
   ============================================ */
@media (max-width: 768px) {
  .sentiment-table thead th:nth-child(2),
  .sentiment-table tbody td:nth-child(2) {
    width: 35% !important;
    min-width: 200px !important;
  }
  
  .sentiment-name-cell {
    padding: 12px !important;
  }
  
  .asset-tabs {
    margin-top: 12px !important;
    margin-bottom: 16px !important;
  }
  
  .asset-tabs .nav-link {
    padding: 8px 14px !important;
    font-size: 12px !important;
  }
}

@media (max-width: 480px) {
  .sentiment-table thead th:nth-child(2),
  .sentiment-table tbody td:nth-child(2) {
    width: 30% !important;
    min-width: 160px !important;
  }
  
  .asset-tabs .nav {
    gap: 8px !important;
  }
  
  .asset-tabs .nav-link {
    padding: 6px 12px !important;
    font-size: 11px !important;
  }
}

/* =========================
   تبويبات أعلى/أسفل الصفحة
   ========================= */

/* غلاف التبويبات = صف مرن (حتى لو وُجد عناصر خارج <ul> مثل "بروفايل") */
.settings-v2 .settings-tabs-top,
.settings-v2 .settings-tabs-sub{
  display:flex; align-items:center; flex-wrap:wrap;
  gap:0; margin:8px 0 10px;
}

/* UL التبويبات: وسط، بدون نقاط، مسافات مضبوطة */
.settings-v2 .settings-tabs-top ul,
.settings-v2 .settings-tabs-sub ul{
  flex:1 1 auto;
  display:flex !important; justify-content:center; align-items:center; flex-wrap:wrap;
  list-style:none !important; margin:0 !important; padding:6px 0 !important;
  column-gap:12px; row-gap:6px; width:100%;
}

/* إزالة أي هوامش افتراضية على العناصر */
.settings-v2 .settings-tabs-top li,
.settings-v2 .settings-tabs-sub li{
  margin:0; padding:0;
}

/* روابط التبويبات: حجم وبدون فراغات زائدة */
.settings-v2 .settings-tabs-top a,
.settings-v2 .settings-tabs-sub a,
.settings-v2 .settings-tabs-top .nav-link,
.settings-v2 .settings-tabs-sub .nav-link{
  display:inline-flex; align-items:center; gap:6px;
  text-decoration:none; white-space:nowrap;
  color:#0e3b46; font-weight:600; font-size:14px;
  padding:6px 12px; margin:0; line-height:1;
  border-radius:8px; transition:.15s ease;
}

/* hover */
.settings-v2 .settings-tabs-top a:hover,
.settings-v2 .settings-tabs-sub a:hover,
.settings-v2 .settings-tabs-top .nav-link:hover,
.settings-v2 .settings-tabs-sub .nav-link:hover{
  background:#e6f4ff;
}

/* active مطابق للتصميم */
.settings-v2 .settings-tabs-top .active,
.settings-v2 .settings-tabs-sub .active,
.settings-v2 .settings-tabs-top .nav-link.active,
.settings-v2 .settings-tabs-sub .nav-link.active{
  background:rgba(11,170,104,.12);
  box-shadow:inset 0 -2px 0 var(--brand);
  color:var(--ink);
}

/* دفع "بروفايل" للطرف حتى لو كان خارج <ul> داخل الغلاف */
.settings-v2 .settings-tabs-top > a:last-child,
.settings-v2 .settings-tabs-top > .btn:last-child,
.settings-v2 .settings-tabs-top > .profile-link:last-child{
  margin-inline-start:auto; /* يعمل في RTL */
}

/* ولو كان "بروفايل" آخر LI داخل نفس UL (تغطية احتياطية) */
.settings-v2 .settings-tabs-top ul > li.last-auto,
.settings-v2 .settings-tabs-top ul > li.profile,
.settings-v2 .settings-tabs-top ul > li:last-child.keep-edge{
  margin-inline-start:auto;
}

/* تقليل الفراغ الرأسي قبل/بعد التبويبات وأعلى القسم */
.settings-v2 .content-section{ padding-top:.5rem; }

/* =========================
   الكرت الجانبي (يمين)
   ========================= */
.settings-v2 .side-card{
  background:#eaf5ff; border:1px solid #d6e9fb; border-radius:14px; padding:16px;
  box-shadow:0 2px 8px rgba(14,59,70,.06);
}
.settings-v2 .side-card__title{font-weight:700;margin-bottom:8px;color:#0e3b46}
.settings-v2 .side-card__list{list-style:none;margin:0;padding:0}
.settings-v2 .side-card__list li{margin:6px 0}
.settings-v2 .side-card__list a{color:#088178;font-weight:600;text-decoration:none}
.settings-v2 .side-card__list a:hover{color:#066b63;text-decoration:underline}

/* =========================
   بطاقة الفورم
   ========================= */
.settings-v2 .settings-card{
  border:1px solid var(--line); border-radius:var(--radius-lg);
  box-shadow:var(--card-shadow); padding:20px; background:#fff;
}
.settings-v2 .settings-card__title{
  color:var(--ink);font-weight:800;text-align:center;margin-bottom:1rem;
}

/* الحقول والأزرار */
.settings-v2 .form-label{font-weight:700;color:var(--ink)}
.settings-v2 .form-control,
.settings-v2 .form-select{
  border-radius:10px;border-color:var(--line);
}
.settings-v2 .form-control:focus,
.settings-v2 .form-select:focus{
  border-color:var(--brand); box-shadow:0 0 0 .2rem rgba(11,170,104,.15);
}

/* زر أساسي */
.settings-v2 .btn.btn-primary{
  background:var(--brand); border-color:var(--brand);
  border-radius:10px; font-weight:700;
}
.settings-v2 .btn.btn-primary:hover{
  background:var(--brand-600); border-color:var(--brand-600);
}

/* رفع الملفات */
.settings-v2 .upload-box{
  display:block;width:100%;border:2px dashed var(--card-border);border-radius:12px;padding:18px;
  text-align:center;cursor:pointer;background:#fff;transition:.15s;
}
.settings-v2 .upload-box:hover{border-color:var(--brand)}
.settings-v2 .upload-box input[type=file]{display:none}

/* تماسك مسافات Bootstrap داخل الصف */
.settings-v2 .content-section .row{ --bs-gutter-x:1.5rem; }

/* (اختياري) تنظيف مسافات nav-pills/nav-tabs الافتراضية إن وُجدت */
.settings-v2 .nav{ --bs-nav-link-padding-x:0; --bs-nav-link-padding-y:0; }


/* =========================
   HOTFIX: تبويبات settings-v2
   ========================= */

/* الغلاف العام لتبويبات الأعلى والأسفل */
.settings-v2 .settings-tabs-top,
.settings-v2 .settings-tabs-sub {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between; /* مثل التصميم الجديد */
  margin: 0 0 12px;
  padding: 0;
}

/* القائمة الداخلية */
.settings-v2 .settings-tabs-top ul,
.settings-v2 .settings-tabs-sub ul {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 12px;
  flex: 1 1 auto;
}

/* كل عنصر */
.settings-v2 .settings-tabs-top li,
.settings-v2 .settings-tabs-sub li {
  margin: 0;
  padding: 0;
}

/* الروابط العامة */
.settings-v2 .settings-tabs-top a,
.settings-v2 .settings-tabs-sub a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  font-weight: 600;
  color: #0e3b46;
  padding: 6px 12px;
  border-radius: 8px;
  transition: .15s ease;
  line-height: 1;
  white-space: nowrap;
}

/* Hover */
.settings-v2 .settings-tabs-top a:hover,
.settings-v2 .settings-tabs-sub a:hover {
  background: #e6f4ff;
}

/* Active */
.settings-v2 .settings-tabs-top .active,
.settings-v2 .settings-tabs-sub .active {
  background: rgba(11,170,104,.12);
  box-shadow: inset 0 -2px 0 var(--brand);
  color: var(--ink);
}

/* رابط بروفايل (أو آخر عنصر خارج ul) على الطرف الأيسر */
.settings-v2 .settings-tabs-top > a:last-child,
.settings-v2 .settings-tabs-top > .profile-link:last-child {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: #0e3b46;
  text-decoration: none;
}

/* أيقونة البروفايل */
.settings-v2 .settings-tabs-top > a:last-child img {
  width: 20px;
  height: 20px;
}

/* تصغير الفراغ قبل التبويبات الفرعية */
.settings-v2 .settings-tabs-sub { margin-top: -6px; }

/* تحسين تماسك الخطوط والألوان */
.settings-v2 .settings-tabs-top a,
.settings-v2 .settings-tabs-sub a {
  font-size: 14px;
  color: #0e3b46;
}


/* =========================
   HOTFIX: تبويبات البار السفلي (تفاصيلك...)
   يتوافق مع بنية _tabs-sub.blade.php
   ========================= */

/* غلاف البار السفلي */
.settings-v2 .settings-tabs-sub {
  display: flex; align-items: center; justify-content: center;
  margin-top: -6px; /* مطابق للصورة الجديدة ويقلل الفراغ */
}

/* إزالة أي حشوات من الـ container الداخلي */
.settings-v2 .settings-tabs-sub .settings-tabs .container-xl {
  padding-right: 0; padding-left: 0;
}

/* قائمة التبويبات */
.settings-v2 .settings-tabs-sub .settings-tabs__list {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  list-style: none; margin: 0; padding: 0;
  column-gap: 12px; row-gap: 6px;
}

/* عناصر القائمة */
.settings-v2 .settings-tabs-sub .settings-tabs__list > li { margin: 0; padding: 0; }

/* الروابط (مطابقة للتصميم الجديد) */
.settings-v2 .settings-tabs-sub .settings-tabs__list > li > a {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; line-height: 1; white-space: nowrap;
  border-radius: 8px; font-weight: 600; font-size: 14px;
  color: #0e3b46; text-decoration: none; transition: .15s ease;
}

/* Hover */
.settings-v2 .settings-tabs-sub .settings-tabs__list > li > a:hover {
  background: #e6f4ff;
}

/* Active (الكلاس القادم من البليد هو is-active) */
.settings-v2 .settings-tabs-sub .settings-tabs__list > li > a.is-active {
  background: rgba(11,170,104,.12);
  box-shadow: inset 0 -2px 0 var(--brand);
  color: var(--ink);
}

/* (أمان) لو تحوّل الكلاس لاحقاً إلى active */
.settings-v2 .settings-tabs-sub .settings-tabs__list > li > a.active {
  background: rgba(11,170,104,.12);
  box-shadow: inset 0 -2px 0 var(--brand);
  color: var(--ink);
}


/* ===== Divider + Profile final fixes ===== */

/* اجعل شريط التبويبات العلوي يحتوي خطاً سفلياً كالفريم في التصميم */
.settings-v2 .settings-tabs-top{
  position: relative;
  padding-bottom: 8px;            /* يقرّب الخط من العناصر */
  border-bottom: 1px solid var(--line);  /* <-- الخط الفاصل */
}

/* قلّل المسافة فوق الشريط السفلي ليظهر وكأنه تحت الخط مباشرة */
.settings-v2 .settings-tabs-sub{
  margin-top: 10px;   /* بدل -6px السابقة */
}

/* توزيع عناصر الشريط العلوي تماماً مثل التصميم:
   - القائمة (ul) تتوسّط وتأخذ المساحة
   - رابط البروفايل ينزاح للطرف الأيسر في RTL ولا ينكسر سطر */
.settings-v2 .settings-tabs-top ul{
  order: 1;            /* في البداية */
  flex: 1 1 auto;      /* تمدد في المنتصف */
}
.settings-v2 .settings-tabs-top .profile-link,
.settings-v2 .settings-tabs-top > a:last-child{
  order: 2;                        /* بعد الـ ul */
  margin-inline-start: auto;       /* ادفعه للطرف (يعمل في RTL) */
  min-width: max-content;          /* امنع الانكسار */
  display: inline-flex; align-items: center; gap: 6px;
}

/* لو كان البروفايل داخل UL بالخطأ، خليه يلتصق بالطرف أيضاً (تغطية احتياطية) */
.settings-v2 .settings-tabs-top ul > li.profile,
.settings-v2 .settings-tabs-top ul > li.keep-edge,
.settings-v2 .settings-tabs-top ul > li:last-child.keep-edge{
  margin-inline-start: auto;
}

/* اتساق طفيف مع التصميم: حجم أصغر للبادج النشط */
.settings-v2 .settings-tabs-top a.active,
.settings-v2 .settings-tabs-sub a.is-active{
  box-shadow: inset 0 -2px 0 var(--brand);
}



/*اخر اضافة  */


/* بقية التابات في التبويب ترتيبات  */

/* ========== FRAME ========== */
.settings-v2 { --tab-gap: 10px; --tab-radius: 10px; --tab-border:#E6EEF3; --tab-active:#0E2A3A; --tab-muted:#6B7A86; }

/* حاوية البار العلوي (الترتيبات …) */
.settings-tabs-top { margin-top: 20px; margin-bottom: 8px; }
.settings-tabs-top .border-tab-main-bottom{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  border-bottom:1px solid var(--tab-border);
  padding-bottom:8px;
}
/* قائمة التبويبات العلوية */
.settings-tabs-top .border-tab{
  display:flex; gap:var(--tab-gap); flex-wrap:wrap;
  list-style:none; padding:0; margin:0;
}
.settings-tabs-top .border-tab .nav-item .nav-link{
  display:inline-block; padding:8px 12px; border-radius:var(--tab-radius);
  color:var(--tab-muted); font-weight:700; line-height:1;
}
.settings-tabs-top .border-tab .nav-item .nav-link.active{ color:var(--tab-active); }

/* رابط بروفايل (يمين البار العلوي) */
.settings-tabs-top .profile-link{
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  margin-inline-start:auto; /* يدفعه لليمين */
  color:var(--tab-active);
}
.settings-tabs-top .profile-link img{ width:18px; height:18px; }

/* خط فاصل واضح بين البارين العلوي والسفلي */
.settings-tabs-top + .settings-tabs-sub{
  position:relative; margin-top:8px;
}
.settings-tabs-top + .settings-tabs-sub::before{
  content:""; position:absolute; inset-inline:0; top:-10px; height:1px; background:var(--tab-border);
}

/* البار السفلي (تفاصيلك – بريد – نسخة – إغلاق) */
.settings-tabs-sub{ margin-bottom:20px; }
.settings-tabs-sub .settings-tabs__list{
  list-style:none; padding:0; margin:0; display:flex; gap:var(--tab-gap); flex-wrap:wrap;
}
.settings-tabs-sub .settings-tabs__list a{
  display:inline-block; padding:10px 14px; border:1px solid var(--tab-border);
  border-radius:999px; color:var(--tab-muted); background:#fff; font-weight:700;
}
.settings-tabs-sub .settings-tabs__list a.is-active{
  color:#fff; background:#0EA47A; border-color:#0EA47A;
}

/* كارت الجانب الأيمن (القائمة المختصرة) */
.side-card{ background:#EAF5FF; border-radius:12px; padding:16px; }
.side-card__title{ font-weight:700; margin-bottom:8px; }
.side-card__list{ list-style:none; padding:0; margin:0; }
.side-card__list li + li{ margin-top:8px; }
.side-card__list a{ color:#0E2A3A; font-weight:700; }

/* عنوان H1 داخل البطاقة الكبيرة */
.settings-card__title{ font-weight:800; color:#0E2A3A; }

/* صندوق الرفع */
.upload-box{ border:1px dashed #BDD4E2; border-radius:12px; padding:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.upload-box.dragover{ background:#F7FBFE; }

/* صغر الهوامش في الشاشات الصغيرة */
@media (max-width: 576px){
  .settings-tabs-top .border-tab-main-bottom{ gap:8px; }
  .settings-tabs-top .profile-link{ margin-inline-start:0; }
}






/*   في إعداد البريد */

/* === Email Preferences (مطابقة للـ HTML المطلوب) === */
.settings-v2 .email-prefs .prefs-list{
  list-style:none; margin:0; padding:0;
}
.settings-v2 .email-prefs .preference-item{
  padding:14px 0; border-bottom:1px solid #E6EEF3;
}
.settings-v2 .email-prefs .preference-item:last-child{
  border-bottom:0;
}
.settings-v2 .email-prefs b{ color:#0E2A3A; font-weight:800; }
.settings-v2 .email-prefs small{ color:var(--text-muted, #5d6b7a); }

/* === صندوق إحصائيات الأعضاء داخل الصفحة (بديل البارشال) === */
.settings-v2 .stats-box{
  background:#EAF5FF; border:1px solid #D6E9FB;
  border-radius:14px; padding:16px;
  box-shadow:0 2px 8px rgba(14,59,70,.06);
}
.settings-v2 .stats-box .list-point{
  list-style: none; padding:0; margin:0;
}
.settings-v2 .stats-box .list-point li::before{
  content:"•"; margin-inline-start:6px; color:#0EA47A; font-weight:bold;
}

/* === تحسينات شكل التبويبات لتطابق صورة التصميم === */
.settings-v2 .settings-tabs-top{
  position:relative; padding-bottom:8px; border-bottom:1px solid var(--tab-border);
}
.settings-v2 .settings-tabs-sub{ margin-top:10px; }


/* ========== تبويبات أعلى الصفحة (main top tabs) ========== */
.settings-v2 .settings-tabs-top .border-tab-main-bottom {
  position: relative;
  align-items: center;
  gap: .75rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid #E7E9EC; /* خط خفيف كالتصميم */
}
.settings-v2 .settings-tabs-top .border-tab .nav-link {
  font-weight: 600;
  padding-inline: .75rem;
}
.settings-v2 .settings-tabs-top .nav-link.active {
  color: #0A5FD6;
}

/* == CUSTOM: Center top tabs & pin profile-link to edge (RTL-aware) ==
   Added to match the new shape from the provided screenshot.
   This block centers the nav group and keeps the profile link flush at the
   container edge; includes a mobile fallback that stacks the elements. */
.settings-v2 .settings-tabs-top .border-tab-main-bottom {
  display: flex;
  align-items: center;
  justify-content: center; /* center the nav group horizontally */
  gap: var(--tab-gap, 12px);
  width: 100%;
}

.settings-v2 .settings-tabs-top ul,
.settings-v2 .settings-tabs-top .border-tab {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--tab-gap, 12px);
  flex: 1 1 auto; /* allow the list to take center space */
}

/* Push the profile link to the far side. margin-inline-start respects RTL.
   min-width prevents the link from wrapping and keeps the icon + text together. */
.settings-v2 .settings-tabs-top .profile-link {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  min-width: max-content;
}

/* Mobile: stack nav and profile to avoid overlap */
@media (max-width: 767.98px) {
  .settings-v2 .settings-tabs-top .border-tab-main-bottom {
    flex-direction: column;
    align-items: stretch;
    gap: .5rem;
  }
  .settings-v2 .settings-tabs-top .profile-link {
    margin-inline-start: 0;
    margin-top: .5rem;
    align-self: flex-start;
  }
  .settings-v2 .settings-tabs-top ul { justify-content: flex-start; }
}

/* == CUSTOM-POLISH: Active tab visual tweaks ==
   Slightly stronger active indicator: bolder color + thicker inset underline
   to match the provided screenshot's emphasis. */
.settings-v2 .settings-tabs-top .border-tab .nav-link.active {
  color: var(--tab-active, #0E2A3A);
  font-weight: 800;
  box-shadow: inset 0 -3px 0 var(--tab-active);
  padding-bottom: 6px; /* visually accommodate the underline */
}

/* == ALIGN: constrain top-tabs to container width & pin profile to edge ==
   Constrains the centered nav to a content-width and positions the
   profile-link absolutely at the container edge (RTL-aware). Mobile
   fallbacks revert to stack/flow layout. */
.settings-v2 .settings-tabs-top .border-tab-main-bottom {
  /* Make the top bar fill the container so its edges align with other page strips */
  width: 100%;
  max-width: none;
  margin-inline: 0;         /* align with parent container edges */
  position: relative;       /* for absolute positioning of profile-link */
  padding-inline-start: 0;
  padding-inline-end: 40px; /* reserve space on the profile side (visual left in RTL) - nudged 8px left */
}

/* Remove duplicate divider between top and sub tabs: keep the main border only */
.settings-v2 .settings-tabs-top + .settings-tabs-sub::before {
  display: none;
}

.settings-v2 .settings-tabs-top .container-xl {
  padding-inline: 0; /* align the tabs container with other page strips */
}

/* Pin profile link absolutely to the container edge (inset-inline-start respects RTL) */
.settings-v2 .settings-tabs-top .profile-link {
  /* pin profile to the opposite edge (visual left in RTL) */
  position: absolute;
  inset-inline-start: auto;  /* cancel start pin */
  inset-inline-end: 12px;    /* pin to the other side (visual left under RTL) */
  top: 50%;
  transform: translateY(-50%);
}

/* Mobile: remove absolute positioning and restore stacked flow */
@media (max-width: 767.98px) {
  .settings-v2 .settings-tabs-top .border-tab-main-bottom {
    max-width: none;
    width: auto;
    padding-inline-start: 0;
    padding-inline-end: 0;
  }
  .settings-v2 .settings-tabs-top .profile-link {
    position: static;
    transform: none;
    margin-top: .5rem;
    margin-inline-start: 0;
  }
}


/* زر/رابط البروفايل يمين الشريط */
.settings-v2 .settings-tabs-top .profile-link {
  margin-inline-start: auto; /* يدفعه لليمين في RTL */
  white-space: nowrap;
}

/* ========== التاب الفرعي (أزرار رمادية) ========== */
.settings-v2 .settings-tabs-sub {
  margin-top: .75rem;
  margin-bottom: 1.25rem;
}
.settings-v2 .settings-tabs-sub .settings-tabs__list {
  display: flex; gap: .5rem; flex-wrap: wrap; justify-content: flex-start;
}
.settings-v2 .settings-tabs-sub .settings-tabs__list a {
  display: inline-block;
  padding: .35rem .9rem;
  border: 1px solid #E7E9EC;
  border-radius: 8px;
  background: #F8FAFC;
  color: #111827;
  font-weight: 600;
}
.settings-v2 .settings-tabs-sub .settings-tabs__list a.is-active {
  background: #E9F2FF;
  color: #0A5FD6;
  border-color: #CFE2FF;
}

/* ========== الكارد الرئيسي لتفضيلات البريد ========== */
.settings-v2 .settings-card.settings-card--email {
  background: #fff;
  border: 1px solid #EDF0F3;
  border-radius: 14px;
  padding: 24px 28px;
  box-shadow: 0 2px 10px rgba(16,24,40,0.04);
}
.settings-v2 .settings-card__title {
  font-size: 32px; line-height: 1.3; font-weight: 800; margin-bottom: .5rem;
}
.settings-v2 .settings-card__lead {
  color: #4B5563; margin: 0 0 1.25rem;
}

/* ========== قائمة الخيارات (مثل التصميم: سطر سفلي لكل بند) ========== */
.settings-v2 .email-prefs-list { list-style: none; margin: 0; padding: 0; }
.settings-v2 .email-prefs-list > li {
  border-bottom: 1px solid #E7E9EC;
  padding: .9rem 0;
}
.settings-v2 .email-prefs-item {
  display: grid;
  grid-template-columns: 20px 1fr;
  gap: .6rem;
  align-items: start;
  cursor: pointer;
}
.settings-v2 .email-prefs-item input[type="checkbox"] {
  inline-size: 18px; block-size: 18px; margin-top: .25rem;
}
.settings-v2 .email-prefs-text { display: grid; gap: .2rem; }
.settings-v2 .email-prefs-title { font-weight: 700; }
.settings-v2 .email-prefs-desc  { color: #4B5563; font-size: .95rem; }

/* ========== بوكس "إحصائيات الأعضاء" داخل الصفحة (أزرق فاتح) ========== */
.settings-v2 .stats-box {
  background: #EAF4FF;       /* أزرق باهت كما بالصورة */
  border: 1px solid #D7E9FF; /* محيط خفيف */
  border-radius: 12px;
  padding: 18px 16px;
}
.settings-v2 .stats-title {
  font-size: 18px; font-weight: 600; margin: 8px 0 14px;
}
.settings-v2 .stats-box .list-point {
  list-style: none; padding: 0; margin: 0;
}
.settings-v2 .stats-box .list-point li {
  margin-bottom: .75rem;
}
.settings-v2 .stats-box .list-point li strong { font-weight: 600; }
.settings-v2 .stats-box .list-point li span { font-weight: 700; }

/* ========== مسافات عامة لتقارب الشكل ========== */
.settings-v2 .content-row {
  align-items: start;
}
@media (min-width: 992px){
  .settings-v2 .content-row > [class*="col-"] { margin-top: .25rem; }
}


/* =========================
   1) الكارد الرئيسي والعنوان
   ========================= */
.settings-v2 .settings-card {
  background: #fff;
  border: 1px solid #EDF0F3;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(16,24,40,0.04);
}

.settings-v2 .settings-card__title,
.settings-v2 .settings-card h1 {
  font-size: 32px;
  line-height: 1.3;
  font-weight: 800;
  margin-bottom: .5rem;
}

.settings-v2 .settings-card__lead {
  color: #4B5563;
  margin-bottom: 1.25rem;
}

/* =========================================
   2) قائمة الخيارات داخل فورم البريد (بنيتك الحالية)
   ========================================= */
.settings-v2 .settings-card .personal-data-form ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.settings-v2 .settings-card .personal-data-form ul > li {
  border-bottom: 1px solid #E7E9EC;
  padding: .9rem 0;
}
.settings-v2 .settings-card .personal-data-form input[type="checkbox"] {
  inline-size: 18px;
  block-size: 18px;
  margin-inline-end: .5rem;
  margin-top: .25rem;
}
.settings-v2 .settings-card .personal-data-form label.fw-bold {
  display: inline-block;
  font-weight: 700 !important;
}
.settings-v2 .settings-card .personal-data-form span {
  color: #4B5563;
  font-size: .95rem;
}

/* =====================================
   3) “بوكس” إحصائيات الأعضاء (يمين الصفحة)
      يستهدف الكلاسات الحالية لديك:
      .side-panel / .side-card
   ===================================== */
.settings-v2 .side-panel .side-card,
.settings-v2 .stats-box {
  background: #EAF4FF;          /* أزرق باهت */
  border: 1px solid #D7E9FF;     /* محيط خفيف */
  border-radius: 12px;
  padding: 18px 16px;
}

.settings-v2 .side-panel .side-card__title,
.settings-v2 .stats-title,
.settings-v2 .side-panel .card-title {
  font-size: 18px;
  font-weight: 600;
  margin: 8px 0 14px;
}

.settings-v2 .side-panel .side-card__list,
.settings-v2 .stats-box .list-point {
  list-style: none;
  padding: 0;
  margin: 0;
}
.settings-v2 .side-panel .side-card__list li,
.settings-v2 .stats-box .list-point li {
  margin-bottom: .75rem;
}
.settings-v2 .side-panel .side-card__list li strong,
.settings-v2 .stats-box .list-point li strong {
  font-weight: 600;
}
.settings-v2 .side-panel .side-card__list li span,
.settings-v2 .stats-box .list-point li span {
  font-weight: 700;
}

/* ==========================================
   4) التابات: العلوية والفرعية (تنسيق بسيط مطابق)
   ========================================== */
.settings-v2 .settings-tabs-top .border-tab-main-bottom {
  border-bottom: 1px solid #E7E9EC;
  padding-bottom: .5rem;
  gap: .75rem;
}
.settings-v2 .settings-tabs-top .border-tab .nav-link {
  font-weight: 600;
  padding-inline: .75rem;
}
.settings-v2 .settings-tabs-top .nav-link.active { color: #0A5FD6; }
.settings-v2 .settings-tabs-top .profile-link { margin-inline-start: auto; white-space: nowrap; }

.settings-v2 .settings-tabs-sub { margin-top: .75rem; margin-bottom: 1.25rem; }
.settings-v2 .settings-tabs-sub .settings-tabs__list {
  display: flex; gap: .5rem; flex-wrap: wrap; justify-content: flex-start;
}
.settings-v2 .settings-tabs-sub .settings-tabs__list a {
  display: inline-block;
  padding: .35rem .9rem;
  border: 1px solid #E7E9EC;
  border-radius: 8px;
  background: #F8FAFC;
  color: #111827;
  font-weight: 600;
}
.settings-v2 .settings-tabs-sub .settings-tabs__list a.is-active {
  background: #E9F2FF;
  color: #0A5FD6;
  border-color: #CFE2FF;
}

/* ====================================
   5) محاذاة الأعمدة والمسافات العامة
   ==================================== */
.settings-v2 .content-row { align-items: flex-start; }
@media (min-width: 992px){
  .settings-v2 .content-row > [class*="col-"] { margin-top: .25rem; }
}


/* ====== تبويب علوي: نفس سلوك التصميم ====== */
.settings-tabs-top .border-tab-main-bottom{
  border-bottom:1px solid #E7E9EC;
  padding-bottom:.5rem;
  gap:.75rem;
}
.settings-tabs-top .border-tab .nav-link{
  font-weight:600;
  padding-inline:.75rem;
}
.settings-tabs-top .border-tab .nav-link.active{ color:#0A5FD6; }
.settings-tabs-top .profile-link{ margin-inline-start:auto; white-space:nowrap; }

/* امنع أي تغليف مزدوج يسبب خطوط/فراغات */
.settings-v2 > .settings-tabs-top .settings-tabs-top,
.settings-v2 > .settings-tabs-sub .settings-tabs-sub{ border:0; padding:0; }

/* ====== تبويب فرعي ====== */
.settings-tabs-sub{ margin-top:.75rem; margin-bottom:1.25rem; }
.settings-tabs-sub .settings-tabs__list{
  display:flex; flex-wrap:wrap; gap:.5rem; justify-content:flex-start;
  list-style:none; margin:0; padding:0;
}
.settings-tabs-sub .settings-tabs__list a{
  display:inline-block;
  padding:.35rem .9rem;
  border:1px solid #E7E9EC; border-radius:8px;
  background:#F8FAFC; color:#111827; font-weight:600;
}
.settings-tabs-sub .settings-tabs__list a.is-active{
  background:#E9F2FF; color:#0A5FD6; border-color:#CFE2FF;
}

/* === FINAL FIX-PACK for settings-v2 (tabs & layout) === */

/* لا نسمح بتعشيش شريط داخل شريط: ألغِ الحدود/الحشوات المكررة إن حدث ذلك */
.settings-v2 > .settings-tabs-top .settings-tabs-top,
.settings-v2 > .settings-tabs-sub .settings-tabs-sub { border:0; padding:0; }

/* الشريط العلوي: خط سفلي واحد ومحاذاة العناصر كما في التصميم */
.settings-v2 .settings-tabs-top .border-tab-main-bottom{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  border-bottom:1px solid #E7E9EC; padding-bottom:.5rem;
}

/* قائمة تبويبات الشريط العلوي */
.settings-v2 .settings-tabs-top .border-tab{
  display:flex; flex-wrap:wrap; gap:.5rem;
  list-style:none; margin:0; padding:0;
}
.settings-v2 .settings-tabs-top .border-tab .nav-item{ margin:0; }
.settings-v2 .settings-tabs-top .border-tab .nav-link{
  padding:8px 12px; margin:0; line-height:1; font-weight:600;
}
.settings-v2 .settings-tabs-top .border-tab .nav-link.active{ color:#0A5FD6; }

/* ادفع رابط البروفايل للطرف الأيمن (RTL) ولا تدعه ينكسر سطر */
.settings-v2 .settings-tabs-top .profile-link{
  margin-inline-start:auto; white-space:nowrap;
  display:inline-flex; align-items:center; gap:8px;
}

/* خط لطيف يفصل بين البارين */
.settings-v2 .settings-tabs-top + .settings-tabs-sub{ position:relative; margin-top:.75rem; }
.settings-v2 .settings-tabs-top + .settings-tabs-sub::before{
  content:""; position:absolute; inset-inline:0; top:-10px; height:1px; background:#E7E9EC;
}

/* تبويبات الشريط الفرعي */
.settings-v2 .settings-tabs-sub{ margin-bottom:1.25rem; }
.settings-v2 .settings-tabs-sub .settings-tabs__list{
  display:flex; flex-wrap:wrap; gap:.5rem; justify-content:flex-start;
  list-style:none; margin:0; padding:0;
}
.settings-v2 .settings-tabs-sub .settings-tabs__list a{
  display:inline-block; padding:.35rem .9rem;
  border:1px solid #E7E9EC; border-radius:8px;
  background:#F8FAFC; color:#111827; font-weight:600;
}
.settings-v2 .settings-tabs-sub .settings-tabs__list a.is-active{
  background:#E9F2FF; color:#0A5FD6; border-color:#CFE2FF;
}

/* بطاقة البريد + وصف أعلى الخيارات (مطابق للمعاينة) */
.settings-v2 .settings-card.settings-card--email{
  background:#fff; border:1px solid #EDF0F3; border-radius:14px;
  padding:24px 28px; box-shadow:0 2px 10px rgba(16,24,40,.04);
}
.settings-v2 .settings-card.settings-card--email .settings-card__title{
  font-size:32px; font-weight:800; margin-bottom:.5rem;
}
.settings-v2 .settings-card.settings-card--email .settings-card__lead{
  color:#4B5563; margin-bottom:1.25rem;
}

/* قائمة تفضيلات البريد: سطر سفلي لكل عنصر */
.settings-v2 .settings-card .personal-data-form ul{ list-style:none; margin:0; padding:0; }
.settings-v2 .settings-card .personal-data-form ul > li{ border-bottom:1px solid #E7E9EC; padding:.9rem 0; }
.settings-v2 .settings-card .personal-data-form input[type="checkbox"]{ inline-size:18px; block-size:18px; margin-top:.25rem; }
.settings-v2 .email-prefs-item{ display:grid; grid-template-columns:20px 1fr; gap:.6rem; align-items:start; }

/* صندوق إحصائيات داخل الصفحة (بدل البارشال) */
.settings-v2 .stats-box{
  background:#EAF4FF; border:1px solid #D7E9FF; border-radius:12px;
  padding:18px 16px; box-shadow:0 2px 8px rgba(14,59,70,.06);
}
.settings-v2 .stats-title{ font-size:18px; font-weight:600; margin:8px 0 14px; }
.settings-v2 .stats-box .list-point{ list-style:none; margin:0; padding:0; }
.settings-v2 .stats-box .list-point li{ margin-bottom:.75rem; }
.settings-form .row > [class^="col-"],
.settings-form .row > [class*=" col-"] {
  flex: 0 0 100% !important;
  max-width: 100% !important;
}

/* جدول الانطباعات – ضبط طول خانة الاسم */
.settings-v2 .profile-sentiments .sentiment-name-cell {
  max-width: 220px;        /* عدّل القيمة حسب ما يناسب عرض الجدول عندك */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/* جدول الانطباعات – التحكم في عرض خانة الاسم */
.settings-v2 .profile-sentiments .sentiment-name-cell {
  max-width: 260px;   /* عدّل الرقم إذا احتجت عرضًا أكبر أو أصغر */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}