/* ==========================================================================
   قالب NeuroClinic — دیزاین‌سیستم الهام‌گرفته از سبک Metronic (کد اورجینال)
   سایدبار تیره + محتوای روشن، کارت‌های نرم، بج‌های کم‌رنگ، فرم‌های solid
   ========================================================================== */

:root {
  --nc-sidebar-width: 260px;

  /* پالت اصلی */
  --nc-primary: #1b84ff;
  --nc-primary-hover: #056ee9;
  --nc-primary-light: #e9f3ff;
  --nc-success: #17c653;
  --nc-success-light: #dfffea;
  --nc-danger: #f8285a;
  --nc-danger-light: #ffeef3;
  --nc-warning: #f6b100;
  --nc-warning-light: #fff8dd;
  --nc-info: #7239ea;
  --nc-info-light: #f8f5ff;

  /* خاکستری‌ها */
  --nc-text: #071437;
  --nc-text-2: #252f4a;
  --nc-muted: #78829d;
  --nc-muted-2: #99a1b7;
  --nc-border: #f1f1f4;
  /* بوردر پررنگ‌تر برای المان‌هایی که باید مرزشان دیده شود (ورودی‌ها و کارت‌ها) */
  --nc-border-strong: #dbdfe9;
  --nc-border-hover: #b5bdd0;
  --nc-input-bg: #f9f9f9;
  --nc-input-bg-focus: #ffffff;
  --nc-focus-ring: 0 0 0 .2rem rgba(27, 132, 255, .15);
  --nc-danger-ring: 0 0 0 .2rem rgba(248, 40, 90, .15);
  --nc-body-bg: #f5f8fa;

  /* سایدبار تیره */
  --nc-sidebar-bg: #1e1e2d;
  --nc-sidebar-item: #9d9da6;
  --nc-sidebar-item-hover: #ffffff;
  --nc-sidebar-active-bg: #2a2a3c;
  --nc-sidebar-sep: #565674;

  --nc-radius: .85rem;
  --nc-radius-sm: .55rem;
  --nc-shadow-card: 0 3px 4px rgba(0, 0, 0, .03);
  --nc-shadow-pop: 0 0 50px rgba(82, 63, 105, .15);
}

* {
  font-family: Vazirmatn, Tahoma, "Segoe UI", sans-serif;
}

body {
  background: var(--nc-body-bg);
  color: var(--nc-text-2);
  margin: 0;
  font-size: .95rem;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--nc-text);
  font-weight: 600;
}

a { color: var(--nc-primary); }
a:hover { color: var(--nc-primary-hover); }

/* اسکرول‌بار باریک */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #dbdfe9; border-radius: 4px; }
::-webkit-scrollbar-track { background: transparent; }

/* ---------- چیدمان کلی ---------- */
.app-shell {
  display: flex;
  min-height: 100vh;
}

/* ---------- سایدبار ---------- */
.app-sidebar {
  width: var(--nc-sidebar-width);
  background: var(--nc-sidebar-bg);
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: 1030;
  transition: transform .25s ease;
}

.app-sidebar::-webkit-scrollbar-thumb { background: #3a3a4d; }

.app-brand {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: 1.25rem 1.5rem;
  font-size: 1.1rem;
  font-weight: 700;
  color: #fff;
  border-bottom: 1px dashed rgba(255, 255, 255, .08);
}

.app-brand .bi {
  color: var(--nc-primary);
  font-size: 1.5rem;
}

.app-nav {
  padding: 1rem .9rem;
  overflow-y: auto;
  flex: 1;
}

.app-nav .nav-link {
  display: flex;
  align-items: center;
  gap: .7rem;
  color: var(--nc-sidebar-item);
  padding: .62rem .9rem;
  margin-bottom: .15rem;
  border-radius: var(--nc-radius-sm);
  font-size: .95rem;
  font-weight: 500;
  transition: background .15s ease, color .15s ease;
}

.app-nav .nav-link .bi {
  font-size: 1.1rem;
  width: 1.3rem;
  text-align: center;
}

.app-nav .nav-link:hover {
  background: rgba(255, 255, 255, .04);
  color: var(--nc-sidebar-item-hover);
}

.app-nav .nav-link.active {
  background: var(--nc-sidebar-active-bg);
  color: #fff;
}

.app-nav .nav-link.active .bi {
  color: var(--nc-primary);
}

.app-nav-sep {
  padding: 1.1rem .9rem .4rem;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .06em;
  color: var(--nc-sidebar-sep);
  text-transform: uppercase;
}

/* ---------- بخش اصلی ---------- */
.app-main {
  margin-right: var(--nc-sidebar-width);
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.app-topbar {
  height: 64px;
  background: #fff;
  border-bottom: 1px solid var(--nc-border);
  display: flex;
  align-items: center;
  padding: 0 1.5rem;
  position: sticky;
  top: 0;
  z-index: 1020;
}

.app-topbar .btn-light {
  background: transparent;
  border: 0;
  color: var(--nc-muted);
}

.app-topbar .btn-light:hover {
  background: var(--nc-input-bg-focus);
  color: var(--nc-text);
}

/* آواتار حرف اول نام کاربر */
.user-avatar {
  width: 34px;
  height: 34px;
  border-radius: .5rem;
  background: var(--nc-primary-light);
  color: var(--nc-primary);
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.app-content {
  padding: 1.75rem;
  flex: 1;
}

.app-footer {
  padding: 1rem 1.75rem;
  color: var(--nc-muted-2);
  font-size: .85rem;
  border-top: 1px solid var(--nc-border);
  background: #fff;
}

/* ---------- کارت‌ها ---------- */
.card {
  border-radius: var(--nc-radius);
  border: 1px solid var(--nc-border-strong);
  box-shadow: var(--nc-shadow-card);
}

.card-body { padding: 1.5rem; }

.card-title {
  color: var(--nc-text);
  font-weight: 600;
}

/* کارت‌های آماری داشبورد */
.stat-card {
  background: #fff;
  border-radius: var(--nc-radius);
  border: 1px solid var(--nc-border-strong);
  box-shadow: var(--nc-shadow-card);
  padding: 1.35rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  height: 100%;
}

.stat-card .stat-icon {
  width: 52px;
  height: 52px;
  border-radius: var(--nc-radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.45rem;
  color: #fff;
  flex-shrink: 0;
}

.stat-card .stat-value {
  font-size: 1.55rem;
  font-weight: 700;
  color: var(--nc-text);
  line-height: 1.2;
}

.stat-card .stat-title {
  color: var(--nc-muted);
  font-size: .9rem;
}

/* ---------- دکمه‌ها ---------- */
.btn {
  border-radius: var(--nc-radius-sm);
  font-weight: 500;
}

.btn-primary {
  --bs-btn-bg: var(--nc-primary);
  --bs-btn-border-color: var(--nc-primary);
  --bs-btn-hover-bg: var(--nc-primary-hover);
  --bs-btn-hover-border-color: var(--nc-primary-hover);
  --bs-btn-active-bg: var(--nc-primary-hover);
  --bs-btn-active-border-color: var(--nc-primary-hover);
}

.btn-success {
  --bs-btn-bg: var(--nc-success);
  --bs-btn-border-color: var(--nc-success);
  --bs-btn-hover-bg: #13a94a;
  --bs-btn-hover-border-color: #13a94a;
  --bs-btn-active-bg: #13a94a;
  --bs-btn-active-border-color: #13a94a;
}

.btn-light {
  --bs-btn-bg: var(--nc-input-bg);
  --bs-btn-border-color: var(--nc-input-bg);
  --bs-btn-color: #4b5675;
  --bs-btn-hover-bg: var(--nc-input-bg-focus);
  --bs-btn-hover-border-color: var(--nc-input-bg-focus);
  --bs-btn-hover-color: var(--nc-text-2);
}

.btn-outline-primary { --bs-btn-color: var(--nc-primary); --bs-btn-border-color: #d5e7ff; --bs-btn-hover-bg: var(--nc-primary); --bs-btn-hover-border-color: var(--nc-primary); }
.btn-outline-success { --bs-btn-color: var(--nc-success); --bs-btn-border-color: #c5f5d5; --bs-btn-hover-bg: var(--nc-success); --bs-btn-hover-border-color: var(--nc-success); }
.btn-outline-danger  { --bs-btn-color: var(--nc-danger);  --bs-btn-border-color: #ffd4de; --bs-btn-hover-bg: var(--nc-danger);  --bs-btn-hover-border-color: var(--nc-danger); }
.btn-outline-warning { --bs-btn-color: #b28400; --bs-btn-border-color: #ffe9a6; --bs-btn-hover-bg: var(--nc-warning); --bs-btn-hover-border-color: var(--nc-warning); }
.btn-outline-info    { --bs-btn-color: var(--nc-info);    --bs-btn-border-color: #e2d4ff; --bs-btn-hover-bg: var(--nc-info);    --bs-btn-hover-border-color: var(--nc-info); }
.btn-outline-secondary { --bs-btn-color: var(--nc-muted); --bs-btn-border-color: #dbdfe9; --bs-btn-hover-bg: #dbdfe9; --bs-btn-hover-border-color: #dbdfe9; --bs-btn-hover-color: var(--nc-text-2); }

/* ---------- فرم‌ها (سبک solid) ---------- */
.form-label {
  font-weight: 500;
  color: var(--nc-text-2);
  margin-bottom: .35rem;
}

.form-control,
.form-select {
  background-color: var(--nc-input-bg);
  border: 1px solid var(--nc-border-strong);
  border-radius: var(--nc-radius-sm);
  color: var(--nc-text-2);
  padding: .55rem .85rem;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

/* هاور: مرز کمی پررنگ‌تر تا فیلد قابل تشخیص باشد */
.form-control:hover:not(:focus):not([readonly]),
.form-select:hover:not(:focus) {
  border-color: var(--nc-border-hover);
}

/* فوکوس: مرز آبی + هاله‌ی ملایم */
.form-control:focus,
.form-select:focus {
  background-color: var(--nc-input-bg-focus);
  border-color: var(--nc-primary);
  color: var(--nc-text);
  box-shadow: var(--nc-focus-ring);
}

/* خطای اعتبارسنجی (کلاس‌های ASP.NET و Bootstrap): مرز و هاله‌ی قرمز */
.form-control.input-validation-error,
.form-select.input-validation-error,
.form-control.is-invalid,
.form-select.is-invalid {
  border-color: var(--nc-danger);
  background-color: var(--nc-danger-light);
}

.form-control.input-validation-error:focus,
.form-select.input-validation-error:focus,
.form-control.is-invalid:focus,
.form-select.is-invalid:focus {
  border-color: var(--nc-danger);
  box-shadow: var(--nc-danger-ring);
  background-color: #fff;
}

.form-control[readonly] {
  background-color: var(--nc-input-bg-focus);
  color: var(--nc-muted);
}

.form-control::placeholder { color: var(--nc-muted-2); }

.form-check-input:checked {
  background-color: var(--nc-primary);
  border-color: var(--nc-primary);
}

/* Tom Select هماهنگ با سبک فرم */
.ts-control {
  background-color: var(--nc-input-bg) !important;
  border: 1px solid var(--nc-border-strong) !important;
  border-radius: var(--nc-radius-sm) !important;
  padding: .55rem .85rem !important;
  color: var(--nc-text-2);
  box-shadow: none !important;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.ts-wrapper:hover:not(.focus) .ts-control {
  border-color: var(--nc-border-hover) !important;
}

.ts-wrapper.focus .ts-control {
  background-color: var(--nc-input-bg-focus) !important;
  border-color: var(--nc-primary) !important;
  box-shadow: var(--nc-focus-ring) !important;
}

/* خطای اعتبارسنجی روی انتخاب‌گرها (کلاس روی select اصلی داخل wrapper می‌نشیند) */
.ts-wrapper:has(select.input-validation-error) .ts-control,
.ts-wrapper.input-validation-error .ts-control {
  border-color: var(--nc-danger) !important;
  background-color: var(--nc-danger-light) !important;
}

.ts-dropdown {
  border: 1px solid var(--nc-border);
  border-radius: var(--nc-radius-sm);
  box-shadow: var(--nc-shadow-pop);
  overflow: hidden;
}

.ts-dropdown .option.active {
  background: var(--nc-primary-light);
  color: var(--nc-primary);
}

/* دیت‌پیکر شمسی */
.datepicker-plot-area {
  font-family: Vazirmatn, Tahoma, sans-serif !important;
  border-radius: var(--nc-radius-sm);
  box-shadow: var(--nc-shadow-pop);
  border: 1px solid var(--nc-border);
}

/* ---------- جدول‌ها ---------- */
.table {
  --bs-table-striped-bg: #fbfbfd;
  --bs-table-hover-bg: var(--nc-input-bg);
  color: var(--nc-text-2);
}

.table thead th,
.table .table-light th {
  background: transparent;
  color: var(--nc-muted-2);
  font-weight: 600;
  font-size: .82rem;
  border-bottom: 1px solid var(--nc-border);
  white-space: nowrap;
}

.table tbody td {
  border-bottom: 1px dashed var(--nc-border);
  vertical-align: middle;
}

.table tfoot td { border-top: 1px solid var(--nc-border); }

/* ---------- بج‌ها (سبک کم‌رنگ) ---------- */
.badge { border-radius: .45rem; font-weight: 600; padding: .4em .65em; }

.badge.bg-success,
.badge.text-bg-success {
  background-color: var(--nc-success-light) !important;
  color: #0a7a35 !important;
}

.badge.bg-danger,
.badge.text-bg-danger {
  background-color: var(--nc-danger-light) !important;
  color: var(--nc-danger) !important;
}

.badge.bg-warning,
.badge.text-bg-warning {
  background-color: var(--nc-warning-light) !important;
  color: #9c7000 !important;
}

.badge.bg-secondary,
.badge.text-bg-secondary {
  background-color: var(--nc-border) !important;
  color: var(--nc-muted) !important;
}

.badge.bg-info,
.badge.text-bg-info {
  background-color: var(--nc-info-light) !important;
  color: var(--nc-info) !important;
}

.badge.bg-light {
  background-color: var(--nc-input-bg) !important;
  border: 1px solid var(--nc-border);
  color: var(--nc-text-2) !important;
}

/* ---------- هشدارها ---------- */
.alert {
  border: 0;
  border-radius: var(--nc-radius-sm);
}

.alert-success { background: var(--nc-success-light); color: #0a7a35; }
.alert-danger  { background: var(--nc-danger-light);  color: #c81e47; }
.alert-warning { background: var(--nc-warning-light); color: #7a5b00; }
.alert-info    { background: var(--nc-primary-light); color: #0f5cbd; }

.alert .btn-close { filter: grayscale(1); }

/* ---------- صفحه‌بندی ---------- */
.pagination {
  --bs-pagination-border-width: 0;
  --bs-pagination-color: var(--nc-muted);
  --bs-pagination-hover-bg: var(--nc-input-bg-focus);
  --bs-pagination-hover-color: var(--nc-text);
  --bs-pagination-focus-bg: var(--nc-input-bg-focus);
  --bs-pagination-focus-box-shadow: none;
  --bs-pagination-active-bg: var(--nc-primary);
  --bs-pagination-disabled-bg: transparent;
  --bs-pagination-disabled-color: #dbdfe9;
  gap: .2rem;
}

.pagination .page-link { border-radius: var(--nc-radius-sm); }

/* ---------- منوی کشویی / مودال / آف‌کنواس ---------- */
.dropdown-menu {
  border: 0;
  border-radius: .75rem;
  box-shadow: var(--nc-shadow-pop);
  padding: .5rem 0;
  font-size: .92rem;
}

.dropdown-item { padding: .55rem 1.25rem; color: var(--nc-text-2); }
.dropdown-item:hover { background: var(--nc-input-bg); color: var(--nc-primary); }
.dropdown-item.text-danger:hover { background: var(--nc-danger-light); color: var(--nc-danger) !important; }
.dropdown-header { color: var(--nc-text); font-weight: 600; }
.dropdown-divider { border-color: var(--nc-border); }

.modal-content {
  border: 0;
  border-radius: var(--nc-radius);
  box-shadow: var(--nc-shadow-pop);
}

.modal-header, .modal-footer { border-color: var(--nc-border); }

.offcanvas {
  border: 0 !important;
  box-shadow: var(--nc-shadow-pop);
}

.offcanvas-header { border-bottom: 1px solid var(--nc-border) !important; }

/* ---------- جزئیات (dl) ---------- */
dl.row dt { color: var(--nc-muted); font-weight: 500; }
dl.row dd { color: var(--nc-text); }

/* ---------- صفحه‌ی لاگین ---------- */
.login-wrapper {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--nc-body-bg);
  padding: 1rem;
}

.login-card {
  background: #fff;
  border-radius: var(--nc-radius);
  border: 1px solid var(--nc-border);
  padding: 2.5rem;
  width: 100%;
  max-width: 420px;
  box-shadow: var(--nc-shadow-pop);
}

.login-card .login-logo {
  width: 64px;
  height: 64px;
  margin: 0 auto 1rem;
  border-radius: var(--nc-radius-sm);
  background: var(--nc-primary-light);
  color: var(--nc-primary);
  font-size: 1.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ---------- چاپ ---------- */
@media print {
  .app-sidebar,
  .app-topbar,
  .app-footer,
  .no-print {
    display: none !important;
  }

  .app-main { margin: 0 !important; }
  .app-content { padding: 0 !important; }
  .card { border: none !important; box-shadow: none !important; }
  body { background: #fff !important; }
}

/* ---------- موبایل ---------- */
@media (max-width: 991.98px) {
  .app-sidebar {
    transform: translateX(100%);
    box-shadow: none;
  }

  .app-sidebar.show {
    transform: translateX(0);
    box-shadow: 0 0 60px rgba(0, 0, 0, .35);
  }

  .app-main { margin-right: 0; }
  .app-content { padding: 1rem; }
}

/* --------------------------------------------------------------------------
   جستجوی سراسری بیمار در هدر (Ctrl+K)
   -------------------------------------------------------------------------- */
.topbar-search {
  width: 320px;
  margin-inline-start: .75rem;
}

.topbar-search .ts-wrapper.single .ts-control {
  background: var(--nc-input-bg);
  border: 1px solid transparent;
  border-radius: var(--nc-radius-sm);
  padding: .5rem .9rem;
  font-size: .9rem;
  box-shadow: none;
  cursor: text;
}

.topbar-search .ts-wrapper.focus .ts-control {
  background: var(--nc-input-bg-focus);
  border-color: var(--nc-border);
}

.topbar-search .ts-control::before {
  content: "\F52A"; /* bi-search */
  font-family: bootstrap-icons;
  color: var(--nc-muted-2);
  margin-inline-end: .5rem;
}

.topbar-search .ts-dropdown {
  border-radius: var(--nc-radius-sm);
  border-color: var(--nc-border);
  box-shadow: var(--nc-shadow-pop);
}

/* کارت دو خطی نتایج در همه‌ی انتخاب‌گرهای remote */
.ts-dropdown .option .fw-semibold {
  color: var(--nc-text);
}

/* --------------------------------------------------------------------------
   نمایش جدولی/کارتی لیست‌ها — حالت با data-view روی <html> تعیین می‌شود
   -------------------------------------------------------------------------- */
html[data-view="cards"] [data-view-pane="table"] { display: none; }
html[data-view="table"] [data-view-pane="cards"] { display: none; }

/* هنگام چاپ همیشه جدول چاپ شود (کارت‌ها برای کار تعاملی‌اند) */
@media print {
  html[data-view="cards"] [data-view-pane="table"] { display: block; }
  html[data-view="cards"] [data-view-pane="cards"] { display: none; }
}

.view-toggle .btn {
  color: var(--nc-muted);
}

.view-toggle .btn.active {
  background: var(--nc-primary-light);
  color: var(--nc-primary);
}

.entity-card {
  border: 1px solid var(--nc-border-strong);
  transition: box-shadow .15s ease, border-color .15s ease;
}

.entity-card:hover {
  border-color: var(--nc-border-hover);
}

.entity-card:hover {
  box-shadow: var(--nc-shadow-pop);
}

.entity-card .card-title-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: .5rem;
  margin-bottom: .5rem;
}

.entity-card dl.entity-fields {
  margin-bottom: .5rem;
}

.entity-card dl.entity-fields dt {
  color: var(--nc-muted);
  font-weight: 500;
}

.entity-card dl.entity-fields dd {
  margin-bottom: .2rem;
  color: var(--nc-text-2);
}

.entity-card .entity-actions {
  display: flex;
  gap: .35rem;
  justify-content: flex-end;
  border-top: 1px dashed var(--nc-border);
  padding-top: .6rem;
  margin-top: .25rem;
}
