/* Django admin theme override: gold + jungle palette for dark mode.
   The rest of Django's upstream dark_mode.css stays unchanged. */

@media (prefers-color-scheme: dark) {
  :root {
    --primary: #d4af37;
    --primary-fg: #fff8e7;

    --body-fg: #eef2ec;
    --body-bg: #0e1411;
    --body-quiet-color: #c0cabd;
    --body-medium-color: #d8e0d3;
    --body-loud-color: #ffffff;

    --breadcrumbs-link-fg: #f3f6ef;
    --breadcrumbs-bg: #143023;

    --link-fg: #f0d17a;
    --link-hover-color: #ffe29c;
    --link-selected-fg: #d4af37;

    --hairline-color: #24362d;
    --border-color: #31463a;
    --error-fg: #ff8d8d;

    --message-debug-bg: #2b3330;
    --message-debug-icon: url(../img/icon-debug-dark.svg);
    --message-info-bg: #183c31;
    --message-info-icon: url(../img/icon-info-dark.svg);
    --message-success-bg: #123a20;
    --message-success-icon: url(../img/icon-yes-dark.svg);
    --message-warning-bg: #4a3410;
    --message-warning-icon: url(../img/icon-alert-dark.svg);
    --message-error-bg: #4d1a1e;
    --message-error-icon: url(../img/icon-no-dark.svg);

    --darkened-bg: #18211c;
    --selected-bg: #101815;
    --selected-row: #143922;

    --close-button-bg: #3f4d45;
    --close-button-hover-bg: #56665d;

    color-scheme: dark;
  }
}

html[data-theme="dark"] {
  --primary: #d4af37;
  --primary-fg: #fff8e7;

  --body-fg: #eef2ec;
  --body-bg: #0e1411;
  --body-quiet-color: #c0cabd;
  --body-medium-color: #d8e0d3;
  --body-loud-color: #ffffff;

  --breadcrumbs-link-fg: #f3f6ef;
  --breadcrumbs-bg: #143023;

  --link-fg: #f0d17a;
  --link-hover-color: #ffe29c;
  --link-selected-fg: #d4af37;

  --hairline-color: #24362d;
  --border-color: #31463a;
  --error-fg: #ff8d8d;

  --message-debug-bg: #2b3330;
  --message-debug-icon: url(../img/icon-debug-dark.svg);
  --message-info-bg: #183c31;
  --message-info-icon: url(../img/icon-info-dark.svg);
  --message-success-bg: #123a20;
  --message-success-icon: url(../img/icon-yes-dark.svg);
  --message-warning-bg: #4a3410;
  --message-warning-icon: url(../img/icon-alert-dark.svg);
  --message-error-bg: #4d1a1e;
  --message-error-icon: url(../img/icon-no-dark.svg);

  --darkened-bg: #18211c;
  --selected-bg: #101815;
  --selected-row: #143922;

  --close-button-bg: #3f4d45;
  --close-button-hover-bg: #56665d;

  color-scheme: dark;
}

/* THEME SWITCH */
.theme-toggle {
  cursor: pointer;
  border: none;
  padding: 0;
  background: transparent;
  vertical-align: middle;
  margin-inline-start: 5px;
  margin-top: -1px;
}
.theme-toggle svg {
  vertical-align: middle;
  height: 1.5rem;
  width: 1.5rem;
  display: none;
}
/* Fully hide screen reader text so we only show the one matching the current theme. */
.theme-toggle .visually-hidden {
  display: none;
}
html[data-theme="auto"] .theme-toggle .theme-label-when-auto {
  display: block;
}
html[data-theme="dark"] .theme-toggle .theme-label-when-dark {
  display: block;
}
html[data-theme="light"] .theme-toggle .theme-label-when-light {
  display: block;
}

/* ICONS */
.theme-toggle svg.theme-icon-when-auto,
.theme-toggle svg.theme-icon-when-dark,
.theme-toggle svg.theme-icon-when-light {
  fill: var(--header-link-color);
  color: var(--header-bg);
}
html[data-theme="auto"] .theme-toggle svg.theme-icon-when-auto {
  display: block;
}
html[data-theme="dark"] .theme-toggle svg.theme-icon-when-dark {
  display: block;
}
html[data-theme="light"] .theme-toggle svg.theme-icon-when-light {
  display: block;
}

/* Form controls in dark mode */
html[data-theme="dark"] input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .vTextField,
html[data-theme="dark"] .vLargeTextField,
html[data-theme="dark"] .vURLField,
html[data-theme="dark"] .vForeignKeyRawIdAdminField,
html[data-theme="dark"] .vManyToManyRawIdAdminField {
  background-color: #142119;
  color: #f3f6ef;
  border-color: #355044;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-theme="dark"] input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"])::placeholder,
html[data-theme="dark"] textarea::placeholder {
  color: #95a897;
}

html[data-theme="dark"] input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:focus {
  background-color: #183023;
  border-color: #d4af37;
  outline: none;
  box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}