/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in files living in lib/assets/stylesheets are never compiled.
 *
 *= require_tree .
 *= require_self
 */

/* Landing page animations */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes glow-pulse {
  0%, 100% { opacity: 0.5; transform: scale(1); }
  50% { opacity: 0.8; transform: scale(1.2); }
}

@keyframes pulse-bg {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.6; }
}

.animate-fade-in-up {
  animation: fadeInUp 0.6s ease-out forwards;
}

.animate-glow-pulse {
  animation: glow-pulse 3s ease-in-out infinite;
}

.animate-pulse-bg {
  animation: pulse-bg 8s ease-in-out infinite;
}

dl {
    font-size: var(--text-sm);
    dt {
        font-weight: var(--font-weight-bold);
        margin-top: calc(var(--spacing)*4);
    }
}

label:has(+ input:required):after {
    content: " *"
}

input:user-invalid, .field_with_errors input {
    border-color: var(--color-destructive);
}

label:has(+ input:user-invalid), .field_with_errors label {
    color: var(--color-destructive);
}