/* Total Family — dark theme
   Palette taken from help.totalfamily.io: deep teal-green surface (#162525),
   sage cards (#2f3e3c), terracotta accent (#db684c). */
:root {
  --body-background-color: #162525;
  --body-text-color: #f8f8f8;

  --card-background-color: #2f3e3c;
  --card-border-color: #2d3b37;

  --nav-background-color: #162525;
  --nav-border-bottom-color: #2d3b37;
  --nav-current-border-bottom-color: #db684c;

  --up-border-left-color: #47be8b;
  --up-color-color: #47be8b;
  --down-border-left-color: #f14d4c;
  --down-color-color: #f14d4c;
  --down-background-color: #4f1a18;
  --degraded-border-left-color: #ee7e00;
  --degraded-color-color: #ee7e00;

  --tag-color: #162525;
  --tag-up-background-color: #47be8b;
  --tag-down-background-color: #f14d4c;
  --tag-degraded-background-color: #ee7e00;
  --change-background-color: #ee7e00;

  --code-background-color: #2d3b37;
  --code-color: #acbcb5;

  --submit-button-border-color: #db684c;
  --submit-button-background-color: #db684c;
  --submit-button-color: #ffffff;
  --error-button-border-color: #f14d4c;
  --error-button-background-color: #f14d4c;
  --error-button-color: #ffffff;

  --graph-opacity: 0.95;
  --graph-filter: none;
}

/* --- Chrome removal + branding ------------------------------------------
   The upstream navigation and footer are hidden and the Total Family
   wordmark is placed above the page heading instead, so the page carries
   our branding rather than the template's.

   !important against hash-agnostic selectors is deliberate: the upstream
   package scopes its CSS with a build hash (.svelte-a08hsz) that changes
   between releases, so matching its specificity would break silently on
   the next Upptime update. */
nav[class*="svelte-"],
footer[class*="svelte-"] {
  display: none !important;
}

main.container > header {
  padding-top: 3rem;
}

main.container > header::before {
  content: "";
  display: block;
  width: 200px;
  height: 58px;
  margin-bottom: 1.75rem;
  background: url("https://help.totalfamily.io/img/tf-logo-dark.webp") left center / contain no-repeat;
}

/* The published wordmark is dark ink, so invert it on the dark surface. */
main.container > header::before {
  filter: brightness(0) invert(1);
}