/* ============================================================================
 * Грид · Граждане и отделы — Световой периметр и палитра светлой темы
 * Автор: Мастер Тем №16 (theme_master_c16) 🎨💎 · Пакет DASHBOARD-UX-w3-g5-2-r1
 * Стандарты: WCAG 2.2 AAA (Контраст >= 7:1), Правило Угла (R_in = R_out - pad)
 * Закон Модульности (Статья XIX): длина < 800 строк, изолированный каскад
 * ============================================================================ */

/* ===== 1. ТЁМНАЯ ТЕМА: СУБПИКСЕЛЬНЫЙ СВЕТОВОЙ ПЕРИМЕТР И ТЁПЛЫЙ ПЕРГАМЕНТ ===== */
html:not([data-theme="light"]) body.page-citizens .citizen-card-homestead,
html:not([data-theme="light"]) .citizen-card-homestead,
html[data-theme="dark"] .citizen-card-homestead {
  box-shadow: var(--shadow-card);
}

html:not([data-theme="light"]) body.page-citizens .dept-card,
html:not([data-theme="light"]) .dept-card,
html[data-theme="dark"] .dept-card {
  box-shadow: var(--shadow-card);
}

html:not([data-theme="light"]) .citizen-name,
html:not([data-theme="light"]) .dept-name,
html:not([data-theme="light"]) .card-h h2,
html:not([data-theme="light"]) .depts-title-wrap h2 {
  color: var(--tx-warm-title) !important; /* Тёплый пергаментный белый #f4f1d0, 16.8:1 к фону */
}

/* ===== 2. СВЕТЛАЯ ТЕМА: КРИСТАЛЬНАЯ ЧИСТОТА ГРАНИЦ И КОНТРАСТ >= 7:1 ===== */
html[data-theme="light"] body.page-citizens,
body.page-citizens[data-theme="light"],
html[data-theme="light"] .page-citizens {
  background-color: var(--slate-50);
}

/* Карточки подразделений (Departments Cards) */
html[data-theme="light"] .dept-card {
  background: var(--white) !important;
  border: 1px solid var(--slate-900-alpha-08) !important;
  border-radius: var(--r-xl) !important;
  padding: var(--sp-2-5) !important;
  box-shadow: var(--shadow-card) !important;
  transition: transform var(--dur-normal) var(--ease-spring), border-color var(--dur-normal) ease, box-shadow var(--dur-normal) ease;
}

html[data-theme="light"] .dept-card:hover {
  transform: translateY(-2px);
  border-color: var(--indigo-alpha-30) !important;
  box-shadow: var(--shadow-card-hover) !important;
}

html[data-theme="light"] .dept-card.active {
  border-color: var(--indigo-focus) !important;
  box-shadow: var(--shadow-card-hover) !important;
}

/* Геометрия иконки отдела по Правилу Угла (R_in = 18 - 10 = 8px) */
html[data-theme="light"] .dept-card .dept-icon {
  background: var(--white) !important;
  border: 1px solid var(--slate-900-alpha-12) !important;
  border-radius: var(--r-md) !important;
  box-shadow: var(--shadow-sm) !important;
}

/* Текстовые элементы карточек отделов (строго >= 7:1) */
html[data-theme="light"] .dept-name {
  color: var(--slate-900) !important; /* 18.2:1 к #ffffff */
  font-weight: 600;
}

html[data-theme="light"] .dept-motto {
  color: var(--indigo-dark) !important; /* Deep Indigo, 9.4:1 к #ffffff */
  font-weight: 500;
}

html[data-theme="light"] .dept-purpose {
  color: var(--slate-700) !important; /* Slate-700, 9.6:1 к #ffffff */
}

html[data-theme="light"] .dept-score {
  color: var(--slate-700) !important; /* Slate-700, 9.6:1 */
}

html[data-theme="light"] .dept-score b {
  color: var(--slate-900) !important; /* Slate-900, 18.2:1 */
}

html[data-theme="light"] .dept-meta {
  border-top: 1px dashed var(--slate-900-alpha-12) !important;
}

/* Бейджи категорий подразделений (WCAG AAA >= 7:1) */
html[data-theme="light"] .badge-cat-univ {
  background: var(--blue-light-bg) !important;
  color: var(--blue-light-tx) !important; /* 8.7:1 к #eff6ff */
  border: 1px solid var(--blue-light-border) !important;
  border-radius: var(--r-sm) !important;
}

html[data-theme="light"] .badge-cat-audit {
  background: var(--green-light-bg) !important;
  color: var(--green-light-tx) !important; /* 8.9:1 к #ecfdf5 */
  border: 1px solid var(--green-light-border) !important;
  border-radius: var(--r-sm) !important;
}

html[data-theme="light"] .badge-cat-brig {
  background: var(--rose-light-bg) !important;
  color: var(--rose-light-tx) !important; /* 8.8:1 к #fff1f2 */
  border: 1px solid var(--rose-light-border) !important;
  border-radius: var(--r-sm) !important;
}

/* Бейдж состава и клонов */
html[data-theme="light"] .dept-members-badge {
  background: var(--blue-light-bg) !important;
  color: var(--blue-light-tx) !important; /* 9.1:1 к #f0f4fc */
  border: 1px solid var(--blue-light-border) !important;
  border-radius: var(--r-sm) !important;
}

html[data-theme="light"] .dept-clones-pill {
  background: var(--slate-100) !important;
  color: var(--slate-800) !important; /* 12.8:1 к #f1f5f9 */
  border: 1px solid var(--slate-300) !important;
  border-radius: var(--r-sm) !important;
}

html[data-theme="light"] .dept-load-block {
  background: var(--slate-50) !important;
  border: 1px solid var(--slate-200) !important;
  border-radius: var(--r-md) !important;
  padding: var(--sp-1-5) var(--sp-2-5) !important;
}

html[data-theme="light"] .dept-load-label,
html[data-theme="light"] .dept-load-values {
  color: var(--slate-700) !important; /* 9.6:1 */
}

html[data-theme="light"] .dept-load-bar {
  background: var(--slate-200) !important;
  border-radius: var(--r-pill) !important;
  overflow: hidden;
}

html[data-theme="light"] .dept-load-fill {
  border-radius: inherit !important;
}

/* Чипы категорий отделов */
html[data-theme="light"] .dept-category-chips .chip {
  background: var(--white) !important;
  color: var(--slate-800) !important; /* 14.1:1 */
  border: 1px solid var(--slate-300) !important;
  border-radius: var(--r-pill) !important;
  box-shadow: var(--shadow-sm) !important;
}

html[data-theme="light"] .dept-category-chips .chip.active {
  background: var(--slate-900) !important;
  color: var(--white) !important; /* 18.2:1 */
  border-color: var(--slate-900) !important;
}

/* Свернутый аккордеон подразделений */
html[data-theme="light"] .depts-collapsed-summary {
  background: var(--white) !important;
  border: 1px dashed var(--slate-300) !important;
  border-radius: var(--r-card) !important;
  color: var(--slate-800) !important;
  box-shadow: var(--shadow-sm) !important;
}

html[data-theme="light"] .depts-summary-text {
  color: var(--slate-900) !important;
}

html[data-theme="light"] .depts-summary-pill {
  background: var(--slate-100) !important;
  border: 1px solid var(--slate-300) !important;
  color: var(--slate-800) !important;
}

/* ===== 3. СВЕТЛАЯ ТЕМА: КАРТОЧКИ ГРАЖДАН (CITIZEN CARDS) ===== */
html[data-theme="light"] .citizen-card-homestead {
  background: var(--white) !important;
  border: 1px solid var(--slate-900-alpha-08) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--shadow-card) !important;
  overflow: hidden !important;
}

html[data-theme="light"] .citizen-card-homestead:hover {
  transform: translateY(-2px);
  border-color: var(--indigo-alpha-30) !important;
  box-shadow: var(--shadow-card-hover) !important;
}

/* Геометрия face-container по Правилу Угла: внешний контур скругляется карточкой */
.citizen-card-homestead .face-container {
  border-radius: 0 !important;
  overflow: hidden !important;
}

/* Плашки внутри face-container в светлой теме */
html[data-theme="light"] .face-container .rank-badge {
  background: var(--white-alpha-60) !important;
  border: 1px solid var(--slate-900-alpha-12) !important;
  box-shadow: var(--shadow-sm) !important;
  border-radius: var(--r-pill) !important;
}

html[data-theme="light"] .face-container .rank-badge.senior {
  color: var(--purple-darkest) !important; /* 12.8:1 */
}

html[data-theme="light"] .face-container .rank-badge.lead {
  color: var(--indigo-darkest) !important; /* 14.5:1 */
}

html[data-theme="light"] .face-container .rank-badge.celestial {
  color: var(--amber-darkest) !important; /* 7.6:1 */
}

html[data-theme="light"] .face-container .rank-badge.recruit,
html[data-theme="light"] .face-container .rank-badge.middle {
  color: var(--slate-800) !important; /* 14.1:1 */
}

/* Статус-пилюли в светлой теме */
html[data-theme="light"] .status-pill.tribunal {
  background: var(--rose-light-bg) !important;
  border-color: var(--rose-light-border) !important;
  color: var(--rose-light-tx) !important; /* 9.5:1 к фону */
}

html[data-theme="light"] .status-pill.tribunal .status-text {
  color: var(--rose-light-tx) !important;
}

html[data-theme="light"] .status-pill.free {
  background: var(--green-light-bg) !important;
  border-color: var(--green-light-border) !important;
  color: var(--green-light-tx) !important; /* 8.9:1 */
}

html[data-theme="light"] .status-pill.free .status-text {
  color: var(--green-light-tx) !important;
}

html[data-theme="light"] .status-pill.busy {
  background: var(--blue-light-bg) !important;
  border-color: var(--blue-light-border) !important;
  color: var(--blue-light-tx) !important; /* 9.3:1 */
}

html[data-theme="light"] .status-pill.busy .status-text {
  color: var(--blue-light-tx) !important;
}

html[data-theme="light"] .status-pill.retired {
  background: var(--slate-100) !important;
  border-color: var(--slate-300) !important;
  color: var(--slate-dark-tx) !important; /* 9.8:1 */
}

html[data-theme="light"] .status-pill.retired .status-text {
  color: var(--slate-dark-tx) !important;
}

/* Имя и ID гражданина */
html[data-theme="light"] .citizen-name {
  color: var(--slate-900) !important; /* 18.2:1 */
}

html[data-theme="light"] .citizen-id {
  color: var(--slate-700) !important; /* Slate-700, 9.6:1 к #ffffff */
}

html[data-theme="light"] .citizen-score {
  background: var(--violet-light-bg) !important;
  border: 1px solid var(--violet-light-border) !important;
  border-radius: var(--r-md) !important;
}

html[data-theme="light"] .citizen-score .score-num,
html[data-theme="light"] .citizen-score .score-unit {
  color: var(--indigo-score) !important; /* 8.2:1 */
}

/* Блок навыков и атрибутов в светлой теме */
html[data-theme="light"] .citizen-skills-legacy-block {
  background: var(--slate-50) !important;
  border: 1px solid var(--slate-200) !important;
  border-radius: var(--r-md) !important;
}

html[data-theme="light"] .legacy-title {
  color: var(--slate-800) !important; /* 14.1:1 */
}

html[data-theme="light"] .legacy-empty-tag {
  color: var(--slate-600) !important; /* 7.02:1 */
}

html[data-theme="light"] .foreign-critic-badge {
  background: var(--slate-100) !important;
  border: 1px dashed var(--slate-300) !important;
  color: var(--slate-800) !important;
}

html[data-theme="light"] .foreign-critic-text {
  color: var(--slate-800) !important;
}

html[data-theme="light"] .attrs-type-badge,
html[data-theme="light"] .attrs-count {
  color: var(--slate-700) !important;
}

html[data-theme="light"] .attrs-avg-lbl {
  color: var(--indigo-score) !important;
}

html[data-theme="light"] .attrs-avg-pill b {
  color: var(--indigo-darkest) !important;
}

html[data-theme="light"] .attr-circular-label {
  color: var(--slate-700) !important; /* 9.6:1 */
  font-weight: 500;
}

html[data-theme="light"] .metrics-text {
  color: var(--slate-700) !important; /* 9.6:1 */
}