/*
 * The curator admin in the public site's kami look (decision journal D-031).
 * Django's admin draws everything from the variables below, so mapping them onto the kami tokens
 * in tokens.css restyles it, dark mode included, without touching its layout or widgets.
 */

:root {
  --primary: var(--tag-14);
  --secondary: var(--brand);
  --accent: var(--brand);
  --primary-fg: var(--brand);

  --body-fg: var(--near-black);
  --body-bg: var(--parchment);
  --body-quiet-color: var(--stone);
  --body-medium-color: var(--olive);
  --body-loud-color: var(--near-black);

  /* header-bg and header-link-color are a pair: the page header, module captions and widget titles. */
  --header-color: var(--stone);
  --header-branding-color: var(--near-black);
  --header-bg: var(--parchment);
  --header-link-color: var(--brand);

  --breadcrumbs-fg: var(--stone);
  --breadcrumbs-link-fg: var(--brand);
  --breadcrumbs-bg: var(--parchment);

  --link-fg: var(--brand);
  --link-hover-color: var(--brand-light);
  --link-selected-fg: var(--brand);

  --hairline-color: var(--border-soft);
  --border-color: var(--border);
  --error-fg: var(--brand);  /* kami has one accent; errors carry an icon and explicit text (D-026) */

  --message-debug-bg: var(--ivory);
  --message-info-bg: var(--tag-08);
  --message-success-bg: var(--tag-08);
  --message-warning-bg: var(--tag-14);
  --message-error-bg: var(--tag-14);

  --darkened-bg: var(--ivory);
  --selected-bg: var(--tag-08);
  --selected-row: var(--tag-14);

  --button-fg: var(--ivory);
  --button-bg: var(--brand);
  --button-hover-bg: var(--brand-light);
  --default-button-bg: var(--brand);
  --default-button-hover-bg: var(--brand-light);
  --close-button-bg: var(--stone);
  --close-button-hover-bg: var(--olive);
  --object-tools-bg: var(--brand);
  --object-tools-hover-bg: var(--brand-light);
  /* --delete-button-bg keeps Django's red: destructive actions should not look like Save. */

  --font-family-primary: var(--sans);
  --font-family-monospace: var(--mono);
}

/* eyebrow header and breadcrumbs, as on the public pages */
#header { border-bottom: 1px solid var(--border); }
#site-name, #site-name a:link, #site-name a:visited { font: 500 13px/1.4 var(--sans); letter-spacing: 1.2px; text-transform: uppercase; color: var(--near-black); }
.ink { color: var(--brand); }
#user-tools { font: 500 12px/1.4 var(--sans); letter-spacing: 1.2px; text-transform: uppercase; color: var(--stone); }
ol.breadcrumbs { border-bottom: 1px solid var(--border-soft); }

/* serif headings, sans labels */
#content h1, #content h2, .login #header h1 { font-family: var(--serif); font-weight: 500; }
#content > h1 { font-size: 28px; letter-spacing: 0.2px; }
#content .module h2, .module caption, #content .inline-group h2, #content fieldset .fieldset-heading {
  font: 500 12px/1.4 var(--sans); letter-spacing: 1.2px; text-transform: uppercase; border-bottom: 1px solid var(--border);
}

/* the fields curators write public text in read in the public serif */
#id_title, #id_description, #id_review_reason, .readonly { font-family: var(--serif); font-size: 16px; }

/* solid tints instead of the stock blue title bar */
.selector-chosen-title { background: var(--tag-14); color: var(--brand); }

/* rounded controls and buttons, like the public form */
input[type=text], input[type=url], input[type=password], input[type=search], select, textarea, .button, input[type=submit], button { border-radius: 6px; }
