/* Django admin in the LabCore palette. The admin is CSS-variable driven, so
   this only rebinds its tokens to the same values as assets/css/labcore.css. */

:root, html[data-theme="light"] {
  --primary: oklch(0.208 0.042 265.755);
  --secondary: oklch(0.17 0.04 265);
  --accent: oklch(40.238% 0.13831 26.019);
  --primary-fg: #fff;

  --body-fg: oklch(0.129 0.042 264.695);
  --body-bg: oklch(0.985 0.003 247.858);
  --body-quiet-color: oklch(0.554 0.046 257.417);
  --body-medium-color: oklch(0.35 0.04 260);
  --body-loud-color: oklch(0.129 0.042 264.695);

  --header-color: oklch(0.984 0.003 247.858);
  --header-branding-color: oklch(0.984 0.003 247.858);
  --header-bg: oklch(0.208 0.042 265.755);
  --header-link-color: oklch(0.984 0.003 247.858);

  --breadcrumbs-fg: oklch(0.85 0.02 255);
  --breadcrumbs-link-fg: #fff;
  --breadcrumbs-bg: oklch(0.279 0.041 260.031);

  --link-fg: oklch(0.35 0.08 262);
  --link-hover-color: oklch(40.238% 0.13831 26.019);
  --link-selected-fg: oklch(40.238% 0.13831 26.019);

  --hairline-color: oklch(0.929 0.013 255.508);
  --border-color: oklch(0.9 0.013 255.508);

  --error-fg: oklch(0.577 0.245 27.325);

  --message-success-bg: oklch(0.95 0.05 150);
  --message-warning-bg: oklch(0.96 0.06 80);
  --message-error-bg: oklch(0.95 0.04 25);

  --darkened-bg: oklch(0.968 0.007 247.896);
  --selected-bg: oklch(0.94 0.02 255);
  --selected-row: oklch(0.96 0.03 80);

  --button-fg: #fff;
  --button-bg: oklch(0.208 0.042 265.755);
  --button-hover-bg: oklch(0.279 0.041 260.031);
  --default-button-bg: oklch(40.238% 0.13831 26.019);
  --default-button-hover-bg: oklch(0.35 0.14 26);
  --close-button-bg: oklch(0.554 0.046 257.417);
  --close-button-hover-bg: oklch(0.45 0.046 257);
  --delete-button-bg: oklch(0.577 0.245 27.325);
  --delete-button-hover-bg: oklch(0.5 0.24 27);

  --object-tools-fg: #fff;
  --object-tools-bg: oklch(0.554 0.046 257.417);
  --object-tools-hover-bg: oklch(0.208 0.042 265.755);

  --font-family-primary: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-family-monospace: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color-scheme: light;
}

/* Django's own header toggle sets data-theme on <html>; "auto" leaves it
   unset and the media query decides. Both paths land here. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --primary: oklch(0.929 0.013 255.508);
    --primary-fg: oklch(0.208 0.042 265.755);
    --accent: oklch(0.65 0.14 26.019);
    --body-fg: oklch(0.984 0.003 247.858);
    --body-bg: oklch(0.129 0.042 264.695);
    --body-quiet-color: oklch(0.704 0.04 256.788);
    --body-medium-color: oklch(0.85 0.02 255);
    --body-loud-color: oklch(0.984 0.003 247.858);
    --header-bg: oklch(0.17 0.04 265);
    --breadcrumbs-bg: oklch(0.208 0.042 265.755);
    --link-fg: oklch(0.8 0.06 255);
    --link-hover-color: oklch(0.75 0.14 26);
    --link-selected-fg: oklch(0.75 0.14 26);
    --hairline-color: oklch(1 0 0 / 12%);
    --border-color: oklch(1 0 0 / 15%);
    --darkened-bg: oklch(0.208 0.042 265.755);
    --selected-bg: oklch(0.279 0.041 260.031);
    --selected-row: oklch(0.3 0.05 80);
    --button-bg: oklch(0.279 0.041 260.031);
    --button-hover-bg: oklch(0.35 0.04 260);
    --default-button-bg: oklch(0.55 0.14 26);
    --default-button-hover-bg: oklch(0.65 0.14 26);
    --message-success-bg: oklch(0.3 0.06 150);
    --message-warning-bg: oklch(0.35 0.07 80);
    --message-error-bg: oklch(0.32 0.08 25);
    color-scheme: dark;
  }
}
html[data-theme="dark"] {
  --primary: oklch(0.929 0.013 255.508);
  --primary-fg: oklch(0.208 0.042 265.755);
  --accent: oklch(0.65 0.14 26.019);
  --body-fg: oklch(0.984 0.003 247.858);
  --body-bg: oklch(0.129 0.042 264.695);
  --body-quiet-color: oklch(0.704 0.04 256.788);
  --body-medium-color: oklch(0.85 0.02 255);
  --body-loud-color: oklch(0.984 0.003 247.858);
  --header-bg: oklch(0.17 0.04 265);
  --breadcrumbs-bg: oklch(0.208 0.042 265.755);
  --link-fg: oklch(0.8 0.06 255);
  --link-hover-color: oklch(0.75 0.14 26);
  --link-selected-fg: oklch(0.75 0.14 26);
  --hairline-color: oklch(1 0 0 / 12%);
  --border-color: oklch(1 0 0 / 15%);
  --darkened-bg: oklch(0.208 0.042 265.755);
  --selected-bg: oklch(0.279 0.041 260.031);
  --selected-row: oklch(0.3 0.05 80);
  --button-bg: oklch(0.279 0.041 260.031);
  --button-hover-bg: oklch(0.35 0.04 260);
  --default-button-bg: oklch(0.55 0.14 26);
  --default-button-hover-bg: oklch(0.65 0.14 26);
  --message-success-bg: oklch(0.3 0.06 150);
  --message-warning-bg: oklch(0.35 0.07 80);
  --message-error-bg: oklch(0.32 0.08 25);
  color-scheme: dark;
}

#header { padding: 10px 24px; box-shadow: 0 1px 2px oklch(0 0 0 / 15%); }
#branding h1 { font-weight: 600; letter-spacing: -0.01em; }
#branding h1 a:link, #branding h1 a:visited { color: var(--header-branding-color); }
div.breadcrumbs { padding: 8px 24px; font-size: 13px; }
#content { padding: 20px 24px; }
#content h1 { font-size: 22px; font-weight: 600; color: var(--body-loud-color); }
.module { border-radius: 8px; border: 1px solid var(--hairline-color); overflow: hidden; z-index: 1000 !important; }
.module h2, .module caption, .inline-group h2 {
  background: var(--darkened-bg); color: var(--body-medium-color);
  font-weight: 600; font-size: 12px; letter-spacing: 0.04em; text-transform: uppercase;
}
#changelist-filter { border-radius: 8px; }
#changelist-filter h2 { border-radius: 8px 8px 0 0; }
#changelist table thead th { background: var(--darkened-bg); }
.button, input[type=submit], input[type=button], .submit-row input, a.button { border-radius: 6px; padding: 8px 14px; font-weight: 500; }
.button.default, input[type=submit].default, .submit-row input.default { font-weight: 600; }
.object-tools a { border-radius: 999px; padding: 4px 14px; font-weight: 500; text-transform: none; letter-spacing: 0; }
.object-tools a.addlink { padding-right: 24px; }
input[type=text], input[type=password], input[type=email], input[type=url], input[type=number], input[type=tel], textarea, select, .vTextField {
  border-radius: 6px; border-color: var(--border-color); background: var(--body-bg); color: var(--body-fg);
}
input:focus, textarea:focus, select:focus, .vTextField:focus { border-color: var(--accent); box-shadow: 0 0 0 3px oklch(from var(--accent) l c h / 20%); }
.paginator { border-radius: 8px; }
.messagelist li { border-radius: 6px; }
#nav-sidebar { border-radius: 0; }
#nav-sidebar .current-app .section:link, #nav-sidebar .current-app .section:visited { color: var(--accent); }

/* django-admin-index tab bar: quiet tabs on the header, accent on the active one.
   html:root outranks the :root block admin-index.css ships, whichever loads last. */
html:root {
  --djai-tab-bg: transparent;
  --djai-tab-bg--active: oklch(1 0 0 / 14%);
  --djai-tab-bg--hover: oklch(1 0 0 / 10%);
  --djai-tab-fg: oklch(0.85 0.02 255);
  --djai-tab-fg--active: #fff;
  --djai-tab-fg--hover: #fff;
  --djai-dropdown-bg: var(--header-bg);
  --djai-dropdown-bg--active: oklch(1 0 0 / 14%);
  --djai-dropdown-bg--hover: oklch(1 0 0 / 10%);
  --djai-dropdown-fg: #fff;
  --djai-tablist-spacing-top: 6px;
}
.djai-dropdown-menu .djai-dropdown-menu__item { border-radius: 6px 6px 0 0; padding: 8px 12px; font-size: 13px; }
.djai-dropdown-menu .djai-dropdown-menu__drop { border-radius: 0 0 6px 6px; }

/* nav sidebar and module captions: Django paints them primary-on-white; keep them quiet */
.module caption, #nav-sidebar .module caption, #nav-sidebar .module th,
.module caption a.section:link, .module caption a.section:visited {
  color: var(--body-medium-color);
}
#nav-sidebar .module caption { padding: 8px 12px; }
#nav-sidebar .current-model { background: var(--selected-row); }

/* dark: Django paints paginator and object-tool hovers white-on-accent */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .paginator a:hover, :root:not([data-theme="light"]) .paginator a:focus { color: var(--body-bg); }
}
html[data-theme="dark"] .paginator a:hover, html[data-theme="dark"] .paginator a:focus { color: var(--body-bg); }

/* list_display flags, e.g. an order a dealer placed for a client */
.admin-flag { background: var(--message-error-bg); color: var(--body-fg); padding: 1px 4px; border-radius: 4px; }
