/*
 * Админка в цветах сайта.
 *
 * Django собрал свою тему на CSS-переменных, поэтому переопределять правила не
 * нужно — достаточно подменить значения. Палитра берётся из tokens.css, того же
 * файла, что и витрина: поправив цвет там, получаем его и здесь.
 *
 * Тема одна. Django объявляет переменные трижды — для светлой, тёмной и
 * системной схемы, — и все три состояния перекрыты одними значениями. Пока
 * тёмной темы у проекта нет, выбор между ними означал бы только возможность
 * увидеть админку в цветах, которых в дизайн-системе не существует; сам
 * переключатель убран пустым переопределением admin/color_theme_toggle.html.
 *
 * Файл подключается в блоке extrastyle, то есть после base.css и dark_mode.css:
 * при равной специфичности выигрывает тот, что идёт позже.
 */

@import url("./tokens.bbede92a3cd4.css");

html,
html[data-theme="auto"],
html[data-theme="light"],
html[data-theme="dark"] {
  --primary: var(--c-ink);
  --primary-fg: var(--c-cream);
  --secondary: var(--c-ink);
  --accent: var(--c-leaf);

  --body-fg: var(--c-ink);
  --body-bg: var(--c-cream);
  --body-quiet-color: var(--c-ink-muted);
  --body-medium-color: rgba(26, 52, 43, 0.8);
  --body-loud-color: var(--c-ink);

  --header-color: var(--c-cream);
  --header-branding-color: var(--c-leaf);
  --header-bg: var(--c-ink);
  --header-link-color: var(--c-cream);

  --breadcrumbs-fg: var(--c-ink);
  --breadcrumbs-link-fg: var(--c-ink);
  --breadcrumbs-bg: var(--c-leaf-pale);

  --link-fg: var(--c-moss);
  --link-hover-color: var(--c-accent);
  --link-selected-fg: var(--c-accent);

  --hairline-color: rgba(26, 52, 43, 0.1);
  --border-color: rgba(26, 52, 43, 0.16);

  --error-fg: #c0392b;

  /* Обычные кнопки — приглушённо-зелёные, чтобы не спорить с главным действием. */
  --button-fg: var(--c-cream);
  --button-bg: var(--c-moss);
  --button-hover-bg: var(--c-ink);

  /* Сохранение — оранжевое, как главное действие на витрине. */
  --default-button-bg: var(--c-accent);
  --default-button-hover-bg: var(--c-accent-hover);

  --close-button-bg: rgba(26, 52, 43, 0.45);
  --close-button-hover-bg: var(--c-ink);

  --delete-button-bg: #c0392b;
  --delete-button-hover-bg: #a5301f;

  --object-tools-fg: var(--c-cream);
  --object-tools-bg: var(--c-ink);
  --object-tools-hover-bg: var(--c-accent);

  --selected-bg: var(--c-leaf-wash);
  --selected-row: #f2f7e4;
  --darkened-bg: #f5f8ee;

  --message-success-bg: var(--c-leaf-pale);
  --message-warning-bg: #fdf1d6;
  --message-error-bg: #fadbd6;

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

@media (prefers-color-scheme: dark) {
  html,
  html[data-theme="auto"],
  html[data-theme="light"],
  html[data-theme="dark"] {
    --primary: var(--c-ink);
    --primary-fg: var(--c-cream);
    --secondary: var(--c-ink);
    --accent: var(--c-leaf);

    --body-fg: var(--c-ink);
    --body-bg: var(--c-cream);
    --body-quiet-color: var(--c-ink-muted);
    --body-medium-color: rgba(26, 52, 43, 0.8);
    --body-loud-color: var(--c-ink);

    --header-color: var(--c-cream);
    --header-branding-color: var(--c-leaf);
    --header-bg: var(--c-ink);
    --header-link-color: var(--c-cream);

    --breadcrumbs-fg: var(--c-ink);
    --breadcrumbs-link-fg: var(--c-ink);
    --breadcrumbs-bg: var(--c-leaf-pale);

    --link-fg: var(--c-moss);
    --link-hover-color: var(--c-accent);
    --link-selected-fg: var(--c-accent);

    --hairline-color: rgba(26, 52, 43, 0.1);
    --border-color: rgba(26, 52, 43, 0.16);

    --error-fg: #c0392b;

    --button-fg: var(--c-cream);
    --button-bg: var(--c-moss);
    --button-hover-bg: var(--c-ink);

    --default-button-bg: var(--c-accent);
    --default-button-hover-bg: var(--c-accent-hover);

    --close-button-bg: rgba(26, 52, 43, 0.45);
    --close-button-hover-bg: var(--c-ink);

    --delete-button-bg: #c0392b;
    --delete-button-hover-bg: #a5301f;

    --object-tools-fg: var(--c-cream);
    --object-tools-bg: var(--c-ink);
    --object-tools-hover-bg: var(--c-accent);

    --selected-bg: var(--c-leaf-wash);
    --selected-row: #f2f7e4;
    --darkened-bg: #f5f8ee;

    --message-success-bg: var(--c-leaf-pale);
    --message-warning-bg: #fdf1d6;
    --message-error-bg: #fadbd6;

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

/* --- Форма подачи ------------------------------------------------------------
 * Переменными не выражается: Django задаёт эти свойства константами.
 */

#header {
  padding: var(--sp-4) var(--sp-8);
}

#site-name a {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: var(--fw-bold);
  letter-spacing: -0.3px;
}

/* Логотип набирается двумя цветами, как в шапке сайта. */
.admin-logo__eco { color: var(--c-accent); }
.admin-logo__club { color: var(--c-leaf); }

.admin-logo__suffix {
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: rgba(254, 252, 242, 0.62);
  margin-left: var(--sp-2);
}

div.breadcrumbs {
  padding: var(--sp-3) var(--sp-8);
  font-weight: var(--fw-medium);
}

/* Панели и таблицы: скругления и мягкая тень вместо жёстких рамок. */
.module,
.dashboard #content .module,
.inline-group {
  border-radius: var(--r-md);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  border: 0;
}

.module caption,
.inline-group h2,
.module h2 {
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: 0.02em;
  text-transform: none;
}

.button,
input[type="submit"],
input[type="button"],
.submit-row input,
a.button {
  border-radius: var(--r-pill);
  padding: var(--sp-2) var(--sp-5);
  font-weight: var(--fw-semibold);
}

.submit-row {
  border-radius: var(--r-md);
  box-shadow: var(--shadow-card);
  border: 0;
}

#changelist-filter {
  border-radius: var(--r-md);
}

/* Поля ввода: те же скругления, что на витрине. */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="number"],
textarea,
select {
  border-radius: var(--r-sm);
}

/* Ссылки-объекты в списке — привычный тёмно-зелёный, а не синий. */
#changelist table tbody th a {
  font-weight: var(--fw-semibold);
}

/* Подсказки под полями читаются лучше приглушённым цветом. */
.help,
.helptext {
  color: var(--c-ink-muted);
}