/*
 * AVDS consumer primitives for server-rendered and non-React products.
 * Import variables.css first. The class contract deliberately keeps actions,
 * process steps and readiness evidence as rows and rules, not card mosaics.
 */

.avds-action-list,
.avds-workflow-steps,
.avds-readiness-gate {
  color: hsl(var(--foreground));
  font-family: var(--font-sans);
}

.avds-action-list {
  margin: 0;
  padding: 0;
  border-block: 1px solid hsl(var(--border));
  list-style: none;
}

.avds-action-list > li + li {
  border-top: 1px solid hsl(var(--border) / 0.7);
}

.avds-action-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: start;
  min-height: var(--avds-mobile-touch-target);
  padding: 0.75rem 0;
  color: inherit;
  text-align: start;
  text-decoration: none;
}

button.avds-action-row {
  border: 0;
  background: transparent;
  font: inherit;
  cursor: pointer;
}

a.avds-action-row:hover,
button.avds-action-row:hover {
  background: hsl(var(--muted) / 0.35);
}

.avds-action-row:focus-visible,
.avds-workflow-step:focus-visible,
.avds-readiness-action:focus-visible {
  outline: 2px solid hsl(var(--ring));
  outline-offset: 2px;
}

.avds-action-title,
.avds-workflow-title {
  color: hsl(var(--foreground));
  font-weight: 600;
}

.avds-action-description,
.avds-action-meta,
.avds-workflow-description,
.avds-readiness-summary,
.avds-readiness-evidence dt {
  color: hsl(var(--muted-foreground));
}

.avds-action-description,
.avds-workflow-description,
.avds-readiness-summary {
  display: block;
  margin: 0.25rem 0 0;
  font-size: 0.875rem;
  line-height: 1.5;
}

.avds-action-meta {
  margin-top: 0.25rem;
  font-size: 0.75rem;
  line-height: 1.45;
}

.avds-action-status,
.avds-workflow-status,
.avds-readiness-status {
  font-size: 0.8125rem;
  font-weight: 600;
}

.avds-action-status[data-state="attention"],
.avds-workflow-status[data-state="attention"],
.avds-readiness-status[data-state="attention"] {
  color: hsl(var(--chart-3));
}

.avds-action-status[data-state="complete"],
.avds-workflow-status[data-state="complete"],
.avds-readiness-status[data-state="ready"] {
  color: hsl(var(--chart-2));
}

.avds-readiness-status[data-state="blocked"] {
  color: hsl(var(--destructive));
}

.avds-workflow-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border-top: 1px solid hsl(var(--border));
  list-style: none;
}

.avds-workflow-step {
  display: grid;
  grid-template-columns: 1.25rem minmax(0, 1fr) auto;
  gap: 0.625rem;
  min-width: 0;
  min-height: var(--avds-mobile-touch-target);
  padding: 0.875rem 0.75rem;
  color: inherit;
  border: 0;
  border-bottom: 1px solid hsl(var(--border));
  background: transparent;
  font: inherit;
  text-align: start;
  text-decoration: none;
}

.avds-workflow-step:first-child {
  padding-inline-start: 0;
}

.avds-workflow-step:last-child {
  padding-inline-end: 0;
}

.avds-workflow-step:hover:not([aria-disabled="true"]),
.avds-workflow-step[data-active="true"] {
  background: hsl(var(--muted) / 0.25);
}

.avds-workflow-marker {
  display: grid;
  width: 1.25rem;
  height: 1.25rem;
  place-items: center;
  color: hsl(var(--muted-foreground));
  border: 1px solid hsl(var(--border));
  background: hsl(var(--background));
  font-size: 0.625rem;
  font-weight: 600;
}

.avds-workflow-step[data-state="complete"] .avds-workflow-marker {
  border-color: hsl(var(--chart-2) / 0.55);
  background: hsl(var(--chart-2) / 0.1);
  color: hsl(var(--foreground));
}

.avds-workflow-step[data-state="current"] .avds-workflow-marker {
  border-color: hsl(var(--primary));
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
}

.avds-workflow-step[data-state="attention"] .avds-workflow-marker {
  border-color: hsl(var(--chart-3) / 0.65);
  background: hsl(var(--chart-3) / 0.1);
  color: hsl(var(--foreground));
}

.avds-readiness-gate {
  padding-block: 1rem;
  border-block: 1px solid hsl(var(--border));
}

.avds-readiness-header {
  display: flex;
  gap: 1rem;
  align-items: start;
  justify-content: space-between;
}

.avds-readiness-title {
  margin: 0;
  color: hsl(var(--foreground));
  font-size: 1rem;
}

.avds-readiness-progress {
  margin-top: 1rem;
}

.avds-readiness-progress-label {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  color: hsl(var(--muted-foreground));
  font-size: 0.875rem;
}

.avds-readiness-progress-track {
  height: 0.25rem;
  margin-top: 0.5rem;
  overflow: hidden;
  background: hsl(var(--muted));
}

.avds-readiness-progress-value {
  height: 100%;
  background: hsl(var(--primary));
}

.avds-readiness-progress-value[data-state="ready"] { background: hsl(var(--chart-2)); }
.avds-readiness-progress-value[data-state="attention"] { background: hsl(var(--chart-3)); }
.avds-readiness-progress-value[data-state="blocked"] { background: hsl(var(--destructive)); }

.avds-readiness-evidence {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: 0.5rem 1rem;
  margin: 1rem 0 0;
  padding-top: 0.75rem;
  border-top: 1px solid hsl(var(--border) / 0.7);
  font-size: 0.875rem;
}

.avds-readiness-evidence dd {
  min-width: 0;
  margin: 0;
}

.avds-readiness-evidence a,
.avds-readiness-action {
  color: hsl(var(--primary));
  font-weight: 500;
}

.avds-readiness-action {
  display: inline-block;
  margin-top: 1rem;
  padding-top: 0.75rem;
  border-top: 1px solid hsl(var(--border) / 0.7);
  text-decoration: none;
}

@media (max-width: 767px) {
  .avds-workflow-steps {
    grid-template-columns: minmax(0, 1fr);
  }

  .avds-workflow-step,
  .avds-workflow-step:first-child,
  .avds-workflow-step:last-child {
    padding-inline: 0;
  }

  .avds-readiness-header {
    display: grid;
  }

  .avds-readiness-evidence {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.25rem;
  }

  .avds-readiness-evidence dd {
    margin-bottom: 0.5rem;
  }
}