/* ═══════════════════════════════════════════════════════════════
   styles/theme.css — تم جدید «کلینیک گندله»
   روشن/تاریک • موبایل (نوار پایین شناور) • دسکتاپ (سایدبار راست)
   ترتیب لینک در index.html:  bootstrap → main.css (اگر هست) → theme.css (آخر)
   ═══════════════════════════════════════════════════════════════ */

/* ───────────── ۱) توکن‌ها ───────────── */
:root {
  --bg: #f3f6f9;
  --card: #ffffff;
  --text: #0f172a;
  --muted: #64748b;
  --border: #e5eaf0;

  --primary: #16a34a;        --primary-dark: #15803d;   --primary-soft: #e7f6ec;
  --accent:  #2563eb;        --accent-soft:  #e8f0fe;
  --warning: #f59e0b;        --warning-dark: #d97706;   --warning-soft: #fff3d9;
  --danger:  #dc2626;        --danger-soft:  #fde8e8;
  --info:    #0891b2;        --info-soft:    #e0f5f9;
  --purple:  #7c3aed;        --purple-soft:  #efe8ff;
  --success: #16a34a;        --success-dark: #15803d;

  --radius: 20px; --radius-sm: 14px;
  --shadow-1: 0 1px 2px rgba(15,23,42,.04), 0 6px 18px -6px rgba(15,23,42,.08);
  --shadow-2: 0 14px 34px -10px rgba(15,23,42,.18);
  --glow: none;

  --card-bg: var(--card);
  --card-border: var(--border);
  --glass-blur: 0px;

  --nav-bg: #ffffff;
  --nav-active: var(--primary);
  --nav-inactive: #94a3b8;
  --side-w: 264px;

  --incident-bg: linear-gradient(135deg, #ef4444 0%, #dc2626 55%, #b91c1c 100%);
  --incident-shadow: 0 14px 28px -10px rgba(220,38,38,.55);

  /* سازگاری با نام‌های قدیمی theme.css */
  --bg-app: var(--bg); --bg-card: var(--card); --text-main: var(--text); --text-muted: var(--muted);
  --border-color: var(--border); --primary-light: var(--primary-soft);
}

body.dark-mode {
  --bg: #070b10;
  --card: #0f1821;
  --text: #eef4f8;
  --muted: #8fa3b5;
  --border: rgba(148,224,214,.14);

  --primary: #2dd4bf;        --primary-dark: #14b8a6;   --primary-soft: rgba(45,212,191,.13);
  --accent:  #38bdf8;        --accent-soft:  rgba(56,189,248,.13);
  --warning: #fbbf24;        --warning-dark: #f59e0b;   --warning-soft: rgba(251,191,36,.13);
  --danger:  #f87171;        --danger-soft:  rgba(248,113,113,.14);
  --info:    #22d3ee;        --info-soft:    rgba(34,211,238,.13);
  --purple:  #a78bfa;        --purple-soft:  rgba(167,139,250,.14);
  --success: #2dd4bf;        --success-dark: #14b8a6;

  --shadow-1: 0 1px 0 rgba(255,255,255,.03) inset, 0 10px 30px -12px rgba(0,0,0,.65);
  --shadow-2: 0 18px 44px -12px rgba(0,0,0,.75);
  --glow: 0 0 0 1px rgba(45,212,191,.10), 0 0 26px -8px rgba(45,212,191,.25);

  --card-bg: linear-gradient(180deg, rgba(21,33,44,.92), rgba(12,20,28,.92));
  --card-border: rgba(45,212,191,.16);
  --glass-blur: 14px;

  --nav-bg: rgba(14,22,30,.86);
  --nav-active: var(--primary);
  --nav-inactive: #6b7f90;

  --incident-bg: linear-gradient(135deg, rgba(127,29,29,.75), rgba(69,10,10,.85));
  --incident-shadow: 0 0 0 1px rgba(248,113,113,.45), 0 0 34px -6px rgba(239,68,68,.45);
}

/* ───────────── ۲) پایه ───────────── */
html { -webkit-text-size-adjust: 100%; }
body {
  /* ⬅️ فونت استعداد جایگزین شد */
  font-family: 'Estedad', 'Vazirmatn', Tahoma, sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 15px; line-height: 1.65;
  padding-bottom: 104px;
  transition: background-color .25s, color .25s;
}
body.dark-mode {
  background:
    radial-gradient(900px 420px at 85% -8%, rgba(45,212,191,.10), transparent 60%),
    radial-gradient(700px 380px at 5% 105%, rgba(56,189,248,.07), transparent 60%),
    var(--bg);
  background-attachment: fixed;
}
.muted, .text-muted { color: var(--muted) !important; }
a { color: var(--accent); }
::selection { background: var(--primary-soft); }
.hidden { display: none !important; }

/* ───────────── ۳) هدر ───────────── */
.app-header {
  position: sticky; top: 0; z-index: 900;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: calc(10px + env(safe-area-inset-top)) 14px 10px !important;
  background: color-mix(in srgb, var(--bg) 88%, transparent) !important;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border) !important;
}
.app-header .title, #headerTitle { font-weight: 800; font-size: 1.1rem; color: var(--text) !important; }
.app-header .btn, .app-header button.btn-light {
  width: 40px; height: 40px; padding: 0; display: inline-flex; align-items: center; justify-content: center;
  background: var(--card-bg); color: var(--text); border: 1px solid var(--card-border);
  border-radius: 50% !important; box-shadow: var(--shadow-1); font-size: 1.05rem;
}
.app-header .btn.text-danger { color: var(--danger) !important; }
.app-header .btn:active { transform: scale(.94); }
#alertBellBadge { font-size: .6rem; min-width: 17px; padding: 2px 4px; }

/* ───────────── ۴) صفحه اصلی ───────────── */
.home-greeting {
  margin: 14px 16px 12px; padding: 18px 20px;
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius);
  box-shadow: var(--shadow-1), var(--glow); position: relative; overflow: hidden;
  backdrop-filter: blur(var(--glass-blur));
}
.home-greeting::before {
  content: ''; position: absolute; inset: 0 auto 0 0; width: 55%;
  background: radial-gradient(120% 140% at 0% 50%, var(--primary-soft), transparent 70%); pointer-events: none;
}
.home-greeting-text { font-size: 1.9rem; font-weight: 900; color: var(--primary); line-height: 1.2; position: relative; }
.home-greeting-sub  { font-size: .9rem; color: var(--muted); margin-top: 2px; position: relative; }
.home-greeting-email { font-size: .8rem; color: var(--muted); direction: ltr; text-align: right; margin-top: 4px; position: relative; }
.home-greeting-art { font-size: 3rem; color: var(--primary); opacity: .9; position: relative; filter: drop-shadow(0 6px 10px color-mix(in srgb, var(--primary) 35%, transparent)); }

.home-incident-btn {
  position: relative; overflow: hidden; display: flex; align-items: center; gap: 16px;
  width: calc(100% - 32px); margin: 0 16px 16px; padding: 18px 20px;
  background: var(--incident-bg); color: #fff; border: 0; border-radius: var(--radius);
  box-shadow: var(--incident-shadow); text-align: right; transition: transform .15s;
}
.home-incident-btn:active { transform: scale(.985); }
.home-incident-icon {
  flex: 0 0 auto; width: 58px; height: 58px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 1.9rem;
  background: #fff; color: #dc2626; box-shadow: 0 6px 16px rgba(0,0,0,.22);
}
body.dark-mode .home-incident-icon { background: rgba(255,255,255,.06); color: #fecaca; box-shadow: inset 0 0 0 1px rgba(248,113,113,.5), 0 0 22px rgba(239,68,68,.45); }
.home-incident-body { flex: 1; position: relative; z-index: 1; }
.home-incident-title { font-size: 1.3rem; font-weight: 900; margin-bottom: 2px; }
.home-incident-sub { font-size: .85rem; opacity: .92; }
.home-incident-ecg { position: absolute; left: -6px; bottom: 6px; width: 46%; height: 60%; opacity: .32; pointer-events: none; }
.home-incident-cta {
  position: relative; z-index: 1; flex: 0 0 auto; padding: 9px 16px; border-radius: 12px;
  background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.3); font-weight: 800; font-size: .85rem; white-space: nowrap;
}
body.dark-mode .home-incident-cta { background: linear-gradient(135deg,#ef4444,#b91c1c); border: 0; box-shadow: 0 6px 16px rgba(239,68,68,.35); }

.home-dashboard-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; padding: 0 16px; margin-bottom: 24px; }
.home-card {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  padding: 16px; text-align: right; cursor: pointer; font-family: inherit; color: var(--text);
  background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius);
  box-shadow: var(--shadow-1), var(--glow); backdrop-filter: blur(var(--glass-blur));
  transition: transform .15s, box-shadow .2s, border-color .2s; min-height: 132px;
}
.home-card:active { transform: scale(.975); }
@media (hover: hover) { .home-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-2), var(--glow); border-color: color-mix(in srgb, var(--primary) 40%, var(--card-border)); } }
.home-card-icon {
  width: 46px; height: 46px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.4rem; margin-bottom: 8px; background: var(--tone-soft, var(--primary-soft)); color: var(--tone, var(--primary));
}
.home-card-label { font-size: 1.05rem; font-weight: 800; color: var(--text); }
.home-card-sub { font-size: .76rem; color: var(--muted); line-height: 1.55; }
.home-card-arrow { position: absolute; bottom: 14px; left: 14px; color: var(--muted); opacity: .45; }
.tone-green  { --tone: var(--primary); --tone-soft: var(--primary-soft); }
.tone-blue   { --tone: var(--accent);  --tone-soft: var(--accent-soft); }
.tone-amber  { --tone: var(--warning-dark); --tone-soft: var(--warning-soft); }
.tone-red    { --tone: var(--danger);  --tone-soft: var(--danger-soft); }
.tone-purple { --tone: var(--purple);  --tone-soft: var(--purple-soft); }
.tone-cyan   { --tone: var(--info);    --tone-soft: var(--info-soft); }

.hc-chip {
  display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; padding: 4px 11px; border-radius: 999px;
  font-size: .72rem; font-weight: 800; background: var(--tone-soft, var(--primary-soft)); color: var(--tone, var(--primary));
}
.hc-stats { display: flex; width: 100%; margin-top: 10px; padding-top: 12px; border-top: 1px dashed var(--border); }
.hc-stats > div { flex: 1; text-align: center; }
.hc-stats > div + div { border-right: 1px solid var(--border); }
.hc-stats b { display: block; font-size: 1.55rem; font-weight: 900; line-height: 1.2; color: var(--tone, var(--primary)); }
.hc-stats small { font-size: .7rem; color: var(--muted); }
.hc-spark { width: 100%; height: 46px; margin-top: 6px; }

.card-full { grid-column: span 2; flex-direction: row; align-items: center; gap: 14px; min-height: 0; }
.card-full .home-card-icon { margin-bottom: 0; width: 58px; height: 58px; font-size: 1.9rem; }
.card-full .home-card-body { flex: 1; }
.card-wide { grid-column: span 2; }
.card-half { grid-column: span 1; }

/* ───────────── ۵) نوار پایین (موبایل) ───────────── */
.bottom-nav {
  position: fixed; z-index: 1000; left: 12px; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom));
  height: 66px; padding: 0 6px; display: flex; align-items: center; justify-content: space-around;
  background: var(--nav-bg); border: 1px solid var(--card-border); border-radius: 26px;
  box-shadow: var(--shadow-2); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
}
.bottom-nav a {
  flex: 1; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  color: var(--nav-inactive); text-decoration: none; font-size: .68rem; font-weight: 800; border-radius: 18px; transition: color .2s;
}
.bottom-nav a i { font-size: 1.35rem; line-height: 1; }
.bottom-nav a.active { color: var(--nav-active); }
.bottom-nav a.active::after { content: ''; width: 18px; height: 3px; border-radius: 3px; background: var(--nav-active); margin-top: 1px; }
.bottom-nav a.nav-fab {
  flex: 0 0 auto; width: 58px !important; height: 58px !important; margin-top: -30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; color: #fff !important;
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  border: 4px solid var(--bg); box-shadow: 0 10px 22px -6px color-mix(in srgb, var(--primary) 65%, transparent);
}
.bottom-nav a.nav-fab::after { display: none; }
.bottom-nav a.nav-fab i { font-size: 1.6rem; }
body.dark-mode .bottom-nav a.nav-fab { color: #04211d !important; box-shadow: 0 0 0 1px rgba(45,212,191,.5), 0 0 26px rgba(45,212,191,.55); }

/* ───────────── ۶) سایدبار (دسکتاپ) ───────────── */
.side-nav { display: none; }
.side-brand { display: flex; align-items: center; gap: 12px; padding: 22px 20px 16px; }
.brand-mark { width: 42px; height: 42px; flex: 0 0 auto; border-radius: 13px; display: grid; place-items: center; color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--primary-dark)); box-shadow: 0 8px 18px -6px color-mix(in srgb, var(--primary) 60%, transparent); }
body.dark-mode .brand-mark { color: #04211d; box-shadow: 0 0 22px rgba(45,212,191,.45); }
.brand-mark svg { width: 24px; height: 24px; }
.brand-name { font-weight: 900; font-size: 1.25rem; line-height: 1.1; color: var(--text); }
.brand-sub { font-size: .7rem; color: var(--muted); }
.side-links { padding: 8px 12px; display: flex; flex-direction: column; gap: 4px; flex: 1; overflow-y: auto; }
.side-links a {
  display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: 14px;
  color: var(--muted); text-decoration: none; font-weight: 700; font-size: .95rem; transition: background .15s, color .15s;
}
.side-links a i { font-size: 1.2rem; width: 24px; text-align: center; }
.side-links a:hover { background: var(--primary-soft); color: var(--text); }
.side-links a.active { background: var(--primary-soft); color: var(--primary); box-shadow: inset -3px 0 0 var(--primary); }
.side-foot { padding: 12px; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 10px; }
.side-toggle { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; border-radius: 14px; background: var(--primary-soft); color: var(--text); font-weight: 700; font-size: .85rem; border: 0; width: 100%; font-family: inherit; }
.side-toggle .sw { width: 40px; height: 22px; border-radius: 999px; background: color-mix(in srgb, var(--muted) 35%, transparent); position: relative; transition: background .2s; }
.side-toggle .sw::after { content: ''; position: absolute; top: 3px; right: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .2s; }
body.dark-mode .side-toggle .sw { background: var(--primary); }
body.dark-mode .side-toggle .sw::after { transform: translateX(-18px); }
.side-user { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; background: var(--card-bg); border: 1px solid var(--card-border); }
.side-user .av { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); font-size: 1.3rem; }
.side-user .nm { font-weight: 800; font-size: .85rem; line-height: 1.2; }
.side-user .em { font-size: .7rem; color: var(--muted); direction: ltr; }

@media (min-width: 992px) {
  body { padding-bottom: 32px; }
  .bottom-nav { display: none !important; }
  #appHeader:not(.hidden) ~ .side-nav {
    display: flex; flex-direction: column; position: fixed; z-index: 950; top: 0; right: 0; bottom: 0; width: var(--side-w);
    background: var(--card-bg); border-left: 1px solid var(--card-border); box-shadow: var(--shadow-1);
    backdrop-filter: blur(var(--glass-blur));
  }
  #appHeader:not(.hidden), #appHeader:not(.hidden) ~ .screen { margin-right: var(--side-w); }
  #appHeader:not(.hidden) ~ .screen > .container-fluid, #appHeader:not(.hidden) ~ .screen > .content { max-width: 1240px; margin-inline: auto; }
  .app-header { padding-inline: 28px !important; }
  .home-greeting, .home-incident-btn { margin-inline: 24px; width: auto; }
  .home-greeting { margin-top: 20px; }
  .home-dashboard-grid { grid-template-columns: repeat(12, 1fr); gap: 18px; padding: 0 24px; }
  .home-dashboard-grid > .home-card { grid-column: span 3; min-height: 150px; }
  .home-dashboard-grid > .card-full { grid-column: span 12; }
  .home-dashboard-grid > .card-wide { grid-column: span 6; }
  .home-dashboard-grid > .card-half { grid-column: span 3; }
}

/* ───────────── ۷) کارت‌ها و اجزای عمومی ماژول‌ها ───────────── */
.card {
  background: var(--card-bg); border: 1px solid var(--card-border) !important; border-radius: var(--radius) !important;
  box-shadow: var(--shadow-1), var(--glow); overflow: hidden; color: var(--text); margin-bottom: 14px;
  backdrop-filter: blur(var(--glass-blur));
}
.card-body { padding: 16px; }
.card-head {
  display: flex; align-items: center; gap: 8px; padding: 13px 18px; font-weight: 800; font-size: .98rem; color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
}
.card-head.success { background: linear-gradient(135deg, #22c55e, #15803d); }
.card-head.warning { background: linear-gradient(135deg, #fbbf24, #d97706); color: #3b2300; }
.card-head.danger  { background: linear-gradient(135deg, #ef4444, #b91c1c); }
.card-head.info    { background: linear-gradient(135deg, #22d3ee, #0e7490); }
.card-head.purple  { background: linear-gradient(135deg, #8b5cf6, #6d28d9); }
body.dark-mode .card-head { background: linear-gradient(135deg, rgba(45,212,191,.22), rgba(45,212,191,.06)); color: var(--primary); border-bottom: 1px solid var(--card-border); }
body.dark-mode .card-head.success { background: linear-gradient(135deg, rgba(34,197,94,.22), rgba(34,197,94,.05)); color: #4ade80; }
body.dark-mode .card-head.warning { background: linear-gradient(135deg, rgba(251,191,36,.22), rgba(251,191,36,.05)); color: #fbbf24; }
body.dark-mode .card-head.danger  { background: linear-gradient(135deg, rgba(248,113,113,.25), rgba(248,113,113,.06)); color: #fca5a5; }
body.dark-mode .card-head.info    { background: linear-gradient(135deg, rgba(34,211,238,.22), rgba(34,211,238,.05)); color: #67e8f9; }
body.dark-mode .card-head.purple  { background: linear-gradient(135deg, rgba(167,139,250,.25), rgba(167,139,250,.06)); color: #c4b5fd; }

.section-title {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 18px 4px 10px;
  font-weight: 800; font-size: .95rem; color: var(--text);
}
.section-title::before { content: ''; width: 4px; height: 18px; border-radius: 3px; background: var(--primary); margin-left: 8px; }
.section-title > span:first-child { flex: 1; }

.item-card {
  background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 16px; padding: 14px 16px; margin-bottom: 10px;
  box-shadow: var(--shadow-1); position: relative; border-right: 4px solid var(--primary);
}
.item-card.warn { border-right-color: var(--warning); }
.item-card.danger { border-right-color: var(--danger); }
.item-card .name { font-weight: 800; color: var(--text); }
.item-card .meta { font-size: .78rem; color: var(--muted); margin-top: 2px; }
.qty-display { min-width: 44px; text-align: center; font-weight: 900; font-size: 1.2rem; color: var(--primary); }
.num-btn {
  display: inline-flex; align-items: center; justify-content: center; border-radius: 12px !important;
  background: var(--primary-soft); color: var(--text); border: 1px solid var(--card-border); font-weight: 800; font-size: 1.1rem;
}
.num-btn:active { transform: scale(.92); }

.badge-soft {
  display: inline-flex; align-items: center; gap: 4px; padding: 4px 11px; border-radius: 999px; font-size: .75rem; font-weight: 800;
  background: var(--primary-soft); color: var(--primary);
}
.badge-soft.success { background: var(--primary-soft); color: var(--primary); }
.badge-soft.warning { background: var(--warning-soft); color: var(--warning-dark); }
.badge-soft.danger  { background: var(--danger-soft);  color: var(--danger); }
.badge-soft.primary { background: var(--accent-soft);  color: var(--accent); }
.badge-soft.info    { background: var(--info-soft);    color: var(--info); }
.badge-soft.gray    { background: color-mix(in srgb, var(--muted) 14%, transparent); color: var(--muted); }

/* دکمه‌ها */
.btn { font-family: inherit; font-weight: 800; border-radius: 14px; padding: 10px 18px; border-width: 1.5px; transition: transform .12s, box-shadow .2s, background .2s; }
.btn:active { transform: scale(.97); }
.btn-lg { border-radius: 16px; padding: 13px 22px; }
.btn-sm { border-radius: 11px; padding: 6px 12px; }
.btn-primary, .btn-success { background: linear-gradient(135deg, var(--primary), var(--primary-dark)); border-color: transparent; color: #fff; box-shadow: 0 8px 18px -8px color-mix(in srgb, var(--primary) 70%, transparent); }
.btn-primary:hover, .btn-success:hover, .btn-primary:focus, .btn-success:focus { background: linear-gradient(135deg, var(--primary), var(--primary-dark)); filter: brightness(1.06); color: #fff; }
body.dark-mode .btn-primary, body.dark-mode .btn-success { color: #04211d; }
.btn-warning { background: linear-gradient(135deg, #fbbf24, #f59e0b); border-color: transparent; color: #3b2300; }
.btn-danger  { background: linear-gradient(135deg, #ef4444, #dc2626); border-color: transparent; color: #fff; }
.btn-info    { background: linear-gradient(135deg, #22d3ee, #0891b2); border-color: transparent; color: #04212a; }
.btn-secondary { background: color-mix(in srgb, var(--muted) 16%, transparent); border-color: transparent; color: var(--text); }
.btn-light { background: var(--card-bg); border-color: var(--card-border); color: var(--text); }
.btn-outline-primary, .btn-outline-success { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 55%, transparent); background: transparent; }
.btn-outline-primary:hover, .btn-outline-success:hover { background: var(--primary-soft); color: var(--primary); border-color: var(--primary); }
.btn-outline-warning { color: var(--warning-dark); border-color: color-mix(in srgb, var(--warning) 60%, transparent); background: transparent; }
.btn-outline-warning:hover { background: var(--warning-soft); color: var(--warning-dark); border-color: var(--warning); }
.btn-outline-danger { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 55%, transparent); background: transparent; }
.btn-outline-danger:hover { background: var(--danger-soft); color: var(--danger); border-color: var(--danger); }
.btn-outline-secondary { color: var(--muted); border-color: var(--border); background: transparent; }
.btn-outline-secondary:hover { background: color-mix(in srgb, var(--muted) 12%, transparent); color: var(--text); }
.btn:disabled, .btn.disabled { opacity: .55; }

/* فرم‌ها */
.form-label { font-weight: 700; font-size: .85rem; color: var(--text); margin-bottom: 6px; }
.form-control, .form-select, textarea.form-control {
  background: color-mix(in srgb, var(--card) 100%, transparent); color: var(--text);
  border: 1.5px solid var(--border); border-radius: 14px; padding: 10px 14px; font-family: inherit; min-height: 46px;
}
body.dark-mode .form-control, body.dark-mode .form-select { background: rgba(255,255,255,.04); border-color: rgba(148,224,214,.16); color: var(--text); }
.form-control::placeholder { color: color-mix(in srgb, var(--muted) 75%, transparent); }
.form-control:focus, .form-select:focus { border-color: var(--primary); box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 18%, transparent); background: var(--card); color: var(--text); }
body.dark-mode .form-control:focus, body.dark-mode .form-select:focus { background: rgba(255,255,255,.06); }
.input-group-text { background: var(--primary-soft); border: 1.5px solid var(--border); color: var(--muted); border-radius: 14px; }
body.dark-mode .form-select option { background: #0f1821; color: var(--text); }

/* مودال و شیت */
.modal-content { background: var(--card); color: var(--text); border: 1px solid var(--card-border); border-radius: 24px; overflow: hidden; box-shadow: var(--shadow-2); }
body.dark-mode .modal-content { background: linear-gradient(180deg, #14202b, #0c141b); }
.modal-header { border-bottom: 1px solid var(--border); padding: 16px 20px; }
.modal-footer { border-top: 1px solid var(--border); }
.modal-backdrop.show { opacity: .55; }
body.dark-mode .btn-close { filter: invert(1) grayscale(1); }
.archive-sheet, .list-sheet { background: var(--card); color: var(--text); border-radius: 26px 26px 0 0; }
body.dark-mode .archive-sheet, body.dark-mode .list-sheet { background: linear-gradient(180deg, #14202b, #0c141b); }

/* ابزارهای تاریک */
body.dark-mode .bg-white, body.dark-mode .bg-light { background: rgba(255,255,255,.04) !important; color: var(--text) !important; }
body.dark-mode .text-dark { color: var(--text) !important; }
body.dark-mode .border, body.dark-mode .border-top, body.dark-mode .border-bottom { border-color: var(--border) !important; }
body.dark-mode .table { --bs-table-color: var(--text); --bs-table-bg: transparent; --bs-table-border-color: var(--border); color: var(--text); }
body.dark-mode .alert { border-color: var(--border); }
body.dark-mode code { color: var(--primary); background: var(--primary-soft); }

/* اجزای صفحه جزئیات */
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 999px; font-size: .78rem; font-weight: 800; background: var(--tone-soft, var(--primary-soft)); color: var(--tone, var(--primary)); border: 1px solid color-mix(in srgb, var(--tone, var(--primary)) 22%, transparent); }
.info-tile { display: flex; flex-direction: column; gap: 6px; padding: 14px; border-radius: 16px; background: var(--card-bg); border: 1px solid var(--card-border); box-shadow: var(--shadow-1); text-align: center; align-items: center; }
.info-tile .ic { font-size: 1.7rem; color: var(--tone, var(--accent)); }
.info-tile .tt { font-weight: 800; font-size: .88rem; }
.info-tile .st { font-size: .72rem; color: var(--muted); }
.info-tile .ok { color: var(--primary); font-size: 1.2rem; }
.alert-card { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 18px; background: var(--tone-soft); border: 1px solid color-mix(in srgb, var(--tone) 28%, transparent); }
.alert-card .ic { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 1.4rem; background: color-mix(in srgb, var(--tone) 16%, transparent); color: var(--tone); flex: 0 0 auto; }
.alert-card .tt { font-weight: 900; color: var(--tone); }
.alert-card .tx { font-size: .82rem; color: var(--muted); }
.action-row { display: flex; flex-direction: column; gap: 10px; }
.action-row .btn { display: flex; align-items: center; justify-content: center; gap: 10px; border-width: 1.5px; }
.act-edit  { background: var(--warning-soft); color: var(--warning-dark); border-color: color-mix(in srgb, var(--warning) 45%, transparent); }
.act-refer { background: var(--accent-soft);  color: var(--accent);       border-color: color-mix(in srgb, var(--accent) 35%, transparent); }
.act-retry { background: color-mix(in srgb, var(--warning) 22%, transparent); color: var(--warning-dark); border-color: color-mix(in srgb, var(--warning) 50%, transparent); }
.act-done  { background: linear-gradient(135deg, #ef4444, #dc2626); color: #fff; border-color: transparent; }
.timeline { position: relative; padding-right: 22px; }
.timeline::before { content: ''; position: absolute; right: 6px; top: 6px; bottom: 6px; width: 2px; background: var(--border); }
.timeline .tl { position: relative; padding: 0 0 14px; }
.timeline .tl::before { content: ''; position: absolute; right: -22px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
.timeline .tl.bad::before { background: var(--danger); box-shadow: 0 0 0 4px var(--danger-soft); }
.timeline .tl b { font-size: .9rem; }
.timeline .tl small { display: block; color: var(--muted); font-size: .74rem; }
@media (min-width: 992px) { .action-row { flex-direction: row; } .action-row .btn { flex: 1; } }

/* ───────────── ۸) لاگین و لودینگ ───────────── */
#screenLoading, #screenLogin { min-height: 100vh; }
.login-card { border: 1px solid var(--card-border); background: var(--card-bg) !important; box-shadow: var(--shadow-2); backdrop-filter: blur(var(--glass-blur)); color: var(--text); }
.login-card h3 { color: var(--text); }
.loading-title { color: var(--primary) !important; }
.spinner-border.text-success { color: var(--primary) !important; }

/* ───────────── ۹) چاپ: تم را کنار بگذار ───────────── */
@media print {
  body, body.dark-mode { background: #fff !important; padding: 0 !important; }
  .app-header, .bottom-nav, .side-nav { display: none !important; }
  #appHeader:not(.hidden) ~ .screen { margin-right: 0 !important; }
}
/* اطمینان از مخفی شدن سایدبار در صورت عدم لاگین */
.hidden ~ .side-nav {
  display: none !important;
}
