/* Stage 9: WCAG 2.2 focus, contrast, target sizes and system preferences. */

.skip-link {
  position: fixed;
  z-index: 10000;
  top: 10px;
  left: 10px;
  transform: translateY(-160%);
  min-height: 44px;
  padding: 11px 16px;
  border: 2px solid var(--accent-strong);
  border-radius: 6px;
  background: var(--surface);
  color: var(--ink);
  font-weight: 850;
  box-shadow: var(--panel-shadow);
}

.skip-link:focus {
  transform: translateY(0);
  outline: 3px solid var(--focus);
  outline-offset: 2px;
}

.decision-card.risk span,
.decision-card.risk small,
.family-command-grid .risk span,
.family-command-grid .risk small,
.platform-command-card.risk span,
.platform-command-card.risk small,
.work-queue-summary-chip.risk,
.decision-item.risk span,
.decision-item.risk small {
  color: #713333;
}

.event-chip small,
.version-row small {
  color: var(--muted-strong);
}

.portfolio-bar small {
  opacity: 1;
}

.portfolio-bar.family.near-event,
.portfolio-bar.risk-bar {
  background: #88420d;
}

.portfolio-bar.event.medium {
  background: #74480b;
}

.portfolio-bar.event.low {
  background: #176b57;
}

.release-day-items {
  gap: 4px;
}

.release-day-open,
.release-add-day {
  width: 30px;
  height: 30px;
  min-height: 30px;
}

.release-chip,
.release-more {
  min-height: 24px;
}

.release-month.focused .release-chip {
  min-height: 28px;
}

.platform-matrix:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}

@media (forced-colors: active) {
  button,
  input,
  select,
  textarea,
  summary,
  .pill,
  .status-pill,
  .calendar-bar,
  .portfolio-bar,
  .release-chip,
  .release-day-open,
  .release-add-day,
  .event-chip {
    border: 1px solid ButtonText;
  }

  button:focus-visible,
  a:focus-visible,
  summary:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible,
  [tabindex]:focus-visible {
    outline: 3px solid Highlight !important;
    outline-offset: 3px !important;
  }

  .calendar-bar.risk-bar,
  .calendar-legend-swatch.risk,
  .decision-card.risk,
  .platform-command-card.risk {
    border-style: double;
    border-width: 3px;
  }

  .calendar-legend-swatch,
  .release-dot {
    border: 2px solid ButtonText;
  }
}

