/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

.skip-link {
  position: absolute;
  left: 1rem;
  top: 1rem;
  z-index: 50;
  transform: translateY(-200%);
  border-radius: 9999px;
  background: #111827;
  color: #f9fafb;
  font-weight: 600;
  padding: 0.75rem 1rem;
  transition: transform 0.2s ease;
}

.skip-link:focus {
  transform: translateY(0);
}

:where(a, button, input, select, textarea, summary, [tabindex], trix-editor):focus-visible {
  outline: 3px solid #fb7185;
  outline-offset: 2px;
}