/*--------------------------------------------------------------
# fonts
--------------------------------------------------------------*/

/* fira-code-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Code';
  font-style: normal;
  font-weight: 300;
  src: url('./fonts/fira-code-v22-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* fira-code-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Code';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/fira-code-v22-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* fira-code-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Code';
  font-style: normal;
  font-weight: 500;
  src: url('./fonts/fira-code-v22-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* fira-code-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Code';
  font-style: normal;
  font-weight: 600;
  src: url('./fonts/fira-code-v22-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* fira-code-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Code';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/fira-code-v22-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/*--------------------------------------------------------------
# general
--------------------------------------------------------------*/

body {
  font-family: "Fira Code", sans-serif;
}

/*--------------------------------------------------------------
# htmx swaps & indicators
--------------------------------------------------------------*/
*[hx-swap] {
  animation: animate-in 500ms ease-in-out;
}

@keyframes animate-in {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.htmx-indicator {
  opacity: 0;
  transition: opacity 1s ease-in;
}

.htmx-request .htmx-indicator, .htmx-request.htmx-indicator {
  opacity: 1;
}