/* Django admin theme override: light mode
   Ivory + jungle green + gold, tuned to feel warm and premium. */

html[data-theme="light"], :root {
  --primary: #d4af37;
  --secondary: #173f2c;
  --accent: #f0d17a;

  --primary-fg: #fffdf7;
  --body-fg: #243328;
  --body-bg: #f7f3e8;
  --body-quiet-color: #657266;
  --body-medium-color: #4b5a4d;
  --body-loud-color: #101814;

  --header-color: #fff8de;
  --header-branding-color: #f0d17a;
  --header-bg: #173f2c;
  --header-link-color: #fffdf7;

  --breadcrumbs-fg: #d7e0d2;
  --breadcrumbs-link-fg: #f7f3e8;
  --breadcrumbs-bg: #123122;

  --link-fg: #216b44;
  --link-hover-color: #114d31;
  --link-selected-fg: #173f2c;

  --hairline-color: #dde3d5;
  --border-color: #c7d0c1;
  --error-fg: #ab4150;

  --message-debug-bg: #edf0ea;
  --message-debug-icon: url(../img/icon-debug.svg);
  --message-info-bg: #e2f0e8;
  --message-info-icon: url(../img/icon-info.svg);
  --message-success-bg: #e7f3e1;
  --message-success-icon: url(../img/icon-yes.svg);
  --message-warning-bg: #fff3d7;
  --message-warning-icon: url(../img/icon-alert.svg);
  --message-error-bg: #fae8ea;
  --message-error-icon: url(../img/icon-no.svg);

  --darkened-bg: #efeadc;
  --selected-bg: #e4eddc;
  --selected-row: #fff5d0;

  --button-fg: #fffdf7;
  --button-bg: #173f2c;
  --button-hover-bg: #245f40;
  --default-button-bg: #2a7450;
  --default-button-hover-bg: #d4af37;

  --close-button-bg: #59685f;
  --close-button-hover-bg: #425047;
  --delete-button-bg: #9f3340;
  --delete-button-hover-bg: #7f2530;

  --object-tools-fg: var(--button-fg);
  --object-tools-bg: var(--close-button-bg);
  --object-tools-hover-bg: var(--close-button-hover-bg);

  --font-family-primary: "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-family-monospace: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

  color-scheme: light;
}

/* Light-mode form refinements */
html[data-theme="light"] input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]),
html[data-theme="light"] textarea,
html[data-theme="light"] select,
html[data-theme="light"] .vTextField,
html[data-theme="light"] .vLargeTextField,
html[data-theme="light"] .vURLField,
html[data-theme="light"] .vForeignKeyRawIdAdminField,
html[data-theme="light"] .vManyToManyRawIdAdminField {
  background-color: #fcfaf3;
  color: #243328;
  border-color: #c9d5c2;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

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

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

/* Light-mode admin surface polish */
html[data-theme="light"] #content-related {
  background: #f1ecdd;
  border-color: #d9dfd1;
}

html[data-theme="light"] .module h2,
html[data-theme="light"] .module caption,
html[data-theme="light"] .inline-group h2 {
  background: #173f2c;
  color: #f7dd8a;
}

html[data-theme="light"] div.breadcrumbs {
  color: #d7e0d2;
}

html[data-theme="light"] div.breadcrumbs a {
  color: #fffdf7;
}

html[data-theme="light"] table thead th {
  background: #efeadc;
  color: #243328;
}

html[data-theme="light"] tr:nth-child(odd),
html[data-theme="light"] .row-form-errors {
  background: #fbf8f0;
}

html[data-theme="light"] tr:nth-child(even),
html[data-theme="light"] .module {
  background: #fffdf7;
}

html[data-theme="light"] .selector-chosen h2 {
  background: #2a7450;
  color: #fffdf7;
}

/* Two-state theme toggle polish
   Visual contract: only Light and Dark exist. The stock Django "auto" icon
   is never displayed. The companion two_state_theme.js removes auto from the
   actual click cycle. */

.theme-toggle {
  width: 2rem;
  height: 2rem;
  margin-inline-start: 8px;
  margin-top: -1px;
  padding: 0;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: transparent;
  outline: none;
  box-shadow: none;
  cursor: pointer;
  vertical-align: middle;
}

.theme-toggle:hover {
  background: rgba(212, 175, 55, 0.12);
}

.theme-toggle:focus,
.theme-toggle:active {
  outline: none;
  box-shadow: none;
}

.theme-toggle:focus-visible {
  background: rgba(212, 175, 55, 0.12);
  box-shadow:
    0 0 0 2px rgba(240, 209, 122, 0.34),
    inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.theme-toggle svg,
.theme-toggle svg.theme-icon-when-auto,
.theme-toggle svg.theme-icon-when-light,
.theme-toggle svg.theme-icon-when-dark {
  width: 1.35rem;
  height: 1.35rem;
  display: none;
  fill: var(--header-link-color);
  color: transparent;
  background: transparent;
  filter: drop-shadow(0 1px 0 rgba(0, 0, 0, 0.18));
}

/* Show only the two real states. No half-light/half-dark auto icon. */
html[data-theme="light"] .theme-toggle svg.theme-icon-when-light,
html[data-theme="dark"] .theme-toggle svg.theme-icon-when-dark {
  display: block;
}

/* If Django briefly starts in auto before our JS normalizes it, show the
   effective system theme as Light or Dark, never the auto icon. */
@media (prefers-color-scheme: light) {
  html[data-theme="auto"] .theme-toggle svg.theme-icon-when-light {
    display: block;
  }
}

@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] .theme-toggle svg.theme-icon-when-dark {
    display: block;
  }
}

.theme-toggle .theme-label-when-auto,
.theme-toggle .theme-label-when-light,
.theme-toggle .theme-label-when-dark,
.theme-toggle .visually-hidden {
  display: none;
}

/* Final theme-toggle polish
   Removes the visible circular/currentColor backing shape from Django's SVG
   icons, even if dark_mode.css is loaded after this file. */

.theme-toggle,
.theme-toggle:hover,
.theme-toggle:focus,
.theme-toggle:active,
.theme-toggle:focus-visible {
  background: transparent !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

.theme-toggle svg,
.theme-toggle svg.theme-icon-when-auto,
.theme-toggle svg.theme-icon-when-light,
.theme-toggle svg.theme-icon-when-dark {
  color: transparent !important;
  background: transparent !important;
  fill: var(--header-link-color) !important;
}

/* Two visible states only. The auto/system icon never appears. */
.theme-toggle svg.theme-icon-when-auto {
  display: none !important;
}

html[data-theme="light"] .theme-toggle svg.theme-icon-when-light {
  display: block !important;
}

html[data-theme="dark"] .theme-toggle svg.theme-icon-when-dark {
  display: block !important;
}

html[data-theme="light"] .theme-toggle svg.theme-icon-when-dark,
html[data-theme="dark"] .theme-toggle svg.theme-icon-when-light {
  display: none !important;
}
