/* Easy's own colours, from Easy's app.css (--brand-red, --brand-slate, --chrome-dark, --link, --ink). Easy's rule is kept:
   red marks the current item and the one action that commits, links are ink blue, charcoal is the chrome. */
:root {
  --easy-red: #CE152C;
  --easy-red-hover: #AE1125;
  --easy-red-wash: rgba(206, 21, 44, 0.10);
  --easy-slate: #596475;
  --easy-chrome: #14181D;
  --easy-link: #1F4E79;
  --easy-link-hover: #163A5C;
  --easy-ink: #1A1A1A;
}
[data-md-color-scheme="default"] {
  --md-primary-fg-color: var(--easy-chrome);
  --md-primary-fg-color--light: #2a3038;
  --md-primary-fg-color--dark: #0c0f12;
  --md-primary-bg-color: #ffffff;
  --md-accent-fg-color: var(--easy-red);
  --md-typeset-a-color: var(--easy-link);
  --md-default-fg-color: var(--easy-ink);
  --md-default-bg-color: #ffffff;
}
[data-md-color-scheme="slate"] {
  --md-hue: 215;
  --md-primary-fg-color: #101317;
  --md-primary-bg-color: #E8EAED;
  --md-accent-fg-color: #F4606E;
  --md-typeset-a-color: #8DB8E8;
  --md-default-bg-color: #181C22;
}
.md-typeset a:hover { color: var(--md-accent-fg-color); }

/* Header: charcoal bar with a red rule, the shield on the left. */
.md-header { border-bottom: 3px solid var(--easy-red); box-shadow: none; }
/* The white Project Five logo is a stacked shield and wordmark, so the bar is taller than Material's default to keep the
   wordmark readable. The two sidebars and anchor jumps are moved down by the same amount. */
:root { --easy-header-h: 3.8rem; }
.md-header__inner { height: var(--easy-header-h); }
.md-header__button.md-logo { padding: 0.3rem 0.4rem; margin: 0; }
.md-header__button.md-logo img { height: 3.1rem; width: auto; }
.md-header__title { font-weight: 600; letter-spacing: 0.01em; }
.md-header__button { margin: 0.5rem 0.2rem; }
.md-search__form { height: 2.2rem; }
@media screen and (min-width: 76.25em) {
  .md-sidebar { top: var(--easy-header-h); }
  .md-sidebar__scrollwrap { max-height: calc(100vh - var(--easy-header-h)); }
}
html { scroll-padding-top: calc(var(--easy-header-h) + 1rem); }
.md-tabs { top: var(--easy-header-h); }

/* The current page in the left menu is red, as the active item is in Easy. */
.md-nav__item .md-nav__link--active,
.md-nav__item--active > .md-nav__link { color: var(--easy-red); font-weight: 600; }
[data-md-color-scheme="slate"] .md-nav__item .md-nav__link--active { color: #F4606E; }
.md-nav--primary > .md-nav__title { color: var(--md-primary-bg-color); }
.md-nav__item--section > .md-nav__link { font-weight: 600; text-transform: none; color: var(--easy-slate); }
[data-md-color-scheme="slate"] .md-nav__item--section > .md-nav__link { color: #93A0B3; }

/* Headings. */
.md-typeset h1 { font-weight: 700; color: var(--easy-ink); letter-spacing: -0.01em; }
[data-md-color-scheme="slate"] .md-typeset h1 { color: #E8EAED; }
.md-typeset h2 { font-weight: 600; border-bottom: 1px solid var(--md-default-fg-color--lightest); padding-bottom: 0.3rem; }
.md-typeset h2 a.headerlink, .md-typeset h3 a.headerlink { color: var(--easy-red); }

/* Screenshots: a hairline and a soft shadow, so they read as pictures of the app and not as part of the page. */
.md-typeset img[src*="/shots/"] {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(20, 24, 29, 0.08), 0 6px 18px rgba(20, 24, 29, 0.06);
  margin: 0.4rem 0 1rem;
}

/* The "check before you continue" boxes are the manual's one repeated device: green, as Easy shows a finished step. */
.md-typeset .admonition.success, .md-typeset details.success { border-color: #1b7f4b; }
.md-typeset .success > .admonition-title, .md-typeset .success > summary { background: rgba(27, 127, 75, 0.10); }
.md-typeset .success > .admonition-title::before, .md-typeset .success > summary::before { background-color: #1b7f4b; }
/* A warning is Easy's red: money posts, it can't be undone. */
.md-typeset .admonition.warning, .md-typeset details.warning { border-color: var(--easy-red); }
.md-typeset .warning > .admonition-title, .md-typeset .warning > summary { background: var(--easy-red-wash); }
.md-typeset .warning > .admonition-title::before, .md-typeset .warning > summary::before { background-color: var(--easy-red); }
.md-typeset .admonition.info, .md-typeset details.info, .md-typeset .admonition.note { border-color: var(--easy-slate); }
.md-typeset .info > .admonition-title, .md-typeset .note > .admonition-title { background: rgba(89, 100, 117, 0.10); }
.md-typeset .info > .admonition-title::before, .md-typeset .note > .admonition-title::before { background-color: var(--easy-slate); }

/* Tables and task lists. */
.md-typeset table:not([class]) th { background: var(--easy-chrome); color: #fff; font-weight: 600; }
[data-md-color-scheme="slate"] .md-typeset table:not([class]) th { background: #101317; }
:root {
  /* An empty ring, so a box nobody has ticked yet does not look ticked (the checklists are for the reader). */
  --md-tasklist-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 20a8 8 0 0 1-8-8 8 8 0 0 1 8-8 8 8 0 0 1 8 8 8 8 0 0 1-8 8m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2"/></svg>');
}
.md-typeset .task-list-control .task-list-indicator::before { background-color: var(--easy-slate); }
.md-typeset [type="checkbox"]:checked + .task-list-indicator::before { background-color: #1b7f4b; }

/* Search and the "planned" banner. */
.md-search__input::placeholder { color: rgba(255, 255, 255, 0.7); }
.md-typeset .admonition.warning:has(> .admonition-title:only-child) { margin-bottom: 1rem; }

/* Footer. */
.md-footer-meta { background: var(--easy-chrome); }
.md-footer { background: var(--easy-chrome); }

@media print {
  .md-header, .md-sidebar, .md-footer { display: none; }
  .md-typeset img[src*="/shots/"] { box-shadow: none; page-break-inside: avoid; }
}
