.hidden-inputs {
  display: none;
}

.hidden-inputs.show-hidden-inputs {
  display: block;
}

.debug-on .debug-ring {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-inset: inset;
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(220 38 38 / var(--tw-ring-opacity, 1));
}

/* .debug-off .debug-ring {
	@apply !ring-0 !ring-transparent;
} */

.field-validation-error {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity, 1));
}

.validation-summary-errors {
  width: 100%;
  border-radius: 0.375rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(252 165 165 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  line-height: 1.625;
  --tw-text-opacity: 1;
  color: rgb(153 27 27 / var(--tw-text-opacity, 1));
}

.validation-summary-errors ul {
  margin: 0px;
  list-style-position: inside;
  list-style-type: disc;
  padding: 0px;
}

.validation-summary-errors li {
  margin-bottom: 0.25rem;
}

.validation-summary-errors li:last-child {
  margin-bottom: 0px;
}

.htmx-request .htmx-indicator {
  display: block !important;
}

.htmx-request.htmx-indicator {
  display: block !important;
}

@font-face {
  font-family: 'Roboto';

  src: url('../fonts/Roboto.ttf') format('truetype-variations');

  font-weight: 100 900;

  font-style: normal;
}

@font-face {
  font-family: 'Roboto';

  src: url('../fonts/Roboto.ttf') format('truetype-variations');

  font-weight: 100 900;

  font-style: italic;
}

@keyframes textFloat {
  0% {
    transform: translateX(0px);
  }

  25% {
    transform: translateX(-200px);
  }

  75% {
    transform: translateX(200px);
  }

  100% {
    transform: translateX(0px);
  }
}

.animate-text-float {
  animation: textFloat 30s linear infinite;
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0);
}

:root {
  --altcha-border-width: 1px;
  --altcha-border-radius: 0.375rem;
  --altcha-color-base: #ffffff;
  --altcha-color-border: #d1d5db;
  --altcha-color-text: #1f2937;
  --altcha-color-border-focus: currentColor;
  --altcha-color-error-text: #f23939;
  --altcha-color-footer-bg: #f4f4f4;
  --altcha-max-width: 260px;
}

.altcha input[type="checkbox"] {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-offset-width: 0px;
}

.altcha {
  overflow: hidden;
}

.altcha input[type="checkbox"]:focus {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.altcha:focus-within {
  border: var(--altcha-border-width, 1px) solid var(--altcha-color-border, #a0a0a0) !important;
}

.fade-bottom-mask {
  -webkit-mask-image: linear-gradient(to bottom, black 95%, transparent 100%);
          mask-image: linear-gradient(to bottom, black 95%, transparent 100%);
}