:root {
  font-family: Inter, sans-serif;
  font-feature-settings:
    "liga" 1,
    "calt" 1; /* fix for Chrome */
  font-size: 14px;
  font-variant-numeric: lining-nums tabular-nums slashed-zero;
  color: #000;
}

@supports (font-variation-settings: normal) {
  :root {
    font-family: InterVariable, sans-serif;
  }
}

div#footer {
  color: #999;
  font-size: 10px;
  margin-top: 40px;
  padding: 12px 0 4px 0;
  text-align: center;
  width: 100%;
}

div#login h1,
div#auth-error h1 {
  font-size: 28px;
}

div#login a,
div#auth-error a {
  margin-top: 12px;
}

div#auth-error .uk-button {
  width: 40%;
}

div#documentation a.uk-link {
  color: #000;
}

/* The default sizing for UIKit's notification messages is a bit too large for our purposes. Also it
overlaps the titlebar, with the same background color, which just looks weird. Maybe we'll change
the title bar's background and move the logo to the middle at some point. Until then, we move the
notification container out of the way. */
div.uk-notification {
  margin-top: 90px;
}

div.uk-notification-message {
  font-size: 16px;
  padding: 8px;
}

div.uk-notification-message span.uk-icon > svg {
  padding-bottom: 3px;
}

div#documentation {
  position: relative;
  top: 32px;
}

a.uk-notification-close {
  top: 13px;
  right: 12px;
}

div#upload-ctrl-progress {
  opacity: 0;
}

div#upload-ctrl-progress > progress {
  margin-top: 4px;
}

div#dropzone {
  min-width: 240px;
  margin-right: 16px;
}

div#dropzone-inner {
  border-color: #e5e5e5;
  border-style: dashed;
  border-width: 1px;
}

div#dropzone-inner {
  pointer-events: none;
}

div#dropzone-inner.disabled {
  color: #b3b3b3;
}

div#upload-ctrl {
  padding-left: 24px;
}

div.upload-ctrl-info-badges {
  min-width: 100px;
}

input[type="checkbox"] {
  accent-color: black;
}

span.upload-ctrl-info.uk-icon > svg {
  vertical-align: baseline !important;
}

span.label-tooltip.uk-icon > svg {
  vertical-align: baseline !important;
}

span.important-tooltip.uk-icon > svg {
  color: #fa4d56;
}

#quasset-link {
  gap: 0.4rem;
  color: #f26101 !important;
  cursor: pointer;
  display: flex;
  align-items: center;
}

#quasset-link .uk-icon * {
  stroke: #f26101;
}

#quasset-link a {
  color: #f26101 !important;
}

#quasset-link:hover * {
  color: #d45501 !important;
  stroke: #d45501;
  text-decoration: underline;
  text-underline-offset: 4px;
}

#quasset-link.uk-disabled {
  stroke: #b3b3b3;
  color: #b3b3b3 !important;
  text-decoration: underline;
}

#quasset-link.uk-disabled a {
  color: #b3b3b3 !important;
}

.uk-tab > li:first-child {
  padding-left: 0;
}

.uk-tab::before {
  left: 0;
}

ul#tab-navigation {
  background-color: #ffffff;
  margin: 0px;
  padding-top: 16px;
}

.uk-icon.status-failure {
  color: #fa4d56;
}

.uk-icon.status-pending {
  color: #0192f2;
}

.uk-icon.status-success {
  color: #24a148;
}

#dropped-missions,
#dropped-volume {
  background-color: #999;
  color: #fff;
}

#accepted-missions,
#accepted-volume {
  background-color: #f26101;
  color: #fff;
}

#upload-ctrl-progress {
  margin-top: 24px;
}

#task-config-modal .uk-select {
  width: 100%;
}

span.active-star polygon {
  fill: black;
}

span.disabled-star {
  color: #999;
}