/* Shared controls for the operator workflow. Selected segmented controls keep their local state styling. */
button:not(.danger):not(.segmented button),
.primary:not(.segmented button),
.secondary,
.logout,
.next a {
  align-items: center;
  background: #fff !important;
  border: 1px solid var(--line, #d8e1dc) !important;
  border-radius: 12px !important;
  box-shadow: none;
  color: var(--dark, var(--brand, var(--tinta, var(--green, #105542)))) !important;
  font-weight: 800 !important;
  min-height: 48px;
  padding: 10px 20px !important;
}

.next a {
  display: inline-flex;
  text-decoration: none;
}

button:not(.danger):not(.segmented button):hover,
.primary:not(.segmented button):hover,
.secondary:hover,
.logout:hover,
.next a:hover {
  background: #f7fbf8 !important;
}

button.danger {
  background: var(--danger, var(--red, #a72e38)) !important;
  border-color: var(--danger, var(--red, #a72e38)) !important;
  color: #fff !important;
}

.antecedentes-compactos summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  font-size: 17px;
  font-weight: 800;
  justify-content: space-between;
  list-style: none;
  min-height: 48px;
}

.antecedentes-compactos summary::-webkit-details-marker {
  display: none;
}

.antecedentes-compactos summary::after {
  color: var(--muted, #607068);
  content: "⌄";
  font-size: 20px;
}

.antecedentes-compactos[open] summary {
  border-bottom: 1px solid var(--line, #d8e1dc);
}

.antecedentes-compactos[open] summary::after {
  transform: rotate(180deg);
}

.antecedentes-compactos__content {
  padding-top: 16px;
}

/* Las etapas usan columnas estables: nombre, estado y control de despliegue. */
.stage-top {
  align-items: center;
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content 24px;
}

.stage-top::after {
  justify-self: end;
}

@media (max-width: 720px) {
  .stage-top {
    align-items: center;
    display: grid;
    flex-direction: initial;
    grid-template-columns: minmax(0, 1fr) max-content 24px;
  }
}