/*
====================================================
DoseClock accessibility.css
Phase 7 Package 15

Keyboard, motion, touch-target, screen-reader, and
print/accessibility refinements for the modular CSS system.
====================================================
*/

/*
====================================================
Skip link
====================================================
*/

.skip-link {
  position: fixed;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 9999;

  transform: translateY(-150%);
  opacity: 0;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.75rem 1rem;

  color: #ffffff;
  background: var(--color-primary, #0a2d6f);
  border: 3px solid #ffffff;
  border-radius: var(--radius-md, 0.75rem);
  box-shadow: var(--shadow-lg, 0 16px 40px rgba(10, 45, 111, 0.22));

  font-weight: 800;
  text-decoration: none;
}

.skip-link:focus,
.skip-link:focus-visible {
  transform: translateY(0);
  opacity: 1;
  outline: 4px solid rgba(37, 99, 235, 0.35);
  outline-offset: 3px;
}

#main-content:focus {
  outline: none;
}

/*
====================================================
Consistent keyboard focus
====================================================
*/

:focus-visible {
  outline: 4px solid rgba(37, 99, 235, 0.55);
  outline-offset: 3px;
}

a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.dc-button:focus-visible,
.site-nav__link:focus-visible,
.nav-toggle__button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
  outline: 4px solid rgba(37, 99, 235, 0.6);
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(37, 99, 235, 0.14);
}

/*
====================================================
Touch target safety
====================================================
*/

button,
.btn,
.dc-button,
.site-nav__link,
.site-nav__logout,
.nav-toggle__button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
  min-height: 44px;
}

input,
select,
textarea {
  min-height: 44px;
}

input[type="checkbox"],
input[type="radio"] {
  min-width: 1.25rem;
  min-height: 1.25rem;
}

label {
  cursor: pointer;
}

/*
====================================================
Flash messages and alerts
====================================================
*/

.flash-container {
  scroll-margin-top: 8rem;
}

.flash,
.dc-alert {
  border-left-width: 6px;
  line-height: 1.55;
}

.flash a,
.dc-alert a {
  font-weight: 800;
  text-decoration: underline;
}

/*
====================================================
Form validation and help text
====================================================
*/

.form-error,
.field-error,
.invalid-feedback,
.error-message {
  display: block;
  margin-top: 0.35rem;
  color: var(--color-danger, #b91c1c);
  font-weight: 700;
}

input[aria-invalid="true"],
select[aria-invalid="true"],
textarea[aria-invalid="true"],
.is-invalid {
  border-color: var(--color-danger, #b91c1c) !important;
  box-shadow: 0 0 0 4px rgba(185, 28, 28, 0.12);
}

.form-help,
.field-help,
.help-text {
  display: block;
  margin-top: 0.35rem;
  color: var(--color-muted, #475569);
  font-size: 0.95rem;
}

/*
====================================================
Screen-reader utility
====================================================
*/

.sr-only,
.visually-hidden:not(:focus):not(:active) {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/*
====================================================
Reduced motion
====================================================
*/

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/*
====================================================
Readable selected text
====================================================
*/

::selection {
  color: #ffffff;
  background: var(--color-primary, #0a2d6f);
}

/*
====================================================
Print accessibility
====================================================
*/

@media print {
  .skip-link,
  .site-header,
  .nav-toggle,
  .nav-toggle__button,
  .site-nav,
  .header-actions,
  .no-print {
    display: none !important;
  }

  body {
    background: #ffffff !important;
    color: #000000 !important;
  }

  a[href]::after {
    content: "";
  }

  .page-main {
    padding-top: 0 !important;
  }

  .dc-card,
  .card,
  .panel,
  table {
    box-shadow: none !important;
    break-inside: avoid;
  }
}
