/* PATCH_ADMIN_UI_BASE_V1 — тема АСУ Helpdesk для Django admin.
   Палитра = kc_base / my_profile. Обе темы: light / dark / auto
   (штатный переключатель Django 4.2+ в шапке). */

/* ─── Светлая (default) ─── */
:root, html[data-theme="light"] {
  --primary: #eef1f4;
  --secondary: #ffffff;
  --accent: #34a853;
  --primary-fg: #1f2328;

  --body-bg: #f6f8fa;
  --body-fg: #1f2328;
  --body-quiet-color: #57606a;
  --body-loud-color: #1f2328;

  --header-bg: #ffffff;
  --header-color: #57606a;
  --header-branding-color: #1f2328;
  --header-link-color: #1f2328;

  --breadcrumbs-bg: #f0f2f5;
  --breadcrumbs-fg: #57606a;
  --breadcrumbs-link-fg: #1f883d;

  --link-fg: #0969da;
  --link-hover-color: #0550ae;
  --link-selected-fg: #0969da;

  --hairline-color: #d8dee4;
  --border-color: #d0d7de;

  --darkened-bg: #f0f2f5;
  --selected-bg: #eaf5ec;
  --selected-row: #eaf5ec;

  --button-fg: #ffffff;
  --button-bg: #34a853;
  --button-hover-bg: #2d9249;
  --default-button-bg: #1f883d;
  --default-button-hover-bg: #1a7f37;
  --close-button-bg: #6e7781;
  --close-button-hover-bg: #57606a;
  --delete-button-bg: #cf222e;
  --delete-button-hover-bg: #a40e26;

  --object-tools-fg: #ffffff;
  --object-tools-bg: #57606a;
  --object-tools-hover-bg: #424a53;

  --message-success-bg: #dafbe1;
  --message-warning-bg: #fff8c5;
  --message-error-bg: #ffebe9;
  --error-fg: #cf222e;

  --font-family-primary: 'Inter', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-family-monospace: 'JetBrains Mono', ui-monospace, SFMono-Regular, Consolas, monospace;
}

/* ─── Тёмная ─── */
html[data-theme="dark"] {
  --primary: #1c2128;
  --secondary: #161b22;
  --accent: #34a853;
  --primary-fg: #e6edf3;

  --body-bg: #0d1117;
  --body-fg: #e6edf3;
  --body-quiet-color: #8b949e;
  --body-loud-color: #e6edf3;

  --header-bg: #161b22;
  --header-color: #8b949e;
  --header-branding-color: #e6edf3;
  --header-link-color: #e6edf3;

  --breadcrumbs-bg: #161b22;
  --breadcrumbs-fg: #8b949e;
  --breadcrumbs-link-fg: #34a853;

  --link-fg: #58a6ff;
  --link-hover-color: #79b8ff;
  --link-selected-fg: #58a6ff;

  --hairline-color: #21262d;
  --border-color: #30363d;

  --darkened-bg: #161b22;
  --selected-bg: #1c2128;
  --selected-row: #18221b;

  --button-fg: #ffffff;
  --button-bg: #34a853;
  --button-hover-bg: #2d9249;
  --default-button-bg: #1f883d;
  --default-button-hover-bg: #2ea043;
  --close-button-bg: #30363d;
  --close-button-hover-bg: #3c444d;
  --delete-button-bg: #da3633;
  --delete-button-hover-bg: #f85149;

  --object-tools-fg: #e6edf3;
  --object-tools-bg: #21262d;
  --object-tools-hover-bg: #30363d;

  --message-success-bg: #12261a;
  --message-warning-bg: #2b2511;
  --message-error-bg: #2d1517;
  --error-fg: #f85149;
}

/* ─── auto = prefers-color-scheme ─── */
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    --primary: #1c2128;
    --secondary: #161b22;
    --accent: #34a853;
    --primary-fg: #e6edf3;
    --body-bg: #0d1117;
    --body-fg: #e6edf3;
    --body-quiet-color: #8b949e;
    --body-loud-color: #e6edf3;
    --header-bg: #161b22;
    --header-color: #8b949e;
    --header-branding-color: #e6edf3;
    --header-link-color: #e6edf3;
    --breadcrumbs-bg: #161b22;
    --breadcrumbs-fg: #8b949e;
    --breadcrumbs-link-fg: #34a853;
    --link-fg: #58a6ff;
    --link-hover-color: #79b8ff;
    --link-selected-fg: #58a6ff;
    --hairline-color: #21262d;
    --border-color: #30363d;
    --darkened-bg: #161b22;
    --selected-bg: #1c2128;
    --selected-row: #18221b;
    --button-fg: #ffffff;
    --button-bg: #34a853;
    --button-hover-bg: #2d9249;
    --default-button-bg: #1f883d;
    --default-button-hover-bg: #2ea043;
    --close-button-bg: #30363d;
    --close-button-hover-bg: #3c444d;
    --delete-button-bg: #da3633;
    --delete-button-hover-bg: #f85149;
    --object-tools-fg: #e6edf3;
    --object-tools-bg: #21262d;
    --object-tools-hover-bg: #30363d;
    --message-success-bg: #12261a;
    --message-warning-bg: #2b2511;
    --message-error-bg: #2d1517;
    --error-fg: #f85149;
  }
}

/* ═══ Компоненты ═══ */

body { font-family: var(--font-family-primary); }

/* Шапка */
#header {
  border-bottom: 1px solid var(--border-color);
  padding: 12px 24px;
}
#site-name a { font-weight: 700; letter-spacing: -.02em; font-size: 1.15rem; }
#site-name .brand-accent { color: var(--accent); }
#site-name .brand-sub {
  color: var(--body-quiet-color); font-weight: 500; font-size: .78em;
}
#user-tools { font-size: .78rem; }
#user-tools a { border-bottom: none; text-decoration: none; }
#user-tools a:hover { color: var(--accent); }

/* Хлебные крошки */
div.breadcrumbs {
  border-bottom: 1px solid var(--border-color);
  padding: 10px 24px;
}

/* Модули-карточки */
.module {
  border: 1px solid var(--border-color);
  border-radius: 8px;
  overflow: hidden;
  background: var(--secondary);
}
.module h2, .module caption, .inline-group h2 {
  background: var(--darkened-bg);
  color: var(--body-fg);
  border-left: 3px solid var(--accent);
  font-weight: 600;
  font-size: .85rem;
  letter-spacing: .02em;
}
#content-related .module { background: var(--darkened-bg); }
#content-related .module h2 { background: transparent; }

/* Таблицы списков */
#changelist table thead th {
  background: var(--darkened-bg);
  color: var(--body-quiet-color);
  font-weight: 600;
}
#changelist table tbody tr:hover { background: var(--selected-bg); }
#changelist .paginator { border: none; background: transparent; }

/* Кнопки */
.button, input[type="submit"], input[type="button"],
.submit-row input, a.button {
  border-radius: 6px;
  font-weight: 600;
}
.object-tools a { border-radius: 6px; font-weight: 600; }

/* Поля форм */
input[type="text"], input[type="password"], input[type="email"],
input[type="url"], input[type="number"], input[type="tel"],
textarea, select, .vTextField {
  border: 1px solid var(--border-color);
  border-radius: 6px;
  background: var(--body-bg);
  color: var(--body-fg);
}
input:focus, textarea:focus, select:focus {
  border-color: var(--accent) !important;
  outline: none;
}

/* Сообщения */
ul.messagelist li { border-radius: 8px; }

/* Логин-форма */
.login #container {
  border: 1px solid var(--border-color);
  border-radius: 12px;
  background: var(--secondary);
}
.login #header { border-bottom: 1px solid var(--border-color); border-radius: 12px 12px 0 0; }