/* Official brand for Django admin. Native forms, permissions and statuses stay intact. */
:root, html[data-theme="light"], html[data-theme="auto"] {
  --primary: #32445C;
  --secondary: #26364A;
  --accent: #E3D9CD;
  --header-color: #FFFFFF;
  --header-bg: #32445C;
  --breadcrumbs-bg: #FAF8F5;
  --breadcrumbs-fg: #32445C;
  --body-bg: #FAF8F5;
  --body-fg: #243245;
  --body-quiet-color: #58677A;
  --body-loud-color: #243245;
  --darkened-bg: #F4F0EA;
  --selected-bg: #E3D9CD;
  --selected-row: #F7F2EC;
  --hairline-color: #E3D9CD;
  --border-color: #D8CEC2;
  --link-fg: #32445C;
  --link-selected-fg: #26364A;
  --button-bg: #32445C;
  --button-hover-bg: #26364A;
  --default-button-bg: #32445C;
  --default-button-hover-bg: #26364A;
  --card-bg: #FFFFFF;
  --soft-bg: #FAF8F5;
  --muted-text: #58677A;
}
html[data-theme="dark"] {
  --primary: #E3D9CD;
  --secondary: #C4AF9C;
  --accent: #C4AF9C;
  --header-color: #FFFFFF;
  --header-bg: #26364A;
  --breadcrumbs-bg: #26364A;
  --breadcrumbs-fg: #FFFFFF;
  --body-bg: #182433;
  --body-fg: #F5F1EC;
  --body-quiet-color: #D8CEC2;
  --body-loud-color: #FFFFFF;
  --darkened-bg: #243245;
  --selected-bg: #40546D;
  --selected-row: #31445A;
  --hairline-color: #40546D;
  --border-color: #66778B;
  --link-fg: #E3D9CD;
  --link-selected-fg: #FFFFFF;
  --button-bg: #32445C;
  --button-hover-bg: #425875;
  --default-button-bg: #32445C;
  --default-button-hover-bg: #425875;
  --card-bg: #243245;
  --soft-bg: #26364A;
  --muted-text: #D8CEC2;
}
body, input, select, textarea, button { font-family: var(--brand-font-body); }
#header { background: var(--header-bg); color: var(--header-color); }
#branding .admin-brand a { display: block; width: min(260px, 38vw); }
#branding .brand-logo { display: block; width: 100%; height: auto; max-height: 72px; object-fit: contain; object-position: left center; }
.admin-preview-pill { color: #FFFFFF; border-color: #ffffff6b; }
#user-tools, #user-tools a { color: #FFFFFF; }
#content h1, .dashboard-welcome h1, .form-guidance h2, .login #content h1 {
  font-family: var(--brand-font-title);
  color: var(--body-loud-color);
  font-weight: 500;
  letter-spacing: 0;
}
#content h2, .task-card h3, .admin-start-guide h2 { color: var(--body-loud-color); }
.dashboard-welcome h1 { font-family: var(--brand-font-title)!important; }
.admin-eyebrow, .task-action { color: var(--link-fg); }
.task-card, .admin-start-guide, .form-guidance, .all-tools, .module,
.inline-group, .submit-row, #changelist { border-color: var(--hairline-color); }
.task-card:hover { border-color: var(--brand-navy); }
.featured-task { background: var(--soft-bg); border-color: var(--brand-beige); }
.task-symbol { background: var(--selected-bg); color: var(--link-fg); }
.admin-status-note { border-color: var(--hairline-color); }
#nav-sidebar .current-model { background: var(--selected-bg); }
#nav-sidebar caption a, #nav-sidebar a { color: var(--link-fg); }
.form-guidance h2 { font-family: var(--brand-font-title); }
input[type=checkbox], input[type=radio] { accent-color: var(--brand-navy); }
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible {
  outline: 3px solid var(--brand-navy);
  outline-offset: 2px;
  border-color: var(--brand-navy)!important;
}
fieldset.module h2 {
  background: var(--soft-bg);
  color: var(--body-fg);
  border-bottom: 1px solid var(--hairline-color);
}
html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] button:focus-visible,
html[data-theme="dark"] a:focus-visible {
  outline-color: var(--brand-beige);
  border-color: var(--brand-beige)!important;
}
input[type=submit], .button, a.button, .object-tools a {
  background: var(--button-bg);
  color: #FFFFFF;
}
input[type=submit]:hover, .button:hover, a.button:hover, .object-tools a:hover {
  background: var(--button-hover-bg);
}
.submit-row a.deletelink { background: #9C3542; color: #FFFFFF; }
.submit-row a.deletelink:hover { background: #7C2531; }
.admin-badge { color: var(--link-fg); }
.login #container { border: 1px solid var(--brand-sand); }
.login #header { min-height: 110px; }
@media(max-width:767px) {
  #header { padding: 16px 20px; }
  #branding .admin-brand a { width: min(230px, 72vw); }
  #content { padding: 22px 18px; }
  .dashboard-welcome h1 { font-size: 31px!important; }
}