﻿/* ==========================================================================
   Zankoline Form — design system (RTL / Sorani Kurdish)
   ========================================================================== */

:root {
  --bg: #f2f4fb;
  --surface: #ffffff;
  --ink: #101828;
  --muted: #667085;
  --line: #e6e9f2;
  --brand-1: #4f46e5;
  --brand-2: #7c3aed;
  --grad: linear-gradient(135deg, #4f46e5 0%, #7c3aed 60%, #a855f7 100%);
  --grad-soft: linear-gradient(135deg, #eef2ff, #f5f3ff);
  --ok: #059669;
  --ok-bg: #ecfdf5;
  --bad: #dc2626;
  --bad-bg: #fef2f2;
  --warn: #d97706;
  --warn-bg: #fffbeb;
  --radius: 16px;
  --radius-lg: 22px;
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .08);
  --shadow-md: 0 6px 18px -4px rgba(16, 24, 40, .12);
  --shadow-brand: 0 14px 30px -10px rgba(99, 102, 241, .45);
  --font: 'Noto Kufi Arabic', 'Segoe UI', Tahoma, sans-serif;
}

/* ڕێستی بنەڕەتی — پەڕەی چوونەژوورەوە بووتستراپ بار ناکات، بۆیە پێویستە خۆمان
   box-sizing دابنێین؛ ئەگەرنا خانەکان بە پانی 100% + padding لە مۆبایل دەڕژێن. */
*, *::before, *::after { box-sizing: border-box; }

html { font-size: 15px; }

body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--ink);
  min-height: 100vh;
}

img, svg, video { max-width: 100%; }

::selection { background: rgba(124, 58, 237, .25); }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #c7cbe0; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #a9aecb; }

.icon { width: 1.15em; height: 1.15em; vertical-align: -.22em; fill: currentColor; flex: none; }

/* ---------- buttons ---------- */
.btn { font-family: var(--font); border-radius: 12px; font-weight: 600; }

.btn-brand {
  background: var(--grad);
  color: #fff;
  border: none;
  padding: .62rem 1.35rem;
  box-shadow: var(--shadow-brand);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s;
}
.btn-brand:hover, .btn-brand:focus {
  color: #fff;
  transform: translateY(-2px);
  filter: brightness(1.06);
  box-shadow: 0 18px 34px -10px rgba(99, 102, 241, .55);
}
.btn-brand:active { transform: translateY(0); }

.btn-ghost {
  background: #fff;
  border: 1.5px solid var(--line);
  color: #475467;
  transition: all .15s;
}
.btn-ghost:hover { border-color: var(--brand-1); color: var(--brand-1); background: #f8f8ff; }

.btn-icon {
  width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px;
  border: none;
  background: transparent;
  color: #98a2b3;
  transition: all .15s;
}
.btn-icon:hover { background: #eef2ff; color: var(--brand-1); }
.btn-icon.danger:hover { background: var(--bad-bg); color: var(--bad); }

/* ---------- forms ---------- */
.form-control, .form-select {
  font-family: var(--font);
  border: 1.5px solid var(--line);
  border-radius: 12px;
  padding: .58rem .9rem;
  background: #fbfcfe;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.form-control:focus, .form-select:focus {
  border-color: var(--brand-1);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(99, 102, 241, .14);
}
.form-label { font-weight: 600; font-size: .82rem; color: #475467; margin-bottom: .3rem; }

/* ---------- badges ---------- */
.badge-soft {
  display: inline-flex; align-items: center; gap: .3em;
  padding: .3em .7em;
  border-radius: 999px;
  font-size: .74rem;
  font-weight: 700;
}
.badge-track-zansti { background: #eef2ff; color: #4338ca; }
.badge-track-adabi  { background: #fdf2f8; color: #be185d; }
.badge-track-gshti  { background: #fffbeb; color: #b45309; }

/* ==========================================================================
   App shell
   ========================================================================== */
.app-nav {
  position: sticky; top: 0; z-index: 1020;
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.app-nav .inner {
  max-width: 1280px; margin: 0 auto;
  padding: .65rem 1.25rem;
  display: flex; align-items: center; gap: .9rem;
}
.brand { display: flex; align-items: center; gap: .65rem; text-decoration: none; color: var(--ink); }
.brand img { width: 40px; height: 40px; border-radius: 12px; box-shadow: var(--shadow-brand); }
.brand .t1 { font-weight: 800; font-size: 1.02rem; line-height: 1.2; }
.brand .t2 {
  font-size: .68rem; font-weight: 600;
  background: var(--grad);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.user-chip {
  display: inline-flex; align-items: center; gap: .55rem;
  background: #f4f6fb; border: 1px solid var(--line);
  border-radius: 999px; padding: .32rem .9rem .32rem .5rem;
  font-size: .82rem; font-weight: 700; color: #475467;
}
.user-chip .dot { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px #dcfce7; }

.page-wrap { max-width: 1280px; margin: 0 auto; padding: 1.6rem 1.25rem 5rem; }

.page-title { font-weight: 800; font-size: 1.35rem; margin: 0; }
.page-sub { color: var(--muted); font-size: .85rem; margin: 0; }

/* ==========================================================================
   Login
   ========================================================================== */
.login-body {
  margin: 0;
  min-height: 100vh;
  background: #f6f7fb;
  background-image:
    radial-gradient(55% 50% at 15% 0%, rgba(99, 102, 241, .10) 0%, transparent 60%),
    radial-gradient(50% 45% at 90% 15%, rgba(124, 58, 237, .08) 0%, transparent 60%);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 2rem 1rem;
  position: relative;
  overflow: hidden;
}

.login-head { text-align: center; position: relative; z-index: 2; margin-bottom: 1.5rem; animation: rise .6s ease both; }
.login-head .logo {
  width: 72px; height: 72px; border-radius: 20px;
  box-shadow: 0 16px 36px -14px rgba(79, 70, 229, .40);
  margin-bottom: 1rem;
}
.login-head h1 { color: var(--ink); font-weight: 800; font-size: 1.4rem; margin: 0 0 .3rem; }
.login-head h1 .grad {
  background: var(--grad);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.login-head p { color: var(--muted); font-size: .86rem; margin: 0; }

.login-card {
  position: relative; z-index: 2;
  width: 100%; max-width: 400px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 1.8rem 1.6rem;
  box-shadow: 0 24px 60px -24px rgba(16, 24, 40, .28);
  animation: rise .6s .1s ease both;
}
@keyframes rise {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

.login-field { position: relative; margin-bottom: 1rem; }
.login-field .icon {
  position: absolute; right: 1rem; top: 50%;
  transform: translateY(-50%);
  width: 1.2em; height: 1.2em;
  color: var(--muted);
  pointer-events: none;
}
.login-field input {
  width: 100%;
  height: 52px;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 12px;
  color: var(--ink);
  font-family: var(--font);
  font-size: .95rem;
  padding: 0 3rem 0 1rem;
  transition: border-color .16s, box-shadow .16s;
}
.login-field input::placeholder { color: var(--muted); opacity: .7; }
.login-field input:focus {
  outline: none;
  border-color: var(--brand-1);
  box-shadow: 0 0 0 4px rgba(79, 70, 229, .14);
}

.captcha-row { display: flex; gap: .6rem; align-items: stretch; margin-bottom: 1.25rem; }
.captcha-row .login-field { flex: 1; margin: 0; }
.captcha-box {
  display: flex; align-items: center; gap: .4rem;
  background: #f2f4fb;
  border: 1.5px solid var(--line);
  border-radius: 12px;
  padding: 2px;
  overflow: hidden;
}
.captcha-box img { height: 46px; border-radius: 10px; display: block; }
.captcha-refresh {
  border: none; background: transparent;
  color: var(--brand-1);
  width: 34px; height: 46px;
  border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center;
  transition: all .2s;
}
.captcha-refresh:hover { background: #eef2ff; transform: rotate(180deg); }

.login-btn {
  width: 100%;
  height: 52px;
  border: none;
  border-radius: 12px;
  background: var(--grad);
  color: #fff;
  font-family: var(--font);
  font-weight: 800;
  font-size: 1.02rem;
  display: flex; align-items: center; justify-content: center; gap: .5rem;
  box-shadow: 0 14px 28px -12px rgba(124, 58, 237, .5);
  transition: transform .16s, box-shadow .16s, filter .16s;
}
.login-btn:hover { transform: translateY(-2px); filter: brightness(1.06); }
.login-btn:active { transform: translateY(0); }

.login-error {
  display: flex; align-items: center; gap: .5rem;
  background: var(--bad-bg);
  border: 1px solid #fecaca;
  color: #b91c1c;
  border-radius: 12px;
  font-size: .82rem;
  padding: .6rem .85rem;
  margin-bottom: 1rem;
}

.login-hint {
  position: relative; z-index: 2;
  margin-top: 1.4rem;
  color: var(--muted);
  font-size: .76rem;
  background: #fff;
  border: 1px dashed var(--line);
  padding: .45rem 1rem;
  border-radius: 999px;
}
.login-hint b { color: var(--brand-1); }

/* ==========================================================================
   Dashboard
   ========================================================================== */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin: 1.3rem 0 1.5rem;
}
.stat-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.05rem 1.15rem;
  display: flex; align-items: center; gap: .95rem;
  box-shadow: var(--shadow-sm);
  transition: transform .18s, box-shadow .18s;
}
.stat-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.stat-ico {
  width: 50px; height: 50px; flex: none;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
}
.stat-ico .icon { width: 1.45em; height: 1.45em; }
.stat-ico.i1 { background: linear-gradient(135deg, #6366f1, #8b5cf6); box-shadow: 0 10px 20px -8px rgba(99,102,241,.6); }
.stat-ico.i2 { background: linear-gradient(135deg, #10b981, #059669); box-shadow: 0 10px 20px -8px rgba(16,185,129,.6); }
.stat-ico.i3 { background: linear-gradient(135deg, #f59e0b, #d97706); box-shadow: 0 10px 20px -8px rgba(245,158,11,.6); }
.stat-ico.i4 { background: linear-gradient(135deg, #0ea5e9, #2563eb); box-shadow: 0 10px 20px -8px rgba(14,165,233,.6); }
.stat-card .num { font-size: 1.5rem; font-weight: 800; line-height: 1.1; }
.stat-card .lbl { font-size: .78rem; color: var(--muted); font-weight: 600; }

.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.panel-toolbar {
  display: flex; align-items: center; gap: .8rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
}
.panel-toolbar .search-wrap { position: relative; flex: 1; min-width: 220px; max-width: 400px; }
.panel-toolbar .search-wrap .icon {
  position: absolute; right: .85rem; top: 50%; transform: translateY(-50%);
  color: #98a2b3;
}
.panel-toolbar .search-wrap input { padding-right: 2.6rem; }

.forms-table { width: 100%; margin: 0; }
.forms-table thead th {
  font-size: .72rem; font-weight: 700; color: #98a2b3;
  text-transform: none;
  padding: .7rem 1.25rem;
  background: #fafbff;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
.forms-table tbody td {
  padding: .85rem 1.25rem;
  border-bottom: 1px solid #f0f2f9;
  vertical-align: middle;
}
.forms-table tbody tr { transition: background .12s; }
.forms-table tbody tr:hover { background: #f8f9ff; }
.forms-table tbody tr:last-child td { border-bottom: none; }

.avatar {
  width: 42px; height: 42px; flex: none;
  border-radius: 13px;
  background: var(--grad-soft);
  border: 1px solid #e4e4ff;
  color: var(--brand-1);
  font-weight: 800; font-size: 1.05rem;
  display: flex; align-items: center; justify-content: center;
}
.student-cell { display: flex; align-items: center; gap: .8rem; }
.student-cell .nm { font-weight: 700; font-size: .92rem; }
.student-cell .sub { font-size: .74rem; color: var(--muted); }

.choices-pill { min-width: 110px; }
.choices-pill .cnt { font-size: .78rem; font-weight: 700; color: #475467; }
.choices-pill .bar {
  height: 6px; border-radius: 99px;
  background: #eef0f8; overflow: hidden; margin-top: 4px;
}
.choices-pill .bar > span { display: block; height: 100%; border-radius: 99px; background: var(--grad); }

.score-chip {
  font-weight: 800; font-size: .95rem;
  color: var(--brand-1);
}
.score-chip small { color: var(--muted); font-weight: 600; }

.empty-state { text-align: center; padding: 4rem 1rem; }
.empty-state .art {
  width: 108px; height: 108px;
  margin: 0 auto 1.2rem;
  border-radius: 32px;
  background: var(--grad-soft);
  display: flex; align-items: center; justify-content: center;
  color: var(--brand-1);
}
.empty-state .art .icon { width: 3em; height: 3em; }
.empty-state h5 { font-weight: 800; }
.empty-state p { color: var(--muted); font-size: .86rem; }

/* modal */
.modal-content { border: none; border-radius: 22px; font-family: var(--font); box-shadow: 0 40px 90px -20px rgba(2,6,23,.4); }
.modal-header { border-bottom: 1px solid var(--line); padding: 1.1rem 1.4rem; }
.modal-title { font-weight: 800; font-size: 1.05rem; }
.modal-body { padding: 1.3rem 1.4rem; }
.modal-footer { border-top: 1px solid var(--line); padding: .9rem 1.4rem; }

/* ==========================================================================
   Form editor
   ========================================================================== */
.editor-head {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 1.15rem 1.3rem;
  box-shadow: var(--shadow-sm);
  margin-bottom: 1.2rem;
}
.editor-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 350px;
  gap: 1.2rem;
  align-items: start;
}

/* ---------- grades + official calculation ---------- */
.grades-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 1.15rem 1.3rem;
  box-shadow: var(--shadow-sm);
  margin-bottom: 1.2rem;
}
.grades-grid-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 400px;
  gap: 1.4rem;
  align-items: start;
}
.grades-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .7rem;
}
.g-field label {
  display: block;
  font-size: .74rem;
  font-weight: 700;
  color: #475467;
  margin-bottom: .25rem;
}
.g-field input {
  width: 100%;
  height: 46px;
  border: 1.5px solid var(--line);
  border-radius: 12px;
  background: #fbfcfe;
  text-align: center;
  font-family: 'Consolas', 'Segoe UI', monospace;
  font-weight: 700;
  font-size: 1.05rem;
  transition: border-color .15s, box-shadow .15s;
}
.g-field input:focus {
  outline: none;
  border-color: var(--brand-1);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(99, 102, 241, .14);
}
/* خانە ئارەزوومەندییەکان (پۆلی 10 و 11) — جیاکراوە */
.g-field.g-opt label { color: var(--brand-1); }
.g-field.g-opt input { border-color: #c7d2fe; background: #f5f7ff; }
.g-field .g-hint { font-weight: 600; color: var(--muted); font-size: .68rem; }
/* نمرەی هەڵە (تاک/دەرەوەی مەودا) */
.g-field input.invalid { border-color: var(--bad); background: var(--bad-bg); box-shadow: 0 0 0 3px rgba(220, 38, 38, .12); }

.calc-box {
  background: #f8f9fe;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: .9rem;
}
.calc-table { width: 100%; border-collapse: collapse; margin-bottom: .7rem; }
.calc-table th {
  font-size: .7rem; font-weight: 800; color: #98a2b3;
  text-align: center; padding: .2rem .4rem;
}
.calc-table td {
  font-size: .8rem;
  padding: .3rem .5rem;
  border-top: 1px solid #eceef8;
}
.calc-table td:first-child { color: #475467; font-weight: 600; }
.calc-table td:not(:first-child) {
  text-align: center;
  font-family: 'Consolas', monospace;
  font-weight: 700;
  color: var(--ink);
  direction: ltr;
  min-width: 72px;
}
.finals { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.finals-hint { margin: .5rem 0 0; font-size: .68rem; line-height: 1.5; }
.final-chip {
  border-radius: 13px;
  padding: .55rem .7rem;
  color: #fff;
  display: flex; flex-direction: column; gap: .1rem;
}
.final-chip .lbl { font-size: .64rem; font-weight: 700; opacity: .85; }
.final-chip .val { font-size: 1.25rem; font-weight: 800; font-family: 'Consolas', monospace; direction: ltr; text-align: right; }
.final-chip.special { background: linear-gradient(135deg, #0ea5e9, #2563eb); box-shadow: 0 10px 22px -10px rgba(37, 99, 235, .6); }
.final-chip.others { background: var(--grad); box-shadow: 0 10px 22px -10px rgba(124, 58, 237, .6); }

.vocational-box .voc-warn {
  background: var(--warn-bg);
  color: #92400e;
  border: 1px solid #fde68a;
  border-radius: 12px;
  font-size: .82rem;
  font-weight: 700;
  padding: .6rem .9rem;
  margin-bottom: .9rem;
}
.dept-item .sc.scp { color: #6d28d9; background: #ede9fe; }
.dept-item .sc.sce { color: #0369a1; background: #e0f2fe; }

@media (max-width: 1100px) {
  .grades-grid-wrap { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .grades-grid { grid-template-columns: repeat(2, 1fr); }
  .finals { grid-template-columns: 1fr; }
}

.slots-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: 1.1rem;
}
.slots-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .35rem 1.1rem;
}
.slots-col { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }

.slot {
  display: flex; align-items: center; gap: .5rem;
  border: 1.5px solid transparent;
  background: #f8f9fd;
  border-radius: 12px;
  padding: .3rem .45rem;
  transition: border-color .15s, background .15s, box-shadow .15s;
}
.slot:focus-within { border-color: var(--brand-1); background: #fff; box-shadow: 0 0 0 4px rgba(99,102,241,.12); }
.slot.ok  { background: var(--ok-bg); }
.slot.bad { background: var(--bad-bg); }
.slot.dup, .slot.warn { background: var(--warn-bg); }
.slot.flash { animation: slot-flash .9s ease; }
@keyframes slot-flash {
  0% { box-shadow: 0 0 0 6px rgba(99,102,241,.35); border-color: var(--brand-1); }
  100% { box-shadow: 0 0 0 0 rgba(99,102,241,0); }
}

.slot-n {
  width: 26px; height: 26px; flex: none;
  border-radius: 9px;
  background: #eceef8;
  color: #5d6b98;
  font-size: .72rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
.slot.ok .slot-n { background: #d1fae5; color: #047857; }
.slot.bad .slot-n { background: #fee2e2; color: #b91c1c; }
.slot.dup .slot-n, .slot.warn .slot-n { background: #fef3c7; color: #b45309; }

.slot-code {
  width: 84px; flex: none;
  height: 38px;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  background: #fff;
  text-align: center;
  font-family: 'Consolas', 'Segoe UI', monospace;
  font-weight: 700; font-size: .95rem;
  color: var(--ink);
  direction: ltr;
  transition: border-color .15s;
}
.slot-code:focus { outline: none; border-color: var(--brand-1); }
.slot-code::placeholder { color: #c3c8dc; font-weight: 400; font-size: .8rem; }

.slot-name { flex: 1; min-width: 0; line-height: 1.25; }
.slot-name .nm {
  font-size: .78rem; font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.slot-name .un {
  font-size: .66rem; color: var(--muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.slot-name .ph { color: #c3c8dc; font-size: .74rem; }
.slot-name .err { color: var(--bad); font-size: .74rem; font-weight: 700; }

.variant-badge {
  flex: none;
  font-size: .62rem; font-weight: 800;
  border-radius: 7px;
  padding: .18em .5em;
}
.variant-badge.vp { background: #ede9fe; color: #6d28d9; }
.variant-badge.ve { background: #e0f2fe; color: #0369a1; }

.min-chip {
  flex: none;
  font-size: .66rem; font-weight: 700;
  color: #5d6b98;
  background: #eceef8;
  border-radius: 7px;
  padding: .2em .5em;
  direction: ltr;
}
.slot .slot-clear {
  flex: none;
  width: 24px; height: 24px;
  border: none; border-radius: 8px;
  background: transparent; color: #c3c8dc;
  font-size: 1rem; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  visibility: hidden;
  transition: all .12s;
}
.slot:hover .slot-clear.show, .slot:focus-within .slot-clear.show { visibility: visible; }
.slot-clear:hover { background: var(--bad-bg); color: var(--bad); }

/* search panel */
.search-panel {
  position: sticky; top: 86px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column;
  max-height: calc(100vh - 180px);
  overflow: hidden;
}
.search-panel .sp-head { padding: 1rem 1rem .6rem; }
.search-panel .sp-title { font-weight: 800; font-size: .92rem; display: flex; align-items: center; gap: .45rem; }
.search-panel .sp-title .icon { color: var(--brand-1); }
.track-chips { display: flex; gap: .35rem; flex-wrap: wrap; padding: .55rem 1rem .75rem; border-bottom: 1px solid var(--line); }
.track-chip {
  border: 1.5px solid var(--line);
  background: #fff;
  color: #667085;
  border-radius: 999px;
  font-size: .72rem; font-weight: 700;
  padding: .28em .85em;
  transition: all .14s;
}
.track-chip.active { background: var(--grad); color: #fff; border-color: transparent; box-shadow: 0 6px 14px -6px rgba(99,102,241,.6); }

.dept-list { overflow-y: auto; padding: .5rem; flex: 1; }
.dept-item {
  width: 100%;
  display: flex; align-items: center; gap: .6rem;
  text-align: right;
  background: transparent;
  border: none;
  border-radius: 12px;
  padding: .5rem .6rem;
  transition: background .12s;
}
.dept-item:hover { background: #f4f5ff; }
.dept-item .code {
  flex: none;
  min-width: 46px;
  font-family: 'Consolas', monospace;
  font-weight: 800; font-size: .82rem;
  color: var(--brand-1);
  background: #eef2ff;
  border-radius: 9px;
  padding: .3em .45em;
  text-align: center;
  direction: ltr;
}
.dept-item .info { flex: 1; min-width: 0; line-height: 1.3; }
.dept-item .info .nm { font-size: .8rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dept-item .info .un { font-size: .68rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dept-item .sc {
  flex: none; font-size: .7rem; font-weight: 800;
  color: #059669; background: #ecfdf5;
  border-radius: 8px; padding: .25em .5em;
  direction: ltr;
}
.dept-item .add {
  flex: none;
  width: 26px; height: 26px;
  border-radius: 9px;
  background: #eef2ff; color: var(--brand-1);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800;
}
.dept-empty { text-align: center; color: var(--muted); font-size: .8rem; padding: 2rem .5rem; }

/* floating save bar */
.save-bar {
  position: fixed;
  bottom: 18px; right: 50%;
  transform: translateX(50%);
  z-index: 1030;
  display: flex; align-items: center; gap: .8rem;
  background: rgba(17, 24, 39, .92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 999px;
  padding: .55rem .7rem .55rem 1.1rem;
  box-shadow: 0 24px 50px -12px rgba(2, 6, 23, .55);
  max-width: calc(100vw - 24px);
}
.save-bar .count { color: #e5e7eb; font-size: .8rem; font-weight: 700; white-space: nowrap; }
.save-bar .count b { color: #a5b4fc; font-size: 1rem; }
.save-bar .bar {
  width: 90px; height: 6px;
  background: rgba(255, 255, 255, .14);
  border-radius: 99px; overflow: hidden;
}
.save-bar .bar > span { display: block; height: 100%; background: linear-gradient(90deg, #818cf8, #c084fc); border-radius: 99px; transition: width .3s; }
.save-bar .status { color: #9ca3af; font-size: .7rem; white-space: nowrap; }
.save-bar .status.saved { color: #6ee7b7; }
.save-bar .btn-brand { padding: .5rem 1.15rem; border-radius: 999px; box-shadow: none; }
.save-bar .btn-dark-ghost {
  border: 1px solid rgba(255, 255, 255, .16);
  background: transparent;
  color: #d1d5db;
  border-radius: 999px;
  padding: .5rem .95rem;
  font-size: .82rem; font-weight: 600;
  display: inline-flex; align-items: center; gap: .4rem;
  transition: all .15s;
}
.save-bar .btn-dark-ghost:hover { background: rgba(255, 255, 255, .1); color: #fff; }

/* ---------- toast ---------- */
#toast-box {
  position: fixed; top: 20px; right: 50%;
  transform: translateX(50%);
  z-index: 2000;
  display: flex; flex-direction: column; gap: .5rem;
  align-items: center;
}
.toast-msg {
  display: flex; align-items: center; gap: .5rem;
  background: #111827; color: #f9fafb;
  border-radius: 999px;
  font-size: .84rem; font-weight: 600;
  padding: .6rem 1.3rem;
  box-shadow: 0 18px 40px -10px rgba(2, 6, 23, .5);
  animation: toast-in .25s ease;
}
.toast-msg.ok { background: #064e3b; color: #a7f3d0; }
.toast-msg.err { background: #7f1d1d; color: #fecaca; }
@keyframes toast-in {
  from { opacity: 0; transform: translateY(-14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1100px) {
  .editor-grid { grid-template-columns: 1fr; }
  .search-panel { position: static; max-height: 420px; order: -1; }
}
@media (max-width: 900px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .slots-cols { grid-template-columns: 1fr; }
}
@media (max-width: 576px) {
  .stats-grid { grid-template-columns: 1fr 1fr; gap: .6rem; }
  .stat-card { padding: .8rem; gap: .6rem; }
  .stat-ico { width: 40px; height: 40px; border-radius: 11px; }
  .stat-card .num { font-size: 1.2rem; }
  .page-wrap { padding: 1rem .8rem 6.5rem; }
  .save-bar { gap: .5rem; padding: .45rem .55rem .45rem .8rem; }
  .save-bar .bar, .save-bar .status { display: none; }
  .hide-sm { display: none !important; }
}

/* ==========================================================================
   NEW: theme toggle
   ========================================================================== */
.theme-btn {
  width: 38px; height: 38px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: #667085;
  cursor: pointer;
  transition: all .15s;
}
.theme-btn:hover { border-color: var(--brand-1); color: var(--brand-1); background: #f8f8ff; }
.theme-btn .icon { width: 1.2em; height: 1.2em; }
.theme-btn .i-sun { display: none; }
[data-theme="dark"] .theme-btn .i-sun { display: inline; }
[data-theme="dark"] .theme-btn .i-moon { display: none; }

/* زمان — سۆرانی / بادینی */
.lang-btn {
  display: inline-flex; align-items: center; gap: .35rem;
  height: 38px; padding: 0 .7rem;
  border-radius: 11px; border: 1px solid var(--line);
  background: var(--surface); color: var(--ink);
  font-weight: 700; font-size: .78rem; cursor: pointer;
}
.lang-btn:hover { border-color: var(--brand-1); color: var(--brand-1); }
.lang-btn .lang-code {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.55rem; height: 1.55rem; border-radius: 7px;
  background: var(--grad); color: #fff; font-size: .65rem; font-weight: 800;
}
.lang-menu .dropdown-item.active { background: #eef2ff; color: var(--brand-1); font-weight: 800; }
.lang-menu .page-sub { margin-inline-start: .35rem; font-size: .7rem; }
.login-lang {
  display: flex; justify-content: center; gap: .5rem;
  margin: 0 auto 1rem; max-width: 420px;
}
.lang-pill {
  text-decoration: none; font-weight: 700; font-size: .85rem;
  padding: .4rem 1rem; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.35); color: #fff; background: rgba(255,255,255,.12);
}
.lang-pill.on, .lang-pill:hover { background: #fff; color: #4f46e5; }
[data-theme="dark"] .lang-btn { background: #1c2440; }
[data-theme="dark"] .lang-menu .dropdown-item.active { background: #232c4e; }

/* ==========================================================================
   NEW: admission-probability system
   ========================================================================== */
.prob-dot {
  flex: none;
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--muted);
  box-shadow: 0 0 0 3px transparent;
}
.prob-dot.safe  { background: #10b981; box-shadow: 0 0 0 3px rgba(16,185,129,.18); }
.prob-dot.edge  { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245,158,11,.18); }
.prob-dot.reach { background: #ef4444; box-shadow: 0 0 0 3px rgba(239,68,68,.18); }
.prob-dot.none  { background: #cbd5e1; }

.prob-tag {
  flex: none;
  display: inline-flex; align-items: center; gap: .25em;
  font-size: .64rem; font-weight: 800;
  border-radius: 7px;
  padding: .2em .5em;
  white-space: nowrap;
}
.prob-tag.safe  { color: #047857; background: #d1fae5; }
.prob-tag.edge  { color: #b45309; background: #fef3c7; }
.prob-tag.reach { color: #b91c1c; background: #fee2e2; }
.prob-tag.none  { color: #64748b; background: #f1f5f9; }

/* slot tinting by probability — accent on RTL leading (right) edge; focus keeps the glow too */
.slot.p-safe  { box-shadow: inset -3px 0 0 #10b981; }
.slot.p-edge  { box-shadow: inset -3px 0 0 #f59e0b; }
.slot.p-reach { box-shadow: inset -3px 0 0 #ef4444; }
.slot.p-safe:focus-within  { box-shadow: 0 0 0 4px rgba(99,102,241,.12), inset -3px 0 0 #10b981; }
.slot.p-edge:focus-within  { box-shadow: 0 0 0 4px rgba(99,102,241,.12), inset -3px 0 0 #f59e0b; }
.slot.p-reach:focus-within { box-shadow: 0 0 0 4px rgba(99,102,241,.12), inset -3px 0 0 #ef4444; }

.prob-legend {
  display: flex; flex-wrap: wrap; gap: .5rem .9rem;
  align-items: center;
  margin-top: .7rem; padding-top: .7rem;
  border-top: 1px dashed var(--line);
  font-size: .72rem; color: var(--muted); font-weight: 600;
}
.prob-legend .lg { display: inline-flex; align-items: center; gap: .35em; }

/* ==========================================================================
   NEW: search-panel filters + secondary actions
   ========================================================================== */
.sp-filters {
  display: flex; gap: .5rem; align-items: center;
  padding: 0 1rem .7rem;
}
.sp-filters .form-select {
  flex: 1; min-width: 0;
  height: 36px; padding: .25rem .6rem;
  font-size: .78rem; font-weight: 600;
  border-radius: 10px;
}
.sp-actions {
  display: flex; gap: .4rem; padding: .6rem 1rem;
  border-bottom: 1px solid var(--line);
}
.sp-action {
  flex: 1;
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
  border: 1.5px solid var(--line);
  background: var(--surface);
  color: #475467;
  border-radius: 11px;
  font-size: .76rem; font-weight: 700;
  padding: .5rem .4rem;
  cursor: pointer;
  transition: all .14s;
}
.sp-action:hover { border-color: var(--brand-1); color: var(--brand-1); background: #f6f7ff; }
.sp-action.accent { background: var(--grad); color: #fff; border-color: transparent; box-shadow: 0 8px 18px -8px rgba(99,102,241,.6); }
.sp-action.accent:hover { color: #fff; filter: brightness(1.06); }
.sp-action .icon { width: 1.05em; height: 1.05em; }

/* extra dept-item bits */
.dept-item.is-present { opacity: .5; }
.dept-item.is-present .add { background: #d1fae5; color: #047857; }

/* ==========================================================================
   NEW: slot move controls
   ========================================================================== */
.slot-move {
  flex: none;
  display: flex; flex-direction: column;
  gap: 1px;
  opacity: 0;
  transition: opacity .12s;
}
.slot:hover .slot-move, .slot:focus-within .slot-move { opacity: 1; }
.slot-move button {
  width: 18px; height: 15px;
  border: none; background: transparent;
  color: #9aa3bd; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  border-radius: 4px; padding: 0;
}
.slot-move button:hover { background: #eef2ff; color: var(--brand-1); }
.slot-move .icon { width: 12px; height: 12px; }

/* ==========================================================================
   NEW: keyboard-shortcuts help
   ========================================================================== */
kbd {
  display: inline-block;
  font-family: 'Consolas', monospace;
  font-size: .72rem; font-weight: 700;
  background: #f1f3fb; color: #475467;
  border: 1px solid var(--line);
  border-bottom-width: 2px;
  border-radius: 6px;
  padding: .1em .45em;
  min-width: 1.4em; text-align: center;
  direction: ltr;
}
.shortcut-row { display: flex; align-items: center; gap: .5rem; padding: .5rem .2rem; border-bottom: 1px solid var(--line); }
.shortcut-row:last-child { border-bottom: none; }
.shortcut-row .keys { flex: none; display: flex; gap: .25rem; align-items: center; }
.shortcut-row .desc { color: var(--ink); font-size: .85rem; }

/* ==========================================================================
   NEW: dashboard insights
   ========================================================================== */
.insights {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.insight-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.05rem 1.15rem;
  box-shadow: var(--shadow-sm);
}
.insight-card .ic-title {
  font-size: .78rem; font-weight: 700; color: var(--muted);
  display: flex; align-items: center; gap: .4rem; margin-bottom: .9rem;
}
.insight-card .ic-title .icon { width: 1.05em; height: 1.05em; color: var(--brand-1); }
.big-metric { font-size: 2rem; font-weight: 800; line-height: 1; color: var(--ink); }
.big-metric small { font-size: .8rem; font-weight: 600; color: var(--muted); }

.bar-row { display: flex; align-items: center; gap: .6rem; margin-bottom: .55rem; }
.bar-row:last-child { margin-bottom: 0; }
.bar-row .bl { flex: none; width: 62px; font-size: .74rem; font-weight: 700; color: #475467; }
.bar-row .bt {
  flex: 1; height: 12px; border-radius: 99px;
  background: var(--track-bg, #eef0f8); overflow: hidden;
}
.bar-row .bt > span { display: block; height: 100%; border-radius: 99px; }
.bar-row .bt > span.b-zansti { background: linear-gradient(90deg, #6366f1, #8b5cf6); }
.bar-row .bt > span.b-adabi  { background: linear-gradient(90deg, #ec4899, #f472b6); }
.bar-row .bt > span.b-gshti  { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.bar-row .bt > span.b-prov   { background: linear-gradient(90deg, #0ea5e9, #2563eb); }
.bar-row .bv { flex: none; width: 34px; text-align: left; font-size: .74rem; font-weight: 800; color: var(--ink); direction: ltr; }

.score-gauge { display: flex; align-items: baseline; gap: .5rem; }
.gauge-track { height: 8px; border-radius: 99px; background: var(--track-bg, #eef0f8); overflow: hidden; margin-top: .7rem; }
.gauge-track > span { display: block; height: 100%; border-radius: 99px; background: var(--grad); }

@media (max-width: 900px) { .insights { grid-template-columns: 1fr; } }

/* ==========================================================================
   NEW: dark theme
   ========================================================================== */
[data-theme="dark"] {
  --bg: #0b1020;
  --surface: #151b2e;
  --ink: #e6eaf5;
  --muted: #93a0c2;
  --line: #26304c;
  --grad-soft: linear-gradient(135deg, #1c2340, #241f45);
  --ok-bg: #06281f;
  --bad-bg: #331519;
  --warn-bg: #33260a;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.3), 0 1px 3px rgba(0,0,0,.4);
  --shadow-md: 0 6px 18px -4px rgba(0,0,0,.5);
  --track-bg: #232c46;
}
[data-theme="dark"] body { background: var(--bg); color: var(--ink); }
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #38436a; }
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #4a578a; }

[data-theme="dark"] .app-nav { background: rgba(17,22,40,.85); border-bottom-color: var(--line); }
[data-theme="dark"] .brand { color: var(--ink); }
[data-theme="dark"] .user-chip { background: #1c2440; border-color: var(--line); color: var(--muted); }
[data-theme="dark"] .theme-btn { background: #1c2440; }
[data-theme="dark"] .theme-btn:hover { background: #232c4e; color: #a5b4fc; border-color: #4f46e5; }

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select { background: #1a2138; border-color: var(--line); color: var(--ink); }
[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus { background: #1e2740; border-color: #6366f1; box-shadow: 0 0 0 4px rgba(99,102,241,.22); }
[data-theme="dark"] .form-control::placeholder { color: #6b769a; }
[data-theme="dark"] .form-label { color: var(--muted); }
[data-theme="dark"] .form-select option { background: #1a2138; color: var(--ink); }

[data-theme="dark"] .btn-ghost { background: #1c2440; border-color: var(--line); color: var(--muted); }
[data-theme="dark"] .btn-ghost:hover { background: #232c4e; color: #a5b4fc; border-color: #4f46e5; }
[data-theme="dark"] .btn-icon { color: #7c88ad; }
[data-theme="dark"] .btn-icon:hover { background: #232c4e; color: #a5b4fc; }
[data-theme="dark"] .btn-icon.danger:hover { background: #331519; color: #f87171; }

[data-theme="dark"] .page-sub { color: var(--muted); }

/* dashboard dark */
[data-theme="dark"] .stat-card,
[data-theme="dark"] .panel,
[data-theme="dark"] .insight-card { background: var(--surface); border-color: var(--line); }
[data-theme="dark"] .stat-card .num,
[data-theme="dark"] .big-metric { color: var(--ink); }
[data-theme="dark"] .panel-toolbar { border-bottom-color: var(--line); }
[data-theme="dark"] .forms-table thead th { background: #12182b; color: #7c88ad; border-bottom-color: var(--line); }
[data-theme="dark"] .forms-table tbody td { border-bottom-color: #1e2740; }
[data-theme="dark"] .forms-table tbody tr:hover { background: #1a2138; }
[data-theme="dark"] .avatar { background: #232c4e; border-color: #35406a; color: #a5b4fc; }
[data-theme="dark"] .student-cell .nm { color: var(--ink); }
[data-theme="dark"] .choices-pill .cnt { color: var(--muted); }
[data-theme="dark"] .choices-pill .bar { background: #232c46; }
[data-theme="dark"] .bar-row .bl { color: var(--muted); }
[data-theme="dark"] .score-chip { color: #a5b4fc; }
[data-theme="dark"] .empty-state .art { background: #1c2340; color: #a5b4fc; }

/* modal dark */
[data-theme="dark"] .modal-content { background: var(--surface); color: var(--ink); }
[data-theme="dark"] .modal-header, [data-theme="dark"] .modal-footer { border-color: var(--line); }
[data-theme="dark"] .btn-close { filter: invert(1) grayscale(1) brightness(1.6); }
[data-theme="dark"] kbd { background: #232c46; color: #c7d2fe; border-color: #38436a; }
[data-theme="dark"] .shortcut-row { border-color: var(--line); }
[data-theme="dark"] .shortcut-row .desc { color: var(--ink); }

/* editor dark */
[data-theme="dark"] .editor-head,
[data-theme="dark"] .grades-card,
[data-theme="dark"] .slots-card,
[data-theme="dark"] .search-panel { background: var(--surface); border-color: var(--line); }
[data-theme="dark"] .g-field label { color: var(--muted); }
[data-theme="dark"] .g-field input { background: #1a2138; border-color: var(--line); color: var(--ink); }
[data-theme="dark"] .g-field input:focus { background: #1e2740; border-color: #6366f1; }
[data-theme="dark"] .g-field.g-opt input { background: #201d3f; border-color: #4a3f86; }
[data-theme="dark"] .calc-box { background: #11172a; border-color: var(--line); }
[data-theme="dark"] .calc-table td { border-top-color: #222b45; color: var(--ink); }
[data-theme="dark"] .calc-table td:first-child { color: var(--muted); }
[data-theme="dark"] .calc-table td:not(:first-child) { color: var(--ink); }

[data-theme="dark"] .slot { background: #1a2138; }
[data-theme="dark"] .slot:focus-within { background: #1e2740; border-color: #6366f1; }
[data-theme="dark"] .slot.ok  { background: #10241d; }
[data-theme="dark"] .slot.bad { background: #2a1418; }
[data-theme="dark"] .slot.dup, [data-theme="dark"] .slot.warn { background: #2a2109; }
[data-theme="dark"] .slot-n { background: #262f4c; color: #9aa6cc; }
[data-theme="dark"] .slot.ok .slot-n { background: #0d3b2c; color: #6ee7b7; }
[data-theme="dark"] .slot-code { background: #0f1526; border-color: #313b5c; color: var(--ink); }
[data-theme="dark"] .slot-name .un { color: var(--muted); }
[data-theme="dark"] .min-chip { background: #262f4c; color: #9aa6cc; }
[data-theme="dark"] .slot-move button:hover { background: #232c4e; color: #a5b4fc; }

[data-theme="dark"] .sp-title { color: var(--ink); }
[data-theme="dark"] .track-chips, [data-theme="dark"] .sp-actions { border-color: var(--line); }
[data-theme="dark"] .track-chip { background: #1c2440; border-color: var(--line); color: var(--muted); }
[data-theme="dark"] .sp-action { background: #1c2440; border-color: var(--line); color: var(--muted); }
[data-theme="dark"] .sp-action:hover { background: #232c4e; color: #a5b4fc; border-color: #4f46e5; }
[data-theme="dark"] .dept-item:hover { background: #1e2740; }
[data-theme="dark"] .dept-item .code { background: #232c4e; color: #a5b4fc; }
[data-theme="dark"] .dept-item .info .nm { color: var(--ink); }
[data-theme="dark"] .dept-item .add { background: #232c4e; color: #a5b4fc; }
[data-theme="dark"] .dept-item .sc { background: #0d3b2c; color: #6ee7b7; }
[data-theme="dark"] .dept-item .sc.scp { background: #241a4d; color: #c4b5fd; }
[data-theme="dark"] .dept-item .sc.sce { background: #0c2c3f; color: #7dd3fc; }
[data-theme="dark"] .variant-badge.vp { background: #241a4d; color: #c4b5fd; }
[data-theme="dark"] .variant-badge.ve { background: #0c2c3f; color: #7dd3fc; }
[data-theme="dark"] .badge-track-zansti { background: #232c4e; color: #a5b4fc; }
[data-theme="dark"] .badge-track-adabi  { background: #3a1f30; color: #f9a8d4; }
[data-theme="dark"] .badge-track-gshti  { background: #3a2c08; color: #fcd34d; }
[data-theme="dark"] .prob-tag.none { background: #232c46; color: #94a3c4; }
[data-theme="dark"] .prob-tag.safe { background: #0d3b2c; color: #6ee7b7; }
[data-theme="dark"] .prob-tag.edge { background: #3a2c08; color: #fcd34d; }
[data-theme="dark"] .prob-tag.reach { background: #3a1418; color: #fca5a5; }
[data-theme="dark"] .prob-legend { border-top-color: var(--line); color: var(--muted); }
[data-theme="dark"] .voc-warn { background: #33260a; color: #fcd34d; border-color: #4d3b12; }

/* ==========================================================================
   NEW: department detail modal + info affordance
   ========================================================================== */
.dd-name { font-weight: 800; font-size: 1.05rem; }
.dd-sub { color: var(--muted); font-size: .82rem; margin-top: .1rem; }
.dd-meta { display: flex; flex-wrap: wrap; gap: .35rem; margin: .7rem 0; }
.dd-final { background: var(--grad-soft); border: 1px solid var(--line); border-radius: 12px; padding: .6rem .8rem; font-weight: 700; font-size: .9rem; }
.dd-table { width: 100%; border-collapse: collapse; margin-top: .8rem; }
.dd-table th { font-size: .72rem; font-weight: 800; color: #98a2b3; text-align: right; padding: .35rem .5rem; border-bottom: 1px solid var(--line); }
.dd-table td { font-size: .85rem; padding: .45rem .5rem; border-bottom: 1px solid var(--line); font-weight: 600; }
.dd-table td:nth-child(2) { font-family: Consolas, monospace; font-weight: 800; direction: ltr; }
.dd-table .dd-na { color: var(--muted); font-size: .78rem; font-weight: 600; }

.dept-item .dd-info {
  flex: none;
  width: 22px; height: 22px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #98a2b3; font-size: .95rem;
  cursor: pointer;
}
.dept-item .dd-info:hover { background: #eef2ff; color: var(--brand-1); }
.slot-name { cursor: default; }
.slot.ok .slot-name, .slot.dup .slot-name, .slot.warn .slot-name { cursor: pointer; }

[data-theme="dark"] .dd-sub { color: var(--muted); }
[data-theme="dark"] .dd-final { background: #1c2340; border-color: var(--line); }
[data-theme="dark"] .dd-table th, [data-theme="dark"] .dd-table td { border-bottom-color: var(--line); }
[data-theme="dark"] .dept-item .dd-info:hover { background: #232c4e; color: #a5b4fc; }

/* department weights in detail modal */
.dd-weights { margin-top: .7rem; }
.dd-wlabel { font-size: .74rem; font-weight: 700; color: var(--muted); margin-bottom: .4rem; }
.wchip {
  display: inline-flex; align-items: center; gap: .3em;
  background: #ede9fe; color: #5b21b6;
  border-radius: 8px; padding: .22em .55em; margin: 0 0 .35rem .35rem;
  font-size: .74rem; font-weight: 700;
}
.wchip b { font-family: Consolas, monospace; font-size: .85rem; color: #6d28d9; }
[data-theme="dark"] .wchip { background: #2a1f4d; color: #c4b5fd; }
[data-theme="dark"] .wchip b { color: #d8c9ff; }
.dd-wformula { font-size: .72rem; font-weight: 700; color: var(--muted); margin-top: .25rem; }
/* کۆنمرەی گشتی پێش کێشی بەشەکە */
.dd-base { display: block; font-size: .72rem; font-weight: 600; color: var(--muted); margin-top: .3rem; }

/* ــ تێبینی: ئەم نمرەیە تەنها بۆ قوتابیانی ئەو پارێزگایەیە ــ */
.provonly-note {
  display: block; margin-top: .12rem;
  font-size: .66rem; font-weight: 700; line-height: 1.35;
  color: #b45309;
}
.dd-provonly {
  margin: .6rem 0;
  background: #fffbeb; border: 1px solid #fcd34d; border-radius: 10px;
  padding: .5rem .7rem;
  font-size: .78rem; font-weight: 700; color: #92400e;
}
.provonly-star { color: #b45309; font-weight: 800; cursor: help; }
/* نمرەی پارێزگای بەشێکی تر — بە هێڵی ژێرەوەی وردە جیادەکرێتەوە */
.sc.sc-provonly, .min-chip.sc-provonly {
  outline: 1px dashed #f59e0b; outline-offset: -1px;
}
[data-theme="dark"] .provonly-note, [data-theme="dark"] .provonly-star { color: #fbbf24; }
[data-theme="dark"] .dd-provonly { background: #3a2c0c; border-color: #a16207; color: #fde68a; }

/* ــ یاریدەدەری ناوچەی بەڕێوەبردن ــ */
.muted { color: var(--muted); }
.alert-line { padding: .75rem 1rem; border-radius: 12px; font-size: .86rem; font-weight: 600; margin: .85rem 0; border: 1px solid transparent; }
.alert-line.ok { color: #0a7a3f; background: #e7f8ee; border-color: #bff0d4; }
.alert-line.err { color: #b42318; background: #fdecea; border-color: #f8ccc6; }
.tok { font-size: .78rem; background: #f2f4fb; padding: .15rem .45rem; border-radius: 6px; color: #475467; }
[data-theme="dark"] .alert-line.ok { color: #6ee7b0; background: #10321f; border-color: #1c5136; }
[data-theme="dark"] .alert-line.err { color: #fca5a5; background: #3a1416; border-color: #63201f; }
[data-theme="dark"] .tok { background: #232840; color: #b6bfda; }

/* ــ فوتەری تینات ــ */
.app-footer {
  text-align: center; color: var(--muted);
  font-size: .82rem; padding: 1.5rem 1rem 2rem;
  margin-top: 1rem; border-top: 1px solid var(--line);
}
.logo-preview {
  width: 64px; height: 64px; border-radius: 14px; object-fit: contain;
  background: var(--grad-soft); border: 1px solid var(--line); padding: 6px;
}

/* ــ نیشانەی ساڵی داتا ــ */
.year-badge {
  display: inline-block; margin-inline-start: .4rem;
  font-size: .72rem; font-weight: 700; color: var(--brand-1);
  background: var(--grad-soft); border: 1px solid #e4e4ff;
  padding: .12rem .55rem; border-radius: 99px; vertical-align: middle;
}
[data-theme="dark"] .year-badge { background: #232a49; border-color: #33406e; color: #c4b5fd; }

/* ــ هەڵبژاردنی شێوازی چاپ لە ڕێکخستنەکان ــ */
.layout-opt {
  display: inline-flex; align-items: center; gap: .4rem;
  border: 1.5px solid var(--line); border-radius: 12px;
  padding: .45rem .9rem; cursor: pointer;
  font-size: .84rem; font-weight: 600; user-select: none;
  transition: border-color .12s, background .12s;
}
.layout-opt:hover { border-color: var(--brand-1); }
.layout-opt.on { border-color: var(--brand-1); background: var(--grad-soft); color: var(--brand-1); }
.layout-opt input { accent-color: var(--brand-1); }
[data-theme="dark"] .layout-opt.on { background: #232a49; }

/* ==========================================================================
   مۆبایل — چاکسازی گشتی بۆ شاشە بچووکەکان
   ========================================================================== */
@media (max-width: 576px) {
  /* ناڤیگەیشنی سەرەوە: بچووکتر و بێ ژێرناونیشان */
  .app-nav .inner { padding-block: .5rem; }
  .brand img { width: 34px; height: 34px; border-radius: 10px; }
  .brand .t1 { font-size: .92rem; }
  .brand .t2 { display: none !important; } /* d-block ی بووتستراپ !important ـە */
  .page-title { font-size: 1.3rem; }

  /* شریتی پاشەکەوت: پەستێنراو بۆ مۆبایل */
  .save-bar {
    gap: .4rem;
    padding: .4rem .5rem;
    bottom: 10px;
    max-width: calc(100vw - 12px);
  }
  .save-bar .btn-dark-ghost { padding: .45rem .55rem; font-size: .78rem; }
  .save-bar .btn-brand { padding: .45rem .8rem; font-size: .82rem; white-space: nowrap; }
  .save-bar .count { font-size: .72rem; }

  /* خشتەکانی ناو پانێڵ بە نەرمی ڕادەکشێن */
  .panel [style*="overflow-x"] { -webkit-overflow-scrolling: touch; }
  .panel-toolbar { flex-wrap: wrap; gap: .5rem; }

  /* فۆرمە ناوخۆییەکانی خشتەی بەڕێوەبردن (سنوورەکان/ساڵ) با نەشکێن */
  .forms-table td form { flex-wrap: nowrap; }

  /* مۆداڵەکان: مەودای لاتەنیشت */
  .modal-dialog { margin: .75rem; }
}

@media (max-width: 400px) {
  .save-bar .bar { display: none; }
  .theme-btn { width: 36px; height: 36px; }
}

/* ==========================================================================
   شێوازەکانی پیشاندانی هەڵبژاردەکان (٢ ستوون / ڕیز / کارت) + ڕاکێشان
   ========================================================================== */
/* ٢ ستوون: ڕیزبەندی ستوونی (1..نیوە لە ستوونی یەکەم) — minmax(0,1fr) ڕێ لە فراوانبوون دەگرێت */
.slots-wrap.view-2col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(var(--half, 25), auto);
  grid-auto-flow: column;
  gap: .35rem 1.1rem;
}
.slots-wrap.view-rows {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .35rem;
}

.slots-wrap.view-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: .6rem;
}
.view-cards .slot {
  flex-wrap: wrap;
  align-items: center;
  row-gap: .4rem;
  padding: .55rem .65rem .65rem;
}
.view-cards .slot-drag  { order: 1; }
.view-cards .slot-n     { order: 2; }
.view-cards .slot-clear { order: 3; margin-inline-start: auto; }
/* min-width:0 گرنگە — بەبێ ئەو، ناوی درێژی بەش کارتەکە فراوان دەکات (grid blowout) */
.view-cards .slot       { min-width: 0; }
.view-cards .slot-code  { order: 4; flex: 1 1 100%; width: 100%; min-width: 0; }
.view-cards .slot-name  { order: 5; flex-basis: 100%; min-width: 0; }
.view-cards .slot-name .nm,
.view-cards .slot-name .un { white-space: normal; overflow: visible; }

/* دەسکی ڕاکێشان (⠿) */
.slot-drag {
  flex: none;
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  color: #a7b0c8;
  font-size: .95rem;
  line-height: 1;
  padding: .35rem .2rem;
  border-radius: 7px;
  transition: color .12s, background .12s;
}
.slot-drag:hover { color: var(--brand-1); background: #eef2ff; }
.slot-drag:active { cursor: grabbing; }
.slot.drag-src { opacity: .45; }
.slot.drop-target {
  outline: 2px dashed var(--brand-1);
  outline-offset: -2px;
  background: #eef2ff;
}
.drag-ghost {
  position: fixed;
  z-index: 3000;
  pointer-events: none;
  background: rgba(17, 24, 39, .95);
  color: #fff;
  padding: .4rem .8rem;
  border-radius: 10px;
  font-size: .78rem;
  font-weight: 600;
  box-shadow: 0 14px 34px -10px rgba(2, 6, 23, .6);
  max-width: 250px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.dragging-slot { cursor: grabbing; }
body.dragging-slot * { cursor: grabbing !important; }

/* گۆڕەری شێواز */
.view-switch {
  display: inline-flex;
  gap: .15rem;
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: .16rem;
  background: var(--surface);
}
.vs-btn {
  border: none;
  background: transparent;
  color: #8a94ad;
  width: 32px; height: 30px;
  border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background .12s, color .12s;
}
.vs-btn:hover { color: var(--brand-1); }
.vs-btn.active { background: var(--grad-soft); color: var(--brand-1); }
.vs-btn .icon { width: 17px; height: 17px; }

/* مۆبایل: هەموو شێوازەکان یەک ستوون دەبن */
@media (max-width: 900px) {
  .slots-wrap.view-2col {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    grid-auto-flow: row;
  }
}
@media (max-width: 576px) {
  .slots-wrap.view-cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 420px) {
  .slots-wrap.view-cards { grid-template-columns: 1fr; }
}

/* تاریک */
[data-theme="dark"] .slot-drag:hover { background: #232a49; }
[data-theme="dark"] .slot.drop-target { background: #232a49; }
[data-theme="dark"] .vs-btn.active { background: #232a49; }

/* ==========================================================================
   پشتگیری — تیکەت و گفتوگۆ
   ========================================================================== */
.tk-st, .tk-pr {
  display: inline-block;
  padding: .14em .6em;
  border-radius: 99px;
  font-size: .72rem;
  font-weight: 700;
  vertical-align: middle;
}
.st-open     { background: #e0edff; color: #1d4ed8; }
.st-answered { background: #e7f8ee; color: #0a7a3f; }
.st-closed   { background: #eef0f5; color: #667085; }
.pr-low    { background: #eef0f5; color: #667085; }
.pr-normal { background: #eef2ff; color: #4338ca; }
.pr-high   { background: #fef3c7; color: #b45309; }
.pr-urgent { background: #fdecea; color: #b42318; }

.ticket-thread { padding: 1.1rem; display: flex; flex-direction: column; gap: .7rem; }
.tk-msg {
  max-width: 78%;
  border-radius: 14px;
  padding: .6rem .85rem .65rem;
}
.tk-msg.from-user  { background: #eef2ff; border: 1px solid #dfe3ff; align-self: flex-start; }
.tk-msg.from-staff { background: #e7f8ee; border: 1px solid #c9eeda; align-self: flex-end; }
.tk-meta { font-size: .68rem; color: var(--muted); display: flex; gap: .6rem; flex-wrap: wrap; margin-bottom: .25rem; }
.tk-meta b { color: var(--ink); }
.tk-body { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .88rem; line-height: 1.65; }
.tk-reply { display: flex; flex-direction: column; gap: .6rem; margin-top: .4rem; border-top: 1px dashed var(--line); padding-top: .95rem; }
.tk-reply .btn-brand { align-self: flex-start; }
.tk-closed-note {
  text-align: center; color: var(--muted); font-size: .8rem;
  background: #f6f7fb; border-radius: 10px; padding: .55rem;
}
.nav-badge {
  background: #ef4444; color: #fff;
  font-size: .62rem; font-weight: 800;
  border-radius: 99px; padding: .12em .5em;
  margin-inline-start: .3rem;
  vertical-align: middle;
}

@media (max-width: 576px) {
  .tk-msg { max-width: 94%; }
  .ticket-thread { padding: .8rem; }
}

[data-theme="dark"] .st-open     { background: #172a54; color: #93b4ff; }
[data-theme="dark"] .st-answered { background: #10321f; color: #6ee7b0; }
[data-theme="dark"] .st-closed   { background: #232840; color: #93a0c2; }
[data-theme="dark"] .pr-low    { background: #232840; color: #93a0c2; }
[data-theme="dark"] .pr-normal { background: #232a49; color: #a5b4fc; }
[data-theme="dark"] .pr-high   { background: #332608; color: #fbbf24; }
[data-theme="dark"] .pr-urgent { background: #3a1416; color: #fca5a5; }
[data-theme="dark"] .tk-msg.from-user  { background: #1c2340; border-color: #2b355c; }
[data-theme="dark"] .tk-msg.from-staff { background: #10321f; border-color: #1c5136; }
[data-theme="dark"] .tk-closed-note { background: #1c2340; }

/* ==========================================================================
   تابەکانی ئێدیتەر + فلتەری بەشەکان (تابی دووەم)
   ========================================================================== */
.editor-tabs {
  display: flex; gap: .4rem; flex-wrap: wrap;
  margin: 0 0 1rem;
  border-bottom: 1px solid var(--line);
}
.etab {
  display: inline-flex; align-items: center; gap: .4rem;
  background: transparent; border: none;
  border-bottom: 2.5px solid transparent;
  color: var(--muted); font-family: var(--font);
  font-weight: 700; font-size: .9rem;
  padding: .6rem .9rem; margin-bottom: -1px;
  cursor: pointer; transition: color .14s, border-color .14s;
}
.etab .icon { width: 1.05em; height: 1.05em; }
.etab:hover { color: var(--ink); }
.etab.active { color: var(--brand-1); border-bottom-color: var(--brand-1); }

.tab-pane { display: none; }
.tab-pane.active { display: block; animation: rise .35s ease both; }

.filter-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 1.2rem;
}
.filter-head { margin-bottom: 1rem; }
.filter-head .sp-title .icon { color: var(--brand-1); }

.filter-controls { display: flex; flex-wrap: wrap; gap: .8rem; margin-bottom: .9rem; }
.fc-group { display: flex; flex-direction: column; gap: .3rem; min-width: 160px; }
.fc-group .form-label { margin: 0; }
.fc-grow { flex: 1 1 200px; }
.fc-range { display: flex; align-items: center; gap: .4rem; }
.fc-range .form-control { width: 90px; text-align: center; }
.fc-dash { color: var(--muted); font-weight: 700; }

.mode-chips { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: .9rem; }
.mode-chip {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 999px; color: var(--muted);
  font-family: var(--font); font-weight: 700; font-size: .8rem;
  padding: .32em .95em; cursor: pointer; transition: all .14s;
}
.mode-chip:hover { border-color: var(--brand-1); color: var(--brand-1); }
.mode-chip.active { background: var(--grad); color: #fff; border-color: transparent; box-shadow: 0 6px 14px -6px rgba(99,102,241,.6); }

.filter-toolbar { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: .6rem; }

.filter-results {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem;
  max-height: 460px; overflow-y: auto; padding: .2rem;
}
.flt-item {
  display: flex; align-items: center; gap: .55rem;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 12px; padding: .5rem .6rem;
  cursor: pointer; margin: 0; transition: background .12s, border-color .12s;
}
.flt-item:hover { background: var(--grad-soft); border-color: #c7d2fe; }
.flt-item.is-checked { border-color: #6ee7b7; background: var(--ok-bg); }
.flt-cb { width: 18px; height: 18px; flex: none; accent-color: var(--brand-1); cursor: pointer; }
.flt-item .code {
  flex: none; min-width: 42px; text-align: center;
  font-family: 'Consolas', monospace; font-weight: 800; font-size: .8rem;
  color: var(--brand-1); background: var(--grad-soft);
  border-radius: 8px; padding: .15rem .3rem;
}
.flt-item .info { flex: 1; min-width: 0; line-height: 1.3; }
.flt-item .info .nm { font-size: .8rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.flt-item .info .un { font-size: .68rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

@media (max-width: 720px) {
  .filter-results { grid-template-columns: 1fr; max-height: none; }
  .fc-group { min-width: 130px; }
}

[data-theme="dark"] .flt-item:hover { background: #1a2138; border-color: #38436a; }
[data-theme="dark"] .flt-item.is-checked { background: #10321f; border-color: #1c5136; }

/* ============ جۆری خوێندن — ڕەنگی مۆدەکان (زانکۆلاین=شین، پارالێڵ=سەوز، ئێواران=سوور) ============ */
:root {
  --mz-bg: #e0f2fe; --mz-bd: #7dd3fc; --mz-fg: #0369a1;   /* زانکۆلاین / ئاسایی — شین */
  --mp-bg: #dcfce7; --mp-bd: #86efac; --mp-fg: #15803d;   /* پارالێڵ — سەوز */
  --me-bg: #fee2e2; --me-bd: #fca5a5; --me-fg: #b91c1c;   /* ئێواران — سوور کاڵ */
}
.sc.mode-z, .variant-badge.mode-z { background: var(--mz-bg); color: var(--mz-fg); }
.sc.mode-p, .variant-badge.mode-p { background: var(--mp-bg); color: var(--mp-fg); }
.sc.mode-e, .variant-badge.mode-e { background: var(--me-bg); color: var(--me-fg); }

/* تینتی پاشبنەمای خانەکان بەپێی مۆد (دوای .ok بۆ سەرکەوتن) */
.slot.mode-z { background: var(--mz-bg); box-shadow: inset 3px 0 0 var(--mz-bd); }
.slot.mode-p { background: var(--mp-bg); box-shadow: inset 3px 0 0 var(--mp-bd); }
.slot.mode-e { background: var(--me-bg); box-shadow: inset 3px 0 0 var(--me-bd); }
.slot.mode-z.p-safe { box-shadow: inset 3px 0 0 var(--mz-bd), inset -3px 0 0 #10b981; }
.slot.mode-p.p-safe { box-shadow: inset 3px 0 0 var(--mp-bd), inset -3px 0 0 #10b981; }
.slot.mode-e.p-safe { box-shadow: inset 3px 0 0 var(--me-bd), inset -3px 0 0 #10b981; }
.slot.mode-z.p-edge { box-shadow: inset 3px 0 0 var(--mz-bd), inset -3px 0 0 #f59e0b; }
.slot.mode-p.p-edge { box-shadow: inset 3px 0 0 var(--mp-bd), inset -3px 0 0 #f59e0b; }
.slot.mode-e.p-edge { box-shadow: inset 3px 0 0 var(--me-bd), inset -3px 0 0 #f59e0b; }
.slot.mode-z.p-reach { box-shadow: inset 3px 0 0 var(--mz-bd), inset -3px 0 0 #ef4444; }
.slot.mode-p.p-reach { box-shadow: inset 3px 0 0 var(--mp-bd), inset -3px 0 0 #ef4444; }
.slot.mode-e.p-reach { box-shadow: inset 3px 0 0 var(--me-bd), inset -3px 0 0 #ef4444; }

/* نمرەی قوتابی لە خانەکان */
.stu-chip {
  flex: none; font-size: .68rem; font-weight: 800; border-radius: 7px;
  padding: .12em .5em; background: #eef2ff; color: #4338ca;
}

/* نیشانەی لق (گشتی/زانستی/وێژەیی) */
.branch-badge { font-size: .6rem; font-weight: 800; border-radius: 6px; padding: .1em .45em; vertical-align: middle; }
.branch-badge.b-gshti { background: #fffbeb; color: #b45309; }
.branch-badge.b-zansti { background: #eef2ff; color: #4338ca; }
.branch-badge.b-adabi { background: #fdf2f8; color: #be185d; }

/* بەشە ناگونجاوەکان بەهۆی لق — پیشان دەدرێن بەڵام ناتوانرێت هەڵبژێردرێن */
.inelig-note { color: #b91c1c; font-size: .66rem; font-weight: 700; }
.dept-item.is-inelig, .flt-item.is-inelig { opacity: .62; background: repeating-linear-gradient(-45deg, #fef2f2, #fef2f2 6px, #fff 6px, #fff 12px); }
.dept-item.is-inelig { cursor: not-allowed; }
.dept-item.is-inelig .add { background: #fee2e2; color: #b91c1c; }
.flt-item.is-inelig { cursor: not-allowed; }
.slot.ineligible .slot-name .nm { text-decoration: line-through solid rgba(185,28,28,.55); }
.badge-inelig { background: #fee2e2; color: #b91c1c; }
.dd-table tr.mode-p td:first-child { box-shadow: inset 3px 0 0 var(--mp-bd); }
.dd-table tr.mode-e td:first-child { box-shadow: inset 3px 0 0 var(--me-bd); }
.dd-table tr.mode-z td:first-child { box-shadow: inset 3px 0 0 var(--mz-bd); }
.reg-hit { color: #15803d; font-weight: 800; }

/* گرووپی چیک-بۆکس بۆ شار/زانکۆ */
.chk-group { display: flex; flex-wrap: wrap; gap: .3rem .5rem; padding: .35rem .1rem; }
.chk-group-scroll { max-height: 122px; overflow-y: auto; border: 1px solid var(--line); border-radius: 10px; padding: .5rem; }
.flt-chk {
  display: inline-flex; align-items: center; gap: .32rem; margin: 0;
  background: var(--surface); border: 1px solid var(--line); border-radius: 999px;
  padding: .2em .7em; font-size: .76rem; font-weight: 700; color: var(--muted); cursor: pointer;
}
.flt-chk input { accent-color: var(--brand-1); cursor: pointer; }
.flt-chk:hover { border-color: var(--brand-1); color: var(--brand-1); }
.fc-wide { flex: 1 1 260px; min-width: 220px; }
.mode-chips-lbl { font-size: .8rem; font-weight: 800; color: var(--ink); align-self: center; margin-inline-end: .3rem; }
.mode-legend-ui { border-top: none; padding-top: 0; }
.mode-legend-ui .sw { display: inline-block; width: 14px; height: 14px; border-radius: 5px; border: 1px solid rgba(0,0,0,.08); vertical-align: -2px; }
.mode-legend-ui .sw.mode-z { background: var(--mz-bg); }
.mode-legend-ui .sw.mode-p { background: var(--mp-bg); }
.mode-legend-ui .sw.mode-e { background: var(--me-bg); }
.mode-chip.mc-z { border-color: var(--mz-bd); }
.mode-chip.mc-p { border-color: var(--mp-bd); }
.mode-chip.mc-e { border-color: var(--me-bd); }
.mode-chip.mc-z.active { background: linear-gradient(135deg,#0ea5e9,#2563eb); }
.mode-chip.mc-p.active { background: linear-gradient(135deg,#22c55e,#15803d); }
.mode-chip.mc-e.active { background: linear-gradient(135deg,#ef4444,#b91c1c); }

[data-theme="dark"] .sc.mode-z, [data-theme="dark"] .variant-badge.mode-z { background: #0c2c3f; color: #7dd3fc; }
[data-theme="dark"] .sc.mode-p, [data-theme="dark"] .variant-badge.mode-p { background: #0d3b2c; color: #6ee7b7; }
[data-theme="dark"] .sc.mode-e, [data-theme="dark"] .variant-badge.mode-e { background: #3a1418; color: #fca5a5; }
[data-theme="dark"] .slot.mode-z { background: #0c2233; }
[data-theme="dark"] .slot.mode-p { background: #0c2c20; }
[data-theme="dark"] .slot.mode-e { background: #2a1418; }
[data-theme="dark"] .stu-chip { background: #232c4e; color: #a5b4fc; }
[data-theme="dark"] .flt-chk { background: #1c2440; border-color: var(--line); color: var(--muted); }
[data-theme="dark"] .dept-item.is-inelig, [data-theme="dark"] .flt-item.is-inelig { background: #241417; }
[data-theme="dark"] .etab.active { color: #a5b4fc; border-bottom-color: #6366f1; }

/* ==========================================================================
   خشتەی دەستکاری بەشەکان (Grid) — دەستکاری ڕیز-بە-ڕیز
   ========================================================================== */

/* پارچەکانی تووڵامراز (تابەکانی دۆخ + مینوی ستوون) */
.seg { display: inline-flex; gap: .25rem; padding: .2rem; background: #f4f6fb; border: 1px solid var(--line); border-radius: 999px; }
.seg-btn {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .3rem .75rem; border-radius: 999px;
  font-size: .8rem; font-weight: 600; color: var(--muted); text-decoration: none;
  transition: all .15s; white-space: nowrap;
}
.seg-btn:hover { color: var(--brand-1); }
.seg-btn.on { background: var(--surface); color: var(--brand-1); box-shadow: var(--shadow-sm); }
.seg-btn .n { font-size: .72rem; background: rgba(79,70,229,.1); color: var(--brand-1); padding: .05rem .4rem; border-radius: 99px; font-weight: 700; }
.seg-btn.on .n { background: var(--brand-1); color: #fff; }

.col-menu { position: relative; }
.col-menu > summary { list-style: none; cursor: pointer; }
.col-menu > summary::-webkit-details-marker { display: none; }
.col-menu-pop {
  position: absolute; top: calc(100% + .4rem); inset-inline-end: 0; z-index: 40;
  width: 260px; max-height: 60vh; overflow-y: auto;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 14px; box-shadow: 0 18px 40px -12px rgba(2,6,23,.28);
  padding: .5rem;
}
.col-menu-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .3rem .4rem .5rem; border-bottom: 1px solid var(--line); margin-bottom: .35rem; }
.col-menu-head .lnk { background: none; border: none; color: var(--brand-1); font-size: .76rem; font-weight: 700; cursor: pointer; padding: .1rem .3rem; border-radius: 6px; }
.col-menu-head .lnk:hover { background: #eef2ff; }
.col-menu-list { display: grid; grid-template-columns: 1fr 1fr; gap: .1rem; }
.col-menu-item { display: flex; align-items: center; gap: .45rem; padding: .35rem .45rem; border-radius: 8px; font-size: .8rem; cursor: pointer; }
.col-menu-item:hover { background: #f6f7fb; }
.col-menu-item input { width: 15px; height: 15px; accent-color: var(--brand-1); flex: none; }

/* خشتەکە خۆی */
.grid-scroll { overflow: auto; max-height: 72vh; }
.dept-grid-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .82rem; }
.dept-grid-table thead th {
  position: sticky; top: 0; z-index: 5;
  background: #fafbff; color: #667085;
  font-size: .72rem; font-weight: 700; white-space: nowrap;
  padding: .55rem .5rem; text-align: start;
  border-bottom: 1px solid var(--line);
}
.dept-grid-table tbody td { padding: .18rem .3rem; border-bottom: 1px solid #f0f2f9; vertical-align: middle; }
.dept-grid-table tbody tr:hover { background: #f8f9ff; }

/* خانەکانی دەستکاری */
.gi {
  width: 100%; min-width: 60px;
  border: 1px solid transparent; background: transparent;
  padding: .32rem .45rem; border-radius: 7px;
  font: inherit; color: inherit; font-size: .82rem;
  transition: border-color .12s, background .12s;
}
.gi:hover { border-color: var(--line); }
.gi:focus { outline: none; border-color: var(--brand-1); background: var(--surface); box-shadow: 0 0 0 3px rgba(79,70,229,.12); }
.gi-code { width: 66px; font-weight: 700; }
.gi-num { width: 76px; }
.gi-sys { width: 72px; text-transform: uppercase; }
.gi-name { min-width: 200px; }
.gi-sel { min-width: 92px; cursor: pointer; }
.dept-grid-table .c-name { min-width: 210px; }
.dept-grid-table .c-act { white-space: nowrap; }
.dept-grid-table .c-updated { font-size: .72rem; white-space: nowrap; }

/* دۆخی ڕیز */
.dept-grid-table tr.dirty > td { background: #fffbeb; }
.dept-grid-table tr.dirty > td:first-child { box-shadow: inset 3px 0 0 #f59e0b; }
.dept-grid-table tr.row-error > td { background: var(--bad-bg); }
.dept-grid-table tr.row-error > td:first-child { box-shadow: inset 3px 0 0 var(--bad); }
.dept-grid-table tr.row-new > td { background: #eff6ff; }

/* پێت (badge)ی دۆخ */
.rev-badge { display: inline-block; padding: .15rem .5rem; border-radius: 99px; font-size: .7rem; font-weight: 700; white-space: nowrap; }
.rev-badge.on { color: #0a7a3f; background: #e7f8ee; }
.rev-badge.off { color: #92600a; background: #fef3c7; }
.rev-badge.new { color: #1d4ed8; background: #dbeafe; }
.rev-badge.changed { color: #b45309; background: #fef3c7; }

@media (max-width: 720px) {
  .seg { flex-wrap: wrap; }
  .col-menu-pop { inset-inline-end: auto; inset-inline-start: 0; }
}

/* دۆخی تاریک */
[data-theme="dark"] .seg { background: #12182b; border-color: var(--line); }
[data-theme="dark"] .seg-btn.on { background: #1a2138; }
[data-theme="dark"] .col-menu-pop { background: #12182b; border-color: var(--line); }
[data-theme="dark"] .col-menu-item:hover { background: #1a2138; }
[data-theme="dark"] .col-menu-head .lnk:hover { background: #232c4e; }
[data-theme="dark"] .dept-grid-table thead th { background: #12182b; color: #7c88ad; border-bottom-color: var(--line); }
[data-theme="dark"] .dept-grid-table tbody td { border-bottom-color: #1e2740; }
[data-theme="dark"] .dept-grid-table tbody tr:hover { background: #1a2138; }
[data-theme="dark"] .gi:hover { border-color: #2b355c; }
[data-theme="dark"] .gi:focus { background: #0e1424; border-color: #6366f1; }
[data-theme="dark"] .dept-grid-table tr.dirty > td { background: #2a2410; }
[data-theme="dark"] .dept-grid-table tr.row-new > td { background: #10203f; }
[data-theme="dark"] .dept-grid-table tr.row-error > td { background: #3a1416; }
[data-theme="dark"] .rev-badge.on { color: #6ee7b0; background: #10321f; }
[data-theme="dark"] .rev-badge.off { color: #fbbf24; background: #332608; }
[data-theme="dark"] .rev-badge.new { color: #93b4ff; background: #172a54; }
[data-theme="dark"] .rev-badge.changed { color: #fbbf24; background: #332608; }

/* ==========================================================================
   ئامرازە خێراکان + ئاگادارکردنەوەکان + ناڤیگەیشنی خوارەوە
   ========================================================================== */
.qt-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .8rem;
  margin-top: 1rem;
}
.qt-card {
  display: flex; align-items: center; gap: .8rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: .9rem 1rem;
  text-decoration: none;
  color: var(--ink);
  box-shadow: var(--shadow-sm);
  transition: transform .15s, box-shadow .15s, border-color .15s;
  min-width: 0;
}
.qt-card:hover { transform: translateY(-2px); border-color: var(--brand-1); color: var(--ink); box-shadow: var(--shadow-md); }
.qt-ico {
  width: 42px; height: 42px; flex: none;
  border-radius: 12px;
  background: var(--grad-soft);
  color: var(--brand-1);
  display: flex; align-items: center; justify-content: center;
}
.qt-t { font-weight: 800; font-size: .9rem; }
.qt-s { font-size: .72rem; color: var(--muted); }

.ann-card {
  display: flex; align-items: flex-start; gap: .7rem;
  background: var(--grad-soft);
  border: 1px solid #dfe3ff;
  border-radius: var(--radius);
  padding: .8rem 1rem;
  margin: .5rem 0;
}
.ann-ico { color: var(--brand-1); margin-top: .15rem; flex: none; }
.ann-t { flex: 1; }
.ann-t .page-sub { margin-top: .15rem; }
.ann-close {
  border: none; background: transparent; color: var(--muted);
  font-size: 1.1rem; line-height: 1; cursor: pointer;
  padding: .1rem .3rem; border-radius: 7px; flex: none;
}
.ann-close:hover { background: rgba(0,0,0,.06); color: var(--ink); }

/* ناڤیگەیشنی خوارەوە — تەنها مۆبایل */
.bottom-nav { display: none; }
@media (max-width: 576px) {
  .bottom-nav {
    display: flex;
    position: fixed;
    bottom: 0; right: 0; left: 0;
    z-index: 1025;
    background: rgba(255, 255, 255, .93);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-top: 1px solid var(--line);
    padding: .3rem .4rem calc(.3rem + env(safe-area-inset-bottom));
  }
  .bn-item {
    flex: 1;
    display: flex; flex-direction: column; align-items: center; gap: .12rem;
    text-decoration: none;
    color: #8a94ad;
    font-size: .62rem; font-weight: 700;
    padding: .3rem 0;
    border-radius: 10px;
    position: relative;
  }
  .bn-item .icon { width: 20px; height: 20px; }
  .bn-item:hover, .bn-item:focus { color: var(--brand-1); }
  .bn-dot {
    position: absolute; top: .2rem; inset-inline-end: 22%;
    width: 8px; height: 8px; border-radius: 50%;
    background: #ef4444; box-shadow: 0 0 0 2px #fff;
  }
  /* جێگە بۆ ناڤیگەیشنی خوارەوە */
  .page-wrap { padding-bottom: 5.6rem; }
  .qt-grid { grid-template-columns: 1fr; }
}
@media (min-width: 577px) and (max-width: 900px) {
  .qt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qt-card:last-child { grid-column: span 2; }
}

/* شاردنەوەی زانکۆ لە مۆبایل تەنها کاتێک ستوونی جیا هەیە */
.hide-lg-up { display: none; }
@media (max-width: 576px) {
  .hide-lg-up { display: block; }
}

[data-theme="dark"] .ann-card { border-color: #33406e; }
[data-theme="dark"] .ann-close:hover { background: rgba(255,255,255,.08); }
[data-theme="dark"] .bottom-nav { background: rgba(15, 20, 40, .93); border-top-color: var(--line); }
[data-theme="dark"] .bn-dot { box-shadow: 0 0 0 2px #151b2e; }

/* ==========================================================================
   لاپەڕەکەر + چاکسازی نوێی ڕووکار (فۆکەس، سەرپەڕەی چەسپاو، دۆخی ناردن)
   ========================================================================== */
.pager {
  display: flex; align-items: center; gap: .25rem; flex-wrap: wrap;
  padding: .85rem 1.25rem;
  border-top: 1px solid var(--line);
}
.pg {
  min-width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 .5rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--ink);
  font-size: .82rem; font-weight: 700;
  text-decoration: none;
  transition: background .12s, border-color .12s, color .12s;
}
.pg:hover { border-color: var(--brand-1); color: var(--brand-1); }
.pg.cur { background: var(--grad); border-color: transparent; color: #fff; }
.pg.off { opacity: .4; pointer-events: none; }
.pg-gap { color: var(--muted); padding: 0 .2rem; }
.pg-info { color: var(--muted); font-size: .78rem; margin-inline-start: auto; }

/* ــ فۆکەسی دیار بۆ کیبۆرد (پێشتر outline:none بوو بەبێ جێگرەوە) ــ */
:focus-visible {
  outline: 2px solid var(--brand-1);
  outline-offset: 2px;
  border-radius: 6px;
}
.btn:focus-visible, .btn-icon:focus-visible, .pg:focus-visible,
.vs-btn:focus-visible, .bn-item:focus-visible, .slot-drag:focus-visible {
  outline: 2px solid var(--brand-1);
  outline-offset: 2px;
}

/* ــ سەرپەڕەی چەسپاو بۆ خشتە درێژەکان ــ */
.table-responsive, .panel [style*="overflow-x"] { position: relative; }
.forms-table thead th {
  position: sticky; top: 0; z-index: 2;
}
[data-theme="dark"] .forms-table thead th { background: #1b2236; }

/* ــ دۆخی ناردن بۆ دوگمەکان ــ */
.btn[data-busy="1"] { opacity: .7; pointer-events: none; position: relative; }
.btn[data-busy="1"]::after {
  content: ''; width: 13px; height: 13px;
  border: 2px solid currentColor; border-top-color: transparent;
  border-radius: 50%;
  display: inline-block; margin-inline-start: .45rem;
  animation: zk-spin .7s linear infinite;
  vertical-align: -2px;
}
@keyframes zk-spin { to { transform: rotate(360deg); } }

/* ــ ڕیزی خشتە: ئاماژەی چالاکی باشتر ــ */
.forms-table tbody tr:hover { background: #f8f9ff; }
[data-theme="dark"] .forms-table tbody tr:hover { background: #1b2236; }

@media (max-width: 576px) {
  .pager { padding: .7rem .8rem; }
  .pg-info { width: 100%; margin: .35rem 0 0; }
}

/* ــ نیشانەی بارکردنی داتای بەشەکان لە دەستکاریکەری فۆرم ــ */
.depts-loading {
  display: flex; align-items: center; gap: .55rem;
  background: var(--grad-soft);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: .55rem .9rem;
  margin-bottom: .8rem;
  color: var(--muted);
  font-size: .82rem; font-weight: 600;
}
.zk-spinner {
  width: 14px; height: 14px; flex: none;
  border: 2px solid var(--brand-1); border-top-color: transparent;
  border-radius: 50%;
  animation: zk-spin .7s linear infinite;
}

/* ــ مینوی هەژمار لە ناڤیگەیشن ــ */
.user-chip { cursor: pointer; border: 1px solid var(--line); }
.user-chip:hover { border-color: var(--brand-1); color: var(--brand-1); }
.user-menu {
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow-md);
  padding: .35rem;
  min-width: 220px;
  background: var(--surface);
}
.user-menu .um-head {
  padding: .5rem .75rem .6rem;
  border-bottom: 1px solid var(--line);
  margin-bottom: .25rem;
  line-height: 1.35;
}
.user-menu .um-head b { display: block; font-size: .88rem; }
.user-menu .um-head span { font-size: .72rem; color: var(--muted); }
.user-menu .dropdown-item {
  display: flex; align-items: center; gap: .55rem;
  border-radius: 10px;
  padding: .5rem .75rem;
  font-size: .85rem; font-weight: 600;
  color: var(--ink);
}
.user-menu .dropdown-item:hover { background: var(--grad-soft); color: var(--brand-1); }
.user-menu .dropdown-item.danger:hover { background: var(--bad-bg); color: var(--bad); }
[data-theme="dark"] .user-menu { background: var(--surface); }
[data-theme="dark"] .user-menu .dropdown-item { color: var(--ink); }
[data-theme="dark"] .user-menu .dropdown-item:hover { background: #232a49; color: #a5b4fc; }

/* ــ یەکخستنی دیمەنی لیستە هەڵبژێردراوەکان ــ
   هەندێک ڤیو select ـەکان بە .form-control دەنووسن و هەندێک بە .form-select؛
   ئەمە وا دەکات هەردووکیان وەک یەک دەربکەون (تیری کەوتنە خوارەوە). */
select.form-control,
select.form-select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23667085' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: left .75rem center;
  background-size: 14px 10px;
  padding-left: 2.1rem;
}
[data-theme="dark"] select.form-control,
[data-theme="dark"] select.form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2393a0c2' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
select.form-control-sm { padding-block: .3rem; font-size: .8rem; }

/* ==========================================================================
   ڕیکلامەکان — شریتی جووڵاو / گۆڕانکاری / کارت
   ========================================================================== */
.ads-wrap {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  margin-bottom: 1rem;
}
.ads-head {
  display: flex; align-items: center; gap: .6rem;
  padding: .5rem .85rem;
  border-bottom: 1px solid var(--line);
  background: var(--grad-soft);
}
.ads-badge {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .72rem; font-weight: 800;
  color: var(--brand-1);
}
.ads-badge .icon { width: 15px; height: 15px; }
.ads-dots { display: flex; gap: .3rem; margin-inline-start: auto; }
.ads-dot {
  width: 7px; height: 7px; padding: 0;
  border: none; border-radius: 99px;
  background: #c7cbe0; cursor: pointer;
  transition: width .2s, background .2s;
}
.ads-dot.on { width: 18px; background: var(--brand-1); }
.ads-pause {
  margin-inline-start: auto;
  border: none; background: transparent; color: var(--muted);
  width: 26px; height: 26px; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.ads-dots + .ads-pause { margin-inline-start: .4rem; }
.ads-pause:hover { background: rgba(0,0,0,.06); color: var(--brand-1); }
.ads-view { overflow: hidden; }

/* ــ ڕیزی ڕیکلامەکان ــ */
.ads-track { display: flex; }
.ad-item {
  display: flex; align-items: center; gap: .75rem;
  border: none; background: transparent;
  text-align: start;
  padding: .7rem .9rem;
  cursor: pointer;
  min-width: 0;
  position: relative;
  transition: background .15s;
}
.ad-item::before {
  content: ''; position: absolute; inset-inline-start: 0; top: 12%; bottom: 12%;
  width: 3px; border-radius: 99px; background: var(--accent, var(--brand-1));
}
.ad-item:hover { background: var(--grad-soft); }
.ad-img {
  width: 54px; height: 54px; flex: none;
  border-radius: 12px; object-fit: cover;
  background: var(--grad-soft);
  border: 1px solid var(--line);
}
.ad-img-ph {
  display: flex; align-items: center; justify-content: center;
  color: var(--accent, var(--brand-1));
}
.ad-img-ph .icon { width: 22px; height: 22px; }
.ad-txt { min-width: 0; flex: 1; line-height: 1.35; }
.ad-title { display: block; font-weight: 800; font-size: .88rem; }
.ad-pin { color: #f59e0b; margin-inline-end: .15rem; }
.ad-sub {
  display: block; color: var(--muted); font-size: .76rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ad-more {
  flex: none; display: inline-flex; align-items: center; gap: .25rem;
  font-size: .72rem; font-weight: 700;
  color: var(--accent, var(--brand-1));
  opacity: .85;
}
.ad-more .icon { width: 13px; height: 13px; transform: scaleX(-1); }

/* ــ شێوازی ١: شریتی جووڵاو ــ */
.ads-ticker .ads-track {
  width: max-content;
  animation: ads-marquee var(--ads-speed, 30s) linear infinite;
}
.ads-ticker .ad-item { width: 340px; flex: none; }
.ads-ticker .ads-track:hover,
.ads-ticker.ads-paused .ads-track { animation-play-state: paused; }
@keyframes ads-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(50%); }   /* RTL: بۆ ڕاست دەجووڵێت */
}

/* ــ شێوازی ٢: گۆڕانکاری ــ */
.ads-carousel .ads-track { transition: transform .55s cubic-bezier(.4,0,.2,1); }
.ads-carousel .ad-item { width: 100%; flex: none; }

/* ــ شێوازی ٣: کارتەکان ــ */
.ads-cards .ads-view { padding: .35rem; }
.ads-cards .ads-track {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: .5rem;
}
.ads-cards .ad-item {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
}
.ads-cards .ad-item:hover { border-color: var(--accent, var(--brand-1)); }

/* ــ کەمکردنەوەی جووڵە ــ */
.ads-noanim .ads-track { animation: none !important; transition: none !important; }

/* ــ مۆداڵی وردەکاری ــ */
.ad-modal { border: none; border-radius: 20px; overflow: hidden; }
.ad-detail { position: relative; }
.ad-close {
  position: absolute; top: .6rem; inset-inline-end: .7rem; z-index: 3;
  width: 34px; height: 34px; border: none; border-radius: 50%;
  background: rgba(15,23,42,.55); color: #fff;
  font-size: 1.2rem; line-height: 1; cursor: pointer;
  backdrop-filter: blur(6px);
}
.ad-close:hover { background: rgba(15,23,42,.75); }
.ad-hero { max-height: 320px; overflow: hidden; background: var(--grad-soft); }
.ad-hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ad-detail-body { padding: 1.4rem 1.5rem 1.6rem; }
.ad-detail-head { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: .5rem; }
.ad-chip {
  font-size: .7rem; font-weight: 700; border-radius: 99px;
  padding: .18em .7em;
  background: var(--grad-soft); color: var(--accent, var(--brand-1));
}
.ad-chip.pinned { background: #fef3c7; color: #b45309; }
.ad-chip.date { background: #eef0f5; color: var(--muted); }
.ad-detail-title { font-weight: 800; margin: 0 0 .6rem; overflow-wrap: anywhere; }
.ad-detail-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.85; font-size: .92rem; }
.ad-loading { display: flex; align-items: center; gap: .5rem; padding: 2.5rem; justify-content: center; color: var(--muted); }

/* ــ پێشبینینی ڕیکلام لە پەڕەی بەڕێوەبردن ــ */
.ad-thumb {
  width: 64px; height: 64px; flex: none;
  border-radius: 12px; object-fit: cover;
  border: 1px solid var(--line); background: var(--grad-soft);
}

@media (max-width: 576px) {
  .ads-ticker .ad-item { width: 280px; }
  .ad-img { width: 46px; height: 46px; }
  .ad-more span { display: none; }
  .ad-detail-body { padding: 1.1rem 1rem 1.3rem; }
  .ad-hero { max-height: 200px; }
  .ads-cards .ads-track { grid-template-columns: 1fr; }
}

[data-theme="dark"] .ads-dot { background: #3a4468; }
[data-theme="dark"] .ads-pause:hover { background: rgba(255,255,255,.08); }
[data-theme="dark"] .ad-chip.pinned { background: #332608; color: #fbbf24; }
[data-theme="dark"] .ad-chip.date { background: #232840; color: #93a0c2; }

/* ==========================================================================
   داواکاری هەژمار — پەڕەی گشتی (قوتابی) + بەڕێوەبردنی نووسینگە
   ========================================================================== */

/* ــ دۆخەکان: هەمان شێوازی نیشانەی تیکەت ــ */
.st-pending  { background: #fef3c7; color: #b45309; }
.st-approved { background: #e7f8ee; color: #0a7a3f; }
.st-rejected { background: #fdecea; color: #b42318; }

/* ــ بەستەری بڵاوکردنەوە (لای نووسینگە) ــ */
.req-share {
  display: flex; flex-wrap: wrap; align-items: center; gap: .75rem;
  background: var(--grad-soft, #f4f6fb);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: .8rem 1rem;
  margin: .9rem 0 .4rem;
}
.req-share-main { display: flex; flex-direction: column; gap: .2rem; min-width: 0; flex: 1; }
.req-share-label { font-size: .72rem; font-weight: 800; color: var(--muted); }
.req-share-url {
  font-size: .84rem; font-weight: 700; color: var(--brand-1);
  overflow-wrap: anywhere; background: none; padding: 0;
}
.req-share-actions { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }

/* ــ ڕیزەکانی خشتەی داواکاری ــ */
.req-name { font-weight: 700; }
.req-sub { display: flex; flex-wrap: wrap; gap: .45rem; font-size: .72rem; color: var(--muted); margin-top: .15rem; }
.req-sub code { color: var(--brand-1); font-weight: 700; background: none; padding: 0; }
.req-note-inline {
  margin-top: .35rem; font-size: .76rem; color: var(--muted);
  border-inline-start: 3px solid var(--line); padding-inline-start: .5rem;
  overflow-wrap: anywhere;
}
.req-note-inline.admin { border-inline-start-color: #f0a; color: #b42318; }
.req-actions-cell { display: flex; gap: .35rem; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
/* دوگمەکان لە ناوەوە نەبڕدرێن — ئەگەرنا هەر دوگمەیەک ڕیزێکی خۆی دەگرێت.
   تەنها بۆ خشتەی داواکارییەکان — نەک هەموو forms-table ـەکان. */
.req-actions-cell .btn { white-space: nowrap; }
.req-table td:last-child { min-width: 15rem; }

/* ــ پەڕەی گشتی بۆ قوتابی ــ */
.req-wrap { max-width: 900px; margin: 0 auto; }
.req-card {
  background: var(--surface, #fff);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 1.4rem 1.35rem 1.6rem;
  box-shadow: var(--shadow-sm);
}
.req-card.req-center { text-align: center; }
.req-head { margin-bottom: .9rem; }
.req-section {
  display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap;
  font-weight: 800; font-size: .92rem;
  margin: 1.35rem 0 .7rem;
  padding-bottom: .4rem;
  border-bottom: 1px solid var(--line);
}
.req-section .page-sub { font-weight: 500; }
.req-star { color: #dc2626; }
.req-note {
  background: #eef2ff; border: 1px solid #dfe3ff; color: #3730a3;
  border-radius: 12px; padding: .65rem .85rem;
  font-size: .84rem; line-height: 1.6;
  white-space: pre-wrap; overflow-wrap: anywhere;
  margin-bottom: .9rem;
}
.req-captcha { display: flex; align-items: center; gap: .5rem; }
.req-captcha img { border-radius: 12px; border: 1.5px solid var(--line); background: #eef2ff; flex: none; }
.req-captcha .form-control { flex: 1; min-width: 90px; }
.req-actions { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1.4rem; }
.req-actions-center { justify-content: center; }
.req-hint { color: var(--muted); font-size: .84rem; line-height: 1.7; margin: .8rem 0 0; }

/* ــ پاش ناردن: کۆدی پشکنین ــ */
.req-icon-ok {
  width: 68px; height: 68px; margin: 0 auto .8rem;
  display: grid; place-items: center;
  border-radius: 22px; background: #e7f8ee; color: #0a7a3f;
}
.req-icon-ok .icon { width: 2.2em; height: 2.2em; }
.req-code-box {
  display: flex; align-items: center; justify-content: center; gap: .7rem; flex-wrap: wrap;
  background: #f4f6fb; border: 1px dashed var(--line);
  border-radius: 14px; padding: .9rem 1rem; margin: 1.1rem 0 .2rem;
}
.req-code-label { font-size: .74rem; font-weight: 800; color: var(--muted); }
.req-code { font-size: 1.35rem; font-weight: 800; letter-spacing: .08em; color: var(--brand-1); background: none; }

/* ــ پشکنینی دۆخ ــ */
.req-status-form { display: flex; gap: .6rem; flex-wrap: wrap; margin: 1rem 0 .8rem; }
.req-status-form .form-control { flex: 1; min-width: 200px; font-weight: 700; letter-spacing: .06em; }
.req-result { border: 1px solid var(--line); border-radius: 14px; padding: 1rem; margin-top: .9rem; }
.req-result-head { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }

@media (max-width: 576px) {
  .req-card { padding: 1.1rem .9rem 1.3rem; border-radius: 14px; }
  .req-share { flex-direction: column; align-items: stretch; }
  .req-share-actions { justify-content: flex-start; }
  .req-actions-cell { justify-content: flex-start; }
  .req-code { font-size: 1.15rem; }
}

[data-theme="dark"] .st-pending  { background: #3a2c07; color: #fbbf24; }
[data-theme="dark"] .st-approved { background: #0d2b1b; color: #6ee7a8; }
[data-theme="dark"] .st-rejected { background: #3a1517; color: #fca5a5; }
[data-theme="dark"] .req-note { background: #1c2340; border-color: #2c3557; color: #c7d2fe; }
[data-theme="dark"] .req-code-box { background: #12182b; }
[data-theme="dark"] .req-icon-ok { background: #0d2b1b; color: #6ee7a8; }
[data-theme="dark"] .req-captcha img { background: #1c2340; }

/* ==========================================================================
   دوگمەی گوزارشتی شنۆکراو + پۆلەکانی تیکەت
   ========================================================================== */

/* لای چەپی خوارەوە — شریتی پاشەکەوت (save-bar) لە ناوەڕاستە، بۆیە پێکەوە نانێن */
.report-fab {
  position: fixed;
  bottom: 18px; left: 18px;
  z-index: 1029;
  display: inline-flex; align-items: center; gap: .45rem;
  border: none;
  padding: .6rem .95rem;
  border-radius: 999px;
  background: var(--grad);
  color: #fff;
  font-family: inherit; font-weight: 800; font-size: .82rem;
  box-shadow: 0 10px 26px -8px rgba(79, 70, 229, .65);
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
}
.report-fab:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -8px rgba(79, 70, 229, .75); }
.report-fab:active { transform: translateY(0); }
.report-fab .icon { width: 1.15em; height: 1.15em; }

/* ــ پۆلەکان لەناو مۆداڵی گوزارشت ــ */
.report-cats { display: flex; flex-wrap: wrap; gap: .4rem; }
.report-cat {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .42rem .7rem;
  border: 1.5px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-family: inherit; font-size: .78rem; font-weight: 700;
  cursor: pointer;
  transition: border-color .15s, color .15s, background .15s;
}
.report-cat:hover { border-color: var(--brand-1); color: var(--brand-1); }
.report-cat.on { background: var(--brand-1); border-color: var(--brand-1); color: #fff; }
.report-cat .icon { width: 1em; height: 1em; }

/* ــ ئەو زانیارییەی خۆکار لەگەڵ گوزارشتەکەدا دەنێردرێت ــ */
.report-ctx {
  display: flex; align-items: center; gap: .4rem; flex-wrap: wrap;
  margin-top: .75rem;
  font-size: .73rem; color: var(--muted);
}
.report-ctx .icon { width: 1em; height: 1em; flex: none; }
.report-ctx code { color: var(--brand-1); font-weight: 700; background: none; overflow-wrap: anywhere; }

/* ــ کۆنتێکستی تیکەت لە پەڕەی وردەکاری ــ */
.tk-ctx {
  display: flex; flex-wrap: wrap; gap: .35rem 1rem;
  background: #f6f7fb; border: 1px solid var(--line);
  border-radius: 12px; padding: .55rem .8rem;
  margin: .7rem 0 0; font-size: .76rem;
}
.tk-ctx-item { display: inline-flex; align-items: center; gap: .35rem; min-width: 0; overflow-wrap: anywhere; }
.tk-ctx-item .icon { width: 1em; height: 1em; flex: none; }

/* ــ فلتەری پۆل لە لیستی بەڕێوەبەر ــ */
.tk-cats { display: flex; flex-wrap: wrap; gap: .35rem; border-top: 1px solid var(--line); }
.tk-cat {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .3rem .6rem; border-radius: 999px;
  font-size: .75rem; font-weight: 700;
  color: var(--muted); text-decoration: none;
  border: 1px solid transparent;
}
.tk-cat:hover { color: var(--brand-1); border-color: var(--line); }
.tk-cat.on { background: var(--brand-1); color: #fff; }
.tk-cat .icon { width: .95em; height: .95em; }
.tk-cat .n {
  font-size: .68rem; background: rgba(79, 70, 229, .12); color: var(--brand-1);
  padding: .02rem .35rem; border-radius: 99px;
}
.tk-cat.on .n { background: rgba(255, 255, 255, .25); color: #fff; }

@media (max-width: 576px) {
  /* ناڤیگەیشنی خوارەوە شوێنەکەی داگیر دەکات — دوگمەکە سەرەوەتر ببە */
  .report-fab { bottom: 74px; left: 12px; padding: .55rem .7rem; }
  .report-fab-label { display: none; }
}

/* :not(.on) گرنگە — ئەگەرنا ئەم ڕیزە (کە دواتر هاتووە و هاوتای تایبەتمەندی .report-cat.on ـە)
   ڕەنگی پۆلی هەڵبژێردراو دەشارێتەوە و بەکارهێنەر نازانێت کامەی هەڵبژاردووە */
[data-theme="dark"] .report-cat:not(.on) { background: #12182b; }
[data-theme="dark"] .report-cat:not(.on):hover { background: #1a2138; }
[data-theme="dark"] .tk-ctx { background: #12182b; }

/* ==========================================================================
   ناسنامەی «ڕێگای زانکۆ» — شریتی پێ + نیشانە
   ========================================================================== */

.app-footer { display: flex; flex-direction: column; align-items: center; gap: .75rem; }

.brand-credit { width: 100%; display: flex; justify-content: center; }
.brand-credit .bc-img { display: block; line-height: 0; width: 100%; max-width: 760px; opacity: .75; transition: opacity .15s; }
.brand-credit .bc-img:hover { opacity: 1; }
.brand-credit .bc-img img { width: 100%; height: auto; }
/* هەردوو ڕەنگاوڕەنگەکە دەنێردرێن، CSS ئەوەی گونجاو هەڵدەبژێرێت */
.brand-credit .on-dark { display: none; }
[data-theme="dark"] .brand-credit .on-light { display: none; }
[data-theme="dark"] .brand-credit .on-dark { display: block; }
/* دەقی جێگرەوە — تەنها لە شاشەی تەنگدا */
.brand-credit .bc-text { display: none; font-size: .74rem; color: var(--muted); }
.brand-credit .bc-text a { color: inherit; }

@media (max-width: 640px) {
  /* شریتی ١٩:١ لە مۆبایلدا نووسینەکەی ناخوێندرێتەوە — دەق جێگەی دەگرێتەوە */
  .brand-credit .bc-img { display: none; }
  .brand-credit .bc-text { display: inline; }
}

/* لە چاپدا شریتەکە پێویست نییە — مۆری گۆشە جێگەی دەگرێتەوە */
@media print { .app-footer { display: none !important; } }

/* ==========================================================================
   ڕووکاری مۆبایل — وا هەست پێبکرێت کە ئەپێکە، نەک پەڕەیەکی ماڵپەڕ
   ========================================================================== */

/* ــ بنەماکان (لەسەر هەموو قەبارەیەک) ــ */
html {
  -webkit-text-size-adjust: 100%;          /* سافاری دەقەکە گەورە ناکات لە چەرخاندنی شاشەدا */
  text-size-adjust: 100%;
}
body {
  -webkit-tap-highlight-color: rgba(79, 70, 229, .12);  /* لەبری کارتێکی ڕەشی بنەڕەت */
  overscroll-behavior-y: contain;          /* ڕاکێشانی زیادە پەڕەکە نالەقێنێت */
}
/* ژمارە و کۆدە درێژەکان پەڕەکە فراوان ناکەن */
code, .tok, .req-share-url { overflow-wrap: anywhere; }
/* ڕاکێشانی نەرم لە خشتە پانەکاندا */
.table-responsive, [style*="overflow-x"] { -webkit-overflow-scrolling: touch; }

@media (max-width: 640px) {
  /* ─────────────────────────────────────────────────────────────────
     ١) خانەکانی فۆرم دەبێت ١٦px بن.
     iOS خۆکار پەڕەکە زوم دەکات کاتێک خانەیەکی بچووکتر لە ١٦px هەڵدەبژێردرێت —
     ڕووکارەکە دەبازێت و بەکارهێنەر دەبێت بە دەست بیگەڕێنێتەوە. ئەمە لە پەڕەی
     داواکاری قوتابیدا (٢٠ خانە) و لە چوونەژوورەوەدا ڕوویدەدا.
     ───────────────────────────────────────────────────────────────── */
  .form-control, .form-select, input, select, textarea,
  .login-field input, .captcha-row input, .slot-code {
    font-size: 16px;
  }
  .form-control, .form-select { padding: .68rem .9rem; }
  /* لۆگۆی سەرەوە ــ بەستەرێکە بۆ ماڵەوە، بۆیە هەمان قەبارەی دەستلێدانی هەبێت */
  .lp-brand, .brand { min-height: 44px; }

  /* ─────────────────────────────────────────────────────────────────
     ٢) شوێنی دەستلێدان — لانیکەم ٤٤px بەرزی (ڕێنمایی iOS/Android).
     پێشتر دوگمەکان ٣٥–٣٨px و بەستەرەکان ٢١px بوون.
     ───────────────────────────────────────────────────────────────── */
  .btn, .lp-btn, .login-btn, .seg-btn, .layout-opt, .vs-btn {
    min-height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .btn-sm, .lp-btn.sm { min-height: 40px; }
  .btn-icon, .theme-btn, .lang-btn, .lang-pill, .captcha-refresh, .slot-clear {
    min-width: 44px; min-height: 44px;
  }
  /* بەستەرەکانی ناو دەق ناگۆڕدرێن — تەنها ئەوانەی وەک دوگمە کار دەکەن */
  .dropdown-item, .bn-item, .tk-cat, .report-cat, .mode-chip, .track-chip { min-height: 44px; }
  .dropdown-item, .tk-cat { display: flex; align-items: center; }

  /* ─────────────────────────────────────────────────────────────────
     ٣) شوێنی پارێزراوی تەلەفۆنە بێ‌چوارچێوەکان (notch / home indicator)
     ───────────────────────────────────────────────────────────────── */
  .page-wrap { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)); }
  .app-nav { padding-top: env(safe-area-inset-top); }
  .save-bar { bottom: calc(14px + env(safe-area-inset-bottom)); }
  .report-fab { bottom: calc(74px + env(safe-area-inset-bottom)); }
  #toast-box { top: calc(12px + env(safe-area-inset-top)); }

  /* ─────────────────────────────────────────────────────────────────
     ٤) ڕیزەکانی خشتە فراوانتر — بە پەنجە ئاسانتر دەکرێن
     ───────────────────────────────────────────────────────────────── */
  .forms-table tbody td { padding: .95rem .8rem; }
  .forms-table thead th { padding: .7rem .8rem; }
  .panel-toolbar { gap: .5rem; }
  .panel-toolbar form { width: 100%; }
  .panel-toolbar .form-control { flex: 1; min-width: 0; }

  /* مۆداڵەکان وەک ورقەی خوارەوەی ئەپ */
  .modal-dialog { margin: .5rem; }
  .modal-content { border-radius: 20px; }
}

/* ــ بۆ ئامێری دەستلێدان (بێ ماوس) — لە هەر پانییەکدا ــ */
@media (hover: none) and (pointer: coarse) {
  /* کاریگەری hover لەسەر مۆبایل دەچەسپێت و دەبێتە کێشە */
  .lp-card:hover, .lp-office:hover, .stat-card:hover { transform: none; }
  .forms-table tbody tr:hover { background: transparent; }
}

/* ــ پەڕەی سەرەکی: دوگمەکان بە پانی تەواو، وەک ئەپ ــ */
@media (max-width: 640px) {
  .lp-cta { flex-direction: column; }
  .lp-cta .lp-btn { width: 100%; }
  .lp-nav .lp-wrap { gap: .5rem; }
  .lp-actions { margin-inline-start: auto; }
}

/* ــ هەنگاوەکانی دوای ناردنی داواکاری ــ */
.req-steps { list-style: none; margin: 1.4rem 0 0; padding: 0; text-align: start; display: grid; gap: .7rem; }
.req-steps li { display: flex; gap: .7rem; align-items: flex-start; padding: .85rem; border-radius: 14px; border: 1px solid var(--line); background: var(--surface); }
.req-steps li.done { opacity: .75; }
.req-steps li.now { border-color: var(--brand-1); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-1) 12%, transparent); }
.rs-n { flex: none; width: 26px; height: 26px; border-radius: 99px; display: grid; place-items: center; background: var(--line); color: var(--muted); font-size: .78rem; font-weight: 800; }
.req-steps li.done .rs-n { background: #e7f8ee; color: #0a7a3f; }
.req-steps li.now .rs-n { background: var(--brand-1); color: #fff; }
.rs-n .icon { width: 1em; height: 1em; }
.rs-t { display: flex; flex-direction: column; gap: .3rem; min-width: 0; font-size: .86rem; }
.rs-d { color: var(--muted); font-size: .8rem; line-height: 1.7; }
.rs-msg { background: #f4f6fb; border: 1px dashed var(--line); border-radius: 10px; padding: .55rem .7rem; font-size: .8rem; line-height: 1.7; white-space: pre-line; overflow-wrap: anywhere; }
.rs-actions { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .3rem; }

/* ــ ناردن بە سۆشیاڵ میدیا ــ */
.rs-social { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; margin-top: .55rem; }
.rs-social-lbl { font-size: .76rem; font-weight: 700; color: var(--muted); }
.rs-net { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; color: #fff; text-decoration: none; transition: transform .15s, filter .15s; }
.rs-net:hover { transform: translateY(-2px); filter: brightness(1.06); }
.rs-net .icon { width: 1.3em; height: 1.3em; }
.rs-net.wa { background: #25d366; }
.rs-net.fb { background: #1877f2; }
.rs-net.ig { background: linear-gradient(45deg, #f09433, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888); }
.rs-net.other { background: var(--brand-1); }
.rs-social-hint { display: block; font-size: .74rem; color: var(--muted); margin-top: .4rem; line-height: 1.6; }

[data-theme="dark"] .rs-msg { background: #12182b; }
[data-theme="dark"] .req-steps li.done .rs-n { background: #0d2b1b; color: #6ee7a8; }
