/* -*- indent-tabs-mode: nil; tab-width: 2; -*- */
/* vim: set ts=2 sw=2 et ai : */

:root, body {
  font-family: system-ui, sans-serif;
}

::selection {
  background-color: var(--selection-color);
}

a {
  color: var(--accent-color);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

#topbar {
  border-block-end-color: var(--accent-color) !important;
  background-color: #fff !important;
  box-shadow: 0 0 16px #fff;
  color: #333;
}

#topbar-branding-icon {
  background-color: var(--accent-color);
}

#topbar-branding-icon > .inner {
  background-color: #fff;
  mask: var(--url-logo) center / contain no-repeat add alpha;
}

#topbar-branding-logotype {
  background-color: var(--accent-color);
  mask: var(--url-logotype) center / contain no-repeat add alpha;
}

#content {
  background-color: #fff;
  color: #333;
}

#global-footer {
  background-color: #333;
  color: #fff;
}

#global-footer-branding-logo {
  background-color: #fff;
  mask: var(--url-logo) center / contain no-repeat add alpha;
}

.post-channel {
  font-size: 120%;
}

.post-channel .post-channel-handle-outer {
  font-size: 1rem;
  color: #888;
}

.post-author .post-author-uuid {
  font-size: 80%;
  color: #888;
}

.post-author .post-author-uuid::before {
  content: '(';
}

.post-author .post-author-uuid::after {
  content: ')';
}

.template-content-tag-list-item > a {
  background-color: var(--accent-color);
  color: #fff;
  border-radius: .5rem;
}