/*
 * GOLD EDU — Design System v1
 * Session 3: Applicants UI/UX Foundation.
 *
 * Bu fayl mövcud dizaynı SİLMİR — `variables.css`/`layout.css`/`table.css`/`components.css`/
 * `catalog.css`/`premium.css` üzərinə YÜKLƏNİR (index.html-də ən sonda bağlanır) və eyni
 * class adlarını təkrar bəyan edərək daha oxunaqlı ölçülərlə əvəz edir. Yeni framework və ya
 * ayrı komponent kitabxanası qurulmayıb — məqsəd tək bir tokens/ölçü təbəqəsi yaratmaqdır ki,
 * gələcək sessiyalarda digər modullara (Universitetlər, Proqramlar, Import) da tətbiq oluna bilsin.
 *
 * Bu sessiyada toxunulan modullar: Abituriyentlər (siyahı, kart, forma, filtrlər, statistika).
 * `.detail-tab`/`.info-card`/`.mini-action` kimi PAYLAŞILAN komponent sinifləri buradan da
 * ölçü alır — bu, Catalog/University kartına da tətbiq olunacaq, lakin Catalog-un JS/HTML/
 * məntiqinə toxunulmayıb, yalnız görünüş tokenləri bölüşülür.
 */

:root {
  /* ---- Typography scale ---- */
  --font-size-xs: 13px;
  --font-size-sm: 14px;
  --font-size-md: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 22px;
  --font-size-2xl: 28px;
  --line-height-tight: 1.25;
  --line-height-normal: 1.5;

  /* ---- Spacing scale ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;

  /* ---- Radius scale (aliases over existing variables.css tokens) ---- */
  --radius-small: var(--radius-sm);
  --radius-medium: var(--radius-md);
  --radius-large: var(--radius-lg);
  --radius-pill: 999px;

  /* ---- GOLD EDU brand aliases (Visual Redesign, Phase 1) ----
     Named per the brand spec (§5). These are aliases over the actual hex values in
     variables.css (single source of truth stays there) so future phases/screens can reach
     for --gold-500/--navy-950/etc. by name without re-declaring colors. --color-primary
     itself stays the "base navy" role (sidebar, hero gradients, tab-active state, etc.);
     it is deliberately NOT what button--primary uses below (see §10: PRIMARY button = gold
     background, not the base navy). */
  --gold-500: var(--color-accent);       /* #D4AF37 */
  --gold-600: #B8952E;                   /* darker gold for hover/pressed states */
  --navy-950: var(--color-primary);      /* #0F172A */
  --navy-900: #14213D;                   /* prior primary value — kept available for gradients */
  --navy-800: var(--color-primary-hover);/* #1E293B */
  --navy-700: #26395f;                   /* matches existing .applicant-hero gradient step */
  --surface: var(--color-surface);
  --surface-muted: var(--color-surface-muted);
  --surface-elevated: #FFFFFF;
  --text-primary: var(--color-text);
  --text-secondary: var(--color-text-secondary);
  --text-muted: var(--color-muted-text);
  --border: var(--color-border);
  --border-strong: #cfd5e0;
  --success: var(--color-success);
  --warning: var(--color-warning);
  --danger: var(--color-danger);
  --info: var(--color-info);
  /* Lotus-logo accent colors — reserved for selective/branding use (logo, illustration),
     deliberately NOT wired into the main button/badge/status system (§1: "multicolor lotus
     colors should mostly remain inside branding / selective accents... do NOT turn the CRM
     into a rainbow dashboard"). */
  --accent-magenta: #C2185B;
  --accent-orange: #F59E0B;
  --accent-burgundy: #7E1D2E;

  /* ---- Semantic colors ---- */
  --color-neutral: #667085;
  --color-muted-text: #8f97a6;
  --color-surface-muted: #f8fafc;
  /* "Arxivdə" — sakit/neytral vəziyyət, XƏTA və ya RƏDD DEYİL. Qırmızı/çəhrayı
     badge--closed ilə QARIŞDIRILMASIN (bax: Mərhələ 1 audit — "ярко-красные архивные строки"). */
  --color-archived-bg: #eef1f5;
  --color-archived-text: #51586b;
  --color-archived-border: #d8dee6;

  /* ---- Control sizes (buttons/inputs/selects/icon-buttons) ---- */
  --control-height-sm: 34px;
  --control-height-md: 42px;
  --control-height-lg: 48px;
  --control-min-tap: 40px;
}

/* =========================================================================
   BASE TYPOGRAPHY — minimum oxunaqlılıq həddi
   ========================================================================= */
html { font-size: 16px; }
body { font-size: var(--font-size-sm); line-height: var(--line-height-normal); }

/* =========================================================================
   PAGE HEADER
   ========================================================================= */
.eyebrow { font-size: 11px !important; }
.page-heading h1 { font-size: var(--font-size-2xl); }
.page-heading > div > p:last-child { font-size: var(--font-size-xs); line-height: var(--line-height-normal); }

.data-card__header h2 { font-size: var(--font-size-lg); }
.data-card__header p { font-size: var(--font-size-xs); }

/* Compact overflow menu for secondary page actions (İxrac et / Sütunlar) —
   bax: Mərhələ 3, "вторичные действия убрать в компактное меню". */
.header-more { position: relative; }
.header-more__menu {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 45;
  width: 190px; padding: 6px; border: 1px solid var(--color-border);
  border-radius: var(--radius-medium); background: #fff; box-shadow: var(--shadow-lg);
}
.header-more__menu button {
  width: 100%; min-height: var(--control-min-tap); display: flex; align-items: center; gap: 9px;
  border: 0; border-radius: 8px; background: transparent; padding: 0 10px; text-align: left;
  font-size: var(--font-size-xs); color: var(--color-text);
}
.header-more__menu button:hover { background: var(--color-surface-muted); color: var(--color-primary); }
.header-more__menu--exports { width: min(330px, calc(100vw - 32px)); }
.header-more__menu--exports button { min-height: 38px; white-space: normal; line-height: 1.35; }

/* =========================================================================
   STATISTICS STRIP — daha az yer, daha az təkrar mətn
   Bax: Mərhələ 4 — "Ayrıca API gözlənilir" hər kartda YOX, bir ümumi qeyd.
   ========================================================================= */
.stats-grid { gap: var(--space-3); margin-bottom: var(--space-4); }
.stat-card { padding: var(--space-3) var(--space-4); min-height: 0; }
.stat-card strong { font-size: var(--font-size-xl); line-height: 1.1; }
.stat-card span { font-size: var(--font-size-xs); margin-top: 2px; }
.stat-card__icon { width: 30px; height: 30px; flex: 0 0 30px; font-size: 14px; }
/* Köhnə per-card qeyd artıq göstərilmir (JS bunu render etmir) — burada yalnız
   ehtiyat qalığı silinmiş elementlərə görə görünməsin deyə saxlanılır. */
.stat-card__note { display: none; }
.stats-note {
  margin: -6px 0 var(--space-4); font-size: var(--font-size-xs); color: var(--color-text-secondary);
  display: flex; align-items: center; gap: 6px;
}
.stats-note::before { content: "ⓘ"; color: var(--color-muted-text); }

/* =========================================================================
   FILTERS — davamlı görünən: axtarış + Aktiv/Arxiv + "Filtrlər" düyməsi.
   Qalanlar panel daxilində (bax: Mərhələ 5).
   ========================================================================= */
.filters-toolbar { gap: var(--space-2); padding: 0 var(--space-5) var(--space-3); flex-wrap: wrap; }
.search-field, .select-field select, .per-page select { height: var(--control-height-md); font-size: var(--font-size-sm); }
.filter-toggle { font-weight: 600; }

.advanced-filters { padding: var(--space-4) var(--space-5); }
.advanced-filters__note {
  display: flex; align-items: flex-start; gap: 8px; margin-bottom: var(--space-3);
  padding: 10px 12px; border-radius: var(--radius-small); background: var(--color-surface-muted);
  border: 1px solid var(--color-border); color: var(--color-text-secondary); font-size: var(--font-size-xs);
}
.advanced-filters__note strong { color: var(--color-text); }
.filter-grid { gap: var(--space-4); }
.filter-grid label, .form-grid label { font-size: var(--font-size-xs); font-weight: 600; }
.filter-grid input, .filter-grid select, .form-grid input, .form-grid select {
  height: var(--control-height-md); font-size: var(--font-size-sm); margin-top: 7px;
}
.filter-grid select[disabled], .filter-grid input[disabled] { background: #f4f5f7; color: var(--color-muted-text); cursor: not-allowed; }
.advanced-filters__actions {
  display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-4);
  padding-top: var(--space-3); border-top: 1px solid var(--color-border);
}
.filter-chip { font-size: var(--font-size-xs); }

/* =========================================================================
   TABLE — daha az sütun, daha hündür sətir, sakit arxiv görünüşü.
   Bax: Mərhələ 6.
   ========================================================================= */
.applicants-table { font-size: var(--font-size-sm); min-width: 1080px; }
.applicants-table th { height: 48px; font-size: 12px; letter-spacing: .03em; }
.applicants-table td { height: 76px; padding: 12px 14px; }
.applicant-cell { min-width: 200px; max-width: 260px; gap: 11px; }
.applicant-cell .avatar { width: 38px; height: 38px; flex: 0 0 38px; font-size: 13px; }
/* SESSION 28.4, §11 — the name column's <div class="applicant-cell__copy"> (avatar's flex sibling,
   see applicants.js's row markup) had no rule at all, and `strong`'s own max-width:210px did
   nothing (max-width has no effect on a plain inline element) — a long first+last name just
   rendered past the cell/avatar instead of being contained, colliding with the next column. Fixed
   with the standard contained-truncation pattern: the flex sibling gets min-width:0 so it can
   actually shrink, the name becomes a block-level, single-line ellipsis — the full name is never
   lost, it's already in the row markup's own title="..." attribute (native tooltip on hover). */
.applicant-cell__copy { flex: 1 1 auto; min-width: 0; }
.applicant-cell strong { display: block; font-size: var(--font-size-sm); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.applicant-cell small { font-size: var(--font-size-xs); margin-top: 5px; color: var(--color-muted-text); }
.applicant-cell__secondary { display: block; margin-top: 3px; font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.contact-cell a { font-size: var(--font-size-sm); }
.contact-cell small { font-size: var(--font-size-xs); margin-top: 5px; }
.major-cell strong { display: block; font-size: var(--font-size-sm); }
.major-cell small { display: block; margin-top: 4px; font-size: var(--font-size-xs); color: var(--color-text-secondary); }
/* SESSION 23 LIVE ACCEPTANCE FIX, Section 5 — "Marketinq +2" compact secondary-intents indicator
   (see applicants.js's own docblock on item.intentsCount). Deliberately understated (muted pill,
   not a loud badge) — this is a count hint, not a status. */
.major-cell__extra { display: inline-block; margin-left: 4px; padding: 1px 6px; border-radius: 999px; background: var(--color-surface-muted); color: var(--color-text-secondary); font-size: 10px; font-weight: 600; vertical-align: middle; }
.employee-cell { font-size: var(--font-size-sm); }
.employee-cell .avatar { width: 28px; height: 28px; flex-basis: 28px; font-size: 10px; }
.date-cell strong { font-size: var(--font-size-sm); }
.date-cell small { font-size: var(--font-size-xs); }

/* Arxiv sətirləri: sakit boz ton, işıqlı qırmızı yoxdur. */
.applicants-table tbody tr.is-archived td { background: #fbfbfc; color: var(--color-text-secondary); }
.applicants-table tbody tr.is-archived .applicant-cell strong { color: #52596b; }
.applicants-table tbody tr.is-archived:hover td { background: #f6f7f9; }

.badge { font-size: 12px; min-height: 26px; padding-inline: 10px; }
.badge--archived { background: var(--color-archived-bg); color: var(--color-archived-text); }
.badge--archived::before { background: var(--color-archived-text); }

.row-actions__button { width: var(--control-min-tap); height: var(--control-min-tap); font-size: 20px; }
.action-menu { width: 220px; padding: 7px; }
.action-menu button { min-height: var(--control-min-tap); font-size: var(--font-size-xs); gap: 10px; }

.empty-state h3 { font-size: var(--font-size-lg); }
.empty-state p { font-size: var(--font-size-sm); }
.page-number { width: var(--control-min-tap); height: var(--control-min-tap); font-size: var(--font-size-xs); }
.per-page label, .per-page span { font-size: var(--font-size-xs); }

/* =========================================================================
   BUTTONS / ICON BUTTONS / INPUTS — vahid ölçülər.
   ========================================================================= */
.button { min-height: var(--control-height-md); font-size: var(--font-size-sm); padding-inline: 15px; }
.icon-button { width: var(--control-min-tap); height: var(--control-min-tap); }

/* GOLD EDU brand redesign, Phase 1 §10 — button hierarchy. components.css centralizes
   .button--primary/--secondary/--danger in one rule each (no per-page duplication found in
   the design audit), so a single override here re-skins every primary CTA app-wide.
   PRIMARY = gold background + dark navy text (NOT var(--color-primary), which stays the
   base navy used elsewhere — see the --gold-500/--navy-950 aliases above). SECONDARY/DANGER
   already matched the target hierarchy (white/outlined, restrained red) so they're untouched. */
.button--primary {
  background: var(--gold-500);
  color: var(--navy-950);
  border-color: var(--gold-500);
  font-weight: 700;
}
.button--primary:hover:not([disabled]) {
  background: var(--gold-600);
  border-color: var(--gold-600);
  color: var(--navy-950);
}
.button--primary:focus-visible { outline-color: var(--navy-950); }
/* .mini-action.button--primary (Session 27's compound-specificity fix, further below in this
   file) must move to the same gold/navy pairing — otherwise "+ Sənəd əlavə et" style buttons
   would stay navy while every other primary CTA goes gold, breaking §10's "one shared
   hierarchy" requirement. Restated here, ahead of that rule's own definition, so the intent
   is visible in one place; the later, more specific rule is what actually wins the cascade. */
.field-error { font-size: 12px; min-height: 15px; }
/* Session 12 — explanatory text under a disabled/read-only form field (e.g. the applicant-mirror
   contact's phone/whatsapp/email, which is edited from the Applicant card, not here). */
.field-hint { display: block; font-size: 12px; color: var(--color-muted-text); margin-top: 2px; }
.toast strong { font-size: var(--font-size-sm); }
.toast span { font-size: var(--font-size-xs); }

/* =========================================================================
   APPLICANT CARD — CRM-tipli başlıq + tablar + qruplaşdırılmış ümumi məlumat.
   Bax: Mərhələ 7. Paylaşılan `.detail-hero`/`.detail-tabs`/`.info-card`
   siniflərini University kartı ilə eyni şəkildə istifadə edir.
   ========================================================================= */
.applicant-hero {
  display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-5);
  padding: var(--space-5); border-radius: var(--radius-large);
  background: linear-gradient(135deg,#14213d 0%,#1d2e54 66%,#26395f 100%); color: #fff;
  margin-bottom: var(--space-4);
}
.applicant-hero__identity { display: flex; align-items: flex-start; gap: var(--space-4); min-width: 0; }
.applicant-hero__avatar {
  width: 54px; height: 54px; flex: 0 0 54px; border-radius: 14px; display: grid; place-items: center;
  background: rgba(255,255,255,.12); color: #fff; font-weight: 700; font-size: 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16);
}
.applicant-hero__name { font-size: var(--font-size-xl); font-weight: 700; margin: 0 0 4px; }
.applicant-hero__id { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #b9c4d7; }
.applicant-hero__contacts { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); margin-top: var(--space-3); font-size: var(--font-size-sm); color: #dbe2ee; }
.applicant-hero__contacts a { color: #fff; font-weight: 500; }
.applicant-hero__badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--space-3); }
.applicant-hero__actions { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex: 0 0 auto; }
.applicant-hero__actions .button--secondary { background: rgba(255,255,255,.94); }

.detail-tabs { border-radius: var(--radius-medium) var(--radius-medium) 0 0; }
/* The applicant card's menu must not live inside the tabs' horizontal scrollport. */
#applicantCardModal .detail-tabs { position: relative; z-index: 2; overflow: visible; }
#applicantCardModal .detail-tabs__primary { display: flex; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: thin; }
#applicantCardModal .detail-tabs__more { flex: 0 0 auto; margin-left: 0; }
.detail-tab { font-size: var(--font-size-xs); height: 42px; padding: 0 14px; }
/* Session 29 ("Simplify, Consolidate, Ship") — Applicant Card primary vs secondary tab grouping
   (applicant-card.js's PRIMARY_TABS/SECONDARY_TABS). The divider is a plain vertical rule reusing
   --color-border (no new token); secondary tabs stay fully functional, just visually quieter
   (smaller/lighter) so Ümumi/Təkliflər/Sənədlər/Tarixçə read as the main path. */
.detail-tabs__divider { flex: 0 0 auto; width: 1px; margin: 6px 4px; background: var(--color-border); align-self: stretch; }
.detail-tabs__secondary-label { align-self: center; margin-left: 4px; color: var(--color-text-secondary); font-size: 10px; font-weight: 700; white-space: nowrap; }
.detail-tabs__more{position:relative;align-self:center;margin-left:auto}.detail-tabs__more>summary{list-style:none;cursor:pointer;color:var(--color-text-secondary);font-size:11px;font-weight:600;white-space:nowrap}.detail-tabs__more>summary::-webkit-details-marker{display:none}.detail-tabs__more[open]>summary{color:var(--color-primary)}.detail-tabs__more-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:8;display:grid;min-width:170px;padding:6px;border:1px solid var(--color-border);border-radius:10px;background:#fff;box-shadow:0 12px 28px rgba(16,24,40,.15)}.detail-tabs__more-menu .detail-tab{width:100%;justify-content:flex-start}
.detail-tab--secondary { font-size: 11px; color: var(--color-text-secondary); }
.detail-tab--secondary:not(.active):hover { color: var(--color-primary); }
/* SESSION 28.6C, Task G — University Detail's two-level tab nav (top-level group + sub-tab pills
   for groups with more than one member, see university-detail.js's tabGroups). Sub-tabs reuse the
   same restrained navy/white/gray palette as .detail-tab, just visually lighter (no border box) to
   read as a secondary level under the group row. */
.detail-subtabs { display: flex; flex-wrap: wrap; gap: 4px; padding: 10px 4px 0; background: #fff; border: 1px solid var(--color-border); border-top: 0; }
.detail-subtab { height: 32px; border: 0; border-radius: var(--radius-pill); padding: 0 12px; background: transparent; color: var(--color-text-secondary); font-size: 11px; font-weight: 600; cursor: pointer; }
.detail-subtab:hover { background: var(--color-surface-muted); color: var(--color-primary); }
.detail-subtab.active { background: var(--color-surface-muted); color: var(--color-primary); }
.detail-content { border-radius: 0 0 var(--radius-medium) var(--radius-medium); min-height: 260px; }
.info-card { padding: var(--space-4); }
.info-card span { font-size: var(--font-size-xs); margin-bottom: 7px; }
.info-card strong { font-size: var(--font-size-sm); }
.section-heading h2 { font-size: var(--font-size-md); }
.section-heading p { font-size: var(--font-size-xs); color: var(--color-text-secondary); margin-top: 2px; }
.card-section + .card-section { margin-top: var(--space-6); }
.card-section__title {
  font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--color-text-secondary); margin: 0 0 var(--space-3);
}
.mini-action { height: 36px; font-size: var(--font-size-xs); }
/* SESSION 27 FINAL DOCUMENTS UX POLISH, §1 — root cause of "+ Sənəd əlavə et" (and every other
 * button--primary mini-action button: "+ Fayl əlavə et", "+ Mərhələ əlavə et", "+ Orijinalı köçür",
 * the partial-success "Faylı yüklə" retry) looking permanently disabled/dimmed EVEN FOR ADMIN: this
 * was never a capability/JS bug (hasCapability('documents.manage') and addDocButtonAttrs() were
 * already correct — see applicant-documents-ui.js). It's a pure CSS cascade collision. catalog.css's
 * .mini-action base rule (background:#fff; color:#475467; border:1px solid var(--color-border)) is
 * a SECONDARY-style reset meant for compact action buttons used ALONE (e.g. "Faylı aç"/"Arxivlə").
 * catalog.css loads AFTER components.css's .button--primary rule (background:var(--color-primary);
 * color:#fff) with EQUAL specificity (one class each) — so for any button carrying BOTH classes,
 * the later .mini-action rule silently overwrites the primary color, making an ENABLED button render
 * washed-out/white exactly like a disabled one. Fix: a higher-specificity compound selector (two
 * classes) restores the primary look whenever both classes are present, without touching
 * .mini-action's own standalone usage anywhere else. Genuinely-disabled buttons (role without
 * documents.manage) still dim correctly afterward via reset.css's button:disabled{opacity:.5} —
 * that rule targets opacity only, which this block does not touch, so both rules coexist. */
.mini-action.button--primary { background: var(--gold-500); color: var(--navy-950); border-color: var(--gold-500); }
.mini-action.button--primary:hover { background: var(--gold-600); color: var(--navy-950); }

/* Placeholder tablar (Sənədlər/Universitet müraciətləri/Ödənişlər/Tapşırıqlar/Tarixçə) —
   arxitektur olaraq mövcuddur, lakin bu sessiyada funksional deyil (bax: Mərhələ 7). */
.tab-placeholder {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: var(--space-2); min-height: 220px; text-align: center; color: var(--color-text-secondary);
}
.tab-placeholder__icon {
  width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
  background: var(--color-surface-muted); color: var(--color-muted-text); font-size: 20px;
}
.tab-placeholder p { font-size: var(--font-size-sm); max-width: 320px; }

/* =========================================================================
   CREATE/EDIT MODAL — bölmələrə ayrılmış forma (payload/REST DƏYİŞMİR,
   yalnız görünüş). Bax: Mərhələ 8.
   ========================================================================= */
/* Bölmələrə ayrılmış forma köhnə formadan hündür ola bilər — bu, .modal-in flex
   sütununda "min-height:auto" defolt davranışı üzündən body-nin daşmasına (scroll
   işləməməsinə) səbəb olurdu. #applicantForm-u özü də flex-sütun edib min-height:0
   ilə düzəldilir ki, .modal__body öz daxilində scroll etsin, footer isə sabit qalsın
   (bax: Mərhələ 8 canlı yoxlama zamanı aşkarlanan overflow xətası). */
#applicantForm { display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto; }
.applicant-quick-mode [data-quick-advanced] { display: none !important; }
#applicantAdvancedToggle { align-self: flex-start; margin: 0 0 var(--space-3); }
.entity-checkbox { display: inline-flex; align-items: center; gap: var(--space-2); }
.entity-checkbox input[type="checkbox"] { width: 18px; height: 18px; margin: 0; flex: 0 0 auto; }
#applicantModal:not([hidden]) { z-index: 120; }
.modal-layer--discard-confirm { z-index: 140; }
#applicantModal .modal__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; }

/* SESSION 27 LIVE-ACCEPTANCE FIX #2 — the document-create modal (.modal.modal--wide, built in
   applicant-documents-ui.js's openAddDocumentModal()) hit the EXACT SAME bug documented above for
   #applicantModal: components.css's base .modal__body only has `overflow-y: auto`, with no
   `flex: 1 1 auto; min-height: 0`. Per this file's own prior finding (see comment above), that is
   not sufficient on its own for the body to actually become the scrolling region in this modal's
   flex-column shell — the body's default min-height:auto still let it demand its full content
   height, pushing the "Fayl seç" control (the doc-file-picker block, the LAST element in the form)
   down past the visible viewport with no way to scroll to it, even though its own markup/CSS
   (.doc-file-picker etc., both already correct) render fine once reachable.
   Rather than duplicating the #applicantModal-scoped override for every future modal that grows
   past viewport height, this generalizes the fix to the BASE .modal__body/.modal__footer (every
   modal in the app benefits, none regress — flex:1 1 auto + min-height:0 is a strict superset of
   plain overflow-y:auto, it only changes behavior once content actually overflows).
   Also finally styles .modal--wide, which was already used in openAddDocumentModal()'s markup
   ("modal modal--wide") but had NO matching CSS rule anywhere in this codebase (dead class) — this
   two-column, 10-field-plus-file-picker form genuinely needs more width than the 880px default. */
.modal__body { flex: 1 1 auto; min-height: 0; padding-bottom: 28px; }
.modal__footer { flex: 0 0 auto; }
.modal--wide { width: min(960px, 100%); }
#applicantModal .modal__footer { flex: 0 0 auto; }

/* SESSION 27 FINAL LIVE FIX — the ACTUAL remaining root cause the fix above missed. Every modal in
   this codebase (including #applicantModal AND openAddDocumentModal()'s document-create modal)
   puts .modal__body/.modal__footer INSIDE a bare <form>, which is itself the direct flex-item
   child of .modal (.modal { display:flex; flex-direction:column } — see components.css). A plain
   <form> has NO flex/display styling of its own by default, so it is NOT a flex container — meaning
   .modal__body's `flex: 1 1 auto` above has ZERO effect for any modal whose <form> lacks its own
   flex treatment: flex properties only do anything on an element that is itself a flex ITEM of an
   ACTUAL flex CONTAINER parent, and .modal__body's parent is <form>, not .modal, here.
   #applicantModal was never actually fixed by ".modal__body{flex:1 1 auto}" alone either — look one
   line up: `#applicantForm { display:flex; flex-direction:column; min-height:0; flex:1 1 auto; }`
   is what makes THAT modal's form itself a flex column in the first place. The document-create
   modal's <form> (assets/js/applicant-documents-ui.js, openAddDocumentModal(), plain `<form
   novalidate>`, no id/class) never received the equivalent treatment — so the previous round's
   generalized .modal__body fix was inert for it, and the file-picker block stayed unreachable,
   silently clipped by .modal's own `overflow:hidden` with no scroll container anywhere.
   This generalizes the SAME #applicantForm pattern via a structural selector (.modal > form) so
   every current and future modal that follows this exact markup shape (header + form[body+footer])
   gets a real, working scroll container automatically — no per-modal id/class needed. */
.modal > form { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }

.modal__header h2 { font-size: var(--font-size-xl); }
.modal__header p { font-size: var(--font-size-xs); }
.form-hint { font-size: var(--font-size-xs); color: var(--color-text-secondary); margin: 0 0 var(--space-5); }
.form-hint em { color: var(--color-danger); font-style: normal; }
fieldset.form-section { border: 0; margin: 0; padding: 0; min-width: 0; }
.form-section + .form-section { margin-top: var(--space-6); padding-top: var(--space-5); border-top: 1px solid var(--color-border); }
legend.form-section__title {
  padding: 0; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--color-primary); margin: 0 0 var(--space-4);
}
.form-grid textarea { font-size: var(--font-size-sm); }

/* =========================================================================
   SIDEBAR — oxunaqlılıq (bax: Mərhələ 9). Marşrutlaşdırma dəyişmir.
   ========================================================================= */
.nav-item { font-size: var(--font-size-sm); }
.nav-item.active { font-weight: 600; }
.brand__copy span { font-size: 11px; }
.sidebar__help strong { font-size: var(--font-size-xs); }
.sidebar__help small { font-size: 11px; }
.sidebar__footer p { font-size: 11px; }
.topbar__section span { font-size: 11px; }
.topbar__section strong { font-size: var(--font-size-sm); }

/* =========================================================================
   ACCESSIBILITY — fokus vəziyyəti daha görünən (bax: Mərhələ 10).
   ========================================================================= */
/* GOLD EDU brand redesign, Phase 1 §33 — the pre-existing rule used a leftover blue
   (rgba(37,99,235,...) — never part of this app's own palette, matches no token here) for the
   global focus ring. Switched to the brand's own gold focus-ring token (--focus-ring's rgb,
   already defined in variables.css) so keyboard focus reads as on-brand instead of an
   unrelated blue accent. */
:focus-visible { outline: 3px solid rgba(212,175,55,.55); outline-offset: 2px; }
.button:focus-visible, .icon-button:focus-visible, .nav-item:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible { outline-offset: 2px; }

@media (max-width: 1100px) {
  .applicants-table { min-width: 900px; }
}
@media (max-width: 768px) {
  .applicant-hero { flex-direction: column; }
  .applicant-hero__actions { flex-direction: row; align-self: stretch; }
  .applicant-hero__actions .button { flex: 1; }
}

/* =========================================================================
   SƏNƏDLƏR (Applicant Documents workspace) — Session 7.5.
   Yalnız görünüş: bütün datalar assets/js/applicant-documents-ui.js-dən gəlir,
   heç bir rəqəm/say burada uydurulmur. Mövcud .stat-card/.info-card/.card-section/
   .detail-tabs/.catalog-state/.badge/.mini-action siniflərinin üzərinə qurulur.
   ========================================================================= */
.documents-tab-root { min-height: 220px; }

/* 6 xülasə kartı (applicants list-in 5-sütunlu .stats-grid-indən fərqli sayda) —
   avtomatik uyğunlaşan sütunlar, dar ekranda təbii şəkildə sətir keçir. */
.documents-stats-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }

.doc-list-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
  margin: var(--space-3) 0; flex-wrap: wrap;
}
/* Session 29, §10 — offer multi-select checkbox + its toolbar action group. Reuses
   .communication-recipient's existing checkbox spacing convention, no new interaction pattern. */
.doc-list-toolbar__actions { display: flex; align-items: center; gap: var(--space-2); }
.offer-select { display: inline-flex; align-items: center; margin-right: 2px; }
.offer-select input { margin: 0; }
.doc-archived-toggle {
  display: flex; align-items: center; gap: 7px; font-size: var(--font-size-xs);
  color: var(--color-text-secondary); cursor: pointer;
}
.doc-archived-toggle input { width: 16px; height: 16px; margin: 0; }

.doc-card-list { display: flex; flex-direction: column; gap: var(--space-3); }
.doc-card {
  display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4);
  padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-medium);
  background: #fff; transition: box-shadow var(--transition, .15s), border-color var(--transition, .15s);
}
.doc-card:hover { box-shadow: var(--shadow-sm, 0 1px 4px rgba(16,24,40,.06)); border-color: #d0d5dd; }
.doc-card.is-archived { background: var(--color-archived-bg); }
.doc-card__main { min-width: 0; flex: 1 1 auto; }
.doc-card__title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.doc-card__title strong { font-size: var(--font-size-sm); color: var(--color-text); }
.doc-card__meta { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.doc-card__note { margin: 8px 0 0; font-size: var(--font-size-xs); color: var(--color-text-secondary); font-style: italic; }
/* Session 12 — honest preferred-language mismatch notice (contacts + Communication Center), not
   an error, so it borrows the warning tone rather than the danger one. */
.doc-card__note--warning { color: var(--color-warning-text, #92400e); font-style: normal; }
.doc-card__actions { flex: 0 0 auto; }
/* SESSION 27 FINAL DOCUMENTS UX POLISH, §2 — compact card current-file line. Has-file state gets a
   slightly stronger (success-toned) weight so it's scannable at a glance across a long card list;
   the empty state inherits .doc-card__meta's plain muted-caption styling (no color change needed —
   already correct via inheritance from the parent's color/font-size). */
.doc-card__file-status { font-weight: 600; color: var(--color-success, #15803d); }
.doc-card__file-status--empty { font-weight: 400; color: var(--color-text-secondary); }

/* Sub-tab toolbar (Fayl yüklə / Mərhələ əlavə et / Orijinalı köçür düymələri) */
.doc-subtab-toolbar { display: flex; margin-bottom: var(--space-3); }
.doc-subtab-toolbar--end { justify-content: flex-end; }
.doc-subtab-toolbar--center { justify-content: center; }
.doc-detail-header { margin-bottom: var(--space-4); }

/* Fayl siyahısı (versiyalara görə qruplaşdırılmış) */
.doc-file-list { display: flex; flex-direction: column; gap: var(--space-2); }
.doc-file-row {
  display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3);
  border: 1px solid var(--color-border); border-radius: var(--radius-small); background: #fff;
}
.doc-file-row.is-archived { background: var(--color-archived-bg); opacity: .85; }
.doc-file-row__icon { font-size: 20px; flex: 0 0 auto; }
.doc-file-row__meta { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.doc-file-row__meta strong { font-size: var(--font-size-sm); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-file-row__meta span { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.doc-file-row__note { font-style: italic; }
.doc-file-row__archived-note { font-size: var(--font-size-xs); color: var(--color-text-secondary); font-style: italic; }
.doc-file-row__badges { display: flex; flex-direction: column; gap: 4px; flex: 0 0 auto; }
.doc-file-row__actions { display: flex; gap: 6px; flex: 0 0 auto; flex-wrap: wrap; }

/* Emal mərhələləri */
.doc-step-list { display: flex; flex-direction: column; gap: var(--space-2); }
.doc-step-row { padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-small); background: #fff; }
.doc-step-row__head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.doc-step-row__meta { display: flex; flex-wrap: wrap; gap: var(--space-3); font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.doc-step-row__note { margin: 6px 0 0; font-size: var(--font-size-xs); font-style: italic; color: var(--color-text-secondary); }

/* Orijinalın hərəkəti — dəyişilməz (append-only) zaman xətti */
.doc-movement-timeline { position: relative; padding-left: 22px; }
.doc-movement-timeline::before { content: ""; position: absolute; left: 5px; top: 6px; bottom: 6px; width: 2px; background: var(--color-border); }
.doc-movement-row { position: relative; padding-bottom: var(--space-4); }
.doc-movement-row:last-child { padding-bottom: 0; }
.doc-movement-row__dot { position: absolute; left: -22px; top: 4px; width: 12px; height: 12px; border-radius: 50%; background: var(--color-info); border: 2px solid #fff; box-shadow: 0 0 0 2px var(--color-info); }
.doc-movement-row__body { display: flex; flex-direction: column; gap: 2px; }
.doc-movement-row__body strong { font-size: var(--font-size-sm); }
.doc-movement-row__body span { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.doc-movement-row__note { font-style: italic; }

.form-static-value { margin: 0; padding-top: 6px; font-size: var(--font-size-sm); color: var(--color-text); }

/* SESSION 27 — file-attach control on the "Sənəd əlavə et" create modal (§3) + the "Cari fayl"
   info-card value in the document detail header (§4). The native <input type="file"> is hidden via
   the existing .visually-hidden-field utility (see that class's own comment further down this file)
   so a custom-worded trigger button ("Fayl seç") can sit in front of it — the browser's native
   file-input button text cannot be restyled with CSS content. No new visual language: reuses
   .button--secondary/.mini-action for the trigger and the same muted-caption sizing as
   .doc-card__meta elsewhere in this file. */
.doc-file-picker { display: flex; flex-direction: column; gap: 6px; }
.doc-file-picker__control { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.doc-file-picker__filename { font-size: var(--font-size-xs); color: var(--color-text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 260px; }
.doc-file-picker__hint { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.doc-file-picker.has-error .doc-file-picker__control { outline: 2px solid transparent; }
.doc-file-picker.has-error .field-error { color: var(--color-danger); }
/* "Sənəd yaradıldı, lakin fayl yüklənmədi." partial-success banner — same warning tone as
   .doc-card__note--warning above, not the danger tone (metadata DID save; this is not a hard
   failure). */
.doc-file-picker__warning { margin: 0; padding: var(--space-3); border-radius: var(--radius-small); background: #fff1de; color: var(--color-warning-text, #92400e); font-size: var(--font-size-xs); }

.doc-current-file { display: inline-flex; flex-direction: column; gap: 2px; margin-right: var(--space-2); }
.doc-current-file strong { font-size: var(--font-size-sm); }
.doc-current-file small { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.doc-current-file--empty { font-size: var(--font-size-sm); color: var(--color-text-secondary); }

/* Sənəd statusu üçün semantik badge-lər — mövcud rəng tokenlərindən (bax: :root, yuxarı)
   və mövcud badge tonlarından (badge--review/--sent ilə eyni ton) istifadə edir, yeni
   özbaşına rənglər əlavə edilmir. */
.badge--doc-missing { background: #fff1de; color: var(--color-warning); }
.badge--doc-received { background: #e8f0ff; color: var(--color-info); }
.badge--doc-processing { background: #eeeafb; color: #6941c6; }
.badge--doc-ready { background: #e8f7ee; color: var(--color-success); }
.badge--doc-submitted { background: #edf2ff; color: #3e54a3; }
.badge--doc-returned { background: #fff1de; color: var(--color-warning); }
.badge--doc-problem { background: #fcebec; color: var(--color-danger); }
.badge--doc-not-required { background: var(--color-archived-bg); color: var(--color-archived-text); }

@media (max-width: 900px) {
  .doc-card { flex-direction: column; }
  .doc-card__actions { align-self: flex-end; }
  .doc-file-row { flex-wrap: wrap; }
  .doc-file-row__actions { width: 100%; justify-content: flex-start; }
}
@media (max-width: 640px) {
  .documents-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .doc-list-toolbar { flex-direction: column; align-items: stretch; }
  .doc-list-toolbar .button { width: 100%; }
}

/* =========================================================================
   TAPŞIRIQLAR (Tasks & Workflow) — Session 9. Yalnız görünüş: bütün datalar
   assets/js/task-workspace.js-dən gəlir. Mövcud .doc-card/.doc-card-list/.doc-list-toolbar/
   .badge/.mini-action/.detail-tabs siniflərinin üzərinə qurulur — yeni rəng tonu əlavə
   edilmir (badge--new/--info/--waiting/--accepted/--rejected/--docs/--payment artıq mövcuddur,
   bax: components.css).
   ========================================================================= */
.task-card-list { margin-top: var(--space-3); }
.task-card.is-overdue { border-color: var(--color-danger); }
.task-card .doc-card__title { align-items: center; }

.task-filter-bar { align-items: flex-start; }
.task-filter-bar__fields { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-3); align-items: center; }
.task-filter-bar__fields select { height: 36px; border: 1px solid var(--color-border); border-radius: 8px; padding: 0 8px; font-size: var(--font-size-xs); background: #fff; }
.task-filter-bar .doc-archived-toggle { margin: 0; }

.task-comments { margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid #edf0f3; display: flex; flex-direction: column; gap: var(--space-2); }
.task-comments__empty { font-size: var(--font-size-xs); color: var(--color-text-secondary); font-style: italic; }
.task-comment { padding: var(--space-2) var(--space-3); border-radius: var(--radius-small); background: var(--color-surface-muted); }
.task-comment strong { font-size: var(--font-size-xs); }
.task-comment span { margin-left: 6px; font-size: 10px; color: var(--color-text-secondary); }
.task-comment p { margin: 4px 0 0; font-size: var(--font-size-sm); }
.task-comment-form { display: flex; gap: var(--space-2); align-items: flex-start; }
.task-comment-form textarea { flex: 1 1 auto; font-size: var(--font-size-sm); border: 1px solid var(--color-border); border-radius: 8px; padding: 8px 10px; resize: vertical; min-height: 40px; }

.task-preset-tabs { margin-bottom: var(--space-3); }
.task-page-note { font-size: var(--font-size-xs); color: var(--color-text-secondary); margin: 0 0 var(--space-3); }

@media (max-width: 640px) {
  .task-filter-bar { flex-direction: column; align-items: stretch; }
  .task-filter-bar .button { width: 100%; }
  .task-comment-form { flex-direction: column; }
}

/* =========================================================================
   MÜRACIƏTLƏR (Applications / Admissions Workflow) — Session 10. Yalnız görünüş: bütün
   datalar assets/js/application-workspace.js-dən gəlir. Mövcud .doc-card/.doc-card-list/
   .task-filter-bar/.badge/.mini-action/.detail-tabs/.info-grid/.info-card siniflərinin
   üzərinə qurulur — TAPŞIRIQLAR bölməsi ilə eyni prinsip (bax: yuxarı şərh).
   ========================================================================= */
.app-card .doc-card__title { align-items: center; }
.app-card.is-archived { background: var(--color-archived-bg); }

.app-detail { margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid #edf0f3; }
.app-detail-tabs { margin-bottom: var(--space-3); }
.app-detail__body { font-size: var(--font-size-sm); }
.app-detail__empty { font-size: var(--font-size-xs); color: var(--color-text-secondary); font-style: italic; margin: 0; }

.app-requirements-list, .app-history-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.app-requirement-row { display: flex; align-items: flex-start; gap: var(--space-2); padding: var(--space-2) var(--space-3); border-radius: var(--radius-small); background: var(--color-surface-muted); font-size: var(--font-size-sm); }
.app-requirement-row__icon { flex: 0 0 auto; font-weight: 700; }
.app-requirement-row.is-satisfied .app-requirement-row__icon { color: var(--color-success, #12805c); }
.app-requirement-row.is-missing .app-requirement-row__icon { color: var(--color-danger); }
.app-requirement-row__title { flex: 1 1 auto; }
.app-requirement-row__note { display: block; font-size: var(--font-size-xs); color: var(--color-text-secondary); font-style: italic; margin-top: 2px; }

.app-history-row { padding: var(--space-2) var(--space-3); border-radius: var(--radius-small); background: var(--color-surface-muted); font-size: var(--font-size-sm); }
.app-history-row strong { text-transform: capitalize; }
.app-history-row span { margin-left: 8px; font-size: 10px; color: var(--color-text-secondary); }
.app-history-row p { margin: 4px 0 0; font-size: var(--font-size-xs); color: var(--color-text-secondary); }

@media (max-width: 640px) {
  .app-requirement-row, .app-history-row { flex-direction: column; }
}

/* =========================================================================
   SESSION 10.1 — Consultation + Admission Case redesign. Builds on existing tokens/components
   (.status-pill, .button, .form-grid, .check-option, .filter-chip, .catalog-state, .icon-button)
   rather than inventing a parallel visual language — new here is only the layout scaffolding for
   admission-case-page.js, consultations-page.js and admission-case-workspace.js.
   Responsive verification target: 1920x1080 / 1440x900 / 1366x768 / 1024x768 (Section 25) — every
   grid below is auto-fit/minmax so it reflows to a single column on narrow viewports without a
   bespoke breakpoint per component.
   ========================================================================= */

.admission-case-list, .case-choice-list-wrap { display: flex; flex-direction: column; gap: var(--space-3); }
.admission-case-card, .consultation-card {
  border: 1px solid var(--color-border); border-radius: var(--radius-medium); background: #fff;
  padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2);
}
.consultation-card { cursor: pointer; transition: box-shadow .15s ease, border-color .15s ease; }
.consultation-card:hover { border-color: var(--color-primary); box-shadow: var(--shadow-sm, 0 1px 3px rgba(16,24,40,.08)); }
.admission-case-card__header, .consultation-card__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.admission-case-card__specialty, .consultation-card__meta-line { margin: 2px 0 0; font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.admission-case-card__meta { display: flex; flex-wrap: wrap; gap: var(--space-3); font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.admission-case-card__actions { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.admission-case-card__name { font-weight: 700; font-size: var(--font-size-md); text-align: left; }

.case-choice-list { list-style: none; margin: var(--space-2) 0 0; padding: var(--space-3); background: var(--color-surface-muted); border-radius: var(--radius-small); display: flex; flex-direction: column; gap: var(--space-1); }
.case-choice-line { font-size: var(--font-size-xs); }
.case-choice-line em { font-style: normal; color: var(--color-text-secondary); }
.case-choice-line--empty { color: var(--color-muted-text); font-style: italic; }
.availability-icon { display: inline-block; width: 16px; text-align: center; }
.choice-manual-badge {
  display: inline-block; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em;
  color: #92400e; background: #fef3c7; border-radius: var(--radius-pill); padding: 1px 8px; margin-left: 4px;
}

/* ---- İlkin məsləhət (consultations-page.js) ------------------------------------------------- */
.consultation-detail { display: flex; flex-direction: column; gap: var(--space-5); }
.consultation-detail__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap; }
.consultation-detail__header-actions { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }

.discovery-filters, .discovery-results, .discovery-choices {
  border: 1px solid var(--color-border); border-radius: var(--radius-medium); background: #fff; padding: var(--space-4);
}
.discovery-filters h3, .discovery-results h3, .discovery-choices h3 { margin: 0 0 var(--space-3); font-size: var(--font-size-md); }
.discovery-filters__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--space-3); }
.discovery-filters__grid label { display: flex; flex-direction: column; gap: 4px; font-size: var(--font-size-xs); font-weight: 600; color: var(--color-text); }
.discovery-filters__grid input, .discovery-filters__grid select { height: var(--control-height-md); font-size: var(--font-size-sm); }
.discovery-filters__hint { margin: var(--space-3) 0 0; font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.discovery-filters__actions { display: flex; gap: var(--space-2); margin-top: var(--space-4); flex-wrap: wrap; }
.discovery-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-top: var(--space-3); }
.discovery-chip {
  display: inline-flex; align-items: center; gap: 6px; font-size: var(--font-size-xs); font-weight: 600;
  background: var(--color-surface-muted); border: 1px solid var(--color-border); border-radius: var(--radius-pill);
  padding: 4px 6px 4px 12px;
}
.discovery-chip button { border: none; background: none; cursor: pointer; font-size: 14px; line-height: 1; color: var(--color-text-secondary); padding: 2px; }
.discovery-chip button:hover { color: var(--color-danger); }

.discovery-results-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-3); margin-top: var(--space-2); }
.discovery-result-card {
  border: 1px solid var(--color-border); border-radius: var(--radius-medium); padding: var(--space-3);
  display: flex; flex-direction: column; gap: var(--space-2); background: #fff;
}
.discovery-result-card--added { background: var(--color-surface-muted); border-style: dashed; }
.discovery-result-card header { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-2); flex-wrap: wrap; }
.discovery-result-card__type { font-size: 10px; text-transform: uppercase; color: var(--color-text-secondary); }
.discovery-result-card__program { margin: 0; font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.discovery-result-card__meta { display: flex; flex-wrap: wrap; gap: var(--space-2); font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.discovery-badge { border-radius: var(--radius-pill); padding: 1px 8px; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.discovery-badge--discount { background: #dcfce7; color: #166534; }
/* Session 22, §1/§9 — honest canonical-mapping-state badge on discovery result cards. */
.discovery-badge--canonical { background: #eef2ff; color: #3730a3; text-transform: none; }
.discovery-badge--unmapped { background: #f3f4f6; color: #6b7280; text-transform: none; }
.catalog-state-inline { font-size: var(--font-size-xs); color: var(--color-text-secondary); font-style: italic; margin: var(--space-2) 0 0; }

.choice-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.choice-row {
  display: flex; align-items: center; gap: var(--space-3); padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-small); background: var(--color-surface-muted);
}
.choice-row__order { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: var(--color-primary); color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
/* SESSION 28.4, §11 — .choice-row__body had no min-width:0, so inside .choice-row's flex layout a
   long university/program/applicant name (no wrap/truncation rule on the <strong> either) forced
   the row to overflow horizontally instead of wrapping, pushing status badges/actions out past the
   card edge. Reused by three places: admission-case-workspace.js's choice-summary rows, the shared
   university-selection-ui.js panel's own choice list, AND university-selection-page.js's applicant
   search-result rows — one fix covers all three. Wrapping (not ellipsis) per spec preference: the
   full name stays visible, just on more than one line when it doesn't fit. */
.choice-row__body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.choice-row__body strong { overflow-wrap: anywhere; }
.choice-row__program { font-size: var(--font-size-xs); color: var(--color-text-secondary); overflow-wrap: anywhere; }
.choice-row__availability { height: var(--control-height-sm); font-size: var(--font-size-xs); }
.choice-row__actions { display: flex; gap: 2px; }

/* ---- Admission Case workspace (Applicant kartının Müraciətlər tabı) -------------------------- */
.admission-case-header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; margin-bottom: var(--space-3); }
.choice-source-toggle { display: flex; gap: 4px; background: var(--color-surface-muted); border-radius: var(--radius-small); padding: 3px; margin-bottom: var(--space-3); width: fit-content; }
.choice-source-tab { border: none; background: none; padding: 6px 14px; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--radius-small); cursor: pointer; color: var(--color-text-secondary); }
.choice-source-tab.active { background: #fff; color: var(--color-primary); box-shadow: var(--shadow-sm, 0 1px 2px rgba(16,24,40,.08)); }
.choice-catalog-panel { display: grid; gap: 5px; min-width: 0; margin-bottom: var(--space-4); }
.choice-catalog-panel__search { display: grid; gap: 5px; font-size: var(--font-size-xs); font-weight: 600; color: var(--color-text); }
.choice-catalog-panel__search input { width: 100%; min-width: 0; }
.choice-catalog-panel__search-row { display: flex; align-items: center; gap: 8px; min-width: 0; }
.choice-catalog-panel__search-row input { flex: 1 1 auto; }
.choice-catalog-panel__search-row .mini-action { flex: 0 0 auto; white-space: nowrap; }
.choice-catalog-panel__hint, .choice-catalog-selected__empty { color: var(--color-text-secondary); font-size: var(--font-size-xs); }
.choice-catalog-results { max-height: min(250px, 30dvh); overflow-y: auto; border: 1px solid var(--color-border); border-radius: var(--radius-small); background: var(--color-surface); }
.choice-catalog-results:empty { display: none; }
.choice-catalog-results__list { display: grid; }
.choice-catalog-result { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 2px 9px; width: 100%; padding: 8px 10px; border: 0; border-bottom: 1px solid var(--color-border-subtle); background: #fff; text-align: left; }
.choice-catalog-result:last-child { border-bottom: 0; }
button.choice-catalog-result { cursor: pointer; }
button.choice-catalog-result:hover, button.choice-catalog-result:focus-visible { background: var(--color-surface-muted); outline: none; }
.choice-catalog-result strong { grid-row: span 2; align-self: center; color: var(--color-primary); font-size: var(--font-size-xs); }
.choice-catalog-result span { min-width: 0; color: var(--color-text); font-size: var(--font-size-sm); font-weight: 600; overflow-wrap: anywhere; }
.choice-catalog-result small { min-width: 0; color: var(--color-text-secondary); font-size: var(--font-size-xs); overflow-wrap: anywhere; }
.choice-catalog-result--context { background: var(--color-surface-muted); }
.choice-catalog-drill-toolbar { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 10px; padding: 7px 9px; border-bottom: 1px solid var(--color-border); background: var(--color-surface); }
.choice-catalog-drill-toolbar > span { min-width: 0; color: var(--color-text-secondary); font-size: var(--font-size-xs); overflow-wrap: anywhere; }
.choice-catalog-group { border-bottom: 1px solid var(--color-border); }
.choice-catalog-group:last-child { border-bottom: 0; }
.choice-catalog-group__heading { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; width: 100%; padding: 8px 10px; border: 0; border-bottom: 1px solid var(--color-border-subtle); background: var(--color-surface-muted); text-align: left; cursor: pointer; }
.choice-catalog-group__heading:hover, .choice-catalog-group__heading:focus-visible { background: #edf3ff; outline: none; }
.choice-catalog-group__heading span { color: var(--color-primary); font-size: var(--font-size-xs); font-weight: 600; }
.choice-catalog-group__heading strong { grid-column: 1; color: var(--color-text); font-size: var(--font-size-sm); font-weight: 600; }
.choice-catalog-group__heading small { grid-column: 1; color: var(--color-text-secondary); font-size: var(--font-size-xs); }
.choice-catalog-group__heading::after { grid-column: 2; grid-row: 1 / span 3; align-self: center; content: 'Açıq ixtisaslara bax'; color: var(--color-text-secondary); font-size: var(--font-size-xs); }
.choice-catalog-state { margin: 0; padding: 10px 12px; color: var(--color-text-secondary); font-size: var(--font-size-xs); }
.choice-catalog-state--error { color: var(--color-danger); }
.choice-catalog-selected__empty { margin: 2px 0 0; }
.choice-catalog-selected__card { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid #c8d8fa; border-radius: var(--radius-small); background: #f3f7ff; }
.choice-catalog-selected__card > div { display: grid; gap: 2px; min-width: 0; }
.choice-catalog-selected__card small { color: var(--color-primary); font-size: var(--font-size-xs); font-weight: 600; }
.choice-catalog-selected__card strong, .choice-catalog-selected__card span { overflow-wrap: anywhere; }
.choice-catalog-selected__card span { color: var(--color-text-secondary); font-size: var(--font-size-xs); }
@media (max-width: 600px) { .choice-catalog-result { grid-template-columns: 64px minmax(0,1fr); padding: 8px; } .choice-catalog-selected__card { align-items: flex-start; flex-direction: column; } }
.choice-availability-bar { display: flex; flex-wrap: wrap; gap: 4px; margin-top: var(--space-2); }
.availability-chip {
  border: 1px solid var(--color-border); background: #fff; border-radius: var(--radius-pill); padding: 3px 10px;
  font-size: 10px; font-weight: 600; cursor: pointer; color: var(--color-text-secondary);
}
.availability-chip.active { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.status-summary-panel { border: 1px dashed var(--color-border); border-radius: var(--radius-medium); padding: var(--space-3); background: var(--color-surface-muted); font-size: var(--font-size-xs); }
.status-summary-panel__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-2); }
.status-summary-panel__body { margin: 0; white-space: pre-wrap; font-family: inherit; font-size: var(--font-size-xs); }
.admission-case-header__status { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }

/* Session 12 — Communication Center recipient picker + recent-log panel (admission-case-workspace.js). */
.communication-recipients { display: flex; flex-direction: column; gap: var(--space-2); margin: var(--space-3) 0; }
.communication-recipient { display: flex; align-items: flex-start; gap: 8px; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: var(--radius-medium); font-size: var(--font-size-xs); }
.communication-recipient input { margin-top: 2px; }
.communication-recipient small { display: block; color: var(--color-muted-text); }
.communication-recipient--disabled { opacity: .55; }
.communication-log { margin-top: var(--space-3); font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.communication-log ul { margin: 6px 0 0; padding-left: 18px; }
.availability-chip--available { border-color: #16a34a; color: #16a34a; }
.availability-chip--not_available { border-color: var(--color-danger); color: var(--color-danger); }
.availability-chip--waiting_response, .availability-chip--checking { border-color: #d97706; color: #d97706; }
.availability-chip--conditional { border-color: #7c3aed; color: #7c3aed; }

@media (max-width: 768px) {
  .admission-case-card__header, .consultation-card__header, .consultation-detail__header { flex-direction: column; }
  .choice-row { flex-wrap: wrap; }
  .discovery-filters__grid { grid-template-columns: 1fr; }
}

/* =========================================================================
   SESSION 10.2 — İlkin məsləhət UX/vocabulary/discovery-controls korreksiyası.
   Arxitektura DƏYİŞMİR (bax: consultations-page.js şərhi) — bura yalnız yeni görünüş qatı
   əlavə edir: searchable-select widget-i (assets/js/searchable-select.js), qruplaşdırılmış
   büdcə bölməsi, təkmilləşdirilmiş nəticə kartları/çip-lər/seçilmiş variantlar. Mövcud
   tokenlərdən (--space-*, --radius-*, --control-height-*, --color-*) istifadə edir, yeni rəng
   palitrası əlavə edilmir.
   ========================================================================= */

.discovery-filters__subtitle { margin: -6px 0 var(--space-4); font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.discovery-filters__field-note { display: block; margin-top: 4px; font-size: 11px; color: var(--color-text-secondary); font-style: italic; }

/* ---- Searchable-select (Section 13) ------------------------------------------------------- */
.ss-mount { position: relative; }
.searchable-select { position: relative; }
.searchable-select__trigger {
  width: 100%; height: var(--control-height-md); display: flex; align-items: center; gap: 8px;
  border: 1px solid var(--color-border); border-radius: var(--radius-small); background: #fff;
  padding: 0 10px; font-size: var(--font-size-sm); color: var(--color-text); cursor: pointer; text-align: left;
}
.searchable-select--open .searchable-select__trigger { border-color: var(--color-primary); }
.searchable-select__trigger[disabled] { background: #f4f5f7; color: var(--color-muted-text); cursor: not-allowed; }
.searchable-select__trigger-text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.searchable-select__trigger-text.is-placeholder { color: var(--color-muted-text); }
.searchable-select__trigger--multiple { min-height: var(--control-height-md); height: auto; padding-block: 5px; }
.searchable-select__chips { flex: 1 1 auto; min-width: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.searchable-select__chip { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; padding: 3px 6px; border-radius: 999px; background: var(--color-surface-muted); color: var(--color-text); font-size: var(--font-size-xs); line-height: 1.25; }
.searchable-select__chip [data-ss-remove] { display: inline-grid; place-items: center; width: 15px; height: 15px; border-radius: 50%; color: var(--color-text-secondary); font-size: 13px; line-height: 1; }
.searchable-select__chip [data-ss-remove]:hover { background: #fff; color: var(--color-danger); }
.searchable-select__clear {
  flex: 0 0 auto; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%;
  color: var(--color-text-secondary); font-size: 14px; line-height: 1;
}
.searchable-select__clear:hover { background: var(--color-surface-muted); color: var(--color-danger); }
.searchable-select__caret { flex: 0 0 auto; color: var(--color-muted-text); }
.searchable-select__panel {
  position: absolute; z-index: 40; top: calc(100% + 4px); left: 0; right: 0; min-width: 240px;
  background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-medium);
  box-shadow: var(--shadow-lg, 0 8px 24px rgba(16,24,40,.12)); padding: 8px; display: flex; flex-direction: column; gap: 6px;
  /* SESSION 28.5, §10 — safety net on the PANEL itself, not just the inner
     .searchable-select__options list: when the manual-entry sub-section is expanded (search input +
     230px options list + manual-trigger + manual form + actions all stacked), total panel height can
     exceed what a short field's remaining page/modal space can take, so the dropdown visually spills
     over sibling fields/buttons below it (spec §10's exact complaint, seen in the İstiqamət/İxtisas
     picker inside #applicantModal). Bounding the whole panel and letting IT scroll — instead of only
     its options sub-list — keeps the popup's footprint predictable everywhere it's used. */
  max-height: min(420px, calc(100vh - 160px)); overflow-y: auto;
}
.searchable-select__search, .searchable-select__manual-input {
  height: var(--control-height-sm); border: 1px solid var(--color-border); border-radius: var(--radius-small);
  padding: 0 10px; font-size: var(--font-size-sm);
}
.searchable-select__options { max-height: 230px; overflow-y: auto; display: flex; flex-direction: column; gap: 1px; }
.searchable-select__option { padding: 8px 10px; border-radius: 6px; font-size: var(--font-size-sm); cursor: pointer; }
.searchable-select__option:hover, .searchable-select__option.is-highlighted { background: var(--color-surface-muted); }
.searchable-select__option.is-selected { color: var(--color-primary); font-weight: 600; background: var(--color-surface-muted); }
.searchable-select__empty { padding: 10px; font-size: var(--font-size-xs); color: var(--color-text-secondary); font-style: italic; text-align: center; }
.searchable-select__manual-trigger {
  border: 1px dashed var(--color-border); background: none; border-radius: var(--radius-small); padding: 8px 10px;
  font-size: var(--font-size-xs); font-weight: 600; color: var(--color-primary); cursor: pointer; text-align: left;
}
.searchable-select__manual-trigger:hover { background: var(--color-surface-muted); }
.searchable-select__manual { display: flex; flex-direction: column; gap: 8px; }
.searchable-select__manual-actions { display: flex; justify-content: flex-end; gap: 6px; }

/* ---- Büdcə klasteri (Section 11) ---------------------------------------------------------- */
.discovery-budget { margin-top: var(--space-4); padding: var(--space-3); background: var(--color-surface-muted); border-radius: var(--radius-medium); }
.discovery-budget__title { margin: 0 0 var(--space-2); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--color-text-secondary); }
.discovery-budget__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--space-3); }
.discovery-budget__row label { display: flex; flex-direction: column; gap: 4px; font-size: var(--font-size-xs); font-weight: 600; color: var(--color-text); }
.discovery-budget__row input, .discovery-budget__row select { height: var(--control-height-md); font-size: var(--font-size-sm); }

/* ---- Yurd/təqaüd toggle-ları (Section 12) ------------------------------------------------- */
.discovery-filters__toggles { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-4); }
.check-option--card {
  display: flex; align-items: center; gap: 9px; padding: 10px 14px; border: 1px solid var(--color-border);
  border-radius: var(--radius-medium); background: #fff; font-size: var(--font-size-sm); font-weight: 500;
  cursor: pointer; min-height: var(--control-min-tap);
}
.check-option--card:has(input:checked) { border-color: var(--color-primary); background: #eef4ff; }
.check-option--card input { width: 18px; height: 18px; margin: 0; }

/* ---- Nəticə kartı ierarxiyası (Section 14) ------------------------------------------------ */
.discovery-result-card header { align-items: flex-start; }
.discovery-result-card__titles { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.discovery-result-card__program { font-size: var(--font-size-sm); color: var(--color-text); line-height: var(--line-height-tight); }
.discovery-result-card__university { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.discovery-result-card__meta-empty { font-style: italic; color: var(--color-muted-text); }
.discovery-result-card__details {
  display: flex; flex-direction: column; gap: 4px; padding: var(--space-2) var(--space-3);
  background: var(--color-surface-muted); border-radius: var(--radius-small); font-size: var(--font-size-xs); color: var(--color-text-secondary);
}
.discovery-result-card__actions { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); margin-top: auto; padding-top: var(--space-2); }

/* ---- Seçilmiş variantlar (Section 15) ------------------------------------------------------ */
.choice-row__price { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.choice-row__actions .icon-button { display: grid; place-items: center; color: var(--color-text-secondary); }
.choice-row__actions .icon-button:hover:not([disabled]) { color: var(--color-primary); }
.choice-row__actions .icon-button[disabled] { opacity: .35; cursor: not-allowed; }

@media (max-width: 768px) {
  .discovery-budget__row { grid-template-columns: 1fr; }
  .discovery-result-card__actions { flex-direction: column; align-items: stretch; }
  .searchable-select__panel { left: 0; right: 0; }
}

/* SESSION 11 — the applicant intake form (#applicantForm, used both for "Yeni abituriyent" and
   the İlkin məsləhət→müraciət conversion) keeps its original <select name="major"/"desiredCity">
   in the DOM so existing FormData/set()/validate() logic in modal.js is untouched; a
   searchable-select (real catalog specialty/city data, Session 10.2 component) is mounted next to
   it and drives the same hidden <select> via its onChange. The <select> is hidden, not removed. */
.visually-hidden-field { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
/* components.css's .form-grid label.has-error styles the real (now hidden) <select> — mirror the
   same red-border treatment onto the searchable-select trigger so validation errors stay visible. */
.form-grid label.has-error .searchable-select__trigger { border-color: var(--color-danger); box-shadow: 0 0 0 3px rgba(220,38,38,.08); }

/* =========================================================================
   SESSION 13 — Operations Dashboard ("İdarə paneli" / "Operativ nəzarət").
   Built entirely on existing primitives (.card, .stat-card, .badge, .table-scroll, .empty-state,
   .catalog-state, .detail-tabs) — no new color tokens, only 3 new severity-tone badge modifiers
   that reuse the same --color-danger/--color-warning/--color-info variables every other badge
   already uses (Section 15: severity is presentation-only, never persisted).
   ========================================================================= */
.badge--severity-critical { background: #fcebec; color: var(--color-danger); }
.badge--severity-warning { background: #fff1de; color: var(--color-warning); }
.badge--severity-info { background: #e8f0ff; color: var(--color-info); }

/* SESSION 28.6C, Task F — İdarə paneli (Operations Dashboard) visual redesign. Presentation-only:
   OperationsDashboardService/API contracts are untouched, only CSS + a non-semantic .ops-dashboard
   wrapper div in operations-dashboard-page.js (for scoping) change. Palette is deliberately
   restrained — reuses the app's EXISTING tokens only (--color-primary #14213D dark navy,
   --color-accent #D4A72C "muted gold", --color-surface-muted soft gray, white), no new colors
   invented, no gradients/glow/neon (unlike premium.css's shell chrome elsewhere in the app), no
   oversized icons. `.card` was previously a completely UNSTYLED bare class (grep confirmed it is
   used ONLY on this page) — the KPI/side-panel cards rendered with no border/background at all;
   this is the first real chrome they get, scoped to .ops-dashboard so no other screen is affected. */
.ops-dashboard { display: flex; flex-direction: column; gap: var(--space-4); }
/* Product-completion finishing pass — .doc-card/.consultation-card/.manual-review-tab elsewhere in
   this app all use this exact var(--shadow-sm, ...) fallback for a subtle card lift; .ops-dashboard
   .card had none (flat border only), the one remaining "looks like an admin tool, not a commercial
   product" gap from the two prior Dashboard passes. Same reused token/fallback, no new value invented. */
.ops-dashboard .card { background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-medium); padding: var(--space-4); box-shadow: var(--shadow-sm, 0 1px 4px rgba(16,24,40,.06)); }

.ops-toolbar {
  display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-3) var(--space-4);
  background: var(--color-surface-muted); border: 1px solid var(--color-border); border-radius: var(--radius-medium);
}

.ops-kpi-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--space-3); margin-bottom: 0; }
.ops-kpi-card {
  display: flex; flex-direction: column; gap: 6px; text-align: left; cursor: pointer;
  border-left: 3px solid transparent; transition: border-color .15s ease, background-color .15s ease;
}
.ops-kpi-card:hover { border-color: var(--color-accent); background: #fffdf7; }
.ops-dashboard .ops-kpi-card--active { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.ops-dashboard .ops-kpi-card--active:focus-visible { outline: 3px solid var(--color-accent); }
.ops-kpi-card[data-kpi-key="overdue"] { border-left-color: var(--color-danger); }
.ops-kpi-card strong { font-size: var(--font-size-2xl); line-height: 1.1; font-weight: 700; color: var(--color-primary); letter-spacing: -.02em; }
.ops-kpi-card span { font-size: var(--font-size-xs); color: var(--color-text-secondary); font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
/* Product-directive deepening pass — the "Diqqət tələb edən" (total) card is the anchor number an
   operator should register first; it gets a filled navy treatment instead of competing equally with
   the other four plain cards. Still a flat, solid --color-primary fill only — no CSS transition trick. */
/* Session 30 RC Dashboard-acceptance fix: .ops-dashboard .card (0,2,0 specificity, background:#fff)
   was beating this rule (0,1,0) regardless of source order, so the navy fill never applied and the
   white strong/span text rendered invisible on the leftover white background. Scoping to
   .ops-dashboard (matching the convention at line 845) restores the intended specificity. */
.ops-dashboard .ops-kpi-card--primary { background: var(--color-primary); border-left-color: var(--color-primary); }
.ops-dashboard .ops-kpi-card--primary:hover { background: var(--color-primary-hover); border-color: var(--color-primary-hover); }
.ops-kpi-card--primary strong { color: #fff; }
.ops-kpi-card--primary span { color: rgba(255,255,255,.72); }
.ops-kpi-caption { margin: calc(-1 * var(--space-2)) 0 0; color: var(--color-text-secondary); font-size: var(--font-size-xs); }

.ops-filter-bar { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; margin-bottom: 0; }
.ops-filter-bar label { display: flex; flex-direction: column; gap: 4px; font-size: 11px; font-weight: 600; color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: .03em; }
.ops-filter-bar select { min-width: 190px; background: #fff; }
.ops-reset-button { align-self: end; white-space: nowrap; }

.ops-preset-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 0; padding-top: var(--space-2); border-top: 1px solid var(--color-border); }
.ops-preset-tabs .detail-tab { border: 1px solid var(--color-border); border-radius: var(--radius-pill); background: #fff; height: 34px; }
.ops-preset-tabs .detail-tab.active { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.ops-preset-tabs .detail-tab:not(.active):hover { border-color: var(--color-primary); color: var(--color-primary); background: #fff; }

/* GOLD EDU Visual Redesign, Phase 3 — responsive fix. Grid tracks default to an "auto" (min-content)
   floor, so the attention table's non-wrapping cells (university/program names, dates) were dragging
   this whole two-column grid wider than the viewport at intermediate widths (~1024-1360px), even
   though the table already sits in a .table-scroll wrapper (table.css) meant to absorb overflow
   internally. minmax(0, ...) removes that floor so the track — and therefore .table-scroll — can
   actually shrink to the available space and take over the horizontal scroll itself. Presentation
   only; no change to operations-dashboard-page.js or OperationsDashboardService. */
.ops-columns { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--space-4); align-items: start; }
.ops-side-panel { display: flex; flex-direction: column; gap: var(--space-3); }

/* UX polish pass — .ops-attention-table itself had no base cell padding/border/column-gap rule at
   all (only the >=769px-irrelevant mobile stacked-layout rule below styled its <td>s), so adjacent
   columns' text ran directly together at normal desktop widths (e.g. "...Kompüter
   mühəndisliyiDemo Administrator1 gündür..." reported live) — this mirrors the existing
   .report-table cell-spacing pattern a few lines below in this same file, CSS-only, no structural
   change to operations-dashboard-page.js's table markup. */
.ops-attention-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.ops-attention-table th { text-align: left; padding: 10px 14px; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; color: var(--color-text-secondary); border-bottom: 1px solid var(--color-border); white-space: nowrap; background: var(--color-surface-muted); }
.ops-attention-table td { padding: 12px 14px; border-bottom: 1px solid var(--color-border-subtle, #eee); }
.ops-attention-table tbody tr:last-child td { border-bottom: none; }
.ops-attention-row td { vertical-align: top; }
.ops-attention-row:hover td { background: var(--color-surface-muted); }
.ops-attention-row__reason { display: flex; flex-direction: column; gap: 4px; }
.ops-attention-row__meta { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.ops-attention-table__actions { text-align: right; white-space: nowrap; }
.ops-open-button { color: var(--color-primary); border-color: var(--color-border); font-weight: 700; }
.ops-open-button:hover { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
/* Long university/program names no longer stretch the column unbounded — truncate with a native
   title tooltip for the full text, same pattern as .university-identity strong elsewhere. */
.ops-truncate { display: inline-block; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }

/* Shared small text-monogram avatar (applicant/employee names) — same visual language as the
   existing .university-logo circle, just sized for a dense table/list row, not a new icon system. */
.ops-applicant-cell { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ops-avatar {
  flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  background: var(--color-surface-muted); color: var(--color-primary); font-size: 11px; font-weight: 700;
  border: 1px solid var(--color-border);
}
.ops-avatar--sm { width: 24px; height: 24px; font-size: 10px; }

.ops-workload-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); padding: var(--space-3) 0; border-bottom: 1px solid var(--color-border-subtle, #eee); }
.ops-workload-row:last-child { border-bottom: none; }
.ops-workload-row__name { font-weight: 600; font-size: var(--font-size-sm); color: var(--color-text); }
.ops-workload-row__stats { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ops-chip { padding: 3px 8px; border-radius: var(--radius-pill); background: var(--color-surface-muted); color: var(--color-text-secondary); font-size: 11px; font-weight: 600; white-space: nowrap; }
.ops-chip--danger { background: #fcebec; color: var(--color-danger); }
.ops-chip--warning { background: #fff1de; color: var(--color-warning); }

.ops-activity-item { display: flex; align-items: flex-start; gap: 10px; padding: var(--space-2) 0; border-bottom: 1px solid var(--color-border-subtle, #eee); font-size: var(--font-size-sm); }
.ops-activity-item:last-child { border-bottom: none; }
.ops-activity-item__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ops-activity-item__time { font-size: var(--font-size-xs); color: var(--color-muted-text); }
/* Small colored dot per activity type — not an icon glyph, just a scan aid using existing semantic
   colors (info/success/warning/primary), consistent with the app's badge-tone convention. */
.ops-activity-item__type { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; background: var(--color-neutral); }
.ops-activity-item__type--task { background: var(--color-warning); }
.ops-activity-item__type--application { background: var(--color-info); }
.ops-activity-item__type--choice { background: var(--color-accent); }
.ops-activity-item__type--document { background: var(--color-success); }
.ops-activity-item__type--communication { background: var(--color-primary); }

@media (max-width: 1024px) {
  .ops-columns { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .ops-kpi-strip { grid-template-columns: repeat(2, 1fr); }
  .ops-attention-table thead { display: none; }
  .ops-attention-table, .ops-attention-table tbody, .ops-attention-table tr, .ops-attention-table td { display: block; width: 100%; }
  .ops-attention-row { border: 1px solid var(--color-border-subtle, #eee); border-radius: var(--radius-small); margin-bottom: var(--space-2); padding: var(--space-2); }
  .ops-attention-row td { padding: 2px 0; }
  .ops-attention-row td[data-label]::before { content: attr(data-label); display: block; font-size: 11px; color: var(--color-muted-text); text-transform: uppercase; }
}

/* Dashboard 2.0: compact, scan-first presentation. All rules stay inside this page. */
.ops-dashboard { gap: 12px; }
.ops-page-header { margin-bottom: 0; align-items: center; }
.ops-page-header h1 { margin: 0; }
.ops-kpi-strip { display: flex; flex-direction: column; gap: 6px; }
.ops-kpi-primary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ops-dashboard .ops-kpi-card {
  min-width: 0; min-height: 68px; display: flex; flex-direction: row; align-items: center;
  gap: 10px; padding: 10px 14px; border-left-width: 1px; box-shadow: none;
}
.ops-dashboard .ops-kpi-card strong { flex: 0 0 auto; font-size: 23px; line-height: 1; font-variant-numeric: tabular-nums; }
.ops-dashboard .ops-kpi-card span { font-size: 12px; line-height: 1.25; font-weight: 600; letter-spacing: 0; text-transform: none; }
.ops-dashboard .ops-kpi-card--primary { border-color: var(--color-primary); }
.ops-dashboard .ops-kpi-card--primary strong { color: #fff; }
.ops-dashboard .ops-kpi-card--primary span { color: #fff; }
.ops-dashboard .ops-kpi-card--active { outline: 2px solid var(--color-accent); outline-offset: -2px; }
.ops-more-kpis { align-self: flex-start; }
.ops-more-kpis > summary { width: max-content; cursor: pointer; color: var(--color-primary); font-size: 12px; font-weight: 600; padding: 2px 4px; }
.ops-kpi-secondary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: min(460px, calc(100vw - 3rem)); margin-top: 7px; }
.ops-dashboard .ops-kpi-secondary .ops-kpi-card { min-height: 54px; }
.ops-dashboard .ops-kpi-secondary .ops-kpi-card strong { font-size: 19px; }

.ops-toolbar { padding: 10px 12px; background: #fff; }
.ops-filter-bar { display: grid; grid-template-columns: minmax(150px, 1.1fr) minmax(150px, 1.1fr) minmax(135px, .75fr) auto; gap: 10px; align-items: end; }
.ops-filter-bar label { min-width: 0; font-size: 11px; letter-spacing: 0; text-transform: none; }
.ops-filter-bar select { width: 100%; min-width: 0; height: 36px; font-size: 13px; }
.ops-dashboard .ops-reset-button { align-self: end; min-height: 36px; height: 36px; white-space: nowrap; overflow-wrap: normal; padding-inline: 12px; }

.ops-columns { grid-template-columns: minmax(0, 1fr) minmax(245px, 280px); gap: 12px; }
.ops-attention-section { min-width: 0; background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-medium); overflow: hidden; }
.ops-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--color-border); }
.ops-section-heading h2 { margin: 0; font-size: 16px; font-weight: 600; color: var(--color-primary); }
.ops-section-heading span { font-size: 12px; color: var(--color-text-secondary); white-space: nowrap; }
.ops-attention-list { display: block; }
.ops-attention-row { padding: 10px 14px; border: 0; border-bottom: 1px solid var(--color-border-subtle, #eee); min-width: 0; }
.ops-attention-row:last-child { border-bottom: 0; }
.ops-attention-row:hover { background: var(--color-surface-muted); }
.ops-attention-row__main { display: grid; grid-template-columns: minmax(120px, 1.2fr) minmax(145px, 1.4fr) minmax(95px, .8fr) auto; gap: 10px; align-items: center; }
.ops-attention-row__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; }
.ops-attention-row__reason { min-width: 0; display: flex; flex-direction: row; align-items: center; gap: 5px; font-size: 12px; }
.ops-attention-row__reason > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ops-attention-row__reason .badge { flex: 0 0 auto; font-size: 10px; padding: 2px 5px; white-space: nowrap; }
.ops-attention-row__time { color: var(--color-text-secondary); font-size: 12px; white-space: nowrap; }
.ops-attention-row__details { display: flex; justify-content: space-between; gap: 12px; min-width: 0; padding: 5px 58px 0 38px; color: var(--color-text-secondary); font-size: 12px; }
.ops-attention-row__details .ops-truncate { flex: 1 1 auto; min-width: 0; max-width: none; }
.ops-attention-row__employee { flex: 0 0 auto; max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ops-dashboard .ops-open-button { min-width: 48px; width: 48px; min-height: 34px; height: 34px; padding: 0 9px; white-space: nowrap; overflow-wrap: normal; text-align: center; }
.ops-dashboard .ops-open-button--task { width: auto; }
.ops-empty { margin: 0; padding: 22px 14px; color: var(--color-text-secondary); font-size: 13px; }

.ops-side-panel { gap: 8px; }
.ops-dashboard .ops-secondary-card { padding: 0 12px; box-shadow: none; }
.ops-secondary-card > summary { cursor: pointer; padding: 11px 0; color: var(--color-primary); font-size: 13px; font-weight: 600; }
.ops-secondary-card[open] > summary { border-bottom: 1px solid var(--color-border); }
.ops-secondary-card > div { padding: 4px 0 7px; }
.ops-workload-row { flex-direction: column; align-items: stretch; gap: 4px; padding: 7px 0; }
.ops-workload-row__stats { justify-content: flex-start; }
.ops-activity-item { padding: 7px 0; font-size: 12px; }

@media (max-width: 1100px) {
  .ops-columns { grid-template-columns: 1fr; }
  .ops-side-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .ops-kpi-primary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ops-filter-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ops-dashboard .ops-reset-button { width: 100%; }
  .ops-attention-row { margin: 0; border: 0; border-bottom: 1px solid var(--color-border-subtle, #eee); border-radius: 0; padding: 10px 12px; }
  .ops-attention-row__main { grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: 'name time action' 'reason reason reason'; gap: 6px; }
  .ops-attention-row__main .ops-applicant-cell { grid-area: name; }
  .ops-attention-row__reason { grid-area: reason; }
  .ops-attention-row__time { grid-area: time; }
  .ops-open-button { grid-area: action; }
  .ops-attention-row__details { padding: 5px 0 0; }
  .ops-side-panel { grid-template-columns: 1fr; }
}
@media (max-width: 420px) {
  .ops-dashboard .ops-kpi-card { padding: 9px; gap: 7px; }
  .ops-dashboard .ops-kpi-card strong { font-size: 20px; }
  .ops-dashboard .ops-kpi-card span { font-size: 11px; }
  .ops-filter-bar { grid-template-columns: 1fr; }
  .ops-attention-row__main { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: 'name action' 'reason reason' 'time time'; }
  .ops-attention-row__time { display: inline; }
  .ops-attention-row__details { flex-direction: column; gap: 4px; }
  .ops-attention-row__employee { max-width: 100%; }
}

/* =========================================================================
   SESSION 15 — Ödənişlər (Finance / Student Payments + Debt Control). Yalnız görünüş: bütün
   datalar assets/js/applicant-finance-ui.js-dən gəlir. Mövcud .doc-card/.doc-card-list/
   .doc-list-toolbar/.badge/.mini-action/.catalog-state siniflərinin üzərinə qurulur, eyni prinsip
   TAPŞIRIQLAR/MÜRACIƏTLƏR bölmələri ilə (bax: yuxarı şərhlər). Yalnız summary kartları üçün yeni,
   kiçik bir grid lazımdır — heç bir yeni rəng tonu YOXDUR (mövcud badge tonları təkrar istifadə
   olunur), valyuta qarışdırılmır (Bölmə 5): hər kart TƏK bir valyutanı göstərir.
   ========================================================================= */
.finance-section { margin-bottom: var(--space-4); }
.finance-section h3 { font-size: var(--font-size-sm); margin: 0 0 var(--space-2); color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: .02em; }
/* Session 29, §14-15 — one-line clarifying hint under the "Universitet hesabları"/"GOLD EDU xidmət
   haqqı" group headers (see applicant-finance-ui.js render()). Reuses --color-text-secondary, no
   new color token. */
.finance-section__hint { margin: -4px 0 var(--space-2); font-size: var(--font-size-xs); color: var(--color-text-secondary); }

/* Session 29, §25 — Applicant list "Növbəti addım" column. Reuses .badge/badge--waiting as-is. */
.next-action-cell__empty { color: var(--color-text-secondary); }
.finance-summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--space-3); }
.finance-summary-card { border: 1px solid var(--color-border); border-radius: var(--radius-small); padding: var(--space-3); background: #fff; }
.finance-summary-card header { font-weight: 700; font-size: var(--font-size-sm); margin-bottom: 6px; }
.finance-summary-card dl { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.finance-summary-card dl > div { display: flex; justify-content: space-between; gap: var(--space-2); font-size: var(--font-size-xs); }
.finance-summary-card dt { color: var(--color-text-secondary); }
.finance-summary-card dd { margin: 0; font-weight: 600; }
.finance-summary-card dd.is-outstanding { color: var(--color-danger); }

@media (max-width: 640px) {
  .finance-summary-grid { grid-template-columns: 1fr; }
}

/* =========================================================================
   SESSION 16 — Applicant 360 Workspace ("Ümumi məlumat" tabı). Yalnız görünüş: bütün datalar
   assets/js/applicant-overview.js-dən gəlir. Mövcud .badge/.badge--severity-* /.mini-action/
   .catalog-state/.finance-summary-card/.finance-summary-grid siniflərinin üzərinə qurulur, yeni
   rəng tonu YARADILMIR (mövcud --color-danger/--color-warning/--color-info təkrar istifadə olunur).
   Grid: qalan bölmələr (pipeline-dən sonra) auto-fit kart şəbəkəsində sıralanır (Bölmə 16: "no
   horizontal scroll, responsive").

   GOLD EDU Visual Redesign, Phase 4, §18 — Diqqət tələb edir / Növbəti addım / Qəbul mərhələləri
   artıq .overview-grid-in ÜÇÜN DEYİL, ayrıca .overview-priority-stack-in içindədir (tam eni tutan,
   şaquli düzülmüş 3 bölmə) — bu 3 bölmə həmişə əsas məlumat şəbəkəsindən ƏVVƏL göstərilir.
   Presentation-only: eyni .overview-section kartları, yalnız DOM yerləşməsi dəyişib.
   ========================================================================= */
.overview-priority-stack { display: flex; flex-direction: column; gap: var(--space-4); margin-bottom: var(--space-4); }
.overview-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-4); align-items: start; margin-bottom: var(--space-4);
}

/* Session 29 Phase 1, §7 — Ümumi tab process indicator (Müraciət→Təkliflər→Universitet
   seçildi→Sənədlər→Universitet hesabı→Ödəniş təsdiqi→Qəbul→Tamamlandı). Reuses existing tokens
   only (--color-accent = muted gold brand accent, --color-success, --color-border,
   --color-text-secondary) — no new design tokens introduced. */
.overview-pipeline {
  display: flex; flex-wrap: wrap; align-items: center; list-style: none; margin: 0; padding: 0;
  gap: 0; row-gap: var(--space-2);
}
.overview-pipeline__step {
  display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-xs);
  color: var(--color-text-secondary); white-space: nowrap;
}
.overview-pipeline__step:not(:last-child)::after {
  content: ''; display: inline-block; width: 20px; height: 1px; background: var(--color-border);
  margin: 0 var(--space-2);
}
.overview-pipeline__dot { width: 9px; height: 9px; border-radius: 999px; background: var(--color-border); flex: none; }
.overview-pipeline__step.is-done { color: var(--color-text); }
.overview-pipeline__step.is-done .overview-pipeline__dot { background: var(--color-success, #15803d); }
.overview-pipeline__step.is-current { color: var(--color-text); font-weight: 600; }
.overview-pipeline__step.is-current .overview-pipeline__dot { background: var(--color-accent); box-shadow: 0 0 0 3px rgba(212,167,44,.2); }
@media (max-width: 720px) {
  .overview-pipeline { gap: var(--space-2); }
  .overview-pipeline__step:not(:last-child)::after { width: var(--space-2); }
}

.overview-section {
  border: 1px solid var(--color-border); border-radius: var(--radius-medium);
  padding: var(--space-4); background: #fff; min-width: 0;
}
.overview-section--muted { background: var(--color-surface-muted); }
.overview-section--next-action { background: var(--color-surface-muted); }
.overview-section h3 {
  font-size: var(--font-size-xs); margin: 0 0 var(--space-3); color: var(--color-text-secondary);
  text-transform: uppercase; letter-spacing: .02em;
}
.overview-section__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); margin-bottom: var(--space-3); }
.overview-section__head h3 { margin: 0; }

.overview-attention-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.overview-attention-item {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2);
  padding: var(--space-2) var(--space-3); border-radius: var(--radius-small);
  background: var(--color-surface-muted); font-size: var(--font-size-sm); color: var(--color-text);
}
.overview-attention-item__context { color: var(--color-text-secondary); font-size: var(--font-size-xs); margin-left: auto; }

.overview-empty-note { margin: 0; font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.overview-next-action { margin: 0; font-size: var(--font-size-md); font-weight: 600; color: var(--color-text); }

.overview-admission-list { list-style: none; margin: 0 0 var(--space-2); padding: 0; display: flex; flex-direction: column; gap: var(--space-3); counter-reset: none; }
.overview-admission-list li { padding-bottom: var(--space-2); border-bottom: 1px solid var(--color-border); }
.overview-admission-list li:last-child { border-bottom: none; padding-bottom: 0; }
.overview-admission-list strong { display: block; font-size: var(--font-size-sm); }
.overview-admission-list > li > span { display: block; font-size: var(--font-size-xs); color: var(--color-text-secondary); margin-top: 2px; }
.overview-admission-list__status { font-weight: 500; }

.overview-more-note { margin: var(--space-1) 0 var(--space-3); font-size: var(--font-size-xs); color: var(--color-text-secondary); font-style: italic; }

.overview-stat-row { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); font-size: var(--font-size-sm); color: var(--color-text); margin-bottom: var(--space-3); }
.overview-stat-row .is-warning { color: var(--color-danger); font-weight: 600; }

.overview-next-item { margin: 0 0 var(--space-3); font-size: var(--font-size-xs); color: var(--color-text-secondary); }

.overview-line { margin: 0 0 var(--space-2); font-size: var(--font-size-sm); color: var(--color-text); }
.overview-line:last-of-type { margin-bottom: var(--space-3); }

.overview-contact-list { list-style: none; margin: 0 0 var(--space-3); padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.overview-contact-list li { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); font-size: var(--font-size-sm); }
.overview-contact-list li span { color: var(--color-text-secondary); font-size: var(--font-size-xs); }

.overview-meta-row { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); font-size: var(--font-size-xs); color: var(--color-text-secondary); }

.overview-section .is-outstanding { color: var(--color-danger); }

@media (max-width: 640px) {
  .overview-grid { grid-template-columns: 1fr; }
  .overview-attention-item__context { margin-left: 0; }
}

/* "Tarixçə" tabı (Session 16, applicant-timeline.js) — eyni .overview-section/.overview-empty-note
   kartının üzərinə qurulur, sadə şaquli siyahı. Yeni rəng tonu YOXDUR. */
.timeline-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.timeline-item { padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-small); background: #fff; }
.timeline-item__meta { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); flex-wrap: wrap; }
.timeline-item__meta strong { font-size: var(--font-size-sm); }
.timeline-item__meta span { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.timeline-item__detail { margin: var(--space-1) 0 0; font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.timeline-item__actor { margin: 4px 0 0; font-size: var(--font-size-xs); color: var(--color-muted-text); }
.timeline-item--communication { background: var(--color-surface-muted); }

/* =========================================================================
   SESSION 17 — Hesabatlar (Management Reports & Analytics). Deliberately VISUALLY DISTINCT from
   İdarə paneli's .ops-* kit (spec Section 23): no clickable/hover KPI cards (these are read-only
   totals, not filter triggers), a plain neutral border instead of a hover-primary border, and a
   restrained horizontal bar visualization instead of the Ops Dashboard's queue-style table. Same
   underlying tokens (--space-*, --color-*, --font-size-*) — no new color palette, no gradients, no
   emoji, matching the "professional management information system" instruction.
   ========================================================================= */
.report-header p { max-width: 640px; }

.report-period-bar { margin-bottom: var(--space-4); }
.report-preset-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: var(--space-2); }
.report-custom-dates { display: flex; flex-wrap: wrap; align-items: end; gap: var(--space-3); margin-bottom: var(--space-2); }
.report-custom-dates label { display: flex; flex-direction: column; gap: 4px; font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.report-period-note { margin: 0; font-size: var(--font-size-xs); color: var(--color-text-secondary); }

.report-kpi-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--space-3); margin-bottom: var(--space-3); }
.report-kpi-card { display: flex; flex-direction: column; gap: 4px; padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-small); background: #fff; }
.report-kpi-card strong { font-size: var(--font-size-xl); line-height: 1.1; font-variant-numeric: tabular-nums; }
.report-kpi-card span { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.report-kpi-card--muted { background: var(--color-surface-muted); }

.report-empty-note { margin: 0 0 var(--space-2); font-size: var(--font-size-xs); color: var(--color-text-secondary); }

.report-columns { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); align-items: start; margin-bottom: var(--space-4); }
.report-trend-columns { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); align-items: start; }

.report-bar-row { display: grid; grid-template-columns: 160px 1fr 40px; align-items: center; gap: var(--space-2); padding: 4px 0; }
.report-bar-row__label { font-size: var(--font-size-xs); color: var(--color-text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.report-bar-row__track { height: 8px; border-radius: 4px; background: var(--color-surface-muted); overflow: hidden; }
.report-bar-row__fill { height: 100%; background: var(--color-primary); border-radius: 4px; }
.report-bar-row__value { text-align: right; font-size: var(--font-size-xs); font-weight: 600; font-variant-numeric: tabular-nums; }

.report-table { width: 100%; font-size: var(--font-size-sm); }
.report-table th { text-align: left; padding: 8px 10px; font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: var(--color-text-secondary); border-bottom: 1px solid var(--color-border); white-space: nowrap; }
.report-table td { padding: 8px 10px; border-bottom: 1px solid var(--color-border-subtle, #eee); vertical-align: middle; }
.report-table tbody tr:last-child td { border-bottom: none; }
.report-table__clickable { cursor: pointer; }
.report-table__clickable:hover td { background: var(--color-surface-muted); }

.report-currency-list, .report-plain-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.report-currency-list li, .report-plain-list li { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); padding: 6px 0; border-bottom: 1px solid var(--color-border-subtle, #eee); font-size: var(--font-size-sm); }
.report-currency-list li:last-child, .report-plain-list li:last-child { border-bottom: none; }
.report-currency-list li span { color: var(--color-text-secondary); }
.report-currency-list li strong { font-variant-numeric: tabular-nums; }
.report-plain-list li span { color: var(--color-text); }
.report-plain-list li strong { color: var(--color-text-secondary); font-variant-numeric: tabular-nums; }

@media (max-width: 1024px) {
  .report-columns, .report-trend-columns { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .report-kpi-strip { grid-template-columns: repeat(2, 1fr); }
  .report-bar-row { grid-template-columns: 110px 1fr 32px; }
}

/* =========================================================================
   SESSION 28.3 — Universitet seçimi (real discovery/compare/shortlist panel,
   assets/js/university-selection-ui.js). Builds entirely on existing primitives
   (.discovery-result-card/.discovery-badge/.discovery-results-grid from the İlkin
   məsləhət module, .choice-row/.status-pill/.button) — no new color tokens.
   New here is only: (a) education-intent chips, (b) the discover()-specific
   OPEN/UPCOMING/CLOSED/UNKNOWN availability vocabulary as its own modifier set
   (DELIBERATELY separate from .availability-chip--available/--not_available/etc.
   above, which is the UNRELATED admission_choices.availability_status vocabulary —
   see that block's own comment; mixing the two would misrepresent one status as
   the other), (c) budget-status badges, (d) compare-mode table.
   ========================================================================= */

.university-selection-panel { display: flex; flex-direction: column; gap: var(--space-4); margin-bottom: var(--space-5); }
.university-selection-panel__section { border: 1px solid var(--color-border); border-radius: var(--radius-medium); background: #fff; padding: var(--space-4); }
.university-selection-panel__section h3 { margin: 0 0 var(--space-3); font-size: var(--font-size-md); }
.university-selection-panel__subtitle { margin: -6px 0 var(--space-3); font-size: var(--font-size-xs); color: var(--color-text-secondary); }

/* ---- Təhsil istiqaməti çipləri ------------------------------------------------------------- */
.intent-chip-row { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.intent-chip {
  border: 1px solid var(--color-border); background: #fff; border-radius: var(--radius-pill); padding: 7px 14px;
  font-size: var(--font-size-xs); font-weight: 600; cursor: pointer; color: var(--color-text);
}
.intent-chip:hover { border-color: var(--color-primary); }
.intent-chip.active { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.intent-chip__star { color: var(--color-accent); margin-right: 3px; }
.intent-chip.active .intent-chip__star { color: var(--color-accent-soft); }

/* ---- Axtarış filtrləri (universitet/istiqamət/ixtisas/şəhər/büdcə/dil/səviyyə) ---------------
   SESSION 28.5, §11 — grid extended from 6 fields to 9 fields + an in-grid "Axtar" submit button
   (see university-selection-ui.js extraFiltersHtml()): Universitet, İstiqamət, İxtisas, İxtisas/
   proqram sərbəst mətn, Şəhər, Təhsil səviyyəsi, Tədris dili, Maksimum büdcə, Valyuta, Axtar.
   `minmax(160px,1fr)` alone let 9-10 items wrap unevenly with a stray full-width button on its own
   row; `auto-fit` + a wider floor plus `min-width:0` on children keeps text/selects from overflowing
   their cell, and the explicit submit-button rule below stops it stretching edge-to-edge on desktop
   while still going full-width once the grid drops to a single column on narrow screens. ------ */
.discovery-extra-filters { margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px dashed var(--color-border); }
.discovery-extra-filters--primary { margin-top: 0; padding-top: 0; border-top: 0; }
.discovery-extra-filters__heading { margin: 0 0 var(--space-2); font-size: var(--font-size-sm); font-weight: 700; color: var(--color-text); }
.discovery-extra-filters__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--space-3); margin-bottom: var(--space-2); align-items: end; }
.discovery-extra-filters__grid label { display: flex; flex-direction: column; gap: 4px; font-size: var(--font-size-xs); font-weight: 600; color: var(--color-text); min-width: 0; }
.discovery-extra-filters__grid input, .discovery-extra-filters__grid select { height: var(--control-height-md); font-size: var(--font-size-sm); min-width: 0; width: 100%; }
.discovery-extra-filters__submit { justify-self: start; min-width: 140px; }
.discovery-extra-filters__retry { margin-top: 4px; align-self: flex-start; }
.discovery-catalog-suggestions:empty { display: none; }
.discovery-catalog-suggestions { margin-top: 5px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); box-shadow: var(--shadow-sm); max-height: 260px; overflow-y: auto; }
.discovery-catalog-suggestions__list { display: grid; }
.discovery-catalog-suggestion { display: grid; grid-template-columns: 72px minmax(0,1fr); gap: 2px 9px; padding: 8px 10px; border: 0; border-bottom: 1px solid var(--color-border-subtle); background: transparent; text-align: left; cursor: pointer; }
.discovery-catalog-suggestion:last-child { border-bottom: 0; }
.discovery-catalog-suggestion:hover, .discovery-catalog-suggestion:focus-visible { background: var(--color-surface-muted); outline: none; }
.discovery-catalog-suggestion strong { grid-row: span 2; align-self: center; color: var(--color-primary); font-size: var(--font-size-xs); }
.discovery-catalog-suggestion span { color: var(--color-text); font-size: var(--font-size-sm); font-weight: 600; }
.discovery-catalog-suggestion small { color: var(--color-text-secondary); font-size: var(--font-size-xs); font-weight: 400; }
.discovery-filters__field-note { margin: 0; font-size: var(--font-size-xs); color: var(--color-text-secondary); }

/* ---- Nəticə kartına S28.1 sahələri: əlçatanlıq / büdcə / izah siyahısı ---------------------- */
.discovery-badge--avail-open { background: #dcfce7; color: #166534; text-transform: none; }
.discovery-badge--avail-upcoming { background: #fef3c7; color: #92400e; text-transform: none; }
.discovery-badge--avail-closed { background: #fee2e2; color: #991b1b; text-transform: none; }
.discovery-badge--avail-unknown { background: #f3f4f6; color: #6b7280; text-transform: none; }
.discovery-badge--budget-within { background: #dcfce7; color: #166534; text-transform: none; }
.discovery-badge--budget-exceeded { background: #fee2e2; color: #991b1b; text-transform: none; }
.discovery-badge--budget-unknown { background: #f3f4f6; color: #6b7280; text-transform: none; }
.discovery-result-card__explain { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.discovery-result-card__price-line { font-size: var(--font-size-sm); font-weight: 600; color: var(--color-text); }
.discovery-result-card__price-sub { font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.discovery-result-card--comparable { cursor: pointer; }
.discovery-result-card--compare-selected { border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(20,33,61,.12); }

/* ---- Müqayisə paneli --------------------------------------------------------------------- */
.compare-bar-inline { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3); background: var(--color-surface-muted); border-radius: var(--radius-medium); margin-top: var(--space-3); flex-wrap: wrap; }
.compare-table-wrap { overflow-x: auto; margin-top: var(--space-3); }
.compare-table { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.compare-table th, .compare-table td { padding: 8px 10px; border: 1px solid var(--color-border); text-align: left; vertical-align: top; }
.compare-table th:first-child { background: var(--color-surface-muted); white-space: nowrap; width: 160px; }
.compare-table td.compare-best { background: #eefbf3; font-weight: 600; }

/* ---- Seçilmiş variantlar (mövcud admission_choices, oxu-yalnız xülasə) --------------------- */
.university-selection-panel__choices-hint { font-size: var(--font-size-xs); color: var(--color-text-secondary); margin: 0 0 var(--space-2); }

@media (max-width: 768px) {
  .discovery-extra-filters__grid { grid-template-columns: 1fr; }
  .discovery-extra-filters__submit { justify-self: stretch; width: 100%; }
  .compare-table th:first-child { width: 110px; }
}

/* =========================================================================
   SESSION 28.6 — İcazələr (per-user permission grants) panel, users-page.js.
   Groups mirror api/core/Capabilities.php's CAPABILITY_GROUPS (server-sent, not hardcoded here —
   see this file's own docblock). Reuses .check-option/.field-hint sizing tokens rather than
   inventing a new checkbox visual language.
   ========================================================================= */
.permissions-toolbar { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); }
.permissions-toolbar .search-field { flex: 1 1 16rem; }
#userPermissionsModal .modal--wide { width: min(54rem, 100%); }
.permissions-group { border: 1px solid var(--color-border); border-radius: var(--radius-medium); margin: 0 0 var(--space-2); overflow: hidden; background: var(--color-surface); }
.permissions-accordion__summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); min-height: 44px; padding: 9px var(--space-3); cursor: pointer; list-style: none; }
.permissions-accordion__summary::-webkit-details-marker { display: none; }
.permissions-accordion__summary > span:first-child { display: flex; align-items: baseline; gap: var(--space-2); min-width: 0; }
.permissions-accordion__summary strong { font-size: var(--font-size-sm); }
.permissions-accordion__summary small { color: var(--color-text-secondary); white-space: nowrap; }
.permissions-group__actions { display: flex; align-items: center; gap: var(--space-2); flex: 0 0 auto; white-space: nowrap; }
.permissions-group__actions .link-button { min-height: 32px; padding: 4px 0; font-size: var(--font-size-xs); }
.permissions-group__body { border-top: 1px solid var(--color-border); }
.permission-row { display: flex; align-items: center; gap: var(--space-2); min-height: 40px; padding: 6px var(--space-3); border-bottom: 1px solid var(--color-border); font-size: var(--font-size-sm); }
.permission-row:last-child { border-bottom: 0; }
.permission-row input[type="checkbox"] { width: 17px; height: 17px; margin: 0; flex: 0 0 auto; }
.permission-row input[disabled] { opacity: .55; cursor: not-allowed; }
.permission-row > label { min-width: 0; flex: 1 1 auto; cursor: pointer; }
.permission-row__override { color: var(--color-text-secondary); font-size: var(--font-size-xs); white-space: nowrap; }
.permission-row__details { margin-left: auto; font-size: var(--font-size-xs); color: var(--color-text-secondary); }
.permission-row__details p { margin: var(--space-2) 0 0; }
.permissions-history { margin-top: var(--space-5); }
@media (max-width: 760px) {
  .permissions-toolbar { align-items: stretch; flex-wrap: wrap; }
  .permissions-toolbar .search-field { flex-basis: 100%; }
  .permissions-accordion__summary { align-items: flex-start; }
  .permissions-group__actions { flex-wrap: wrap; justify-content: flex-end; }
  .permission-row { align-items: flex-start; }
}

/* =========================================================================
   SESSION 28.6 — Manual-value review queue (Yoxlama tələb edən məlumatlar).
   ========================================================================= */
.manual-review-tabs { display: flex; gap: 4px; background: var(--color-surface-muted); border-radius: var(--radius-small); padding: 3px; margin-bottom: var(--space-3); width: fit-content; }
.manual-review-tab { border: none; background: none; padding: 6px 14px; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--radius-small); cursor: pointer; color: var(--color-text-secondary); }
.manual-review-tab.active { background: #fff; color: var(--color-primary); box-shadow: var(--shadow-sm, 0 1px 2px rgba(16,24,40,.08)); }
.manual-review-row { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-medium); background: #fff; margin-bottom: var(--space-2); }
.manual-review-row__main { min-width: 0; flex: 1 1 auto; }
.manual-review-row__value { font-size: var(--font-size-sm); font-weight: 600; overflow-wrap: anywhere; }
.manual-review-row__meta { display: flex; flex-wrap: wrap; gap: var(--space-3); font-size: var(--font-size-xs); color: var(--color-text-secondary); margin-top: 4px; }
.manual-review-row__actions { display: flex; gap: 6px; flex-wrap: wrap; flex: 0 0 auto; }
/* Release polish: long Azerbaijani labels must wrap inside components, never widen the viewport. */
.module-header > *, .detail-hero__identity, .detail-hero__identity > *, .info-card, .doc-card__main,
.permission-row > label, .catalog-table td, .catalog-table th { min-width:0; }
.module-header h1, .module-header p, .detail-hero h1, .detail-hero__names, .doc-card__title,
.permission-row > label, .catalog-table td { overflow-wrap:break-word; }
.catalog-table-wrap { max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; }
.catalog-table { min-width:720px; }
.button, .mini-action { min-height:2.35rem; white-space:normal; overflow-wrap:anywhere; align-items:center; }
.status-pill, .badge, .chip { max-width:100%; white-space:normal; overflow-wrap:break-word; text-align:center; }
.modal-layer .modal { max-width:min(58rem, calc(100vw - 2rem)); max-height:calc(100dvh - 2rem); display:flex; flex-direction:column; }
.modal-layer .modal__body { overflow:auto; min-width:0; }
.modal-layer .modal__header, .modal-layer .modal__footer { flex:0 0 auto; }
.permission-row { min-width:0; }
@media (max-width:720px){.module-header{gap:1rem}.module-actions{flex-wrap:wrap}.detail-hero__top,.doc-card{align-items:flex-start}.modal-layer .modal{max-width:calc(100vw - 1rem);max-height:calc(100dvh - 1rem)}.catalog-table{min-width:640px}}

/* =========================================================================
   Responsive workspace constraints
   -------------------------------------------------------------------------
   Flex/grid children may otherwise expand to their min-content width. Keep
   overflow inside the relevant card/table instead of widening the document.
   ========================================================================= */
.workspace, .main-content, .data-card, .table-scroll { min-width: 0; }
.main-content { width: 100%; }
.table-scroll { max-width: 100%; overscroll-behavior-inline: contain; }

/* Applicants workspace. The shell already subtracts the expanded sidebar from
   the workspace; these zero-minimum tracks let its real remaining width flow
   through the heading, statistics and list card without a viewport-sized floor. */
.main-content > .page-heading[data-page="applicants"] > div { min-width: 0; }
.main-content > .page-heading[data-page="applicants"] .button { flex: 0 0 auto; }
#statsGrid[data-page="applicants"] { width: 100%; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.data-card[data-page="applicants"] { width: 100%; min-width: 0; }
.data-card[data-page="applicants"] .data-card__header > *,
.data-card[data-page="applicants"] .filters-toolbar > * { min-width: 0; }

/* Applicant list only. Use the browser's content-aware table algorithm and
   modest per-column readability floors, not a viewport-independent width sum.
   At 1920px, the expanded-sidebar workspace provides about 1592px for the table;
   intrinsic sizing uses that space. Only genuinely narrower screens scroll the
   table itself, keeping all employee/date/action columns present. */
#tableContainer { width: 100%; min-width: 0; overflow-x: auto; }
#tableContainer .applicants-table { width: 100%; min-width: 0; table-layout: auto; }
#tableContainer .applicants-table th,
#tableContainer .applicants-table td { min-width: 0; padding-inline: 7px; }
#tableContainer .applicants-table th { white-space: normal; overflow-wrap: anywhere; line-height: 1.3; }
#tableContainer .applicants-table th:nth-child(1), #tableContainer .applicants-table td:nth-child(1) { width: 38px; min-width: 38px; padding-inline: 4px; }
#tableContainer .applicants-table th:nth-child(2), #tableContainer .applicants-table td:nth-child(2) { min-width: 190px; }
#tableContainer .applicants-table th:nth-child(3), #tableContainer .applicants-table td:nth-child(3) { min-width: 125px; }
#tableContainer .applicants-table th:nth-child(4), #tableContainer .applicants-table td:nth-child(4) { min-width: 135px; }
#tableContainer .applicants-table th:nth-child(5), #tableContainer .applicants-table td:nth-child(5) { min-width: 68px; }
#tableContainer .applicants-table th:nth-child(6), #tableContainer .applicants-table td:nth-child(6) { min-width: 105px; }
#tableContainer .applicants-table th:nth-child(7), #tableContainer .applicants-table td:nth-child(7) { min-width: 120px; }
#tableContainer .applicants-table th:nth-child(8), #tableContainer .applicants-table td:nth-child(8) { min-width: 100px; }
#tableContainer .applicants-table th:nth-child(9), #tableContainer .applicants-table td:nth-child(9) { min-width: 145px; }
#tableContainer .applicants-table th:nth-child(10), #tableContainer .applicants-table td:nth-child(10) { width: 68px !important; min-width: 68px; }
#tableContainer .applicants-table .applicant-cell { min-width: 0; max-width: none; gap: 8px; }
#tableContainer .applicants-table .applicant-cell .avatar { width: 32px; height: 32px; flex: 0 0 32px; }
#tableContainer .applicants-table .applicant-cell strong { max-width: none; white-space: normal; overflow-wrap: anywhere; text-overflow: clip; line-height: 1.3; }
#tableContainer .applicants-table .contact-cell { min-width: 0; overflow-wrap: normal; }
#tableContainer .applicants-table .contact-cell a { white-space: nowrap; }
#tableContainer .applicants-table .employee-cell { min-width: 0; overflow-wrap: anywhere; }
#tableContainer .applicants-table .source-cell { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-text-secondary); }
#tableContainer .applicants-table th:nth-child(10) { padding-inline: 4px; white-space: nowrap; overflow-wrap: normal; }
#tableContainer .applicants-table td:nth-child(10) { padding-inline: 4px; text-align: center; }
#tableContainer .applicants-table th .sort-button { min-width: 0; white-space: normal; text-align: left; }
.applicants-table .major-cell strong,
.applicants-table .major-cell small {
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: normal;
}
.applicants-table .major-cell strong {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 1.35;
}
.applicants-table .major-cell small {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.next-action-cell { min-width: 0; }
.next-action-cell .badge {
  display: -webkit-box;
  width: 100%;
  max-width: 100%;
  padding: 6px 10px;
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: normal;
  white-space: normal;
  text-align: left;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.next-action-cell .badge::before { display: none; }

/* Premium operational workspace primitives. These reuse the existing GOLD EDU palette
   and remain opt-in, so established Dashboard 2.0 and catalog screens do not shift. */
:root {
  --workspace-line: var(--color-border);
  --workspace-surface: var(--color-surface);
  --workspace-surface-soft: var(--color-surface-muted);
  --workspace-radius: var(--radius-small);
  --workspace-row-gap: var(--space-3);
}
.workspace-list { border-top: 1px solid var(--workspace-line); }
.workspace-item { background: var(--workspace-surface); border-bottom: 1px solid var(--workspace-line); }
.workspace-item__title { display: block; color: var(--text-primary); font-size: 13px; font-weight: 650; line-height: 1.4; overflow-wrap: anywhere; }
.workspace-item__subtle { display: block; margin-top: 3px; color: var(--text-secondary); font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.workspace-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.workspace-actions .mini-action { min-height: 34px; height: auto; padding: 7px 10px; font-size: 11px; line-height: 1.2; white-space: nowrap; cursor: pointer; }
.workspace-actions .mini-action:focus-visible, .turkey-workspace button:focus-visible, .turkey-workspace input:focus-visible { outline: 2px solid var(--gold-600); outline-offset: 2px; }

/* Country coordinator: university outline + scan-first request rows. There is no
   minimum-width table or nested horizontal scroll in the primary request surface. */
.turkey-workspace { min-width: 0; }
.turkey-workspace__header { margin-bottom: var(--space-4); }
.turkey-workspace__header h1 { font-size: 24px; line-height: 1.25; }
.turkey-workspace .program-page-tabs { flex-wrap: wrap; }
.turkey-workspace .program-page-tabs button { min-height: 36px; height: auto; padding: 7px 12px; font-size: 12px; line-height: 1.3; }
.turkey-workspace .catalog-toolbar { padding: 12px 14px; gap: 12px; justify-content: space-between; }
.turkey-workspace .catalog-toolbar .search-field { min-width: min(280px, 100%); flex: 0 1 360px; }
.turkey-workspace .selection-layout { grid-template-columns: minmax(220px, 270px) minmax(0, 1fr); gap: var(--space-4); }
.turkey-workspace .selection-filter { box-shadow: none; border-radius: var(--workspace-radius); }
.turkey-workspace .selection-filter__head { padding: 12px 14px; }
.turkey-workspace .selection-filter__body { padding: 10px; }
.turkey-workspace .turkey-university-row { padding: 10px 11px; }
.turkey-workspace .turkey-university-row strong { font-size: 12px; line-height: 1.4; }
.turkey-workspace .turkey-university-row__counts { gap: 4px; }
.turkey-workspace .turkey-count { font-size: 10px; }
.turkey-choices-panel { min-width: 0; container-type: inline-size; }
.turkey-choices-panel .data-card { min-width: 0; overflow: hidden; }
.turkey-choices-panel .data-card__header { padding: 13px 16px; }
.turkey-request-list__toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 16px; background: var(--workspace-surface-soft); color: var(--text-secondary); font-size: 11px; }
.turkey-request-list__toolbar label { display: inline-flex; align-items: center; gap: 8px; color: var(--text-primary); cursor: pointer; }
.turkey-request-list input[type="checkbox"] { width: 16px; height: 16px; margin: 0; accent-color: var(--navy-900); cursor: pointer; }
.turkey-request-row { display: grid; grid-template-columns: 20px minmax(130px, .9fr) minmax(190px, 1.3fr) minmax(180px, 1fr) minmax(160px, 1.1fr); grid-template-areas: "select identity study meta actions"; gap: var(--workspace-row-gap); align-items: start; padding: 14px 16px; min-width: 0; }
.turkey-request-row:hover { background: #fbfcfe; }
.turkey-request-row.selected { background: #fffaf0; box-shadow: inset 3px 0 0 var(--gold-500); }
.turkey-request-row__select { grid-area: select; padding-top: 2px; }
.turkey-request-row__identity { grid-area: identity; min-width: 0; }
.turkey-request-row__study { grid-area: study; min-width: 0; }
.turkey-request-row__facts { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 6px; color: var(--text-secondary); font-size: 11px; line-height: 1.35; }
.turkey-request-row__facts span + span::before { content: "·"; margin-right: 10px; color: var(--text-muted); }
.turkey-request-row__meta { grid-area: meta; display: grid; gap: 6px; min-width: 0; color: var(--text-primary); font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.turkey-request-row__meta > div:not(:first-child) { display: flex; gap: 5px; flex-wrap: wrap; }
.turkey-request-row__label { color: var(--text-secondary); font-weight: 600; }
.turkey-request-row__label::after { content: ":"; }
.turkey-request-row .status-pill { font-size: 10px; }
.turkey-request-row__actions { grid-area: actions; align-content: start; }
.turkey-request-row__actions .mini-action { flex: 0 0 auto; }
.turkey-workspace .catalog-pagination { gap: 10px; flex-wrap: wrap; font-size: 11px; }
.turkey-request-search { max-width: 620px; margin: 0 0 var(--space-3); }
.turkey-request-view-tabs { margin-bottom: var(--space-3); }
.turkey-grouped-toolbar { margin-bottom: var(--space-3); }
.turkey-request-summary { margin-bottom: var(--space-3); }
.turkey-request-kpi-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--space-3); }
.turkey-request-kpi { display: grid; gap: 5px; min-width: 0; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: var(--radius-medium); background: var(--color-surface); color: var(--color-text); text-align: left; cursor: pointer; }
.turkey-request-kpi span { color: var(--color-text-secondary); font-size: var(--font-size-xs); }
.turkey-request-kpi strong { font-size: var(--font-size-xl); font-variant-numeric: tabular-nums; }
.turkey-request-kpi.active { border-color: var(--color-primary); background: var(--color-primary-soft, #f3f7ff); box-shadow: 0 0 0 1px var(--color-primary); }
.turkey-inquiry-card { padding: 14px; }
.turkey-inquiry-filters { display: grid; grid-template-columns: minmax(180px,2fr) repeat(2,minmax(130px,1fr)) minmax(170px,1fr); gap: 10px; align-items: end; margin-bottom: 12px; }
.turkey-inquiry-filters label { display: grid; gap: 4px; min-width: 0; color: var(--color-text-secondary); font-size: var(--font-size-xs); }
.turkey-inquiry-filters select, .turkey-inquiry-filters input { width: 100%; min-width: 0; height: var(--control-height-md); font-size: var(--font-size-sm); }
.turkey-inquiry-table { min-width: 1120px; }
.turkey-inquiry-table td { vertical-align: middle; }
.turkey-inquiry-table td strong, .turkey-inquiry-table td small { display: block; }
.turkey-inquiry-table td small { margin-top: 3px; color: var(--color-text-secondary); font-size: var(--font-size-xs); }
.turkey-inquiry-table input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--color-primary); }
.turkey-queue-bulk:empty { display: none; }
.turkey-inquiry-detail-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--color-border); }
@media (max-width: 900px) { .turkey-request-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .turkey-inquiry-filters { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 560px) { .turkey-request-kpi-grid, .turkey-inquiry-filters { grid-template-columns: minmax(0,1fr); } .turkey-inquiry-card { padding: 9px; } }

@container (max-width: 950px) {
  .turkey-request-row { grid-template-columns: 20px minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "select identity study" ". meta meta" ". actions actions"; gap: 8px 12px; padding: 12px 14px; }
  .turkey-request-row__meta { display: flex; flex-wrap: wrap; gap: 6px 14px; }
  .turkey-request-row__actions { justify-content: flex-start; }
}
@container (max-width: 520px) {
  .turkey-request-row { grid-template-columns: 20px minmax(0, 1fr); grid-template-areas: "select identity" ". study" ". meta" ". actions"; }
  .turkey-request-row__meta { display: grid; }
  .turkey-request-list__toolbar { align-items: flex-start; flex-direction: column; gap: 4px; }
}
@media (max-width: 900px) {
  .turkey-workspace .selection-layout { grid-template-columns: minmax(0, 1fr); }
  .turkey-workspace .selection-filter { position: static; inset: auto; transform: none; width: 100%; max-height: none; overflow: visible; }
  .turkey-workspace .turkey-university-list { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
  .turkey-workspace .catalog-toolbar .search-field { flex: 1 1 100%; max-width: none; }
  .turkey-workspace #turkeyDocumentPackages .table-scroll { overflow: visible; }
  .turkey-workspace #turkeyDocumentPackages .applicants-table { display: block; min-width: 0 !important; width: 100%; }
  .turkey-workspace #turkeyDocumentPackages .applicants-table thead { display: none; }
  .turkey-workspace #turkeyDocumentPackages .applicants-table tbody { display: grid; gap: 8px; padding: 10px; }
  .turkey-workspace #turkeyDocumentPackages .applicants-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 12px; border: 1px solid var(--workspace-line); border-radius: var(--workspace-radius); }
  .turkey-workspace #turkeyDocumentPackages .applicants-table td { display: block; min-width: 0; padding: 0; border: 0; overflow-wrap: anywhere; }
  .turkey-workspace #turkeyDocumentPackages .applicants-table .table-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; white-space: normal; }
  .turkey-workspace #turkeyDocumentPackages .applicants-table .mini-action { min-height: 34px; height: auto; padding: 7px 10px; white-space: normal; }
}
@media (max-width: 520px) {
  .turkey-workspace .turkey-university-list { grid-template-columns: minmax(0, 1fr); }
  .turkey-workspace .program-page-tabs { width: 100%; }
  .turkey-workspace .program-page-tabs button { flex: 1 1 auto; }
  .turkey-request-row__actions { justify-content: flex-start; }
  .turkey-workspace #turkeyDocumentPackages .applicants-table tr { grid-template-columns: minmax(0, 1fr); }
}

/* At zoomed laptop widths a five-way KPI row stops being a set of squeezed
   labels.  Controls remain in their original order and wrap as one toolbar. */
@media (max-width: 1280px) {
  .stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .filters-toolbar { align-items: stretch; }
  .filters-toolbar .view-toggle { flex: 0 0 auto; }
  .filters-toolbar .search-field { flex: 1 1 300px; min-width: 240px; }
  .filters-toolbar .filter-toggle,
  .filters-toolbar #resetFilters { flex: 0 0 auto; }
}

@media (max-width: 720px) {
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filters-toolbar .view-toggle { display: flex; width: 100%; }
  .filters-toolbar .view-toggle .button { flex: 1 1 0; }
  .filters-toolbar .search-field { flex-basis: 100%; min-width: 0; }
  .modal-layer { padding: 16px; }
  .modal-layer .modal { width: min(58rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); }
  .modal__footer, .modal__footer > div { flex-wrap: wrap; }
}