/* Mizan — Accessibility enhancements (WCAG 2.2 AA)
   Ledgera theme: Cobalt for focus, Graphite for text, Cool Gray for borders.
   Loaded after app styles to enhance them.
*/

/* ===== SKIP LINK ===== */
.skip-link {
  position: absolute;
  top: -40px; left: 8px;
  background: var(--cobalt); color: #fff;
  padding: 10px 18px;
  border-radius: var(--r-2);
  z-index: 9999;
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  box-shadow: 0 4px 12px rgba(29,34,38,.2);
}
.skip-link:focus { top: 8px; }

/* ===== FOCUS INDICATORS (visible 3px cobalt ring) ===== */
*:focus { outline: none; }
*:focus-visible {
  outline: 3px solid var(--cobalt);
  outline-offset: 2px;
  border-radius: 4px;
}
button:focus-visible, a:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--cobalt);
  outline-offset: 2px;
}

/* ===== SCREEN-READER ONLY ===== */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}
.sr-only-focusable:focus, .sr-only-focusable:active {
  position: static;
  width: auto; height: auto;
  overflow: visible; clip: auto;
  white-space: normal;
}

/* ===== CONTRAST (WCAG AA 4.5:1 for text, 3:1 for large) ===== */
.text-muted { color: var(--gray-500) !important; }      /* 5.7:1 on white */
.btn { font-weight: 600; }
.text-light-on-dark { color: #F0F2F0; }                /* 13:1 on graphite */

/* ===== FORM ERROR IDENTIFICATION ===== */
input[aria-invalid="true"], input:invalid:not(:placeholder-shown) {
  border-color: var(--critical);
  box-shadow: 0 0 0 3px rgba(214,69,69,0.15);
}
.form-error {
  color: var(--critical);
  font-size: 12px;
  font-weight: 600;
  margin-top: 4px;
  display: flex; align-items: center; gap: 4px;
}
.form-error::before { content: '⚠'; font-size: 14px; }

/* ===== ACCESSIBLE TABLES ===== */
table { border-collapse: collapse; }
th { text-align: left; }
[role="table"] th { font-weight: 700; }
table caption {
  text-align: left;
  font-weight: 700;
  padding: 8px 0;
  font-size: 14px;
  caption-side: top;
}

/* ===== HIGH CONTRAST MODE (Windows) ===== */
@media (prefers-contrast: more) {
  body { background: #fff; color: #000; }
  .btn-primary { background: #000; color: #fff; }
  .btn-ghost { border-color: #000; color: #000; }
  .card { border-color: #000; }
}

/* ===== DARK MODE (system preference) — DISABLED =====
   The Ledgera design system is LIGHT-FIRST. Mizan accounting
   data requires high-contrast text on white surfaces for
   audit-ready readability. Dark mode would compromise WCAG AA
   on tables, forms, and financial numbers.

   To opt back in later, wrap the rules in a manual toggle
   (e.g. `[data-theme="dark"] body { ... }`).
   ================================================ */

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

/* ===== MINIMUM TAP TARGET (44x44px) ===== */
button, a, input[type="checkbox"], input[type="radio"], select {
  min-height: 36px;
}
.btn { min-height: 44px; padding: 12px 20px; }
.btn-sm { min-height: 32px; padding: 8px 12px; }
.btn-icon { min-width: 44px; }

/* ===== ARIA HELPERS ===== */
[aria-busy="true"] { cursor: wait; opacity: 0.6; }
[aria-disabled="true"], [disabled] { opacity: 0.5; cursor: not-allowed; }
[aria-expanded="false"] .collapse-content { display: none; }
[aria-expanded="true"] .collapse-content { display: block; }

/* ===== STATUS / ALERT (role="status" or "alert") ===== */
[role="status"], [role="alert"] {
  padding: 8px 12px;
  border-radius: var(--r-2);
  font-weight: 500;
}
[role="status"] { background: var(--success-pale); color: #14633F; }
[role="alert"]  { background: var(--critical-pale); color: #8B2929; }
[role="alert"][data-severity="critical"] { background: var(--critical); color: #fff; }

/* ===== PROGRESS (aria-valuenow) ===== */
[role="progressbar"] {
  height: 8px;
  background: var(--cool-gray);
  border-radius: 4px;
  overflow: hidden;
}
[role="progressbar"] > [role="presentation"] {
  height: 100%;
  background: var(--cobalt);
  transition: width 0.3s ease;
}
