/**
  When adding fonts here, make sure to add them using a base64 data uri, otherwise
  fonts loading are delayed, and text may get displayed incorrectly.
*/

/* https://github.com/unoplatform/uno/issues/3954 */
@font-face {
  font-family: 'Segoe UI';
  src: local('Segoe UI'), local('-apple-system'), local('BlinkMacSystemFont'), local('Inter'), local('Cantarell'), local('Ubuntu'), local('Roboto'), local('Open Sans'), local('Noto Sans'), local('Helvetica Neue'), local('sans-serif');
}

@font-face {
  font-family: 'Roboto';
  src: url(./Uno.Fonts.Roboto/Fonts/Roboto-Light.ttf) format('truetype');
  font-weight: 300;
}

@font-face {
  font-family: 'Roboto';
  src: url(./Uno.Fonts.Roboto/Fonts/Roboto-Regular.ttf) format('truetype');
  font-weight: 400;
}

@font-face {
  font-family: 'Roboto';
  src: url(./Uno.Fonts.Roboto/Fonts/Roboto-Medium.ttf) format('truetype');
  font-weight: 500;
}

/* ---- Loading screen -------------------------------------------------------
   The WebAssembly runtime is a large first download, so give the boot splash a
   clear, always-moving progress bar (plus a "Loading…" caption) so it never
   looks frozen. The bar animates continuously regardless of the reported value.
   Logo, bar and caption stack in one centred column. uno-bootstrap.css pins the
   logo to the middle of the window (position: fixed) and the bar to its bottom
   left (position: absolute), which left the caption alone in the column, right
   on top of the logo - so both are put back in the column here. The container
   itself is already absolute and fills the window (uno-bootstrap.css). */
.uno-loader {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 22px;
  margin: 0;
}

.uno-loader .logo {
  position: static;
  top: auto;
  left: auto;
  transform: none;
  max-width: none;
  max-height: none;
  width: 132px;
  height: auto;
}

.uno-loader progress {
  position: static;
  top: auto;
  left: auto;
  right: auto;
  bottom: auto;
  flex: 0 0 auto;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 220px;
  height: 8px;
  border: 0;
  border-radius: 999px;
  background-color: #FBE1E4;
  background-image: linear-gradient(90deg, rgba(215, 38, 61, 0) 0%, #D7263D 50%, rgba(215, 38, 61, 0) 100%);
  background-repeat: no-repeat;
  background-size: 45% 100%;
  animation: uno-loading 1.15s ease-in-out infinite;
}

.uno-loader progress::-webkit-progress-bar { background: transparent; }
.uno-loader progress::-webkit-progress-value { background: transparent; }
.uno-loader progress::-moz-progress-bar { background: transparent; }

.uno-loader .alert { display: none; }

.uno-loader::after {
  content: "Loading\2026";
  font-family: 'Segoe UI', system-ui, sans-serif;
  font-size: 13px;
  letter-spacing: 0.3px;
  opacity: 0.6;
}

/* Uno's loader turns dark (#202020) with the system theme; the page text does not. */
@media (prefers-color-scheme: dark) {
  .uno-loader::after { color: #FFFFFF; }
}

@keyframes uno-loading {
  0%   { background-position: -60% 0; }
  100% { background-position: 160% 0; }
}