/* ================================================================
   NEGARNOVIN — WHMCS Client Area Theme v3.0.0
   قالب ناحیه کاربری نگارنوین — فارسی، راست‌چین، دارک مود کامل
   ----------------------------------------------------------------
   - برند: آبی سرمه‌ای #002B85 + طلایی #FFBE00
   - فونت: Vazirmatn (محلی)
   - دارک مود: data-bs-theme="dark"
   - بدون هیچ CDN خارجی
   ================================================================ */

/* ----------------------------------------------------------------
   1. Design Tokens — برند نگارنوین
   ---------------------------------------------------------------- */
:root {
  /* Brand — پالت برند */
  --nv-primary: #002B85;
  --nv-primary-rgb: 0, 43, 133;
  --nv-primary-hover: #001F63;
  --nv-primary-active: #001749;
  --nv-primary-deep: #001338;          /* secondary brand */
  --nv-primary-soft: rgba(0, 43, 133, 0.07);
  --nv-primary-soft-2: rgba(0, 43, 133, 0.14);
  --nv-primary-border: rgba(0, 43, 133, 0.22);

  --nv-accent: #FFBE00;                /* طلایی */
  --nv-accent-rgb: 255, 190, 0;
  --nv-accent-hover: #E5AC00;
  --nv-accent-soft: rgba(255, 190, 0, 0.12);
  --nv-accent-ink: #4A3B00;            /* متن روی طلایی */

  /* Light Mode — حالت روشن */
  --nv-bg-body: #F4F6FA;
  --nv-bg-surface: #FFFFFF;
  --nv-bg-elevated: #F8F9FC;
  --nv-bg-input: #FFFFFF;
  --nv-text-1: #252525;
  --nv-text-2: #55565A;
  --nv-text-muted: #8B8D94;
  --nv-border: #E3E6EC;
  --nv-border-subtle: #EEF0F4;
  --nv-shadow-sm: 0 1px 3px rgba(0, 19, 56, 0.05);
  --nv-shadow-md: 0 6px 24px rgba(0, 19, 56, 0.07);
  --nv-shadow-lg: 0 16px 48px rgba(0, 19, 56, 0.12);

  /* دارک مود — پالت Hostim (طبق درخواست) */
  --hostim_dark_bg: #121829;
  --hostim_dark_gray_bg: #182036;

  /* Status Palette */
  --nv-success: #1B7A3D;
  --nv-success-bg: rgba(27, 122, 61, 0.09);
  --nv-warning: #9A6700;
  --nv-warning-bg: rgba(154, 103, 0, 0.10);
  --nv-danger: #C22525;
  --nv-danger-bg: rgba(194, 37, 37, 0.08);
  --nv-info: #0059B9;
  --nv-info-bg: rgba(0, 89, 185, 0.07);

  /* Typography */
  --nv-font: 'Vazirmatn', 'Tahoma', -apple-system, 'Segoe UI', sans-serif;

  /* Layout */
  --nv-announcement-h: 40px;
  --nv-topbar-h: 68px;
  --nv-sidebar-w: 272px;

  /* Bootstrap var bridges */
  --bs-body-font-family: var(--nv-font);
  --bs-primary: var(--nv-primary);
  --bs-primary-rgb: var(--nv-primary-rgb);
  --bs-link-color: var(--nv-primary);
  --bs-link-hover-color: var(--nv-primary-hover);
  --bs-border-color: var(--nv-border);
  --bs-body-color: var(--nv-text-1);
  --bs-body-bg: var(--nv-bg-body);
  --bs-body-font-size: 0.875rem;
}

/* Dark Mode — دارک مود کامل (پالت سرمه‌ای تیره برند — بدون آبی خیره‌کننده) */
[data-bs-theme="dark"] {
  --nv-primary: #2C55B8;
  --nv-primary-rgb: 44, 85, 184;
  --nv-primary-hover: #3E6FE0;
  --nv-primary-active: #22448F;
  --nv-primary-deep: #0B1226;
  --nv-primary-soft: rgba(62, 111, 224, 0.13);
  --nv-primary-soft-2: rgba(62, 111, 224, 0.2);
  --nv-primary-border: rgba(62, 111, 224, 0.32);

  --nv-accent: #FFBE00;
  --nv-accent-rgb: 255, 190, 0;
  --nv-accent-hover: #FFD84D;
  --nv-accent-soft: rgba(255, 190, 0, 0.14);
  --nv-accent-ink: #2B2200;

  --nv-bg-body: #0D1120;
  --nv-bg-surface: #121829;
  --nv-bg-elevated: #182036;
  --nv-bg-input: #1A2340;
  --nv-text-1: #E4E9F5;
  --nv-text-2: #AFB7CB;
  --nv-text-muted: #8890A6;
  --nv-border: #232C48;
  --nv-border-subtle: #1C2440;
  --nv-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
  --nv-shadow-md: 0 6px 24px rgba(0, 0, 0, 0.55);
  --nv-shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.65);

  --nv-success: #4CC38A;
  --nv-success-bg: rgba(76, 195, 138, 0.12);
  --nv-warning: #E3A008;
  --nv-warning-bg: rgba(227, 160, 8, 0.13);
  --nv-danger: #F2555A;
  --nv-danger-bg: rgba(242, 85, 90, 0.12);
  --nv-info: #6FA8FF;
  --nv-info-bg: rgba(111, 168, 255, 0.1);

  --bs-border-color: var(--nv-border);
  --bs-body-color: var(--nv-text-1);
  --bs-body-bg: var(--nv-bg-body);
}

/* گرادیان برند — الگوی دارک طبق درخواست کاربر */
.bg-primary-gradient {
  background: linear-gradient(135deg, #002B85 0%, #001338 100%);
}
[data-bs-theme="dark"] .bg-primary-gradient {
  background: linear-gradient(95.45deg, var(--hostim_dark_gray_bg) 0.64%, var(--hostim_dark_bg) 98.23%);
}

/* ----------------------------------------------------------------
   2. Base & Typography — تایپوگرافی فارسی
   ---------------------------------------------------------------- */
html { font-size: 15px; scroll-behavior: smooth; }

body {
  font-family: var(--nv-font);
  font-weight: 400;
  font-size: 0.9333rem; /* ≈14px */
  line-height: 1.8;
  color: var(--nv-text-1);
  background-color: var(--nv-bg-body);
  margin: 0;
  direction: rtl;
  text-align: right;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color 0.25s ease, color 0.25s ease;
}

a { color: var(--nv-primary); text-decoration: none; transition: color 0.15s; }
a:hover { color: var(--nv-primary-hover); }

h1, h2, h3, h4, h5, h6 {
  color: var(--nv-text-1);
  font-weight: 700;
  line-height: 1.5;
}
[data-bs-theme="dark"] h1, [data-bs-theme="dark"] h2, [data-bs-theme="dark"] h3,
[data-bs-theme="dark"] h4, [data-bs-theme="dark"] h5, [data-bs-theme="dark"] h6 { color: var(--nv-text-1); }

p { color: var(--nv-text-2); }
small, .text-muted { color: var(--nv-text-muted) !important; }
::selection { background: rgba(var(--nv-primary-rgb), 0.25); }

/* اسکرول‌بار زیبا */
* { scrollbar-width: thin; scrollbar-color: var(--nv-border) transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: var(--nv-border); border-radius: 8px; }
*::-webkit-scrollbar-thumb:hover { background: var(--nv-text-muted); }

/* اعداد لاتین داخل متن فارسی — خوانایی بهتر */
.ltr-nums, .num, code, pre, kbd { direction: ltr; unicode-bidi: embed; font-variant-numeric: tabular-nums; }
code, kbd, pre { font-family: 'Courier New', monospace; }
.text-ltr { direction: ltr; unicode-bidi: embed; display: inline-block; }

/* ----------------------------------------------------------------
   3. Bootstrap Overrides — بازنویسی بوت‌استرپ
   ---------------------------------------------------------------- */
.card {
  background: var(--nv-bg-surface);
  border: 1px solid var(--nv-border);
  border-radius: 14px;
  color: var(--nv-text-1);
  box-shadow: var(--nv-shadow-sm);
  transition: background-color 0.25s ease, border-color 0.25s ease;
}
.card-header {
  background: transparent;
  border-bottom: 1px solid var(--nv-border-subtle);
  color: var(--nv-text-1);
  font-weight: 700;
  padding: 1rem 1.25rem;
}
.card-body { padding: 1.25rem; }
.card-footer { background: transparent; border-top: 1px solid var(--nv-border-subtle); color: var(--nv-text-2); }
[data-bs-theme="dark"] .card, [data-bs-theme="dark"] .modal-content { background-color: var(--nv-bg-surface); }

.table { color: var(--nv-text-1); --bs-table-bg: transparent; }
.table > :not(caption) > * > * { border-bottom-color: var(--nv-border-subtle); padding: 0.8rem 1rem; }
.table thead th { color: var(--nv-text-muted); font-size: 0.78rem; font-weight: 600; }
.table-hover > tbody > tr:hover > * { background-color: var(--nv-primary-soft); color: var(--nv-text-1); }
.table-striped > tbody > tr:nth-of-type(odd) > * { --bs-table-accent-bg: var(--nv-bg-elevated); }

/* Forms */
.form-control, .form-select {
  background-color: var(--nv-bg-input);
  border: 1px solid var(--nv-border);
  color: var(--nv-text-1);
  border-radius: 10px;
  padding: 0.55rem 0.9rem;
  font-family: var(--nv-font);
  font-size: 0.9rem;
  min-height: 44px;
  transition: border-color 0.15s, box-shadow 0.15s, background-color 0.25s;
}
textarea.form-control { min-height: 100px; }
.form-control::placeholder { color: var(--nv-text-muted); }
.form-control:focus, .form-select:focus {
  background-color: var(--nv-bg-input);
  border-color: var(--nv-primary);
  color: var(--nv-text-1);
  box-shadow: 0 0 0 4px rgba(var(--nv-primary-rgb), 0.12);
}
.form-control:disabled, .form-select:disabled { background-color: var(--nv-bg-elevated); color: var(--nv-text-muted); }
.form-label { color: var(--nv-text-2); font-weight: 600; font-size: 0.85rem; margin-bottom: 0.4rem; }
.form-text { color: var(--nv-text-muted); font-size: 0.75rem; }
.form-check-input {
  background-color: var(--nv-bg-input);
  border-color: var(--nv-border);
  cursor: pointer;
}
.form-check-input:checked {
  background-color: var(--nv-primary);
  border-color: var(--nv-primary);
}
.form-check-input:focus { box-shadow: 0 0 0 4px rgba(var(--nv-primary-rgb), 0.12); border-color: var(--nv-primary); }
.form-check-label { color: var(--nv-text-2); cursor: pointer; }
.input-group-text {
  background-color: var(--nv-bg-elevated);
  border: 1px solid var(--nv-border);
  color: var(--nv-text-2);
  border-radius: 10px;
}
.input-group > .form-control:not(:last-child), .input-group > .form-select { border-radius: 10px; }
.was-validated .form-control:valid, .form-control.is-valid { border-color: var(--nv-success); }
.was-validated .form-control:invalid, .form-control.is-invalid { border-color: var(--nv-danger); }
.invalid-feedback { color: var(--nv-danger); }
select.form-select { background-position: left 0.9rem center; padding-left: 2.4rem; }

/* Badges */
.badge { font-weight: 600; letter-spacing: 0; border-radius: 8px; padding: 0.35em 0.7em; font-size: 0.72rem; }
.badge.bg-success { background-color: var(--nv-success-bg) !important; color: var(--nv-success) !important; }
.badge.bg-warning { background-color: var(--nv-warning-bg) !important; color: var(--nv-warning) !important; }
.badge.bg-danger { background-color: var(--nv-danger-bg) !important; color: var(--nv-danger) !important; }
.badge.bg-info { background-color: var(--nv-info-bg) !important; color: var(--nv-info) !important; }
.badge.bg-secondary { background-color: var(--nv-bg-elevated) !important; color: var(--nv-text-2) !important; border: 1px solid var(--nv-border); }
.text-bg-success { background-color: var(--nv-success) !important; }
.text-bg-danger { background-color: var(--nv-danger) !important; }
.text-bg-warning { background-color: var(--nv-warning) !important; color: #fff !important; }

/* Alerts */
.alert { border-radius: 12px; font-size: 0.875rem; border: none; }
.alert-success { background: var(--nv-success-bg); color: var(--nv-success); }
.alert-danger { background: var(--nv-danger-bg); color: var(--nv-danger); }
.alert-warning { background: var(--nv-warning-bg); color: var(--nv-warning); }
.alert-info { background: var(--nv-info-bg); color: var(--nv-info); }

/* Dropdowns */
.dropdown-menu {
  background-color: var(--nv-bg-surface);
  border: 1px solid var(--nv-border);
  border-radius: 12px;
  box-shadow: var(--nv-shadow-md);
  padding: 0.5rem;
  font-family: var(--nv-font);
}
.dropdown-item {
  color: var(--nv-text-2);
  border-radius: 8px;
  font-size: 0.85rem;
  font-weight: 500;
  padding: 0.5rem 0.85rem;
  transition: all 0.15s;
}
.dropdown-item:hover, .dropdown-item:focus {
  background-color: var(--nv-primary-soft);
  color: var(--nv-primary);
}
.dropdown-divider { border-color: var(--nv-border-subtle); opacity: 1; }

/* Modals */
.modal-content { background-color: var(--nv-bg-surface); border: 1px solid var(--nv-border); border-radius: 16px; }
.modal-header { border-bottom: 1px solid var(--nv-border-subtle); }
.modal-footer { border-top: 1px solid var(--nv-border-subtle); }
.btn-close { filter: none; }
[data-bs-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
.modal-backdrop.show { opacity: 0.6; }

/* Pagination */
.pagination { --bs-pagination-bg: var(--nv-bg-surface); --bs-pagination-color: var(--nv-text-2); --bs-pagination-border-color: var(--nv-border); --bs-pagination-hover-bg: var(--nv-primary-soft); --bs-pagination-hover-color: var(--nv-primary); --bs-pagination-hover-border-color: var(--nv-primary); --bs-pagination-active-bg: var(--nv-primary); --bs-pagination-active-border-color: var(--nv-primary); --bs-pagination-disabled-bg: var(--nv-bg-elevated); --bs-pagination-disabled-color: var(--nv-text-muted); --bs-pagination-disabled-border-color: var(--nv-border); }
.page-link { border-radius: 8px !important; margin-inline: 2px; font-size: 0.85rem; }

/* Progress */
.progress { background-color: var(--nv-bg-elevated); border-radius: 10px; }
.progress-bar { background: linear-gradient(90deg, var(--nv-primary), #3E6FE0); }

/* Nav & Tabs */
.nav-tabs { border-bottom-color: var(--nv-border); }
.nav-tabs .nav-link { color: var(--nv-text-muted); border: none; font-weight: 600; font-size: 0.85rem; }
.nav-tabs .nav-link:hover { color: var(--nv-text-1); border-bottom: 2px solid var(--nv-border); }
.nav-tabs .nav-link.active { color: var(--nv-primary); background: transparent; border-bottom: 2px solid var(--nv-primary); }
.nav-pills .nav-link { color: var(--nv-text-muted); font-weight: 600; border-radius: 10px; }
.nav-pills .nav-link.active { background: var(--nv-primary); color: #fff; }

/* Accordion */
.accordion-item { background-color: var(--nv-bg-surface); border-color: var(--nv-border); }
.accordion-button { background-color: var(--nv-bg-surface); color: var(--nv-text-1); font-family: var(--nv-font); font-weight: 600; }
.accordion-button:not(.collapsed) { background-color: var(--nv-primary-soft); color: var(--nv-primary); box-shadow: none; }
.accordion-button:focus { box-shadow: 0 0 0 4px rgba(var(--nv-primary-rgb), 0.12); border-color: var(--nv-primary); }
[data-bs-theme="dark"] .accordion-button::after { filter: invert(1); }

/* Tooltip / Popover */
.tooltip { font-family: var(--nv-font); }
.tooltip-inner { background: var(--nv-primary-deep); border-radius: 8px; font-size: 0.75rem; }
.popover { background-color: var(--nv-bg-surface); border-color: var(--nv-border); font-family: var(--nv-font); }

/* Breadcrumb */
.breadcrumb { --bs-breadcrumb-divider-color: var(--nv-text-muted); }
.breadcrumb-item a { color: var(--nv-text-muted); font-size: 0.8rem; }
.breadcrumb-item.active { color: var(--nv-text-2); font-size: 0.8rem; }

/* ----------------------------------------------------------------
   4. Button System — سیستم دکمه‌ها
   ---------------------------------------------------------------- */
.btn { font-family: var(--nv-font); font-weight: 600; border-radius: 10px; padding: 0.55rem 1.2rem; font-size: 0.875rem; transition: all 0.2s; min-height: 44px; }
.btn-sm { min-height: 36px; padding: 0.35rem 0.85rem; font-size: 0.8rem; border-radius: 8px; }
.btn-lg { min-height: 52px; padding: 0.75rem 1.6rem; font-size: 1rem; }

.btn-brand, .btn-primary-custom {
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover));
  color: #fff;
  border: none;
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(var(--nv-primary-rgb), 0.28);
  font-weight: 600;
}
.btn-brand:hover, .btn-primary-custom:hover, .btn-brand:focus, .btn-primary-custom:focus {
  background: linear-gradient(135deg, var(--nv-primary-hover), var(--nv-primary-active));
  color: #fff;
  box-shadow: 0 8px 22px rgba(var(--nv-primary-rgb), 0.38);
  transform: translateY(-1px);
}
.btn-brand:active { transform: translateY(0); }
.btn-brand:disabled, .btn-brand.disabled { background: var(--nv-text-muted); box-shadow: none; }

/* دکمه طلایی — اکسنت برند */
.btn-accent {
  background: linear-gradient(135deg, #FFBE00, #E5AC00);
  color: var(--nv-accent-ink);
  border: none;
  border-radius: 10px;
  font-weight: 700;
  box-shadow: 0 4px 14px rgba(var(--nv-accent-rgb), 0.3);
}
.btn-accent:hover, .btn-accent:focus {
  background: linear-gradient(135deg, #FFCC33, #FFBE00);
  color: var(--nv-accent-ink);
  box-shadow: 0 8px 22px rgba(var(--nv-accent-rgb), 0.42);
  transform: translateY(-1px);
}

/* دکمه n8n — رنگ برند رسمی n8n (استثنای برند شخص ثالث، مانند طلایی اکسنت)
   #EA4B71 = رنگ رسمی لوگوی n8n */
.btn-n8n {
  --n8n-brand: #EA4B71;
  --n8n-brand-deep: #D63A66;
  background: linear-gradient(135deg, var(--n8n-brand), var(--n8n-brand-deep));
  color: #fff;
  border: none;
  border-radius: 10px;
  font-weight: 600;
  box-shadow: 0 4px 14px rgba(234, 75, 113, 0.3);
}
.btn-n8n:hover, .btn-n8n:focus {
  background: linear-gradient(135deg, var(--n8n-brand-deep), #C22E58);
  color: #fff;
  box-shadow: 0 8px 22px rgba(234, 75, 113, 0.45);
  transform: translateY(-1px);
}
.btn-n8n:active { transform: translateY(0); }
[data-bs-theme="dark"] .btn-n8n {
  background: linear-gradient(135deg, #F05C8A, var(--n8n-brand));
  box-shadow: 0 4px 16px rgba(234, 75, 113, 0.35);
}
[data-bs-theme="dark"] .btn-n8n:hover, [data-bs-theme="dark"] .btn-n8n:focus {
  background: linear-gradient(135deg, var(--n8n-brand), var(--n8n-brand-deep));
}
/* نسخه خط‌دار برای مکان‌های ثانویه */
.btn-outline-n8n {
  background: transparent;
  color: var(--n8n-brand, #EA4B71);
  border: 1px solid rgba(234, 75, 113, 0.4);
  border-radius: 10px;
  font-weight: 600;
}
.btn-outline-n8n:hover, .btn-outline-n8n:focus {
  background: rgba(234, 75, 113, 0.08);
  border-color: #EA4B71;
  color: #EA4B71;
}

.btn-outline-custom, .btn-outline-table {
  background: transparent;
  color: var(--nv-text-2);
  border: 1px solid var(--nv-border);
  border-radius: 10px;
  font-weight: 600;
}
.btn-outline-custom:hover, .btn-outline-table:hover {
  background: var(--nv-primary-soft);
  border-color: var(--nv-primary);
  color: var(--nv-primary);
}
.btn-outline-danger-custom {
  background: transparent; color: var(--nv-danger);
  border: 1px solid rgba(194, 37, 37, 0.3); border-radius: 10px; font-weight: 600;
}
.btn-outline-danger-custom:hover { background: var(--nv-danger-bg); border-color: var(--nv-danger); color: var(--nv-danger); }

/* بازنویسی دکمه‌های پیش‌فرض WHMCS/Bootstrap */
.btn-primary { background: var(--nv-primary); border-color: var(--nv-primary); }
.btn-primary:hover, .btn-primary:focus { background: var(--nv-primary-hover); border-color: var(--nv-primary-hover); }
.btn-outline-primary { color: var(--nv-primary); border-color: var(--nv-primary); }
.btn-outline-primary:hover { background: var(--nv-primary); border-color: var(--nv-primary); }
.btn-secondary { background: var(--nv-bg-elevated); border-color: var(--nv-border); color: var(--nv-text-2); }
.btn-secondary:hover { background: var(--nv-border); border-color: var(--nv-border); color: var(--nv-text-1); }
.btn-light { background: var(--nv-bg-elevated); border-color: var(--nv-border); color: var(--nv-text-1); }
.btn-light:hover { background: var(--nv-border); color: var(--nv-text-1); }
.btn-default { background: var(--nv-bg-elevated); color: var(--nv-text-1); border: 1px solid var(--nv-border); border-radius: 10px; }
.btn-default:hover { background: var(--nv-primary-soft); color: var(--nv-primary); border-color: var(--nv-primary); }
.btn-success { background: var(--nv-success); border-color: var(--nv-success); }
.btn-danger { background: var(--nv-danger); border-color: var(--nv-danger); }

/* ----------------------------------------------------------------
   5. Layout Structure — ساختار چیدمان (دسکتاپ: توپ‌بار / موبایل: دراور)
   ---------------------------------------------------------------- */
#nv-wrapper { display: flex; min-height: 100vh; flex-direction: column; }

#nv-main {
  flex: 1;
  min-width: 0;
  margin-top: calc(var(--nv-announcement-h) + var(--nv-topbar-h));
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - var(--nv-announcement-h) - var(--nv-topbar-h));
  background-color: var(--nv-bg-body);
  transition: margin 0.25s ease, background-color 0.25s ease;
}

.nv-content { padding: 1.75rem 1.5rem 3rem; max-width: 1560px; width: 100%; margin: 0 auto; flex: 1; }

@media (max-width: 767.98px) {
  .nv-content { padding: 1.25rem 1rem 2.5rem; }
}

/* ----------------------------------------------------------------
   6. Sidebar — سایدبار موبایل/تبلت (دراور از راست تا ۱۲۰۰ پیکسل)
      دسکتاپ (≥۱۲۰۰): منوی توپ‌بار؛ زیر ۱۲۰۰: دکمه همبرگری + دراور
   ---------------------------------------------------------------- */
#nv-sidebar {
  width: min(var(--nv-sidebar-w), 86vw);
  background: var(--nv-bg-surface);
  border-inline-end: 1px solid var(--nv-border-subtle);
  position: fixed;
  inset-block: calc(var(--nv-announcement-h) + var(--nv-topbar-h)) 0;
  inset-inline-end: 0;
  z-index: 1045;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  visibility: hidden;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.3s;
  overflow-x: hidden;
  overscroll-behavior: contain;
  box-shadow: var(--nv-shadow-lg);
}
#nv-sidebar.mobile-open { transform: translateX(0); visibility: visible; }

.sidebar-backdrop {
  position: fixed; inset: 0;
  background: rgba(0, 19, 56, 0.5);
  backdrop-filter: blur(2px);
  z-index: 1040;
  opacity: 0; visibility: hidden;
  transition: opacity 0.25s, visibility 0.25s;
}
.sidebar-backdrop.show { opacity: 1; visibility: visible; }

/* بالای ۱۲۰۰ پیکسل: توپ‌بار کامل است، دراور لازم نیست */
@media (min-width: 1200px) {
  #nv-sidebar { display: none !important; }
  .toggle-sidebar-btn { display: none !important; }
  .sidebar-backdrop { display: none !important; }
}

.nv-brand-logo-container {
  height: 64px;
  display: flex; align-items: center;
  padding: 0 1.25rem;
  border-bottom: 1px solid var(--nv-border-subtle);
  overflow: hidden;
  flex-shrink: 0;
}
.nv-brand-logo { max-height: 40px; width: auto; display: block; }

.nav-section-label {
  padding: 1.1rem 1.4rem 0.45rem;
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--nv-text-muted);
  letter-spacing: 0.5px;
}
.nav-section-label:first-child { padding-top: 0.6rem; }

.nv-nav-menu { flex: 1; padding: 0.5rem 0.75rem; overflow-y: auto; overflow-x: hidden; }

.nv-nav-item {
  display: flex; align-items: center;
  padding: 0.7rem 0.9rem;
  color: var(--nv-text-2);
  border-inline-start: 3px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.18s ease;
  white-space: nowrap;
  font-size: 0.9rem;
  font-weight: 600;
  gap: 0.75rem;
  text-decoration: none;
  margin-bottom: 2px;
}
.nv-nav-item:hover { background: var(--nv-primary-soft); color: var(--nv-primary); }
.nv-nav-item.active {
  background: var(--nv-primary-soft-2);
  color: var(--nv-primary);
  border-inline-start-color: var(--nv-accent);
}
.nv-nav-item i { font-size: 1.2rem; color: var(--nv-text-muted); flex-shrink: 0; width: 1.4rem; text-align: center; transition: color 0.18s; }
.nv-nav-item:hover i { color: var(--nv-primary); }
.nv-nav-item.active i { color: var(--nv-primary); }

.nv-user-profile {
  padding: 1rem 1.25rem;
  border-top: 1px solid var(--nv-border-subtle);
  display: flex; align-items: center; gap: 0.75rem;
  white-space: nowrap; overflow: hidden;
  flex-shrink: 0;
}
.user-avatar {
  width: 40px; height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover));
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 1rem;
  flex-shrink: 0;
}
.user-info { display: flex; flex-direction: column; min-width: 0; }
.user-name { font-weight: 700; font-size: 0.85rem; color: var(--nv-text-1); overflow: hidden; text-overflow: ellipsis; }
.user-email { font-size: 0.72rem; color: var(--nv-text-muted); overflow: hidden; text-overflow: ellipsis; direction: ltr; text-align: right; }

/* ----------------------------------------------------------------
   7. Announcement Bar — نوار اعلان
   ---------------------------------------------------------------- */
.nv-announcement-bar {
  position: fixed; top: 0; inset-inline: 0;
  height: var(--nv-announcement-h);
  background: linear-gradient(90deg, #001338, #002B85 55%, #001338);
  z-index: 1060;
  display: flex; align-items: center;
  overflow: hidden;
}
[data-bs-theme="dark"] .nv-announcement-bar {
  background: linear-gradient(95.45deg, var(--hostim_dark_gray_bg) 0.64%, var(--hostim_dark_bg) 98.23%);
}
.announcement-container {
  width: 100%; max-width: 1560px; margin: 0 auto;
  padding: 0 1.5rem;
  display: flex; justify-content: space-between; align-items: center;
  gap: 1rem;
}
.announcement-left { display: flex; align-items: center; gap: 0.625rem; min-width: 0; }
.announcement-badge {
  background: linear-gradient(135deg, #FFBE00, #E5AC00);
  color: var(--nv-accent-ink);
  font-size: 0.68rem; font-weight: 800;
  padding: 0.2rem 0.6rem; border-radius: 6px;
  flex-shrink: 0;
}
.announcement-text { color: rgba(255,255,255,0.9); font-size: 0.8rem; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.announcement-right { display: flex; align-items: center; flex-shrink: 0; }
.announcement-link {
  color: #FFBE00; font-size: 0.78rem; font-weight: 700;
  display: flex; align-items: center; gap: 0.3rem;
  transition: color 0.2s;
}
.announcement-link:hover { color: #FFD84D; }
.announcement-link i { transform: scaleX(-1); }
@media (max-width: 575.98px) { .announcement-text { font-size: 0.72rem; } .announcement-badge { display: none; } }

/* ----------------------------------------------------------------
   8. Topbar — نوار بالای صفحه
   ---------------------------------------------------------------- */
#nv-topbar {
  height: var(--nv-topbar-h);
  background: var(--nv-bg-surface);
  border-bottom: 1px solid var(--nv-border-subtle);
  position: fixed; top: var(--nv-announcement-h); inset-inline: 0;
  z-index: 1050;
  box-shadow: var(--nv-shadow-sm);
  transition: background-color 0.25s ease;
}
/* محتوای تاپ‌بار — هم‌عرض نوار تب و فوتر و بدنه محتوا */
.topbar-inner {
  width: 100%;
  max-width: 1560px;
  margin: 0 auto;
  height: 100%;
  padding: 0 1.5rem;
  display: flex; align-items: center; justify-content: space-between;
  gap: 0.75rem;
  min-width: 0;
}
@media (max-width: 767.98px) { .topbar-inner { padding: 0 1rem; } }
.topbar-left-wrap { display: flex; align-items: center; gap: 0.75rem; min-width: 0; }
.toggle-sidebar-btn {
  background: none; border: none;
  color: var(--nv-text-2); font-size: 1.3rem;
  cursor: pointer; padding: 0.5rem;
  border-radius: 10px; transition: all 0.2s;
  width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
}
.toggle-sidebar-btn:hover { background: var(--nv-primary-soft); color: var(--nv-primary); }
.topbar-logo-link { display: flex; align-items: center; }
.topbar-logo { height: 34px; width: auto; display: block; }

/* Topbar nav (desktop) */
.topbar-nav { display: flex; align-items: center; gap: 0.25rem; }
.topbar-nav-link {
  color: var(--nv-text-2);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  padding: 0.5rem 0.85rem;
  border-radius: 10px;
  transition: all 0.18s ease;
  display: flex; align-items: center; gap: 0.3rem;
}
.topbar-nav-link:hover, .topbar-nav-link.active {
  color: var(--nv-primary);
  background: var(--nv-primary-soft);
}
.topbar-nav-item.dropdown .dropdown-toggle::after { display: none; }

/* Search */
.topbar-search-compact { display: flex; align-items: center; position: relative; width: 170px; transition: width 0.25s ease; }
.topbar-search-compact:focus-within { width: 240px; }
.topbar-search-compact .search-input-group { width: 100%; position: relative; display: flex; align-items: center; }
.topbar-search-compact i {
  position: absolute; inset-inline-start: 0.85rem;
  color: var(--nv-text-muted); font-size: 0.9rem; z-index: 1; pointer-events: none;
}
.topbar-search-compact input {
  width: 100%;
  background-color: var(--nv-bg-elevated) !important;
  border: 1px solid transparent !important;
  color: var(--nv-text-1) !important;
  padding: 0.45rem 2.3rem 0.45rem 1rem !important;
  border-radius: 50rem !important;
  font-size: 0.82rem !important;
  font-family: var(--nv-font) !important;
  font-weight: 500 !important;
  outline: none !important;
  transition: all 0.2s ease !important;
  min-height: 40px;
}
.topbar-search-compact input:focus {
  background-color: var(--nv-bg-input) !important;
  border-color: var(--nv-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--nv-primary-rgb), 0.12) !important;
}
.topbar-search-compact input::placeholder { color: var(--nv-text-muted); }

/* Topbar icon buttons */
.topbar-right { display: flex; align-items: center; gap: 0.5rem; }
.topbar-icon-btn {
  background: var(--nv-bg-elevated);
  border: 1px solid transparent;
  color: var(--nv-text-2);
  width: 42px; height: 42px;
  border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.05rem;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none;
  position: relative;
}
.topbar-icon-btn:hover { background: var(--nv-primary-soft); color: var(--nv-primary); border-color: var(--nv-primary-border); }

/* Dark mode toggle — دکمه تغییر حالت روشن/تیره */
.theme-toggle-btn .ti-sun, .theme-toggle-btn .fa-sun { display: none; }
.theme-toggle-btn .ti-moon, .theme-toggle-btn .fa-moon { display: block; }
[data-bs-theme="dark"] .theme-toggle-btn .ti-sun, [data-bs-theme="dark"] .theme-toggle-btn .fa-sun { display: block; }
[data-bs-theme="dark"] .theme-toggle-btn .ti-moon, [data-bs-theme="dark"] .theme-toggle-btn .fa-moon { display: none; }

/* Currency */
.topbar-currency .btn-currency {
  background: var(--nv-bg-elevated);
  border: 1px solid transparent;
  color: var(--nv-text-2);
  border-radius: 50rem;
  font-size: 0.78rem; font-weight: 700;
  font-family: var(--nv-font);
  min-height: 40px;
}
.topbar-currency .btn-currency:hover { background: var(--nv-primary-soft); color: var(--nv-primary); }

/* User dropdown */
.topbar-user .btn-user {
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover));
  color: #fff;
  border: none;
  border-radius: 50rem;
  font-size: 0.82rem; font-weight: 700;
  padding: 0.45rem 1.1rem;
  min-height: 40px;
  display: inline-flex; align-items: center; gap: 0.4rem;
}
.topbar-user .btn-user:hover { background: linear-gradient(135deg, var(--nv-primary-hover), var(--nv-primary-active)); color: #fff; }
.topbar-user .dropdown-menu { min-width: 220px; }

/* ----------------------------------------------------------------
   9. Page Headers — سربرگ صفحات
   ---------------------------------------------------------------- */
.page-title-wrap { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.5rem; }
.page-title { font-size: 1.5rem; font-weight: 800; color: var(--nv-text-1); margin: 0; }
.page-title .accent { color: var(--nv-primary); }
.page-subtitle { color: var(--nv-text-muted); font-size: 0.85rem; margin-top: 0.35rem; }
.page-actions { display: flex; gap: 0.6rem; flex-wrap: wrap; }

/* ----------------------------------------------------------------
   10. Stat Cards — کارت‌های آمار داشبورد
   ---------------------------------------------------------------- */
.stat-card-clean {
  background: var(--nv-bg-surface);
  border: 1px solid var(--nv-border);
  border-radius: 16px;
  box-shadow: var(--nv-shadow-sm);
  transition: transform 0.25s cubic-bezier(0.4,0,0.2,1), box-shadow 0.25s, border-color 0.25s, background-color 0.25s;
  position: relative;
  overflow: hidden;
  height: 100%;
}
.stat-card-clean::before {
  content: '';
  position: absolute; top: 0; inset-inline: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--nv-primary), rgba(var(--nv-primary-rgb), 0.15));
  opacity: 0; transition: opacity 0.25s;
}
.stat-card-clean:hover { transform: translateY(-4px); box-shadow: var(--nv-shadow-md); border-color: var(--nv-primary-border); }
.stat-card-clean:hover::before { opacity: 1; }
.stat-icon-clean {
  width: 52px; height: 52px;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  flex-shrink: 0;
}
.stat-icon-clean.accent { background: var(--nv-accent-soft); color: #B8860B; }
.stat-icon-clean.success { background: var(--nv-success-bg); color: var(--nv-success); }
.stat-icon-clean.warning { background: var(--nv-warning-bg); color: var(--nv-warning); }
.stat-icon-clean.danger { background: var(--nv-danger-bg); color: var(--nv-danger); }
.stat-value-clean { font-size: 1.85rem; font-weight: 800; color: var(--nv-text-1); line-height: 1.3; }
.stat-label-clean { font-size: 0.82rem; color: var(--nv-text-muted); font-weight: 500; }

/* ----------------------------------------------------------------
   11. Shared Cards & Panels — کارت‌های مشترک
   ---------------------------------------------------------------- */
.panel-clean {
  background: var(--nv-bg-surface);
  border: 1px solid var(--nv-border);
  border-radius: 16px;
  box-shadow: var(--nv-shadow-sm);
  overflow: hidden;
  transition: background-color 0.25s, border-color 0.25s;
}
.panel-clean-header {
  padding: 1.1rem 1.4rem;
  border-bottom: 1px solid var(--nv-border-subtle);
  display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap;
}
.panel-clean-title { font-size: 1rem; font-weight: 700; color: var(--nv-text-1); margin: 0; display: flex; align-items: center; gap: 0.5rem; }
.panel-clean-title i { color: var(--nv-primary); }
.panel-clean-body { padding: 1.4rem; }

/* Empty state */
.empty-state { text-align: center; padding: 3rem 1.5rem; color: var(--nv-text-muted); }
.empty-state i { font-size: 2.5rem; opacity: 0.4; margin-bottom: 1rem; display: block; }
.empty-state h5 { color: var(--nv-text-2); font-weight: 700; font-size: 1rem; margin-bottom: 0.35rem; }
.empty-state p { font-size: 0.83rem; margin-bottom: 1.25rem; }

/* ----------------------------------------------------------------
   12. Status Badges — نشان‌های وضعیت
   ---------------------------------------------------------------- */
.status-pill {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.3rem 0.75rem;
  border-radius: 50rem;
  font-size: 0.74rem; font-weight: 700;
  white-space: nowrap;
}
.status-pill::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.status-pill.active { background: var(--nv-success-bg); color: var(--nv-success); }
.status-pill.pending { background: var(--nv-warning-bg); color: var(--nv-warning); }
.status-pill.suspended, .status-pill.terminated, .status-pill.cancelled, .status-pill.overdue, .status-pill.unpaid { background: var(--nv-danger-bg); color: var(--nv-danger); }
.status-pill.completed, .status-pill.paid { background: var(--nv-success-bg); color: var(--nv-success); }
.status-pill.refunded { background: var(--nv-info-bg); color: var(--nv-info); }
.status-pill.collections { background: var(--nv-danger-bg); color: var(--nv-danger); }
.status-pill.default { background: var(--nv-bg-elevated); color: var(--nv-text-2); }
.status-pill.open, .status-pill.customer-reply, .status-pill.answered { background: var(--nv-info-bg); color: var(--nv-info); }
.status-pill.closed { background: var(--nv-bg-elevated); color: var(--nv-text-muted); }

/* نسخه ۴.۱۴.۰ — تضمین سبزبودن واژه وضعیت «فعال» در همه فهرست‌ها و کارت‌های
   سرویس. هسته در برخی فهرست‌ها برچسب ترجمه‌شده را همراه با کلاس پیش‌فرض
   می‌فرستد؛ این قاعده رنگ سبز را تثبیت می‌کند (هم‌رنگ پیل فعال در سایر صفحات). */
.status-pill.active,
.nv-service-card .status-pill.active,
.nv-service-card .status-pill.nv-active,
.nv-stat-meta .status-pill.active { background: var(--nv-success-bg) !important; color: var(--nv-success) !important; }
.status-pill.nv-active { background: var(--nv-success-bg); color: var(--nv-success); }

/* Persian status labels mapping helper */
.badge-status-active, .badge-status-paid, .badge-status-completed { background: var(--nv-success-bg) !important; color: var(--nv-success) !important; }
.badge-status-pending, .badge-status-unpaid { background: var(--nv-warning-bg) !important; color: var(--nv-warning) !important; }
.badge-status-cancelled, .badge-status-terminated, .badge-status-suspended, .badge-status-overdue { background: var(--nv-danger-bg) !important; color: var(--nv-danger) !important; }
.badge-status-refunded { background: var(--nv-info-bg) !important; color: var(--nv-info) !important; }

/* ----------------------------------------------------------------
   13. Auth Pages — صفحات ورود و ثبت‌نام
   ---------------------------------------------------------------- */
.auth-page {
  background: var(--nv-bg-body);
  min-height: 100vh;
  display: flex;
  align-items: stretch;
  position: relative;
}
#particles-js {
  position: fixed; inset: 0;
  z-index: 0;
  pointer-events: none;
}
.auth-page ~ #particles-js, .auth-page + #particles-js { display: block; }

.login-split { display: flex; width: 100%; min-height: 100vh; position: relative; z-index: 1; }

/* پنل برند (سمت راست در RTL) */
.login-left {
  flex: 1;
  background: linear-gradient(160deg, #001338 0%, #00215F 45%, #002B85 78%, #001338 100%);
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 3rem 3.5rem;
  position: relative; overflow: hidden;
  color: #fff;
}
[data-bs-theme="dark"] .login-left {
  background: linear-gradient(95.45deg, var(--hostim_dark_gray_bg) 0.64%, var(--hostim_dark_bg) 98.23%);
}
.login-left-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 36px 36px;
  pointer-events: none;
}
.orb { position: absolute; border-radius: 50%; filter: blur(70px); pointer-events: none; }
.orb-1 { width: 380px; height: 380px; background: radial-gradient(circle, rgba(255,190,0,0.28), rgba(0,43,133,0.05)); top: -120px; inset-inline-end: -120px; }
.orb-2 { width: 220px; height: 220px; background: radial-gradient(circle, rgba(62,111,224,0.35), transparent); bottom: 60px; inset-inline-start: -60px; }
.orb-3 { width: 140px; height: 140px; background: radial-gradient(circle, rgba(255,190,0,0.12), transparent); top: 45%; inset-inline-end: 8%; }

.login-logo-wrap { position: relative; z-index: 2; }
.login-logo-wrap img { max-height: 42px; width: auto; }
.login-brand { position: relative; z-index: 2; flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 3rem 0; animation: nv-slide-up 0.7s cubic-bezier(0.22,1,0.36,1) both; }
.login-brand-badge {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: rgba(255,190,0,0.14);
  border: 1px solid rgba(255,190,0,0.35);
  color: #FFD24D;
  padding: 0.35rem 0.95rem;
  border-radius: 50rem;
  font-size: 0.75rem; font-weight: 700;
  margin-bottom: 2rem;
  width: fit-content;
}
/* تیتر یک‌خطی — «سرویس ابری پرسرعت نگارنوین» نمی‌شکند */
.login-brand-title {
  font-size: clamp(1.35rem, 2.3vw, 2rem);
  font-weight: 900;
  color: #fff;
  line-height: 1.5;
  margin-bottom: 1.25rem;
  white-space: nowrap;
}
.login-brand-title span {
  background: linear-gradient(135deg, #FFBE00, #FFD84D);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
@media (max-width: 575.98px) {
  .login-brand-title { white-space: normal; }
}
.login-brand-desc { font-size: 0.95rem; color: rgba(255,255,255,0.65); line-height: 2; max-width: 400px; margin-bottom: 2.5rem; }
.login-features { display: flex; flex-direction: column; gap: 1rem; }
.login-feature-item { display: flex; align-items: center; gap: 0.85rem; color: rgba(255,255,255,0.78); font-size: 0.875rem; font-weight: 500; }
.login-feature-icon {
  width: 32px; height: 32px;
  background: rgba(255,190,0,0.12);
  border: 1px solid rgba(255,190,0,0.3);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.8rem; color: #FFBE00;
  flex-shrink: 0;
}
.login-stats { display: flex; gap: 2.5rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,0.09); position: relative; z-index: 2; }
.login-stat-item { text-align: right; }
.login-stat-num { font-size: 1.6rem; font-weight: 800; color: #fff; line-height: 1.2; }
.login-stat-label { font-size: 0.72rem; color: rgba(255,255,255,0.5); margin-top: 0.25rem; }

/* پنل فرم */
.login-right {
  width: 480px; flex-shrink: 0;
  display: flex; flex-direction: column; justify-content: center;
  padding: 3rem 2.75rem;
  background: var(--nv-bg-body);
  position: relative;
  overflow-y: auto;
}
.login-form-wrap {
  position: relative; z-index: 2;
  background: var(--nv-bg-surface);
  border-radius: 18px;
  border: 1px solid var(--nv-border);
  box-shadow: var(--nv-shadow-md);
  padding: 2.5rem;
  animation: nv-slide-in-start 0.6s cubic-bezier(0.22,1,0.36,1) both;
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
}
.form-headline { font-size: 1.55rem; font-weight: 800; color: var(--nv-text-1); line-height: 1.4; margin-bottom: 0.4rem; }
.form-headline-accent { color: var(--nv-primary); }
.form-subhead { font-size: 0.85rem; color: var(--nv-text-muted); margin-bottom: 1.75rem; }

.auth-trust-item { display: flex; align-items: center; gap: 0.5rem; font-size: 0.75rem; color: var(--nv-text-muted); }
.auth-trust-item i { color: var(--nv-success); }

@media (max-width: 991.98px) {
  .login-left { display: none; }
  .login-right { width: 100%; padding: 2rem 1.25rem; }
}
@media (max-width: 1399.98px) {
  .login-left { padding: 2.25rem 2.5rem; }
}

@keyframes nv-slide-in-start { from { opacity: 0; transform: translateX(-24px); } to { opacity: 1; transform: translateX(0); } }
@keyframes nv-slide-up { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes nv-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes nv-spin { to { transform: rotate(360deg); } }

/* ----------------------------------------------------------------
   14. FAB — دکمه شناور اقدام سریع (پایین-چپ، قابل جابه‌جایی با درگ)
   ---------------------------------------------------------------- */
/* ترتیب عمودی از پایین: هوش نگارنوین (پایین‌ترین) ← FAB روی آن
   column-reverse باعث می‌شود منوی FAB به سمت بالا باز شود */
.fab-container { position: fixed; bottom: 6rem; left: 1.75rem; z-index: 1035; display: flex; flex-direction: column-reverse; align-items: flex-start; gap: 0.75rem; }
.fab-container.dragging { z-index: 1080; }
.fab-container.dragging .fab-main { transform: scale(1.06); box-shadow: 0 16px 34px rgba(0, 19, 56, 0.3); cursor: grabbing; }
.fab-main {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover));
  color: #fff;
  border: none;
  font-size: 1.25rem;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(var(--nv-primary-rgb), 0.4);
  transition: all 0.25s cubic-bezier(0.34,1.56,0.64,1);
  display: flex; align-items: center; justify-content: center;
  touch-action: none; /* لازم برای درگ لمسی */
}
.fab-main:hover { transform: scale(1.08) rotate(90deg); }
.fab-main.active { transform: rotate(45deg); background: var(--nv-primary-deep); }
.fab-menu { display: flex; flex-direction: column-reverse; gap: 0.65rem; align-items: flex-start; }
.fab-item {
  width: 46px; height: 46px;
  border-radius: 50%;
  background: var(--nv-bg-surface);
  color: var(--nv-primary);
  border: 1px solid var(--nv-border);
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
  opacity: 0; transform: translateY(20px) scale(0.8);
  transition: all 0.25s cubic-bezier(0.34,1.56,0.64,1);
  box-shadow: var(--nv-shadow-md);
  position: relative;
}
.fab-item:hover { background: var(--nv-primary); color: #fff; border-color: var(--nv-primary); }
.fab-item[data-tooltip]::after {
  content: attr(data-tooltip);
  /* تولتیپ سمت راستِ دکمه در RTL */
  position: absolute; inset-inline-end: calc(100% + 0.75rem); top: 50%; transform: translateY(-50%);
  background: var(--nv-primary-deep);
  color: #fff;
  padding: 0.35rem 0.75rem;
  border-radius: 8px;
  font-size: 0.75rem; font-weight: 600;
  white-space: nowrap;
  opacity: 0; pointer-events: none;
  transition: opacity 0.2s;
}
.fab-item:hover[data-tooltip]::after { opacity: 1; }

/* ----------------------------------------------------------------
   15. Loader — صفحه بارگذاری
   ---------------------------------------------------------------- */
#nv-loader {
  position: fixed; inset: 0;
  background: var(--nv-bg-body);
  z-index: 2000;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  transition: opacity 0.4s ease;
}
.loader-logo { max-height: 48px; width: auto; margin-bottom: 1.5rem; opacity: 0.9; }
.loader-progress { width: 180px; height: 4px; background: var(--nv-border); border-radius: 10px; overflow: hidden; }
.loader-progress-bar { height: 100%; width: 0%; background: linear-gradient(90deg, var(--nv-primary), var(--nv-accent)); border-radius: 10px; transition: width 0.5s ease; }
.loader-text { margin-top: 0.85rem; font-size: 0.8rem; color: var(--nv-text-muted); font-weight: 500; }

/* ----------------------------------------------------------------
   16. RTL Fixes — اصلاحات راست‌چین کامپوننت‌های والد (twenty-one/BS4)
   ---------------------------------------------------------------- */
/* Bootstrap 4 utilities → منطقی */
html[dir="rtl"] .ml-1, html[dir="rtl"] .mls-1 { margin-inline-start: 0.25rem; }
html[dir="rtl"] .ml-2 { margin-inline-start: 0.5rem; }
html[dir="rtl"] .ml-3 { margin-inline-start: 1rem; }
html[dir="rtl"] .ml-4 { margin-inline-start: 1.5rem; }
html[dir="rtl"] .ml-5 { margin-inline-start: 3rem; }
html[dir="rtl"] .mr-1 { margin-inline-end: 0.25rem; }
html[dir="rtl"] .mr-2 { margin-inline-end: 0.5rem; }
html[dir="rtl"] .mr-3 { margin-inline-end: 1rem; }
html[dir="rtl"] .mr-4 { margin-inline-end: 1.5rem; }
html[dir="rtl"] .mr-5 { margin-inline-end: 3rem; }
html[dir="rtl"] .pl-3 { padding-inline-start: 1rem; }
html[dir="rtl"] .pr-3 { padding-inline-end: 1rem; }
html[dir="rtl"] .text-left { text-align: left; }
html[dir="rtl"] .text-right { text-align: right; }
html[dir="rtl"] .float-left { float: inline-end; }
html[dir="rtl"] .float-right { float: inline-start; }
html[dir="rtl"] .ml-auto { margin-inline-start: auto; margin-left: 0; }
html[dir="rtl"] .mr-auto { margin-inline-end: auto; margin-right: 0; }
html[dir="rtl"] .dropdown-menu-right { left: 0; right: auto; }
html[dir="rtl"] .dropdown-menu-left { right: 0; left: auto; }

/* WHMCS twenty-one layout flip */
html[dir="rtl"] .main-sidebar { order: 2; }
html[dir="rtl"] .main-body { order: 1; }
html[dir="rtl"] .sidebar .nav-link i { margin-inline-end: 0.5rem; margin-inline-start: 0; }
html[dir="rtl"] .navbar .dropdown-menu { text-align: right; }
html[dir="rtl"] .custom-control-input { margin-inline-start: -1.5rem; margin-inline-end: 0; }
html[dir="rtl"] .custom-switch .custom-control-label::before { inset-inline-start: -2.25rem; left: auto; }
html[dir="rtl"] .custom-switch .custom-control-label::after { inset-inline-start: calc(-2.25rem + 2px); left: auto; }
html[dir="rtl"] .input-group-prepend { order: 2; }
html[dir="rtl"] .input-group-append { order: 0; }

/* Falg/arrow icons flip */
html[dir="rtl"] .rtl-flip { transform: scaleX(-1); }

/* KB / store / fallback pages typography */
.main-body { font-family: var(--nv-font); }
.panel { background: var(--nv-bg-surface); border-color: var(--nv-border); border-radius: 14px; box-shadow: var(--nv-shadow-sm); }
.panel-header, .panel-heading { background: transparent; border-bottom-color: var(--nv-border-subtle) !important; color: var(--nv-text-1) !important; }
.panel-body { color: var(--nv-text-2); }
.panel-footer { background: var(--nv-bg-elevated); border-top-color: var(--nv-border-subtle); color: var(--nv-text-2); }

/* Dark mode for parent pages */
[data-bs-theme="dark"] .main-body, [data-bs-theme="dark"] .main-sidebar { background: transparent !important; }
[data-bs-theme="dark"] .navbar-light .navbar-brand, [data-bs-theme="dark"] .navbar-light .nav-link { color: var(--nv-text-1); }
[data-bs-theme="dark"] .bg-light { background-color: var(--nv-bg-elevated) !important; }
[data-bs-theme="dark"] .text-dark { color: var(--nv-text-1) !important; }
[data-bs-theme="dark"] .border, [data-bs-theme="dark"] .border-top, [data-bs-theme="dark"] .border-bottom { border-color: var(--nv-border) !important; }
[data-bs-theme="dark"] .list-group-item { background-color: var(--nv-bg-surface); border-color: var(--nv-border-subtle); color: var(--nv-text-1); }
[data-bs-theme="dark"] .list-group-item-action:hover { background-color: var(--nv-bg-elevated); }
[data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select { color: var(--nv-text-1); }
[data-bs-theme="dark"] .text-primary { color: var(--nv-primary) !important; }
[data-bs-theme="dark"] .btn-light { background-color: var(--nv-bg-elevated); border-color: var(--nv-border); color: var(--nv-text-1); }
[data-bs-theme="dark"] .btn-light:hover { background-color: var(--nv-bg-input); color: var(--nv-text-1); }
[data-bs-theme="dark"] .alert-light { background: var(--nv-bg-elevated); color: var(--nv-text-2); border: 1px solid var(--nv-border); }
[data-bs-theme="dark"] .table { color: var(--nv-text-1); --bs-table-color: var(--nv-text-1); }
[data-bs-theme="dark"] .table td, [data-bs-theme="dark"] .table th { border-color: var(--nv-border-subtle); color: var(--nv-text-1); }
[data-bs-theme="dark"] .modal-title { color: var(--nv-text-1); }
[data-bs-theme="dark"] .close { color: var(--nv-text-1); }
[data-bs-theme="dark"] .breadcrumb-item + .breadcrumb-item::before { color: var(--nv-text-muted); }
[data-bs-theme="dark"] .dropdown-item { color: var(--nv-text-2); }
[data-bs-theme="dark"] .dropdown-item:hover { background: var(--nv-primary-soft); color: var(--nv-primary); }
[data-bs-theme="dark"] img.logo.img-responsive { filter: brightness(0) invert(1); }
[data-bs-theme="dark"] .login-container .card { background-color: var(--nv-bg-surface); }
[data-bs-theme="dark"] .text-secondary { color: var(--nv-text-2) !important; }
[data-bs-theme="dark"] .text-black-50 { color: var(--nv-text-muted) !important; }
[data-bs-theme="dark"] .bg-white { background-color: var(--nv-bg-surface) !important; }
[data-bs-theme="dark"] .bg-secondary { background-color: var(--nv-bg-input) !important; }
[data-bs-theme="dark"] .border-secondary { border-color: var(--nv-border) !important; }
[data-bs-theme="dark"] .toast { background-color: var(--nv-bg-surface); color: var(--nv-text-1); }
[data-bs-theme="dark"] .toast-header { background-color: var(--nv-bg-elevated); color: var(--nv-text-1); }
[data-bs-theme="dark"] blockquote { border-inline-start-color: var(--nv-primary); color: var(--nv-text-2); }

/* ----------------------------------------------------------------
   17.5 Footer — فوتر کامل نگارنوین (تماس، شبکه‌های اجتماعی، مجوزها)
   ---------------------------------------------------------------- */
#nv-wrapper { min-height: 100vh; }
.nv-footer {
  margin-top: auto;
  background: var(--nv-bg-surface);
  border-top: 1px solid var(--nv-border-subtle);
  padding: 0 1.5rem;
  position: relative;
}
.nv-footer::before {
  content: "";
  position: absolute; top: -1px; inset-inline: 0; height: 3px;
  background: linear-gradient(to left, var(--nv-primary) 0%, var(--nv-primary-deep, #001338) 55%, var(--nv-gold, #FFBE00) 100%);
  opacity: 0.85;
}
.nv-footer-inner { max-width: 1560px; margin: 0 auto; }

/* گرید ۴ ستونه */
.nv-footer-grid {
  display: grid;
  grid-template-columns: 1.65fr 0.95fr 1.4fr 1.1fr;
  gap: 2.25rem;
  padding: 2.5rem 0 1.9rem;
}

/* ── ستون برند ── */
.nv-footer-lockup { display: flex; align-items: center; gap: 0.75rem; }
.nv-footer-mark { width: 42px; height: 42px; display: block; }
.nv-footer-lockup-text { display: flex; flex-direction: column; line-height: 1.2; }
.nv-footer-lockup-name { font-size: 1.15rem; font-weight: 800; color: var(--nv-text-1); }
.nv-footer-lockup-sub {
  font-size: 0.58rem; font-weight: 700; letter-spacing: 2.2px;
  color: var(--nv-text-muted); text-align: right;
}
.nv-footer-desc {
  margin: 1rem 0 1.1rem;
  font-size: 0.82rem; line-height: 1.9; color: var(--nv-text-2);
  max-width: 34ch;
}
.nv-footer-contact-mini { display: flex; flex-wrap: wrap; gap: 0.55rem; margin-bottom: 1.15rem; }
.nv-footer-chip {
  display: inline-flex; align-items: center; gap: 0.45rem;
  padding: 0.42rem 0.9rem;
  font-size: 0.78rem; font-weight: 700;
  color: var(--nv-text-1);
  background: var(--nv-primary-soft);
  border: 1px solid var(--nv-border-subtle);
  border-radius: 50rem;
  text-decoration: none;
  transition: all 0.22s ease;
}
.nv-footer-chip i { font-size: 0.85rem; color: var(--nv-primary); }
.nv-footer-chip:hover {
  background: var(--nv-primary); color: #fff;
  border-color: var(--nv-primary);
  transform: translateY(-2px);
  box-shadow: 0 8px 18px -8px rgba(0, 43, 133, 0.45);
}
.nv-footer-chip:hover i { color: #FFBE00; }

/* ── شبکه‌های اجتماعی ── */
.nv-footer-social { display: flex; flex-wrap: wrap; gap: 0.55rem; }
.nv-social-btn {
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.02rem;
  color: var(--nv-text-2);
  background: var(--nv-bg-elevated, var(--nv-bg-surface));
  border: 1px solid var(--nv-border-subtle);
  border-radius: 13px;
  transition: all 0.24s cubic-bezier(0.22, 1, 0.36, 1);
}
.nv-social-btn:hover {
  color: #fff; border-color: transparent;
  transform: translateY(-3px);
  box-shadow: 0 10px 20px -8px rgba(0, 0, 0, 0.35);
}
.nv-social-instagram:hover { background: linear-gradient(45deg, #F09433, #E6683C, #DC2743, #CC2366, #BC1888); }
.nv-social-whatsapp:hover { background: #25D366; }
.nv-social-telegram:hover { background: #229ED9; }
.nv-social-youtube:hover { background: #E62117; }
.nv-social-facebook:hover { background: #1877F2; }
.nv-social-x:hover { background: #141419; }
[data-bs-theme="dark"] .nv-social-x:hover { background: #ffffff; color: #141419; }
[data-bs-theme="dark"] .nv-social-btn {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.1);
  color: var(--nv-text-2);
}

/* ── عنوان ستون‌ها ── */
.nv-footer-title {
  font-size: 0.85rem; font-weight: 800; color: var(--nv-text-1);
  margin: 0 0 1.05rem;
  padding-inline-start: 0.65rem;
  border-inline-start: 3px solid var(--nv-gold, #FFBE00);
  line-height: 1.4;
}

/* ── لیست لینک‌ها ── */
.nv-footer-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.55rem; }
.nv-footer-list a {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-size: 0.8rem; font-weight: 500; color: var(--nv-text-2);
  text-decoration: none;
  transition: color 0.18s ease, transform 0.18s ease;
}
.nv-footer-list a i { font-size: 0.9rem; color: var(--nv-text-muted); transition: color 0.18s ease; }
.nv-footer-list a:hover { color: var(--nv-primary); transform: translateX(-3px); }
.nv-footer-list a:hover i { color: var(--nv-gold, #FFBE00); }

/* ── اطلاعات تماس ── */
.nv-footer-contact { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.7rem; }
.nv-footer-contact-link {
  display: flex; align-items: flex-start; gap: 0.65rem;
  text-decoration: none;
}
.nv-footer-contact-icon {
  flex-shrink: 0;
  width: 36px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1rem;
  color: var(--nv-primary);
  background: var(--nv-primary-soft);
  border-radius: 11px;
  transition: all 0.2s ease;
}
.nv-footer-contact-icon-gold { color: #8a6600; background: rgba(255, 190, 0, 0.18); }
.nv-footer-contact-body { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.nv-footer-contact-label { font-size: 0.68rem; font-weight: 600; color: var(--nv-text-muted); }
.nv-footer-contact-value { font-size: 0.8rem; font-weight: 700; color: var(--nv-text-1); line-height: 1.65; }
a.nv-footer-contact-link:hover .nv-footer-contact-value { color: var(--nv-primary); }
a.nv-footer-contact-link:hover .nv-footer-contact-icon { transform: scale(1.08); }

/* ── نمادهای اعتماد ── */
.nv-footer-namad { display: flex; align-items: stretch; gap: 0.6rem; flex-wrap: wrap; }
.namad-badge {
  flex: 1 1 0; min-width: 76px;
  display: flex; align-items: center; justify-content: center;
  background: #ffffff;
  border: 1px solid var(--nv-border-subtle);
  border-radius: 14px;
  padding: 0.65rem 0.55rem;
  transition: all 0.22s ease;
}
.namad-badge img { height: 66px; width: auto; display: block; }
.namad-badge-tall img { height: 66px; }
.namad-badge:hover {
  transform: translateY(-3px);
  border-color: rgba(255, 190, 0, 0.6);
  box-shadow: 0 12px 24px -10px rgba(0, 43, 133, 0.28);
}

/* ── نوار پایانی ── */
.nv-footer-bottom {
  display: flex; align-items: center; justify-content: space-between;
  gap: 0.9rem; flex-wrap: wrap;
  padding: 1.15rem 0 1.3rem;
  border-top: 1px solid var(--nv-border-subtle);
}
.nv-footer-copyright { font-size: 0.78rem; color: var(--nv-text-muted); }
.nv-footer-copyright a { color: var(--nv-primary); font-weight: 600; }
.nv-footer-links { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.nv-footer-links a { font-size: 0.78rem; color: var(--nv-text-muted); font-weight: 500; }
.nv-footer-links a:hover { color: var(--nv-primary); }

/* ── دارک مود فوتر ── */
[data-bs-theme="dark"] .nv-footer { background: var(--nv-bg-surface); }
[data-bs-theme="dark"] .nv-footer-desc { color: var(--nv-text-2); }
[data-bs-theme="dark"] .nv-footer-chip { background: rgba(255, 255, 255, 0.05); }
[data-bs-theme="dark"] .nv-footer-chip:hover { background: var(--nv-primary); color: #fff; }
[data-bs-theme="dark"] .namad-badge { background: #ffffff; }

/* ── واکنش‌گرایی فوتر ── */
@media (max-width: 1199.98px) {
  .nv-footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem 2.5rem; }
  .nv-footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 767.98px) {
  .nv-footer { padding: 0 1rem; }
  .nv-footer-grid { grid-template-columns: 1fr; gap: 1.8rem; padding: 2rem 0 1.5rem; }
  .nv-footer-desc { max-width: none; }
  .nv-footer-bottom { flex-direction: column; text-align: center; justify-content: center; }
  .nv-footer-namad { justify-content: center; }
  .namad-badge { flex: 0 1 auto; min-width: 86px; }
}
@media (max-width: 400px) {
  .nv-footer-social { justify-content: center; }
  .nv-footer-contact-mini { justify-content: center; }
}

/* ----------------------------------------------------------------
   17.6 لوگوی لوك‌آپ نگارنوین (مارک + متن) — سایدبار، توپ‌بار، ورود
   ---------------------------------------------------------------- */
.nv-brand-lockup { display: flex; align-items: center; gap: 0.7rem; text-decoration: none; }
.nv-brand-mark { width: 40px; height: 40px; display: block; }
.nv-brand-text { display: flex; flex-direction: column; line-height: 1.24; }
.nv-brand-name {
  font-size: 1.32rem; font-weight: 900; color: var(--nv-text-1);
  letter-spacing: -0.3px;
  background: linear-gradient(120deg, var(--nv-primary) 20%, #0A1F5C 90%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
[data-bs-theme="dark"] .nv-brand-name {
  background: linear-gradient(120deg, #FFFFFF 20%, #B9C6E8 90%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.nv-brand-sub {
  font-size: 0.62rem; font-weight: 700; line-height: 1.35;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--nv-text-muted); text-align: right;
  display: block; white-space: nowrap; overflow: visible;
}
.nv-brand-lockup:hover .nv-brand-name { filter: brightness(1.15); }

.topbar-mark { width: 32px; height: 32px; display: block; }
.topbar-brand-name {
  font-size: 1.18rem; font-weight: 900; color: var(--nv-text-1);
  letter-spacing: -0.3px;
  margin-inline-start: 0.6rem;
  white-space: nowrap;
  background: linear-gradient(120deg, var(--nv-primary) 20%, #0A1F5C 90%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
[data-bs-theme="dark"] .topbar-brand-name {
  background: linear-gradient(120deg, #FFFFFF 20%, #B9C6E8 90%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}

.nv-login-lockup { display: flex; align-items: center; gap: 0.8rem; }
.nv-login-mark {
  width: 48px; height: 48px; display: block;
  filter: drop-shadow(0 8px 20px rgba(0, 0, 0, 0.35));
}
.nv-login-brand-name { font-size: 1.55rem; font-weight: 800; color: #ffffff; letter-spacing: -0.5px; }

/* ── ردیف تماس صفحه ورود ── */
.login-contact-row {
  position: relative; z-index: 2;
  display: flex; align-items: center; justify-content: center;
  flex-wrap: wrap; gap: 0.65rem;
  padding-top: 1.4rem;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}
.login-contact-label { font-size: 0.78rem; color: rgba(255, 255, 255, 0.72); font-weight: 500; }
.login-contact-link {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-size: 0.8rem; font-weight: 700; color: #ffffff;
  padding: 0.4rem 0.85rem;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 50rem;
  text-decoration: none;
  backdrop-filter: blur(6px);
  transition: all 0.22s ease;
}
.login-contact-link i { font-size: 0.88rem; }
.login-contact-link:hover { background: rgba(255, 255, 255, 0.2); transform: translateY(-2px); color: #fff; }
.login-contact-whatsapp:hover { background: #25D366; border-color: #25D366; }
.login-contact-telegram:hover { background: #229ED9; border-color: #229ED9; }
.login-contact-sep { width: 4px; height: 4px; border-radius: 50%; background: rgba(255, 255, 255, 0.35); }

/* ── چیپ‌های تماس موبایل (زیر فرم ورود) ── */
.login-contact-compact {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 0.5rem;
  margin-top: 1.15rem;
  padding-top: 1.05rem;
  border-top: 1px dashed var(--nv-border-subtle);
}
.login-contact-pill {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-size: 0.78rem; font-weight: 700;
  color: var(--nv-text-1);
  padding: 0.45rem 0.9rem;
  background: var(--nv-primary-soft);
  border: 1px solid var(--nv-border-subtle);
  border-radius: 50rem;
  text-decoration: none;
  transition: all 0.2s ease;
  min-height: 38px;
}
.login-contact-pill i { font-size: 0.85rem; color: var(--nv-primary); }
.login-contact-pill:hover { background: var(--nv-primary); color: #fff; border-color: var(--nv-primary); }
.login-contact-pill:hover i { color: var(--nv-gold, #FFBE00); }
.login-contact-pill-wa i { color: #1FA855; }
.login-contact-pill-tg i { color: #1F8FC5; }
.login-contact-pill-wa:hover { background: #25D366; border-color: #25D366; }
.login-contact-pill-tg:hover { background: #229ED9; border-color: #229ED9; }
.login-contact-pill-wa:hover i, .login-contact-pill-tg:hover i { color: #fff; }

@media (max-width: 575.98px) {
  .login-contact-row { gap: 0.45rem; }
  .login-contact-label { width: 100%; text-align: center; margin-bottom: 0.15rem; }
  .login-contact-sep { display: none; }
}

/* دکمه ورود توپ‌بار */
.btn-topbar-dashboard {
  border-radius: 50rem;
  padding: 0.45rem 1.3rem;
  min-height: 40px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  gap: 0.35rem;
  white-space: nowrap;
}

/* ----------------------------------------------------------------
   17.7 Dashboard Density — چگالی نمایش داشبورد (راحت / فشرده)
   حالت فشرده: کلید html[data-nv-density="compact"]
   انتخاب کاربر در localStorage با کلید nv-dash-density ذخیره می‌شود
   ---------------------------------------------------------------- */
html[data-nv-density="compact"] { --nv-dash-gap: 0.6rem; }

/* ردیف‌های داشبورد — گاتر منطقی BS5 از توکن */
html[data-nv-density="compact"] .nv-dash-row { --bs-gutter-x: var(--nv-dash-gap); --bs-gutter-y: var(--nv-dash-gap); margin-bottom: 1rem !important; }

/* هیرو داشبورد */
html[data-nv-density="compact"] .nv-dash-hero { padding: 1.15rem 1.3rem; }
html[data-nv-density="compact"] .nv-dash-hero-title { font-size: 1.3rem; }
html[data-nv-density="compact"] .nv-dash-hero-sub { font-size: 0.8rem; margin-bottom: 0; }
html[data-nv-density="compact"] .nv-dash-hero-actions .btn,
html[data-nv-density="compact"] .nv-dash-hero-actions .nv-hero-btn-ghost {
  padding: 0.42rem 0.9rem;
  font-size: 0.8rem;
}

/* کارت‌های آمار */
html[data-nv-density="compact"] .stat-card-clean .p-4 { padding: 0.9rem 1rem !important; }
html[data-nv-density="compact"] .stat-value-clean { font-size: 1.45rem; }
html[data-nv-density="compact"] .stat-label-clean { font-size: 0.74rem; }
html[data-nv-density="compact"] .stat-icon-clean { width: 42px; height: 42px; border-radius: 11px; font-size: 1.15rem; }
html[data-nv-density="compact"] .nv-stat-meta { margin-top: 0.35rem; }
html[data-nv-density="compact"] .nv-stat-meta .status-pill { font-size: 0.66rem; padding: 0.22rem 0.6rem; }

/* پنل‌های مشترک */
html[data-nv-density="compact"] .panel-clean-header { padding: 0.75rem 1rem; }
html[data-nv-density="compact"] .panel-clean-header .panel-clean-title { font-size: 0.9rem; }
html[data-nv-density="compact"] .panel-clean-body { padding: 0.95rem 1rem; }

/* کارت وفاداری */
html[data-nv-density="compact"] .nv-loyalty-card .p-4,
html[data-nv-density="compact"] .nv-loyalty-card .p-md-5 { padding: 1rem 1.1rem !important; }

/* ردیف‌های جدول‌مانند داخل پنل‌ها */
html[data-nv-density="compact"] .nv-mail-row { padding: 0.7rem 0.9rem; gap: 0.65rem; }
html[data-nv-density="compact"] .nv-mail-icon { width: 38px; height: 38px; font-size: 1rem; border-radius: 10px; }

/* دکمه‌های اقدام سریع */
html[data-nv-density="compact"] .nv-dash-quick .btn { padding: 0.38rem 0.8rem; font-size: 0.78rem; }

/* سوئیچ چگالی خودش */
.nv-density-switch {
  display: inline-flex;
  align-items: center;
  background: var(--nv-bg-elevated);
  border: 1px solid var(--nv-border-subtle);
  border-radius: 50rem;
  padding: 0.22rem;
  gap: 0.15rem;
}
.nv-density-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--nv-text-muted);
  font-family: var(--nv-font);
  font-size: 0.74rem;
  font-weight: 700;
  padding: 0.32rem 0.85rem;
  border-radius: 50rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  transition: color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
  white-space: nowrap;
}
.nv-density-btn i { font-size: 0.9rem; }
.nv-density-btn:hover { color: var(--nv-text-1); }
.nv-density-btn[aria-pressed="true"] {
  background: var(--nv-primary);
  color: #fff;
  box-shadow: 0 2px 8px rgba(var(--nv-primary-rgb), 0.35);
}
.nv-density-btn[aria-pressed="true"] i { color: var(--nv-accent); }
.nv-density-btn:focus-visible { outline: 2px solid var(--nv-primary); outline-offset: 2px; }

/* ----------------------------------------------------------------
   18. Loader skeleton — اسکلتون بارگذاری
   ---------------------------------------------------------------- */
.skeleton { background: var(--nv-bg-elevated); border-radius: 10px; position: relative; overflow: hidden; }
.skeleton::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(var(--nv-primary-rgb), 0.06), transparent);
  animation: nv-shimmer 1.6s infinite;
}
@keyframes nv-shimmer { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }

/* ----------------------------------------------------------------
   18. Utilities
   ---------------------------------------------------------------- */
.nv-gradient-text {
  background: linear-gradient(135deg, var(--nv-primary), #3E6FE0);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.nv-gold-text {
  background: linear-gradient(135deg, #FFBE00, #E5AC00);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.bg-brand-soft { background: var(--nv-primary-soft); }
.text-brand { color: var(--nv-primary) !important; }
.text-accent { color: #B8860B !important; }
[data-bs-theme="dark"] .text-accent { color: var(--nv-accent) !important; }
.nv-divider { height: 1px; background: var(--nv-border-subtle); margin: 1.25rem 0; border: none; }

/* رنگ‌های متن و پس‌زمینه‌های بوت‌استرپ در دارک مود */
[data-bs-theme="dark"] .text-success { color: var(--nv-success) !important; }
[data-bs-theme="dark"] .text-danger { color: var(--nv-danger) !important; }
[data-bs-theme="dark"] .text-warning { color: var(--nv-warning) !important; }
[data-bs-theme="dark"] .text-info { color: var(--nv-info) !important; }
[data-bs-theme="dark"] .bg-success { background-color: rgba(76,195,138,0.15) !important; color: var(--nv-success) !important; }
[data-bs-theme="dark"] .bg-danger { background-color: rgba(242,85,90,0.15) !important; color: var(--nv-danger) !important; }
[data-bs-theme="dark"] .bg-warning { background-color: rgba(227,160,8,0.15) !important; color: var(--nv-warning) !important; }
[data-bs-theme="dark"] .bg-info { background-color: rgba(111,168,255,0.15) !important; color: var(--nv-info) !important; }
[data-bs-theme="dark"] .bg-primary { background-color: var(--nv-primary) !important; }
[data-bs-theme="dark"] .text-white[data-bs-theme="dark"] { color: #fff !important; }

/* ----------------------------------------------------------------
   19. Responsive
   ---------------------------------------------------------------- */
@media (max-width: 1199.98px) {
  .topbar-nav { display: none !important; }
}
@media (max-width: 991.98px) {
  .login-left { display: none; }
}
@media (max-width: 767.98px) {
  :root { --nv-topbar-h: 62px; }
  .topbar-logo { height: 30px; }
  .nv-content { padding-top: 1rem; }
  .login-form-wrap { padding: 1.75rem 1.25rem; }
  .page-title { font-size: 1.25rem; }
  .fab-container { bottom: 4.9rem; left: 1.25rem; }
}
@media (max-width: 575.98px) {
  .stat-value-clean { font-size: 1.5rem; }
  .topbar-search-compact { display: none !important; }
  .login-stats { gap: 1.5rem; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* ----------------------------------------------------------------
   19.5 UX Polish — جزئیات تعاملی و دسترسی‌پذیری (نسخه ۳.۴)
   ---------------------------------------------------------------- */

/* حلقه فوکوس یکپارچه کیبورد روی همه عناصر تعاملی */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible,
.nav-link:focus-visible,
.page-link:focus-visible {
  outline: 2px solid var(--nv-primary);
  outline-offset: 2px;
  border-radius: 8px;
}

/* بازخورد لمسی دکمه‌ها — فشرده‌شدن ملایم هنگام کلیک */
.btn:active:not(:disabled),
.nv-hero-btn-ghost:active,
[role="button"]:active { transform: scale(0.97); }

/* ردیف‌های جدول — هاور ملایم باکال برند */
.table > :not(caption) > *:hover > * { background-color: rgba(var(--nv-primary-rgb), 0.045); }
[data-bs-theme="dark"] .table > :not(caption) > *:hover > * { background-color: rgba(var(--nv-primary-rgb), 0.09); }

/* لینک‌های محتوا — زیرخط با فاصله و رنگ برند */
.nv-sec .nv-mail-viewer a,
.kb-article-body a,
.panel-clean-body p a:not(.btn):not([class*="btn-"]),
.nv-announce-title { text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* نشان وضعیت «فعال» — نقطه نبض‌دار زنده (فاصله از gap والد تأمین می‌شود) */
.status-pill.active::before,
.status-pill.paid::before,
.status-pill.completed::before {
  content: '';
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
  vertical-align: middle;
  animation: nv-pill-pulse 2.2s ease-in-out infinite;
}
@keyframes nv-pill-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(46, 161, 105, 0.5); }
  55% { box-shadow: 0 0 0 4px rgba(46, 161, 105, 0); }
}

/* اسکرول‌بار سفارشی برای نواحی اسکرول‌شونده (مودال‌ها، نمایشگر ایمیل) */
.nv-mail-viewer::-webkit-scrollbar,
.modal-body::-webkit-scrollbar,
.nv-sidebar-body::-webkit-scrollbar { width: 8px; }
.nv-mail-viewer::-webkit-scrollbar-thumb,
.modal-body::-webkit-scrollbar-thumb,
.nv-sidebar-body::-webkit-scrollbar-thumb {
  background: rgba(var(--nv-primary-rgb), 0.28);
  border-radius: 8px;
}
.nv-mail-viewer::-webkit-scrollbar-thumb:hover,
.modal-body::-webkit-scrollbar-thumb:hover { background: rgba(var(--nv-primary-rgb), 0.5); }
.nv-mail-viewer, .modal-body, .nv-sidebar-body { scrollbar-width: thin; scrollbar-color: rgba(var(--nv-primary-rgb), 0.35) transparent; }

/* انتخاب متن در دارک مود — خواناتر */
[data-bs-theme="dark"] ::selection { background: rgba(255, 190, 0, 0.3); color: #fff; }

/* سرریز افقی پیش‌فرض برای جداول داخل پنل‌ها */
.panel-clean-body .table-responsive { border-radius: 10px; }

/* انیمیشن ورود ملایم کارت‌ها (فقط بار اول، بدون تکرار) */
@keyframes nv-card-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.nv-anim-in { animation: nv-card-in 0.45s cubic-bezier(0.22, 1, 0.36, 1) both; }
.nv-anim-in:nth-child(2) { animation-delay: 0.06s; }
.nv-anim-in:nth-child(3) { animation-delay: 0.12s; }
.nv-anim-in:nth-child(4) { animation-delay: 0.18s; }

/* ----------------------------------------------------------------
   20. Print
   ---------------------------------------------------------------- */
@media print {
  #nv-sidebar, #nv-topbar, .nv-announcement-bar, .fab-container, #nv-loader, .sidebar-backdrop { display: none !important; }
  #nv-main { margin-top: 0 !important; }
  body { background: #fff !important; }
}

/* ----------------------------------------------------------------
   21. Snackbar / Copy feedback
   ---------------------------------------------------------------- */
.btn.copied { background: var(--nv-success) !important; color: #fff !important; border-color: var(--nv-success) !important; }

/* لینک‌های فوتر اعلان */
.announcement-container { position: relative; z-index: 2; }

/* ----------------------------------------------------------------
   22. Equal-height dashboard panels
   ---------------------------------------------------------------- */
@media (min-width: 992px) {
  .nv-content .row > [class*="col-lg"] > .panel-clean.h-100 { height: 100%; }
}

/* ----------------------------------------------------------------
   23. jQuery Widgets — بازطراحی سراسری (bootstrapSwitch + آی‌چک)
   ویجت‌های jQuery قدیمی هسته WHMCS در همه‌جا (امنیت/سبد/تیکت)
   به برند نگارنوین تبدیل می‌شوند — دیگر هیچ سوییچ سفید/سبز خام
   ---------------------------------------------------------------- */
/* 23.1 bootstrapSwitch — قاب و دستگیره */
.bootstrap-switch {
  border: 1px solid var(--nv-border) !important;
  border-radius: 999px !important;
  background: var(--nv-bg-elevated) !important;
  overflow: hidden;
  vertical-align: middle;
}
.bootstrap-switch .bootstrap-switch-container { border-radius: 999px !important; }
.bootstrap-switch .bootstrap-switch-handle-on,
.bootstrap-switch .bootstrap-switch-handle-off {
  border-radius: 999px !important;
  margin-top: 0 !important;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success { background: var(--nv-primary) !important; color: #fff !important; border-color: var(--nv-primary) !important; }
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success:hover { background: var(--nv-primary-hover) !important; }
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary { background: transparent !important; color: var(--nv-text-muted) !important; border-color: transparent !important; }
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary:hover,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default:hover { background: rgba(var(--nv-primary-rgb), 0.08) !important; color: var(--nv-text-2) !important; }
/* دستگیره متحرک (knob) — طلایی برند */
.bootstrap-switch .bootstrap-switch-label {
  background: var(--nv-accent) !important;
  border-radius: 999px !important;
  box-shadow: 0 1px 4px rgba(0, 19, 56, 0.28) !important;
  color: var(--nv-accent-ink) !important;
  transition: background 0.2s ease;
}
.bootstrap-switch .bootstrap-switch-label::after { color: var(--nv-accent-ink) !important; }
.bootstrap-switch.bootstrap-switch-focused { box-shadow: 0 0 0 4px rgba(var(--nv-primary-rgb), 0.16) !important; }
[data-bs-theme="dark"] .bootstrap-switch { background: var(--hostim_dark_gray_bg) !important; border-color: rgba(255, 255, 255, 0.09) !important; }
[data-bs-theme="dark"] .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success { background: var(--nv-primary-hover) !important; border-color: var(--nv-primary-hover) !important; }
[data-bs-theme="dark"] .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary,
[data-bs-theme="dark"] .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default { color: #9CA1AD !important; }
[data-bs-theme="dark"] .bootstrap-switch .bootstrap-switch-label { box-shadow: 0 1px 5px rgba(0, 0, 0, 0.45) !important; }
/* 23.2 آی‌چک (checkbox/radio قدیمی) — به‌جای اسپرایت آبی، برند محلی
   نکته: CSS پایه layout پلاگین iCheck (ابعاد و مخفی‌کردن input اصلی)
   در استایل قدیمی all.min.css حذف‌شده بود؛ بدون این قواعد رادیوهای
   سبد خرید (مثل «ساخت اکانت جدید») نامرئی و غیرقابل کلیک می‌شدند. */
.icheckbox_square-blue,
.iradio_square-blue {
  display: inline-block !important;
  vertical-align: middle;
  margin: 0;
  padding: 0;
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  box-sizing: content-box;
  background-image: none !important;
  background-color: var(--nv-bg-input) !important;
  border: 2px solid var(--nv-border-strong, #C9CBD4) !important;
  border-radius: 7px !important;
  position: relative !important;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.icheckbox_square-blue input,
.iradio_square-blue input {
  position: absolute !important;
  inset: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  /* نکته حیاتی: input نباید کلیک بگیرد — iCheck روی wrapper/label خودش toggle می‌کند.
     کلیک‌پذیر بودن input + label = دو بار toggle = تیک که می‌خورد دیگر برداشته نمی‌شود. */
  pointer-events: none;
}
.icheckbox_square-blue,
.iradio_square-blue { cursor: pointer; }
.iradio_square-blue { border-radius: 999px !important; }
.icheckbox_square-blue.hover, .iradio_square-blue.hover { border-color: var(--nv-primary-border) !important; }
.icheckbox_square-blue.checked, .iradio_square-blue.checked {
  background-color: var(--nv-primary) !important;
  border-color: var(--nv-primary) !important;
}
.iradio_square-blue.checked::after {
  content: '' !important;
  position: absolute; inset: 0; margin: auto;
  width: 8px; height: 8px; border-radius: 999px;
  background: #fff !important;
}
.icheckbox_square-blue.checked::after {
  content: '\2713' !important;
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff !important; font-size: 13px; font-weight: 900; line-height: 1;
}
.icheckbox_square-blue.disabled, .iradio_square-blue.disabled { opacity: 0.45 !important; }
[data-bs-theme="dark"] .icheckbox_square-blue,
[data-bs-theme="dark"] .iradio_square-blue {
  background-color: var(--hostim_dark_gray_bg) !important;
  border-color: #4A4757 !important;
}
[data-bs-theme="dark"] .icheckbox_square-blue.checked,
[data-bs-theme="dark"] .iradio_square-blue.checked {
  background-color: var(--nv-primary-hover) !important;
  border-color: var(--nv-primary-hover) !important;
}
/* 23.3 دارک — placeholder خواناتر (کنتراست AA) */
[data-bs-theme="dark"] .form-control::placeholder,
[data-bs-theme="dark"] .field::placeholder,
[data-bs-theme="dark"] textarea::placeholder { color: #9CA1AD !important; opacity: 1 !important; }
[data-bs-theme="dark"] .form-control::placeholder, [data-bs-theme="dark"] select.form-control { color: #E4E4EA; }

/* ═══════════════ ۲۴. کامپوننت‌های مشترک قالب‌های v4 (پورت Twenty-One) ═══════════════ */

/* ── هشدار برند (includes/alert.tpl) ── */
.nv-alert {
    display: flex; align-items: flex-start; gap: 0.7rem;
    border-radius: 12px; padding: 0.9rem 1.1rem;
    margin-bottom: 1.2rem; font-size: 0.85rem; line-height: 1.9;
    border: 1px solid transparent;
}
.nv-alert i { font-size: 1.05rem; flex-shrink: 0; margin-top: 0.25rem; }
.nv-alert ul { margin: 0; padding-inline-start: 1.2rem; }
.nv-alert a { font-weight: 700; }
.nv-alert-center { justify-content: center; text-align: center; }
.nv-alert-success { background: var(--nv-success-bg); border-color: color-mix(in srgb, var(--nv-success) 28%, transparent); color: var(--nv-text-2); }
.nv-alert-success i { color: var(--nv-success); }
.nv-alert-info { background: var(--nv-info-bg); border-color: color-mix(in srgb, var(--nv-info) 28%, transparent); color: var(--nv-text-2); }
.nv-alert-info i { color: var(--nv-info); }
.nv-alert-warning { background: var(--nv-warning-bg); border-color: color-mix(in srgb, var(--nv-warning) 32%, transparent); color: var(--nv-text-2); }
.nv-alert-warning i { color: var(--nv-warning); }
.nv-alert-error { background: var(--nv-danger-bg); border-color: color-mix(in srgb, var(--nv-danger) 30%, transparent); color: var(--nv-text-2); }
.nv-alert-error i { color: var(--nv-danger); }
.nv-alert-error strong { color: var(--nv-danger); }

/* ── دکمه‌های فرم برند (فارسی، آیکون‌دار) ── */
.nv-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 0.6rem; flex-wrap: wrap; margin-top: 1.4rem; }
.btn-outline-custom { border-color: var(--nv-border); color: var(--nv-text-2); background: transparent; }
.btn-outline-custom:hover { border-color: var(--nv-primary-border); color: var(--nv-primary); background: var(--nv-primary-soft); }

/* ── جدول برند مشترک (masspay/quotes/…) ── */
.nv-table-card { background: var(--nv-bg-surface); border: 1px solid var(--nv-border); border-radius: 16px; overflow: hidden; box-shadow: var(--nv-shadow-sm); }
.nv-table-head { display: flex; align-items: center; gap: 0.75rem; padding: 1.1rem 1.3rem; border-bottom: 1px solid var(--nv-border-subtle); flex-wrap: wrap; }
.nv-table-head i { color: var(--nv-primary); font-size: 1.15rem; }
.nv-table-title { font-size: 0.95rem; font-weight: 800; color: var(--nv-text-1); margin: 0; }
.nv-table-wrap { overflow-x: auto; }
table.nv-table { width: 100%; border-collapse: collapse; font-size: 0.84rem; min-width: 560px; }
table.nv-table th {
    background: var(--nv-bg-elevated); color: var(--nv-text-muted);
    font-size: 0.72rem; font-weight: 700; text-align: start;
    padding: 0.7rem 1rem; border-bottom: 1px solid var(--nv-border-subtle);
    white-space: nowrap;
}
table.nv-table td { padding: 0.85rem 1rem; border-bottom: 1px solid var(--nv-border-subtle); color: var(--nv-text-2); vertical-align: middle; }
table.nv-table tr:last-child td { border-bottom: 0; }
table.nv-table tbody tr { transition: background 0.15s ease; }
table.nv-table tbody tr:hover { background: color-mix(in srgb, var(--nv-primary-soft) 45%, transparent); }
.nv-cell-strong { color: var(--nv-text-1); font-weight: 700; }

/* ── خالی‌بودن حالت (empty state) ── */
.nv-empty {
    text-align: center; padding: 3rem 1.5rem; color: var(--nv-text-muted);
}
.nv-empty i { font-size: 2.4rem; color: var(--nv-primary); opacity: 0.45; margin-bottom: 0.8rem; display: block; }
.nv-empty-title { font-size: 0.95rem; font-weight: 700; color: var(--nv-text-1); margin-bottom: 0.3rem; }
.nv-empty p { font-size: 0.82rem; margin: 0; }

/* ── چیپ وضعیت برند ── */
.nv-badge {
    display: inline-flex; align-items: center; gap: 0.35rem;
    font-size: 0.7rem; font-weight: 700; padding: 0.28rem 0.7rem;
    border-radius: 999px; white-space: nowrap;
}
.nv-badge i { font-size: 0.75rem; }
.nv-badge-success { color: var(--nv-success); background: var(--nv-success-bg); }
.nv-badge-danger { color: var(--nv-danger); background: var(--nv-danger-bg); }
.nv-badge-info { color: var(--nv-primary); background: var(--nv-primary-soft); }
.nv-badge-warning { color: var(--nv-warning); background: var(--nv-warning-bg); }
.nv-badge-muted { color: var(--nv-text-muted); background: var(--nv-bg-elevated); }

/* ── بیل‌جمع نهایی (masspay/checkout-style totals) ── */
.nv-totals { background: var(--nv-bg-elevated); border-top: 1px solid var(--nv-border-subtle); padding: 1rem 1.3rem; }
.nv-totals-row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.35rem 0; font-size: 0.85rem; color: var(--nv-text-2); }
.nv-totals-row span:last-child { font-weight: 700; color: var(--nv-text-1); }
.nv-totals-row.nv-totals-grand { border-top: 1px dashed var(--nv-border); margin-top: 0.5rem; padding-top: 0.75rem; font-size: 1rem; }
.nv-totals-row.nv-totals-grand span:first-child { color: var(--nv-text-1); font-weight: 800; }
.nv-totals-row.nv-totals-grand span:last-child { color: var(--nv-primary); font-size: 1.15rem; }

/* ── پنل (includes/panel.tpl) ── */
.nv-panel { background: var(--nv-bg-surface); border: 1px solid var(--nv-border); border-radius: 16px; overflow: hidden; box-shadow: var(--nv-shadow-sm); }
.nv-panel-head { display: flex; align-items: center; gap: 0.6rem; padding: 1rem 1.3rem; font-weight: 800; font-size: 0.92rem; color: var(--nv-primary); background: linear-gradient(135deg, color-mix(in srgb, var(--nv-primary-soft) 55%, transparent), transparent); border-bottom: 1px solid var(--nv-border-subtle); }
.nv-panel-head i { font-size: 1.1rem; }
.nv-panel-body { padding: 1.25rem 1.3rem; font-size: 0.87rem; color: var(--nv-text-2); line-height: 2; }
.nv-panel-foot { padding: 0.9rem 1.3rem; border-top: 1px solid var(--nv-border-subtle); background: var(--nv-bg-elevated); font-size: 0.84rem; color: var(--nv-text-2); }
.nv-panel-center { text-align: center; }
.nv-panel-success .nv-panel-head { color: var(--nv-success); }
.nv-panel-danger .nv-panel-head { color: var(--nv-danger); }
.nv-panel-warning .nv-panel-head { color: var(--nv-warning); }
.nv-panel-info .nv-panel-head { color: var(--nv-info); }

/* ── مودال برند ── */
.nv-modal-content { background: var(--nv-bg-surface); border: 1px solid var(--nv-border); border-radius: 16px; box-shadow: var(--nv-shadow-lg); }
.nv-modal-header { border-bottom: 1px solid var(--nv-border-subtle); }
.nv-modal-header .modal-title { font-size: 1rem; font-weight: 800; color: var(--nv-text-1); }
.nv-modal-footer { border-top: 1px solid var(--nv-border-subtle); }

/* ── بردکرامب ── */
.nv-breadcrumb-wrap { margin-bottom: 1rem; }
.nv-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem; list-style: none; margin: 0; padding: 0; font-size: 0.78rem; color: var(--nv-text-muted); }
.nv-breadcrumb-item + .nv-breadcrumb-item::before { content: '‹'; margin-inline-end: 0.35rem; color: var(--nv-text-muted); opacity: 0.6; }
.nv-breadcrumb-item a { color: var(--nv-text-muted); text-decoration: none; transition: color 0.15s ease; }
.nv-breadcrumb-item a:hover { color: var(--nv-primary); }
.nv-breadcrumb-item.active { color: var(--nv-primary); font-weight: 700; }

/* ── بنر تأیید ایمیل/احراز هویت ── */
.nv-verify-banner { background: var(--nv-warning-bg); border-bottom: 1px solid color-mix(in srgb, var(--nv-warning) 30%, transparent); padding: 0.65rem 1rem; }
.nv-verify-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.nv-verify-text { display: flex; align-items: center; gap: 0.6rem; font-size: 0.82rem; color: var(--nv-text-2); font-weight: 500; }
.nv-verify-text i { color: var(--nv-warning); font-size: 1.05rem; }
.nv-verify-actions { display: flex; align-items: center; gap: 0.6rem; }
.nv-verify-close { background: none; border: 0; color: var(--nv-text-muted); font-size: 1.3rem; line-height: 1; cursor: pointer; padding: 0.15rem 0.4rem; border-radius: 8px; transition: color 0.15s ease; }
.nv-verify-close:hover { color: var(--nv-danger); }

/* ── دکمه شبکه اجتماعی ── */
.nv-social-btn { background: var(--nv-bg-elevated); border: 1px solid var(--nv-border-subtle); color: var(--nv-text-2); }
.nv-social-btn:hover { border-color: var(--nv-primary-border); color: var(--nv-primary); background: var(--nv-primary-soft); }

/* ----------------------------------------------------------------
   16. هوش نگارنوین — دستیار هوشمند مشتری
   لانچر پایین‌ترین دکمه سمت چپ؛ FAB روی آن قرار دارد
   ---------------------------------------------------------------- */
#nv-ai-launcher {
  position: fixed;
  bottom: 1.75rem;
  left: 1.75rem;
  z-index: 1036;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover));
  color: #fff;
  border: 2px solid rgba(255, 255, 255, 0.25);
  box-shadow: 0 10px 26px rgba(var(--nv-primary-rgb), 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  cursor: pointer;
  transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.25s ease;
}
#nv-ai-launcher::after {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 2px solid rgba(var(--nv-primary-rgb), 0.35);
  animation: nvAiPulse 2.6s ease-out infinite;
  pointer-events: none;
}
@keyframes nvAiPulse {
  0%   { transform: scale(0.85); opacity: 0.9; }
  70%  { transform: scale(1.25); opacity: 0; }
  100% { transform: scale(1.25); opacity: 0; }
}
#nv-ai-launcher:hover { transform: scale(1.08); }
#nv-ai-launcher.active { background: linear-gradient(135deg, var(--nv-primary-deep, #001338), var(--nv-primary)); }
#nv-ai-launcher.active::after { animation: none; opacity: 0; }
.nv-ai-launcher-badge {
  position: absolute;
  top: -4px;
  inset-inline-end: -4px;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 10px;
  background: var(--nv-accent);
  color: #4A3B00;
  font-size: 0.72rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
}

/* پنل گفتگو */
#nv-ai-panel {
  position: fixed;
  bottom: 6rem;
  left: 1.75rem;
  z-index: 1040;
  width: min(400px, calc(100vw - 2rem));
  max-height: min(620px, calc(100vh - 12rem));
  display: flex;
  flex-direction: column;
  background: var(--nv-bg-surface);
  border: 1px solid var(--nv-border);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0, 19, 56, 0.22);
  overflow: hidden;
  opacity: 0;
  transform: translateY(14px) scale(0.97);
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s cubic-bezier(0.34,1.3,0.64,1);
}
#nv-ai-panel.open { opacity: 1; transform: none; pointer-events: auto; }

.nv-ai-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.9rem 1.1rem;
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-deep, #001338));
  color: #fff;
}
[data-bs-theme="dark"] .nv-ai-header {
  background: linear-gradient(95.45deg, var(--hostim_dark_gray_bg) 0.64%, var(--hostim_dark_bg) 98.23%);
}
.nv-ai-header-id { display: flex; align-items: center; gap: 0.7rem; min-width: 0; }
.nv-ai-avatar {
  width: 40px; height: 40px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.15rem;
  flex-shrink: 0;
}
.nv-ai-title { font-weight: 800; font-size: 0.95rem; }
.nv-ai-status { font-size: 0.72rem; opacity: 0.85; }
.nv-ai-close {
  background: rgba(255,255,255,0.12);
  border: none;
  color: #fff;
  width: 34px; height: 34px;
  border-radius: 10px;
  cursor: pointer;
  font-size: 1rem;
  transition: background 0.15s ease;
}
.nv-ai-close:hover { background: rgba(255,255,255,0.25); }

/* اعلان‌های سررسید */
.nv-ai-alerts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding: 0.6rem 1rem 0;
}
.nv-ai-alert-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.32rem 0.7rem;
  border-radius: 50rem;
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  border: 1px solid var(--nv-primary-border);
  text-decoration: none;
  transition: all 0.15s ease;
}
.nv-ai-alert-chip.urgent { background: rgba(220, 53, 69, 0.1); color: #b02a37; border-color: rgba(220, 53, 69, 0.35); }
[data-bs-theme="dark"] .nv-ai-alert-chip.urgent { color: #ff8f96; }
.nv-ai-alert-chip:hover { filter: brightness(0.97); transform: translateY(-1px); }

/* پیام‌ها */
.nv-ai-messages {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  min-height: 200px;
  max-height: 340px;
  background: var(--nv-bg-elevated);
}
.nv-ai-msg { display: flex; }
.nv-ai-msg-user { justify-content: flex-start; }
.nv-ai-msg-bot { justify-content: flex-end; }
.nv-ai-bubble {
  max-width: 85%;
  padding: 0.65rem 0.95rem;
  border-radius: 14px;
  font-size: 0.83rem;
  line-height: 1.9;
  overflow-wrap: break-word;
}
.nv-ai-msg-user .nv-ai-bubble {
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover));
  color: #fff;
  border-start-start-radius: 4px;
}
.nv-ai-msg-bot .nv-ai-bubble {
  background: var(--nv-bg-surface);
  border: 1px solid var(--nv-border);
  color: var(--nv-text-1);
  border-start-end-radius: 4px;
}
.nv-ai-bubble a { color: var(--nv-primary); }
.nv-ai-bubble code {
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  padding: 0.05rem 0.35rem;
  border-radius: 6px;
  font-size: 0.78rem;
  direction: ltr;
  display: inline-block;
}
.nv-ai-typing .nv-ai-bubble { display: inline-flex; gap: 5px; align-items: center; padding: 0.8rem 1rem; }
.nv-ai-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--nv-primary);
  opacity: 0.4;
  animation: nvAiDot 1.2s infinite ease-in-out;
}
.nv-ai-dot:nth-child(2) { animation-delay: 0.18s; }
.nv-ai-dot:nth-child(3) { animation-delay: 0.36s; }
@keyframes nvAiDot {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.35; }
  30% { transform: translateY(-4px); opacity: 1; }
}

/* پیشنهادهای سریع */
.nv-ai-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding: 0.65rem 1rem 0.35rem;
}
.nv-ai-chip-btn {
  background: var(--nv-bg-surface);
  border: 1px solid var(--nv-primary-border);
  color: var(--nv-primary);
  border-radius: 50rem;
  padding: 0.35rem 0.85rem;
  font-size: 0.73rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.15s ease;
  font-family: inherit;
}
.nv-ai-chip-btn:hover { background: var(--nv-primary); color: #fff; }

/* ردیف ورودی */
.nv-ai-input-row {
  display: flex;
  gap: 0.5rem;
  padding: 0.75rem 1rem 0.5rem;
}
.nv-ai-input {
  flex: 1;
  border: 1px solid var(--nv-border);
  background: var(--nv-bg-surface);
  color: var(--nv-text-1);
  border-radius: 12px;
  padding: 0.6rem 0.9rem;
  font-size: 0.85rem;
  font-family: inherit;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.nv-ai-input:focus {
  border-color: var(--nv-primary);
  box-shadow: 0 0 0 3px rgba(var(--nv-primary-rgb), 0.12);
}
.nv-ai-send {
  width: 44px;
  border-radius: 12px;
  border: none;
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover));
  color: #fff;
  font-size: 1rem;
  cursor: pointer;
  transition: transform 0.15s ease, opacity 0.15s ease;
  flex-shrink: 0;
}
.nv-ai-send:hover:not(:disabled) { transform: scale(1.05); }
.nv-ai-send:disabled { opacity: 0.55; cursor: not-allowed; }
.nv-ai-foot {
  padding: 0.35rem 1rem 0.7rem;
  font-size: 0.66rem;
  color: var(--nv-text-muted);
  text-align: center;
}

@media (max-width: 575.98px) {
  #nv-ai-launcher { bottom: 1rem; left: 1rem; width: 48px; height: 48px; }
  #nv-ai-panel { left: 0.75rem; right: 0.75rem; width: auto; bottom: 4.5rem; max-height: calc(100vh - 7rem); }
  .nv-ai-messages { max-height: 260px; }
}

/* ----------------------------------------------------------------
   17. دارک مود — لوگوی سفید + اصلاح فرم‌ها
   ---------------------------------------------------------------- */

/* لوگوی نگارنوین در حالت تیره سفید می‌شود (بدون نیاز به فایل جدا)
   نکته: نسخه کارت‌دار (nv-login-mark) جداگانه توسط JS به نسخه تیره
   negarnovin-mark-card-dark.png سوییچ می‌شود — فیلتر روی آن اعمال نمی‌شود */
[data-bs-theme="dark"] .nv-brand-mark,
[data-bs-theme="dark"] .topbar-mark,
[data-bs-theme="dark"] .nv-footer-mark,
[data-bs-theme="dark"] .loader-logo {
  filter: brightness(0) invert(1);
}

/* فونت فارسی برای همه‌ی عناصر فرم (input/select/textarea/datalist)
   از جمله «شرح کامل تیکت را بنویسید...» و فیلدهای انتخابی */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="tel"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
select,
textarea,
.form-control,
.form-select,
.reg-input,
.reg-select,
.auth-clean-input,
.field,
.nv-ai-input {
  font-family: var(--nv-font, Vazirmatn, Tahoma, sans-serif) !important;
}
textarea { line-height: 1.9; }
input::placeholder,
textarea::placeholder,
select option { font-family: var(--nv-font, Vazirmatn, Tahoma, sans-serif); }

/* فیلدهای LTR (ایمیل، دامنه، کد) هم از همان فونت با جهت درست */
input.text-ltr,
.form-control.text-ltr,
.ltr-nums input { direction: ltr; text-align: left; }

/* دکمه چشم نمایش رمز در صفحات ورود توسط استایل داخلی همان صفحات
   مدیریت می‌شود؛ اینجا فقط حداقل دسترس‌پذیری: */
.auth-pw-toggle:focus-visible { outline: 2px solid var(--nv-primary); outline-offset: 2px; border-radius: 6px; }
.auth-input-wrap .auth-input-icon { pointer-events: none; }

/* گروه ورودی شماره تلفن (کد کشور + شماره) — مرتب و راست‌چین */
.input-group-phone,
.form-group .input-group {
  direction: rtl;
}
.form-group .input-group .input-group-text,
.input-group .input-group-text {
  background: var(--nv-bg-elevated);
  border: 1px solid var(--nv-border);
  color: var(--nv-text-2);
  border-radius: 10px;
  font-family: var(--nv-font, Vazirmatn, Tahoma, sans-serif);
}
.form-group .input-group select.input-group-text {
  max-width: 120px;
  direction: ltr;
}

/* فاصله دکمه ورود از عناصر پایین فرم */
#login.auth-clean-btn,
button.auth-clean-btn { margin-bottom: 0.5rem; }

/* ----------------------------------------------------------------
   18. ریسپانسیوِ محتوای غنی — جلوگیری از به‌هم‌ریختگی پست‌ها
   جدول/تصویر/کد عریض داخل اطلاعیه‌ها، مقالات و پنل‌ها
   ---------------------------------------------------------------- */
.nv-ann-body,
.nv-ann-title,
.panel-clean-body,
.kb-article-body,
.nv-va-body,
.nv-bubble {
  min-width: 0;
  overflow-wrap: anywhere;
}
.nv-ann-body img,
.nv-ann-body video,
.nv-ann-body iframe,
.panel-clean-body img,
.panel-clean-body video,
.panel-clean-body iframe,
.kb-article-body img,
.kb-article-body video,
.kb-article-body iframe,
.nv-va-body img,
.nv-va-body video,
.nv-va-body iframe {
  max-width: 100% !important;
  height: auto;
}
/* جدول‌های عریض: اسکرول افقی داخل پنل، نه شکستن چیدمان صفحه */
.nv-ann-body table,
.panel-clean-body table,
.kb-article-body table,
.nv-va-body table,
.nv-bubble table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-collapse: collapse;
}
.nv-ann-body pre,
.panel-clean-body pre,
.kb-article-body pre,
.nv-va-body pre {
  max-width: 100%;
  overflow-x: auto;
  direction: ltr;
  text-align: left;
}
.nv-ann-body a,
.panel-clean-body a,
.kb-article-body a { overflow-wrap: anywhere; }
/* عنوان‌های طولانی بدون فضای خالی هم شکسته شوند */
.nv-ann-title,
.nv-side-item-title,
.panel-clean-title { overflow-wrap: anywhere; }
/* سایدبار اطلاعیه‌ها در موبایل زیر محتوا می‌آید (در announcements.tpl) */
@media (max-width: 991.98px) {
  .nv-ann-layout { grid-template-columns: 1fr; }
}

/* ----------------------------------------------------------------
   19. فوتر حرفه‌ای — نسخه ۲ (nv-f2)
   ---------------------------------------------------------------- */
.nv-f2 {
  margin-top: auto;
  background: var(--nv-bg-surface);
  border-top: 1px solid var(--nv-border-subtle);
  position: relative;
}
[data-bs-theme="dark"] .nv-f2 { background: var(--nv-bg-elevated); }

/* نوار آماری — گرادیان برند */
.nv-f2-stats {
  background:
    radial-gradient(ellipse at 85% 20%, rgba(255, 190, 0, 0.14), transparent 55%),
    linear-gradient(120deg, var(--nv-primary) 0%, var(--nv-primary-deep, #001338) 100%);
}
[data-bs-theme="dark"] .nv-f2-stats {
  background: linear-gradient(95.45deg, var(--hostim_dark_gray_bg) 0.64%, var(--hostim_dark_bg) 98.23%);
}
.nv-f2-stats-inner {
  max-width: 1560px;
  margin: 0 auto;
  padding: 1.1rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem 2.2rem;
}
.nv-f2-stat { display: flex; align-items: center; gap: 0.75rem; color: #fff; }
.nv-f2-stat-icon {
  width: 44px; height: 44px;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.2);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem;
  color: var(--nv-accent);
  flex-shrink: 0;
}
.nv-f2-stat-body { display: flex; flex-direction: column; line-height: 1.5; }
.nv-f2-stat-body b { font-size: 1.05rem; font-weight: 800; }
.nv-f2-stat-body small { font-size: 0.72rem; opacity: 0.8; font-weight: 600; }
.nv-f2-stat-sep {
  width: 1px; height: 38px;
  background: rgba(255, 255, 255, 0.16);
  flex-shrink: 0;
}
@media (max-width: 767.98px) {
  .nv-f2-stats-inner { gap: 0.9rem 1.4rem; padding: 0.9rem 1rem; }
  .nv-f2-stat-sep { display: none; }
  .nv-f2-stat { gap: 0.55rem; }
  .nv-f2-stat-icon { width: 38px; height: 38px; font-size: 1.05rem; border-radius: 11px; }
  .nv-f2-stat-body b { font-size: 0.9rem; }
  .nv-f2-stat-body small { font-size: 0.65rem; }
}

/* بدنه اصلی */
.nv-f2-main {
  max-width: 1560px;
  margin: 0 auto;
  padding: 2.4rem 1.5rem 1.9rem;
}
.nv-f2-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1.25fr;
  gap: 2rem;
}
@media (max-width: 1199.98px) { .nv-f2-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575.98px)  { .nv-f2-grid { grid-template-columns: 1fr; gap: 1.6rem; } }

/* ستون برند */
.nv-f2-lockup { display: flex; align-items: center; gap: 0.8rem; margin-bottom: 0.9rem; }
.nv-f2-mark { width: 46px; height: 46px; display: block; }
.nv-f2-lockup-text { display: flex; flex-direction: column; line-height: 1.25; }
.nv-f2-lockup-name {
  font-size: 1.25rem; font-weight: 800; color: var(--nv-text-1);
  letter-spacing: -0.02em;
}
.nv-f2-lockup-sub { font-size: 0.62rem; font-weight: 700; color: var(--nv-text-muted); letter-spacing: 0.22em; }
.nv-f2-desc {
  color: var(--nv-text-2);
  font-size: 0.83rem;
  line-height: 2;
  margin: 0 0 1.1rem;
  max-width: 34ch;
}
.nv-f2-contact-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.1rem; }
.nv-f2-chip {
  display: inline-flex; align-items: center; gap: 0.45rem;
  padding: 0.5rem 0.95rem;
  border-radius: 12px;
  font-size: 0.8rem; font-weight: 700;
  text-decoration: none;
  border: 1px solid var(--nv-border);
  background: var(--nv-bg-elevated);
  color: var(--nv-text-2);
  transition: all 0.18s ease;
}
.nv-f2-chip i { font-size: 0.95rem; }
.nv-f2-chip-phone { color: var(--nv-primary); border-color: var(--nv-primary-border); background: var(--nv-primary-soft); }
.nv-f2-chip-phone:hover { background: var(--nv-primary); color: #fff; }
.nv-f2-chip-wa:hover { border-color: #25D366; color: #128C7E; background: rgba(37, 211, 102, 0.08); }
.nv-f2-chip-tg:hover { border-color: #229ED9; color: #229ED9; background: rgba(34, 158, 217, 0.08); }

/* شبکه‌های اجتماعی */
.nv-f2-social { display: flex; flex-wrap: wrap; gap: 0.55rem; }
.nv-f2-soc {
  width: 40px; height: 40px;
  border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.05rem;
  color: var(--nv-text-muted);
  background: var(--nv-bg-elevated);
  border: 1px solid var(--nv-border);
  transition: all 0.2s cubic-bezier(0.34,1.4,0.64,1);
}
.nv-f2-soc:hover { transform: translateY(-3px); color: #fff; }
.nv-f2-soc-instagram:hover { background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); border-color: transparent; }
.nv-f2-soc-telegram:hover  { background: #229ED9; border-color: #229ED9; }
.nv-f2-soc-youtube:hover   { background: #FF0000; border-color: #FF0000; }
.nv-f2-soc-facebook:hover  { background: #1877F2; border-color: #1877F2; }
.nv-f2-soc-x:hover         { background: #000; border-color: #000; }

/* ستون‌های لینک */
.nv-f2-title {
  font-size: 0.92rem;
  font-weight: 800;
  color: var(--nv-text-1);
  margin: 0 0 1rem;
  position: relative;
  padding-bottom: 0.65rem;
}
.nv-f2-title::after {
  content: "";
  position: absolute;
  bottom: 0; inset-inline-start: 0;
  width: 34px; height: 3px;
  border-radius: 3px;
  background: linear-gradient(to left, var(--nv-accent), var(--nv-primary));
}
.nv-f2-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.55rem; }
.nv-f2-list a {
  display: inline-flex; align-items: center; gap: 0.55rem;
  color: var(--nv-text-2);
  font-size: 0.83rem;
  font-weight: 600;
  text-decoration: none;
  padding: 0.28rem 0.5rem 0.28rem 0;
  border-radius: 8px;
  transition: color 0.15s ease, transform 0.15s ease;
}
.nv-f2-list a i { color: var(--nv-primary); font-size: 0.95rem; width: 18px; text-align: center; }
.nv-f2-list a:hover { color: var(--nv-primary); transform: translateX(-3px); }

/* ستون تماس */
.nv-f2-contact { list-style: none; margin: 0 0 1.1rem; padding: 0; display: flex; flex-direction: column; gap: 0.8rem; }
.nv-f2-c-row { display: flex; gap: 0.7rem; align-items: flex-start; text-decoration: none; }
a.nv-f2-c-row:hover .nv-f2-c-body b { color: var(--nv-primary); }
.nv-f2-c-icon {
  width: 38px; height: 38px;
  border-radius: 11px;
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  border: 1px solid var(--nv-primary-border);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1rem;
  flex-shrink: 0;
}
.nv-f2-c-icon-gold { background: rgba(255, 190, 0, 0.12); color: var(--nv-accent-ink, #8a6600); border-color: rgba(255, 190, 0, 0.4); }
[data-bs-theme="dark"] .nv-f2-c-icon-gold { color: var(--nv-accent); }
.nv-f2-c-body { display: flex; flex-direction: column; line-height: 1.6; min-width: 0; }
.nv-f2-c-body small { font-size: 0.66rem; color: var(--nv-text-muted); font-weight: 700; }
.nv-f2-c-body b { font-size: 0.78rem; color: var(--nv-text-1); font-weight: 700; overflow-wrap: anywhere; }
.nv-f2-namad { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; }
.nv-f2-badge {
  background: #fff;
  border-radius: 12px;
  padding: 0.45rem 0.6rem;
  border: 1px solid var(--nv-border);
  display: inline-flex; align-items: center; justify-content: center;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.nv-f2-badge:hover { transform: translateY(-2px); box-shadow: var(--nv-shadow-sm); }
.nv-f2-badge img { display: block; }

/* نوار پایانی */
.nv-f2-bottom { border-top: 1px solid var(--nv-border-subtle); background: var(--nv-bg-elevated); }
.nv-f2-bottom-inner {
  max-width: 1560px;
  margin: 0 auto;
  padding: 0.9rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
}
.nv-f2-copy { font-size: 0.75rem; color: var(--nv-text-muted); }
.nv-f2-copy a { color: var(--nv-primary); font-weight: 700; text-decoration: none; }
.nv-f2-bottom-links { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; }
/* ══════════════════════════════════════════════════════════════════
   نسخه ۴.۱۵.۰ — T6: تایپوگرافی لینک‌های نوار پایانی فوتر
   باگ واقعی که مالک دیده بود: انتخابگر این قاعده در نسخه‌های قبل
   شکسته بود (`.nv-f` در یک خط و `-f2-bottom-links a:hover` در خط بعد)،
   پس هیچ قاعده‌ای برای `a`‌های این نوار وجود نداشت و مرورگر آن‌ها را با
   استایل پیش‌فرض (فونت بزرگ، رنگ لینک، زیرخط) نشان می‌داد. حالا هم
   انتخابگر ترمیم شده و هم قاعده‌ی پایه‌ی فشرده اضافه شده تا این چهار
   لینک درست مثل بقیه‌ی فوتر، «عنوان/لینک کوچک» دیده شوند.
   ══════════════════════════════════════════════════════════════════ */
.nv-f2-bottom-links a {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--nv-text-muted);
  text-decoration: none;
  line-height: 1.9;
  transition: color 0.15s ease;
}
.nv-f2-bottom-links a:hover { color: var(--nv-primary); }
.nv-f2-bottom-links a:focus-visible { outline: 2px solid var(--nv-primary); outline-offset: 2px; border-radius: 4px; }
.nv-f2-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--nv-border); }
.nv-f2-top {
  width: 38px; height: 38px;
  border-radius: 11px;
  border: 1px solid var(--nv-primary-border);
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1rem;
  transition: all 0.2s ease;
}
.nv-f2-top:hover { background: var(--nv-primary); color: #fff; transform: translateY(-2px); }
@media (max-width: 575.98px) {
  .nv-f2-bottom-inner { justify-content: center; text-align: center; }
}

/* ----------------------------------------------------------------
   20. نسخه ۴.۵.۰ — اصلاحات تاپ‌بار، موبایل، زبان و فرم‌ها
   ---------------------------------------------------------------- */

/* زیرمنوهای تاپ‌بار — راست‌چین و هم‌تراز لینک والد (RTL)؛ آیکون قبل از متن */
#nv-topbar .dropdown-menu {
  inset-inline-start: auto;
  inset-inline-end: 0;
  text-align: start;
  min-width: 210px;
}
#nv-topbar .dropdown-menu .dropdown-item {
  text-align: start;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  direction: rtl;
}
#nv-topbar .dropdown-menu .dropdown-item i {
  margin: 0;
  flex-shrink: 0;
}
#nv-topbar .dropdown-menu .dropdown-divider { margin: 0.4rem 0; }

/* منوی انتخاب زبان — لیست بلند، اسکرول داخلی */
.nv-lang-menu { max-height: 340px; overflow-y: auto; overscroll-behavior: contain; }
.nv-lang-menu .dropdown-item.active {
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  font-weight: 700;
}

/* گارد سرریز افقی (بدون شکستن position:sticky) */
html, body { max-width: 100%; }
html { overflow-x: hidden; overflow-x: clip; }
body { overflow-x: hidden; overflow-x: clip; }

/* ── دکمه چشم رمز سراسری (صفحات ورود/ثبت‌نام) ── */
.nv-pw-wrap { position: relative; }
.nv-pw-toggle-btn {
  position: absolute;
  inset-inline-end: 0.9rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--nv-text-muted);
  cursor: pointer;
  padding: 0.3rem;
  font-size: 0.9rem;
  transition: color 0.2s;
  z-index: 3;
}
.nv-pw-toggle-btn:hover { color: var(--nv-primary); }
.nv-pw-toggle-btn:focus-visible { outline: 2px solid var(--nv-primary); outline-offset: 2px; border-radius: 6px; }

/* ── فاصله امن FAB با دکمه هوش مصنوعی در موبایل ── */
@media (max-width: 575.98px) {
  .fab-container { bottom: 5.5rem; left: 1rem; }
  .topbar-brand-name { font-size: 1.05rem; }
  #nv-topbar .topbar-search-compact { display: none !important; }
}

/* فیلد تلفن ساده (بدون افزودنی intlTelInput) همیشه مرتب بماند */
#inputPhone { direction: ltr; text-align: left; }

/* ----------------------------------------------------------------
   21. نسخه ۴.۵.۱ — ادیتور شرح تیکت در دارک مود + اصلاحات تیکت
   ---------------------------------------------------------------- */

/* ادیتور مارک‌داون WHMCS (.md-editor) در دارک مود تیره می‌شود */
[data-bs-theme="dark"] .md-editor {
  background: var(--nv-bg-input) !important;
  border: 1px solid var(--nv-border) !important;
  border-radius: 10px;
}
[data-bs-theme="dark"] .md-header.btn-toolbar {
  background: var(--nv-bg-elevated) !important;
  border-bottom: 1px solid var(--nv-border-subtle) !important;
}
[data-bs-theme="dark"] .md-editor .btn {
  background: transparent !important;
  color: var(--nv-text-2) !important;
  border-color: var(--nv-border) !important;
}
[data-bs-theme="dark"] .md-editor .btn:hover {
  background: var(--nv-primary-soft) !important;
  color: var(--nv-primary) !important;
}
[data-bs-theme="dark"] .md-input,
[data-bs-theme="dark"] .md-editor textarea,
[data-bs-theme="dark"] textarea.markdown-editor,
[data-bs-theme="dark"] textarea.form-control.markdown-editor,
[data-bs-theme="dark"] .nv-tk-textarea {
  background: var(--nv-bg-input) !important;
  color: var(--nv-text-1) !important;
  border-color: var(--nv-border) !important;
  caret-color: var(--nv-text-1);
}
[data-bs-theme="dark"] .md-input::placeholder,
[data-bs-theme="dark"] .nv-tk-textarea::placeholder { color: var(--nv-text-muted) !important; }
[data-bs-theme="dark"] .md-preview,
[data-bs-theme="dark"] .md-footer {
  background: var(--nv-bg-elevated) !important;
  color: var(--nv-text-1) !important;
  border-color: var(--nv-border-subtle) !important;
}

/* بستر روشن‌تر برای ادیتور در حالت روشن هم (تمایز بهتر از کارت) */
.nv-tk-textarea, textarea.markdown-editor { background: var(--nv-bg-input); }

/* ----------------------------------------------------------------
   22. نسخه ۴.۶.۰ — دکمه تولید رمز + برچسب اختیاری
   ---------------------------------------------------------------- */
.nv-genpass-btn {
  display: inline-flex; align-items: center; gap: 0.35rem;
  background: var(--nv-primary-soft); color: var(--nv-primary);
  border: 1px dashed var(--nv-primary-border); border-radius: 50rem;
  padding: 0.3rem 0.8rem; font-family: var(--nv-font);
  font-size: 0.7rem; font-weight: 700; cursor: pointer;
  transition: all 0.18s ease;
}
.nv-genpass-btn:hover { background: var(--nv-primary); color: #fff; border-style: solid; }
.reg-optional { font-size: 0.68rem; font-weight: 500; color: var(--nv-text-muted); }

/* ----------------------------------------------------------------
   23. نسخه ۴.۶.۱ — دکمه‌های دارک مود تیره‌تر (آبی برند عمیق)
   ---------------------------------------------------------------- */
[data-bs-theme="dark"] .btn-brand,
[data-bs-theme="dark"] .btn-primary:not(.btn-link),
[data-bs-theme="dark"] .btn-success,
[data-bs-theme="dark"] .auth-clean-btn,
[data-bs-theme="dark"] .nv-inv-topay-btn,
[data-bs-theme="dark"] #fab-main,
[data-bs-theme="dark"] #nv-ai-launcher,
[data-bs-theme="dark"] .nv-inv-paywrap input[type="submit"],
[data-bs-theme="dark"] .nv-inv-paywrap button[type="submit"],
[data-bs-theme="dark"] .nv-inv-paywrap .btn-primary,
[data-bs-theme="dark"] .nv-inv-paywrap .btn-success,
[data-bs-theme="dark"] .nv-inv-paywrap .btn-danger,
[data-bs-theme="dark"] .nv-inv-paywrap a.btn,
[data-bs-theme="dark"] .nv-f2 .btn {
  background: linear-gradient(135deg, #1E3D7D, #142653) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5) !important;
}
[data-bs-theme="dark"] .btn-brand:hover,
[data-bs-theme="dark"] .btn-primary:not(.btn-link):hover,
[data-bs-theme="dark"] .btn-success:hover,
[data-bs-theme="dark"] .auth-clean-btn:hover,
[data-bs-theme="dark"] .nv-inv-topay-btn:hover,
[data-bs-theme="dark"] #fab-main:hover,
[data-bs-theme="dark"] #nv-ai-launcher:hover,
[data-bs-theme="dark"] .nv-inv-paywrap input[type="submit"]:hover,
[data-bs-theme="dark"] .nv-inv-paywrap button[type="submit"]:hover,
[data-bs-theme="dark"] .nv-inv-paywrap .btn-primary:hover,
[data-bs-theme="dark"] .nv-inv-paywrap .btn-success:hover,
[data-bs-theme="dark"] .nv-inv-paywrap .btn-danger:hover,
[data-bs-theme="dark"] .nv-inv-paywrap a.btn:hover {
  background: linear-gradient(135deg, #27468C, #1B3070) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.55) !important;
}
/* هاله‌های آبی روشن دور دکمه‌ها و کارت‌ها در دارک ملایم شد */
[data-bs-theme="dark"] .btn-brand,
[data-bs-theme="dark"] .nv-inv-topay-btn { text-shadow: none; }

/* ----------------------------------------------------------------
   24. نسخه ۴.۷.۱ — مارک‌داون تیکت/مقاله + رنگ وضعیت تیکت‌های فارسی
   ---------------------------------------------------------------- */
.markdown-content pre {
  background: #0F172A !important;
  color: #E2E8F0 !important;
  border: 1px solid rgba(148, 163, 184, 0.25);
  border-radius: 10px;
  padding: 0.85rem 1rem;
  overflow-x: auto;
  direction: ltr;
  text-align: left;
  font-size: 0.8rem;
  line-height: 1.8;
  margin: 0.6rem 0;
}
.markdown-content pre code { background: transparent !important; color: inherit; padding: 0; border: none; }
.markdown-content code {
  background: rgba(var(--nv-primary-rgb), 0.1);
  border: 1px solid var(--nv-border-subtle);
  border-radius: 6px;
  padding: 0.08rem 0.4rem;
  font-size: 0.82em;
  direction: ltr;
  display: inline-block;
}
.markdown-content table { width: 100%; border-collapse: collapse; }
.markdown-content table th, .markdown-content table td { border: 1px solid var(--nv-border); padding: 0.4rem 0.6rem; }

/* رنگ وضعیت‌های تیکت (فارسی و انگلیسی) */
.status-pill.pending, .status-pill.in-progress, .status-pill.customer-reply { background: var(--nv-danger-bg); color: var(--nv-danger); }
.status-pill.answered { background: var(--nv-success-bg); color: var(--nv-success); }

/* نقشه واقعی قاره‌ها — جلوه شب‌تاب */
.ns-map-world-wrap { opacity: 0.95; }
.ns-map-world { filter: drop-shadow(0 0 6px rgba(91, 140, 255, 0.35)); }
.ns-map-world path { transition: fill 0.3s ease; }
.ns-map-world-wrap:hover path { fill-opacity: 1; }

/* ----------------------------------------------------------------
   25. نسخه ۴.۸.۰ — مگامنو فروشگاه
   ---------------------------------------------------------------- */
.nv-store-mega { position: static; }
#nv-topbar .nv-store-mega .nv-mega-menu {
  inset-inline-start: auto;
  inset-inline-end: auto;
  right: 20%;
  width: min(60vw, 980px);
  padding: 0;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--nv-shadow-lg);
  border: 1px solid var(--nv-border);
}
@media (max-width: 1199.98px) { #nv-topbar .nv-store-mega .nv-mega-menu { display: none !important; } }
.nv-mega-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.85rem 1.2rem;
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover));
  color: #fff;
}
.nv-mega-head strong { font-size: 0.9rem; font-weight: 800; }
.nv-mega-head small { color: rgba(255,255,255,0.8); font-size: 0.72rem; }
.nv-mega-all { color: #FFD84D; font-size: 0.78rem; font-weight: 700; text-decoration: none; display: inline-flex; align-items: center; gap: 0.3rem; }
.nv-mega-all:hover { color: #fff; }
.nv-mega-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 0;
  max-height: 60vh;
  overflow-y: auto;
  padding: 0.9rem;
}
.nv-mega-col { padding: 0.35rem 0.9rem; border-inline-start: 2px solid var(--nv-border-subtle); }
.nv-mega-col-title {
  display: flex; flex-direction: column; gap: 0.1rem;
  font-weight: 800; font-size: 0.88rem; color: var(--nv-primary);
  text-decoration: none; padding: 0.3rem 0; margin-bottom: 0.35rem;
}
.nv-mega-col-title small { font-weight: 500; font-size: 0.68rem; color: var(--nv-text-muted); }
.nv-mega-col-title:hover { color: var(--nv-primary-hover); }
.nv-mega-item {
  display: flex; flex-direction: column; gap: 0.15rem;
  padding: 0.5rem 0.65rem; margin: 0.15rem 0;
  border-radius: 10px; text-decoration: none;
  transition: background 0.15s ease;
}
.nv-mega-item:hover { background: var(--nv-primary-soft); }
.nv-mega-item-name { font-size: 0.8rem; font-weight: 700; color: var(--nv-text-1); }
.nv-mega-item-feats { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.nv-mega-item-feats em {
  font-style: normal; font-size: 0.62rem; font-weight: 600;
  color: var(--nv-text-muted);
  background: var(--nv-bg-elevated);
  border: 1px solid var(--nv-border-subtle);
  border-radius: 50rem; padding: 0.1rem 0.5rem;
}

/* ----------------------------------------------------------------
   26. نسخه ۴.۸.۱ — سبد زنده + منوی فروشگاه + زبان‌ها با پرچم
   ---------------------------------------------------------------- */

/* نشان سبد خرید تاپ‌بار */
.nv-cart-btn {
  position: relative;
  /* دکمه سبد حالا <button type="button"> است — بازنشانی پیش‌فرض مرورگر
     تا رندر آن با حالت لینک قبلی مو‌به‌مو یکسان بماند */
  padding: 0;
  line-height: 1;
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
}
.nv-cart-badge {
  position: absolute;
  top: -6px;
  inset-inline-end: -6px;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: 50rem;
  background: linear-gradient(135deg, #FFBE00, #E5AC00);
  color: #3A2E00;
  font-size: 0.66rem;
  font-weight: 900;
  font-style: normal;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(255, 190, 0, 0.5);
  font-family: var(--nv-font);
}
/* ══════════════════════════════════════════════════════════════════
   نسخه ۴.۱۴.۰ — زنگ اعلان‌های ناحیه کاربری (topbar)
   داده از $clientAlerts هسته؛ نشان تعداد + فهرست کشویی، RTL و دارک‌مود.
   ══════════════════════════════════════════════════════════════════ */
.nv-notify-dd { position: relative; display: inline-flex; }
.nv-notify-badge {
  position: absolute;
  top: -6px;
  inset-inline-end: -6px;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: 50rem;
  background: linear-gradient(135deg, #FFBE00, #E5AC00);
  color: #3A2E00;
  font-size: 0.66rem;
  font-weight: 900;
  font-style: normal;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(255, 190, 0, 0.5);
  font-family: var(--nv-font);
}
.nv-notify-menu {
  width: min(360px, calc(100vw - 2rem));
  padding: 0;
  border: 1px solid var(--nv-border);
  border-radius: 16px;
  box-shadow: var(--nv-shadow-lg);
  background: var(--nv-bg-surface);
  overflow: hidden;
}
.nv-notify-head {
  display: flex; align-items: center; justify-content: space-between; gap: 0.5rem;
  padding: 0.8rem 1rem;
  background: var(--nv-bg-elevated);
  border-bottom: 1px solid var(--nv-border-subtle);
  color: var(--nv-text-1);
  font-size: 0.84rem;
  font-weight: 800;
}
.nv-notify-head i { color: var(--nv-primary); }
.nv-notify-count {
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  border-radius: 50rem;
  padding: 0.05rem 0.55rem;
  font-size: 0.7rem;
  font-weight: 800;
}
.nv-notify-items { max-height: 340px; overflow-y: auto; }
.nv-notify-item {
  display: flex; align-items: flex-start; gap: 0.65rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--nv-border-subtle);
  color: var(--nv-text-2);
  font-size: 0.8rem;
  line-height: 1.9;
  text-decoration: none;
  transition: background 0.15s ease;
}
.nv-notify-item:last-child { border-bottom: 0; }
.nv-notify-item:hover, .nv-notify-item:focus-visible { background: var(--nv-primary-soft); color: var(--nv-primary); }
.nv-notify-icon {
  width: 30px; height: 30px; flex-shrink: 0;
  border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--nv-info-bg);
  color: var(--nv-info);
  font-size: 1rem;
}
.nv-notify-item.is-danger .nv-notify-icon { background: var(--nv-danger-bg); color: var(--nv-danger); }
.nv-notify-item.is-warning .nv-notify-icon { background: var(--nv-warning-bg); color: var(--nv-warning); }
.nv-notify-item.is-success .nv-notify-icon { background: var(--nv-success-bg); color: var(--nv-success); }
.nv-notify-msg { min-width: 0; word-break: break-word; }
.nv-notify-empty {
  display: flex; align-items: center; justify-content: center; gap: 0.5rem;
  padding: 1.6rem 1rem;
  color: var(--nv-text-muted);
  font-size: 0.8rem;
  font-weight: 600;
}
.nv-notify-empty i { font-size: 1.3rem; opacity: 0.6; }
[data-bs-theme="dark"] .nv-notify-menu { background: var(--nv-bg-surface); border-color: var(--nv-border); }

.nv-cart-badge-top {
  margin-inline-start: auto;
  background: var(--nv-primary);
  color: #fff;
  border-radius: 50rem;
  font-size: 0.62rem;
  font-weight: 800;
  padding: 0.08rem 0.5rem;
}

/* منوی فروشگاه — دسته‌بندی‌ها در دو ستون */
#nv-topbar .nv-store-dd .nv-store-menu {
  min-width: 460px;
  max-width: min(60vw, 620px);
  padding: 0.5rem;
}
.nv-store-menu-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.1rem 0.4rem;
  max-height: 46vh;
  overflow-y: auto;
}
#nv-topbar .nv-store-menu .dropdown-item {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.82rem;
  border-radius: 9px;
}
#nv-topbar .nv-store-menu .dropdown-item span { flex: 1; min-width: 0; }
#nv-topbar .nv-store-menu .dropdown-divider { margin: 0.45rem 0.3rem; }
@media (max-width: 767.98px) {
  #nv-topbar .nv-store-dd .nv-store-menu { min-width: 300px; }
  .nv-store-menu-cols { grid-template-columns: 1fr; }
}

/* منوی زبان — پرچم + نام بومی */
.nv-lang-fa-list .dropdown-item { display: flex; align-items: center; gap: 0.55rem; }
.nv-lang-flag { font-size: 1.15rem; line-height: 1; }
.nv-lang-name { font-weight: 600; }
.nv-lang-code { margin-inline-start: auto; font-size: 0.62rem; color: var(--nv-text-muted); font-weight: 700; direction: ltr; }
.nv-lang-item.active { background: var(--nv-primary-soft); }

/* ----------------------------------------------------------------
   27. نسخه ۴.۱۰.۰ — مینی‌کارت ووکامرسی + منوهای مهمان
   ---------------------------------------------------------------- */
#nv-topbar .nv-cart-dd .nv-mini-cart {
  min-width: 330px;
  max-width: 92vw;
  padding: 0;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--nv-shadow-lg);
}
.nv-mini-cart-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.85rem 1.1rem;
  background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover));
  color: #fff;
}
.nv-mini-cart-head strong { font-size: 0.88rem; font-weight: 800; }
.nv-mini-cart-count { font-size: 0.72rem; background: rgba(255,255,255,0.18); border-radius: 50rem; padding: 0.18rem 0.65rem; font-weight: 700; }
.nv-mini-cart-items { max-height: 300px; overflow-y: auto; padding: 0.45rem; }
.nv-mini-cart-empty {
  text-align: center; color: var(--nv-text-muted); font-size: 0.8rem;
  padding: 1.6rem 0.5rem; display: flex; flex-direction: column; gap: 0.5rem; align-items: center;
}
.nv-mini-cart-empty i { font-size: 1.7rem; opacity: 0.5; }
.nv-mini-cart-item {
  display: flex; align-items: center; gap: 0.65rem;
  padding: 0.6rem 0.6rem; border-radius: 11px;
  text-decoration: none; transition: background 0.14s ease;
}
.nv-mini-cart-item:hover { background: var(--nv-primary-soft); }
.nv-mc-icon {
  width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0;
  background: var(--nv-primary-soft); color: var(--nv-primary);
  display: inline-flex; align-items: center; justify-content: center; font-size: 1rem;
}
.nv-mc-name { flex: 1; min-width: 0; font-size: 0.8rem; font-weight: 700; color: var(--nv-text-1); direction: ltr; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nv-mc-name small { color: var(--nv-text-muted); font-weight: 500; }
.nv-mc-go { color: var(--nv-text-muted); font-size: 0.85rem; }
.nv-mini-cart-foot {
  display: flex; gap: 0.6rem; padding: 0.75rem 0.9rem;
  border-top: 1px solid var(--nv-border-subtle);
}
.nv-mini-cart-btn {
  flex: 1; text-align: center; border-radius: 50rem; text-decoration: none;
  font-size: 0.8rem; font-weight: 800; padding: 0.55rem 0.5rem; font-family: var(--nv-font);
}
.nv-mini-cart-btn.view { border: 1.5px solid var(--nv-border); color: var(--nv-text-2); }
.nv-mini-cart-btn.view:hover { border-color: var(--nv-primary); color: var(--nv-primary); }
.nv-mini-cart-btn.pay { background: linear-gradient(135deg, var(--nv-primary), var(--nv-primary-hover)); color: #fff; }
.nv-mini-cart-btn.pay:hover { filter: brightness(1.08); }

/* دکمه سفارش جدید در زیرمنوی سرویس‌ها */
#nv-topbar .nv-services-menu .nv-new-order-btn { color: var(--nv-primary); font-weight: 800; }
#nv-topbar .nv-services-menu .nv-new-order-btn i { color: var(--nv-accent, #FFBE00); }
#nv-topbar .nv-services-menu { min-width: 230px; }
.nv-mc-name .nv-mc-domain { display: block; direction: ltr; text-align: right; color: var(--nv-primary); font-size: 0.68rem; font-weight: 600; }
/* ----------------------------------------------------------------
   18. پرچم‌های محلی لوکیشن (اسپرایت بومی قالب — بدون CDN)
   تصویر: templates/negarnovin/img/flags.png (+ نسخه @2x)
   کلاس پایه و مختصات هر کشور از css/all.css رسمی قالب والد گرفته
   شده است؛ چون آن فایل در هیچ صفحه‌ای لود نمی‌شود، تعریف بومی آن
   اینجا لازم است. نام کلاس‌ها عمداً همان iti-flag است تا در صورت
   لود هر دو فایل، رفتار یکسان بماند.
   ---------------------------------------------------------------- */
.iti-flag {
  width: 20px; height: 15px; flex-shrink: 0;
  display: inline-block; vertical-align: -2px;
  border-radius: 2px;
  background-image: url("../../img/flags.png");
  background-repeat: no-repeat;
  background-color: #DBDBDB;
  background-position: 20px 0;
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.3);
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .iti-flag { background-image: url("../../img/flags@2x.png"); background-size: 5630px 15px; }
}
.iti-flag.fr { height: 14px; background-position: -1731px 0; }
.iti-flag.de { height: 12px; background-position: -1269px 0; }
.iti-flag.ca { height: 10px; background-position: -834px 0; }
.iti-flag.us { height: 11px; background-position: -5241px 0; }
.iti-flag.fi { height: 12px; background-position: -1621px 0; }
.iti-flag.gb { height: 10px; background-position: -1775px 0; }
.iti-flag.nl { height: 14px; background-position: -3752px 0; }
.iti-flag.it { height: 14px; background-position: -2523px 0; }
.iti-flag.es { height: 14px; background-position: -1555px 0; }
.iti-flag.pt { height: 14px; background-position: -4141px 0; }
.iti-flag.pl { height: 13px; background-position: -4031px 0; }
.iti-flag.ie { height: 10px; background-position: -2347px 0; }
.iti-flag.cz { height: 14px; background-position: -1247px 0; }
.iti-flag.be { width: 18px; height: 15px; background-position: -440px 0; }
.iti-flag.lv { height: 10px; background-position: -3073px 0; }

/* ----------------------------------------------------------------
   19. ویترین «سرور مجازی مولتی» — صفحه اصلی (نسخه ۴.۱۳.۰)
   ساختار داده: $nv_multi_showcase (هوک negarnovin_dashboard_hook.php)
   ---------------------------------------------------------------- */
.nv-multi {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--nv-border-subtle);
  border-radius: 22px;
  padding: 2.1rem 1.9rem 1.9rem;
  margin-bottom: 2.2rem;
  box-shadow: var(--nv-shadow-md);
  background:
    radial-gradient(720px 300px at 92% -14%, color-mix(in srgb, var(--nv-accent) 15%, transparent), transparent 70%),
    radial-gradient(600px 300px at 4% 112%, color-mix(in srgb, var(--nv-primary) 11%, transparent), transparent 68%),
    var(--nv-bg-surface);
}
.nv-multi::before {
  content: "";
  position: absolute;
  inset-inline-start: -110px; top: -110px;
  width: 300px; height: 300px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--nv-primary) 12%, transparent), transparent 70%);
  pointer-events: none;
}
.nv-multi > * { position: relative; z-index: 1; }

.nv-multi-top { display: grid; grid-template-columns: 1fr; gap: 1.6rem; align-items: start; }
@media (min-width: 992px) { .nv-multi-top { grid-template-columns: 1.2fr 0.8fr; gap: 2.2rem; } }

.nv-multi-eyebrow {
  display: inline-flex; align-items: center; gap: 0.45rem;
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  border: 1px solid var(--nv-primary-border);
  border-radius: 50rem;
  padding: 0.38rem 0.95rem;
  font-size: 0.74rem; font-weight: 800;
  margin-bottom: 0.9rem;
}
.nv-multi-eyebrow i { color: var(--nv-accent); font-size: 0.95rem; }
.nv-multi-title {
  color: var(--nv-text-1);
  font-size: clamp(1.25rem, 2.6vw, 1.7rem);
  font-weight: 900;
  line-height: 1.6;
  margin: 0 0 0.55rem;
}
.nv-multi-lead { color: var(--nv-text-2); font-size: 0.86rem; line-height: 2.05; margin: 0 0 1.05rem; max-width: 62ch; }
.nv-multi-tagline {
  display: flex; align-items: flex-start; gap: 0.7rem;
  background: linear-gradient(90deg, var(--nv-accent-soft), transparent);
  border-inline-start: 3px solid var(--nv-accent);
  border-radius: 12px;
  padding: 0.8rem 1rem;
  color: var(--nv-text-1);
  font-size: 0.83rem; font-weight: 700; line-height: 2;
  margin: 0 0 1.2rem;
}
.nv-multi-tagline i { color: var(--nv-accent); font-size: 1.05rem; margin-top: 0.22rem; flex-shrink: 0; }

.nv-multi-cta { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; }
.nv-multi-cta .btn {
  border-radius: 12px; font-size: 0.85rem; font-weight: 800;
  padding: 0.7rem 1.35rem; font-family: var(--nv-font);
  display: inline-flex; align-items: center; gap: 0.45rem;
}
.nv-multi-cta .btn i { font-size: 1rem; }

.nv-multi-spot {
  background: linear-gradient(150deg, var(--nv-bg-elevated), var(--nv-bg-surface));
  border: 1px solid var(--nv-border);
  border-radius: 18px;
  padding: 1.35rem 1.4rem;
  box-shadow: var(--nv-shadow-sm);
}
.nv-multi-spot-label {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-size: 0.73rem; font-weight: 800; color: var(--nv-text-muted);
  margin-bottom: 0.35rem;
}
.nv-multi-spot-price { display: block; font-size: 1.58rem; font-weight: 900; color: var(--nv-text-1); letter-spacing: -0.4px; line-height: 1.4; }
.nv-multi-spot-cycle { display: block; font-size: 0.76rem; font-weight: 700; color: var(--nv-primary); margin-bottom: 1rem; }
.nv-multi-spot-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.nv-multi-spot-list li { display: flex; align-items: center; gap: 0.5rem; font-size: 0.79rem; font-weight: 600; color: var(--nv-text-2); line-height: 1.8; }
.nv-multi-spot-list li i { color: var(--nv-success); font-size: 0.95rem; flex-shrink: 0; }

.nv-multi-sub {
  display: flex; align-items: center; gap: 0.5rem;
  margin: 1.9rem 0 1rem;
  color: var(--nv-text-1);
  font-size: 0.94rem; font-weight: 800;
}
.nv-multi-sub > i { color: var(--nv-primary); font-size: 1.05rem; }
.nv-multi-sub-note { margin-inline-start: auto; font-size: 0.74rem; font-weight: 600; color: var(--nv-text-muted); }

.nv-multi-products { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 0.9rem; }
.nv-multi-card {
  display: flex; flex-direction: column;
  background: var(--nv-bg-surface);
  border: 1px solid var(--nv-border);
  border-radius: 16px;
  padding: 1.15rem 1.15rem 1.05rem;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.nv-multi-card::before {
  content: "";
  position: absolute; inset-inline: 0; top: 0;
  height: 3px;
  background: linear-gradient(to left, var(--nv-primary), var(--nv-accent));
  opacity: 0.9;
}
.nv-multi-card:hover { transform: translateY(-4px); box-shadow: var(--nv-shadow-md); border-color: var(--nv-primary-border); }
.nv-multi-card-name { color: var(--nv-text-1); font-size: 0.92rem; font-weight: 800; margin: 0 0 0.5rem; direction: ltr; text-align: right; }
.nv-multi-card-price { color: var(--nv-primary); font-size: 1.02rem; font-weight: 900; line-height: 1.55; }
.nv-multi-card-cycle { display: block; color: var(--nv-text-muted); font-size: 0.72rem; font-weight: 700; margin-bottom: 0.8rem; }
.nv-multi-card-feats { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.35rem; }
.nv-multi-card-feats li { display: flex; align-items: flex-start; gap: 0.45rem; font-size: 0.75rem; color: var(--nv-text-2); line-height: 1.85; }
.nv-multi-card-feats li i { color: var(--nv-success); font-size: 0.85rem; margin-top: 0.2rem; flex-shrink: 0; }
.nv-multi-card-go {
  margin-top: auto; padding-top: 0.85rem;
  border-top: 1px dashed var(--nv-border-subtle);
  display: flex; align-items: center; justify-content: space-between;
  font-size: 0.76rem; font-weight: 800; color: var(--nv-primary);
}

.nv-multi-locs { margin-top: 1.9rem; padding-top: 1.5rem; border-top: 1px solid var(--nv-border-subtle); }

/* ── نسخه ۴.۱۵.۰ — متادیتای محصول (tagline / short_description / color /
   is_featured) که از tblproducts می‌آید و در کارت‌های ویترین و ردیف‌های
   فرم سفارش نمایش داده می‌شود. رنگ تأکیدی همیشه از قبل در هوک با
   negarnovin_safe_css_color() پاک‌سازی شده و فقط به شکل
   var(--nv-card-accent) مصرف می‌شود — هیچ CSS خام تزریق نمی‌شود. ── */
.nv-multi-card[style*="--nv-card-accent"]::before {
  background: linear-gradient(to left, var(--nv-card-accent), var(--nv-accent));
}
.nv-prod-badge-featured,
.nv-multi-card-badge {
  display: inline-flex; align-items: center; gap: 0.25rem;
  background: var(--nv-accent);
  color: var(--nv-accent-ink, #4A3B00);
  font-size: 0.66rem; font-weight: 800;
  border-radius: 50rem;
  padding: 0.2rem 0.6rem;
  line-height: 1.7;
}
.nv-prod-badge-featured i,
.nv-multi-card-badge i { font-size: 0.7rem; }
.nv-multi-card-badge { position: absolute; inset-inline-end: 0.75rem; top: 0.75rem; z-index: 2; }
.nv-multi-card-tagline,
.nv-prod-tagline {
  display: block;
  color: #8a6600;
  font-size: 0.72rem; font-weight: 700;
  line-height: 1.85;
  margin: 0 0 0.35rem;
}
[data-bs-theme="dark"] .nv-multi-card-tagline,
[data-bs-theme="dark"] .nv-prod-tagline { color: var(--nv-accent); }
.nv-multi-card-desc,
.nv-prod-shortdesc {
  color: var(--nv-text-2);
  font-size: 0.74rem; line-height: 1.9;
  margin: 0 0 0.7rem;
}
.nv-multi-card-feats { margin-bottom: 0.15rem; }

/* ══════════════════════════════════════════════════════════════════
   نسخه ۴.۱۴.۰ — نوار کناری ناحیه کاربری (Client Area Sidebar)
   معادل بصری بلاک‌های استاندارد WHMCS (primarySidebar/secondarySidebar)
   با طراحی خود قالب. در RTL ستون کناری سمت راست می‌نشیند (هم‌راستا با
   منوی اصلی قالب) و در موبایل به زیر محتوا منتقل می‌شود.
   ══════════════════════════════════════════════════════════════════ */
.nv-cas-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.35rem; align-items: start; }
@media (min-width: 992px) {
  .nv-cas-layout { grid-template-columns: 320px minmax(0, 1fr); gap: 1.6rem; }
}
@media (max-width: 991.98px) {
  .nv-cas-main { order: 1; }
  .nv-cas { order: 2; }
}

.nv-cas { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.nv-cas-main { min-width: 0; }

.nv-cas-card {
  background: var(--nv-bg-surface);
  border: 1px solid var(--nv-border);
  border-radius: 16px;
  box-shadow: var(--nv-shadow-sm);
  overflow: hidden;
}
.nv-cas-head {
  display: flex; align-items: center; gap: 0.5rem;
  margin: 0;
  padding: 0.8rem 1.05rem;
  background: var(--nv-bg-elevated);
  border-bottom: 1px solid var(--nv-border-subtle);
  color: var(--nv-text-1);
  font-size: 0.84rem;
  font-weight: 800;
}
.nv-cas-head i { color: var(--nv-primary); font-size: 1.05rem; }
.nv-cas-head .nv-cas-head-badge {
  margin-inline-start: auto;
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  border-radius: 50rem;
  padding: 0.05rem 0.55rem;
  font-size: 0.7rem;
  font-weight: 800;
}
.nv-cas-body { padding: 0.55rem; }
.nv-cas-body .nv-cas-empty { color: var(--nv-text-muted); font-size: 0.78rem; padding: 0.5rem 0.7rem; margin: 0; }

.nv-cas-link {
  display: flex; align-items: center; gap: 0.55rem;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  color: var(--nv-text-2);
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.16s ease, color 0.16s ease;
}
.nv-cas-link:hover, .nv-cas-link:focus-visible { background: var(--nv-primary-soft); color: var(--nv-primary); }
.nv-cas-link i { font-size: 1.05rem; color: var(--nv-text-muted); flex-shrink: 0; }
.nv-cas-link:hover i, .nv-cas-link:focus-visible i { color: var(--nv-primary); }
.nv-cas-link.is-danger { color: var(--nv-danger); }
.nv-cas-link.is-danger i { color: var(--nv-danger); }
.nv-cas-link.is-danger:hover, .nv-cas-link.is-danger:focus-visible { background: var(--nv-danger-bg); color: var(--nv-danger); }
.nv-cas-link.is-danger:hover i { color: var(--nv-danger); }
.nv-cas-link.is-disabled { opacity: 0.5; pointer-events: none; }
.nv-cas-link.is-selected {
  background: var(--nv-primary-soft);
  color: var(--nv-primary);
  box-shadow: inset 0 0 0 1px var(--nv-primary-border);
}
.nv-cas-link.is-selected i { color: var(--nv-primary); }
.nv-cas-count {
  margin-inline-start: auto;
  background: var(--nv-bg-elevated);
  border: 1px solid var(--nv-border-subtle);
  border-radius: 50rem;
  padding: 0.02rem 0.5rem;
  font-size: 0.7rem;
  font-weight: 800;
  color: var(--nv-text-2);
}
.nv-cas-count.is-active { background: var(--nv-success-bg); border-color: transparent; color: var(--nv-success); }
.nv-cas-count.is-warning { background: var(--nv-warning-bg); border-color: transparent; color: var(--nv-warning); }
.nv-cas-count.is-danger { background: var(--nv-danger-bg); border-color: transparent; color: var(--nv-danger); }
.nv-cas-count.is-muted { background: var(--nv-bg-elevated); border-color: transparent; color: var(--nv-text-muted); }

.nv-cas-kv {
  display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem;
  padding: 0.5rem 0.7rem;
  border-bottom: 1px dashed var(--nv-border-subtle);
  font-size: 0.79rem;
}
.nv-cas-kv:last-child { border-bottom: 0; }
.nv-cas-kv dt { margin: 0; color: var(--nv-text-muted); font-weight: 600; white-space: nowrap; }
.nv-cas-kv dd {
  margin: 0; color: var(--nv-text-1); font-weight: 700;
  text-align: end; word-break: break-word; min-width: 0;
}
.nv-cas-kv dd.is-long { max-height: 5.4rem; overflow-y: auto; }
.nv-cas-note {
  margin: 0; padding: 0.65rem 0.7rem 0.35rem;
  color: var(--nv-text-muted); font-size: 0.72rem; line-height: 1.9;
  border-top: 1px solid var(--nv-border-subtle);
}

/* بلاک‌های هسته WHMCS ($primarySidebar / $secondarySidebar) داخل نوار کناری */
.nv-cas-core .nv-cas-body .card,
.nv-cas-core .nv-cas-body .list-group { border: 0; box-shadow: none; margin: 0; }
.nv-cas-core .nv-cas-body .list-group-item { font-size: 0.82rem; }

@media (max-width: 991.98px) {
  .nv-cas { gap: 0.85rem; }
  .nv-cas-body { padding: 0.45rem; }
}

/* نسخه ۴.۱۴.۰ — حالت بدون داده محصول: اسکلت ویترین می‌ماند، شبکه کارت‌ها
   با یک پیام راهنما و دکمه فروشگاه جایگزین می‌شود. */
.nv-multi-empty {
  display: flex; flex-direction: column; align-items: center; gap: 0.85rem;
  text-align: center;
  background: var(--nv-bg-elevated);
  border: 1px dashed var(--nv-border);
  border-radius: 16px;
  padding: 1.9rem 1.5rem;
}
.nv-multi-empty > i { font-size: 1.9rem; color: var(--nv-primary); opacity: 0.65; }
.nv-multi-empty p { margin: 0; max-width: 62ch; color: var(--nv-text-2); font-size: 0.83rem; line-height: 2; }
.nv-multi-empty .btn { margin-top: 0.15rem; }

.nv-loc-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.6rem; }
.nv-loc-chip {
  display: flex; align-items: center; gap: 0.55rem;
  background: var(--nv-bg-elevated);
  border: 1px solid var(--nv-border-subtle);
  border-radius: 12px;
  padding: 0.6rem 0.7rem;
  transition: border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}
.nv-loc-chip:hover { border-color: var(--nv-primary-border); transform: translateY(-2px); box-shadow: var(--nv-shadow-sm); }
.nv-loc-text { display: flex; flex-direction: column; min-width: 0; }
.nv-loc-text b { color: var(--nv-text-1); font-size: 0.78rem; font-weight: 800; line-height: 1.5; }
.nv-loc-text small { color: var(--nv-text-muted); font-size: 0.68rem; font-weight: 600; line-height: 1.5; }

@media (max-width: 1199.98px) { .nv-loc-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 991.98px) {
  .nv-loc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nv-multi-lead { max-width: none; }
}
@media (max-width: 575.98px) {
  .nv-multi { padding: 1.5rem 1.15rem 1.4rem; border-radius: 18px; }
  .nv-loc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
  .nv-multi-sub { flex-wrap: wrap; }
  .nv-multi-sub-note { margin-inline-start: 0; }
  .nv-multi-cta .btn { width: 100%; justify-content: center; }
}

/* ══════════════════════════════════════════════════════════════════
   ۴۰) نسخه ۴.۱۵.۰ — T4: قفل‌کردن بلوک نشان برند (نگارنوین / NEGARNOVIN)
   مالک گزارش داد خط انگلیسی «یک لحظه دیده می‌شود و بعد محو می‌شود» و
   گاهی کنار متن فارسی می‌نشیند (نه زیر آن). دلایل ساختاری:
   ۱) لوک‌آپ توپ‌بار اصلاً خط انگلیسی نداشت و در دسکتاپ (≥۱۲۰۰px)
      سایدبار مخفی است؛ پس مالک فقط «نگارنوین» را می‌دید.
   ۲) `.nv-brand-name` و `.topbar-brand-name` با
      -webkit-text-fill-color: transparent و متنِ گرادیانی رنگ می‌شوند؛
      اگر background-clip:text پشتیبانی نشود، متن کاملاً نامرئی می‌شود
      (همان «دیده می‌شود و بعد محو می‌شود» در مرورگرهای قدیمی‌تر).
   اصلاح: هر دو لوک‌آپ یک بلوک دوخطی با ستون صریح و رنگ پشتیبان دارند و
   خط دوم در هیچ بریک‌پوینت و هیچ حالت رنگی پنهان یا جابه‌جا نمی‌شود.
   ══════════════════════════════════════════════════════════════════ */

/* بلوک متن هر دو لوک‌آپ: همیشه ستونی (فارسی بالا، انگلیسی زیر) */
.nv-brand-text,
.topbar-brand-text {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start;
  justify-content: center;
  line-height: 1.2;
  min-width: 0;
}

/* خط دوم انگلیسی — همیشه دیده می‌شود، در همه بریک‌پوینت‌ها */
.nv-brand-sub,
.topbar-brand-sub {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: visible;
  direction: ltr;
  text-align: left;
  color: var(--nv-text-muted, #6B7280);
  -webkit-text-fill-color: var(--nv-text-muted, #6B7280);
}
[data-bs-theme="dark"] .nv-brand-sub,
[data-bs-theme="dark"] .topbar-brand-sub { color: #A9B4CC; -webkit-text-fill-color: #A9B4CC; }
.topbar-brand-sub { margin-top: 0.1rem; margin-inline-start: 0; }

/* نام فارسی برند: رنگ پشتیبان برای وقتی گرادیان/background-clip:text نیست */
.nv-brand-name,
.topbar-brand-name {
  color: var(--nv-primary, #002B85);
  display: block;
}
[data-bs-theme="dark"] .nv-brand-name,
[data-bs-theme="dark"] .topbar-brand-name { color: #FFFFFF; }

@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
  .nv-brand-name,
  .topbar-brand-name {
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
    color: var(--nv-primary, #002B85) !important;
  }
  [data-bs-theme="dark"] .nv-brand-name,
  [data-bs-theme="dark"] .topbar-brand-name {
    color: #FFFFFF !important;
    -webkit-text-fill-color: currentColor !important;
  }
}

/* مارک کنار متن، در ستون جدا؛ ارتفاع هر دو لوک‌آپ ثابت می‌ماند */
.topbar-logo-link { display: flex; align-items: center; gap: 0.5rem; }
.topbar-mark { flex-shrink: 0; }
.nv-brand-mark { flex-shrink: 0; }
/* فضای کافی برای دو خط متن در نوار بالایی (بدون بریدگی در موبایل) */
#nv-topbar .topbar-brand-name { font-size: 1.02rem; line-height: 1.15; }

/* ══════════════════════════════════════════════════════════════════
   ۴۱) نسخه ۴.۱۵.۰ — T11: سرصفحه و چیدمان کشوی کاربر (توپ‌بار)
   ══════════════════════════════════════════════════════════════════ */
.nv-user-menu { min-width: 258px; }
.nv-user-menu-head {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.7rem 1rem 0.6rem;
  border-bottom: 1px solid var(--nv-border-subtle);
  margin-bottom: 0.35rem;
}
.nv-user-menu-head span { color: var(--nv-text-1); font-size: 0.82rem; font-weight: 800; }
.nv-user-menu-head small { color: var(--nv-text-muted); font-size: 0.72rem; direction: ltr; text-align: left; }
.nv-user-menu .dropdown-item { font-size: 0.82rem; }
.nv-user-menu .dropdown-item i { width: 1.05rem; text-align: center; }

/* ══════════════════════════════════════════════════════════════════
   ۴۲) نسخه ۴.۱۵.۰ — T15: کلاس چرخش آیکون اسپینر
   قالب‌ها از `ti ti-loader-2 ti-spin` استفاده می‌کنند ولی `.ti-spin` در
   فونت/استایل Tabler محلی تعریف نشده بود و آیکون بی‌حرکت می‌ماند.
   ══════════════════════════════════════════════════════════════════ */
.ti-spin { display: inline-block; animation: nv-spin 1s linear infinite; }
@media (prefers-reduced-motion: reduce) { .ti-spin { animation: none; } }

/* ══════════════════════════════════════════════════════════════════
   ۴۳) نسخه ۴.۱۵.۰ — T15: پایداری نوار بالایی در موبایل
   روی عرض‌های ۳۲۰ تا ۴۰۰ پیکسل، مجموع دکمه‌ی همبرگری + لوک‌آپ دوخطی
   (که در T4 اضافه شد) + آیکون‌های سمت چپ + دکمه‌ی کاربر می‌توانست از
   عرض صفحه بزند و باعث سرریز افقی/بریدگی شود. اینجا فاصله‌ها فشرده‌تر
   و عرض دکمه‌ی کاربر محدود می‌شود؛ در دسکتاپ هیچ تغییری نیست.
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 575.98px) {
  .topbar-inner { padding: 0 0.7rem; gap: 0.4rem; }
  .topbar-left-wrap { gap: 0.35rem; }
  .topbar-right { gap: 0.2rem; }
  .toggle-sidebar-btn { width: 40px; height: 40px; font-size: 1.2rem; }
  .topbar-user .btn-user {
    max-width: 86px;
    padding-inline: 0.6rem;
    overflow: hidden;
    white-space: nowrap;
  }
  .topbar-user .btn-user > i { flex-shrink: 0; }
  .nv-user-menu { min-width: 0; width: min(258px, calc(100vw - 1.5rem)); }
  #nv-topbar .dropdown-menu { max-width: calc(100vw - 1rem); }
}
/* لوک‌آپ برند هرگز سرریز نکند (به‌ویژه روی ۳۲۰ پیکسل) */
.topbar-brand-text { max-width: 40vw; }
@media (max-width: 400px) { .topbar-brand-text { max-width: 34vw; } }