/* Proposal review and curriculum modification workspace. */
.proposal-pane {
  container: proposal-pane / inline-size;
}

.proposal-index {
  margin: 0;
}

.proposal-index__header {
  display: none;
}

.proposal-pane__header {
  align-items: center;
  display: flex;
  gap: var(--space-3);
  justify-content: space-between;
  margin-bottom: var(--space-4);
}

.proposal-index__error {
  background: color-mix(in srgb, var(--color-danger) 8%, transparent);
  border-left: 0.2rem solid var(--color-danger);
  margin-bottom: var(--space-4);
  padding: var(--space-3);
}

.curriculum-modification__unit-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  justify-content: flex-end;
}

.curriculum-modification__units > .section-heading h2 {
  color: var(--color-muted);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.curriculum-modification__units > .section-heading {
  margin-bottom: 0;
}

.curriculum-modification__units .curriculum-explorer {
  margin-top: var(--space-3);
}

.active-proposals {
  margin-bottom: var(--space-5);
}

.active-proposal-list {
  display: grid;
  gap: var(--space-2);
  grid-template-columns: minmax(0, 1fr);
  margin-top: var(--space-3);
}

.active-proposal-card {
  background: color-mix(in srgb, var(--color-ink) 2%, var(--color-surface));
  border-radius: var(--radius-surface);
  color: inherit;
  container: active-proposal-card / inline-size;
  min-height: 5rem;
}

.active-proposal-card {
  view-transition-class: layout-position;
}

.active-proposal-card__icon,
.active-proposal-card__title,
.active-proposal-card__rationale,
.active-proposal-card__meta,
#active-proposals-title {
  view-transition-class: layout-position non-scaling-content;
}

.active-proposal-card__identity {
  color: inherit;
  display: grid;
  gap: 0;
  min-width: 0;
  padding: var(--space-3);
  text-decoration: none;
}

.active-proposal-card__icon {
  color: var(--color-muted);
  font-size: 1.25rem;
  justify-self: start;
  margin-bottom: var(--space-2);
}

.active-proposal-card__title {
  color: var(--color-ink-strong);
  font-size: 0.9rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.active-proposal-card__rationale {
  color: var(--color-muted);
  display: -webkit-box;
  font-size: 0.72rem;
  margin-top: var(--space-1);
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.active-proposal-card__meta {
  align-items: center;
  color: var(--color-muted);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  font-size: 0.68rem;
  font-weight: 700;
  margin-top: var(--space-2);
}

@container active-proposal-card (min-width: 22rem) {
  .active-proposal-card__identity {
    column-gap: var(--space-2);
    grid-template-columns: 1.5rem minmax(0, 1fr);
  }

  .active-proposal-card__icon {
    align-self: start;
    grid-column: 1;
    grid-row: 1 / span 3;
    margin-bottom: 0;
  }

  .active-proposal-card__title,
  .active-proposal-card__rationale,
  .active-proposal-card__meta {
    grid-column: 2;
  }
}

.proposal-workspace__changes {
  margin-bottom: var(--space-6);
}

.proposal-workspace__changes-heading {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-3);
  justify-content: space-between;
}

.proposal-workspace__changes-lock {
  align-items: center;
  color: var(--color-muted);
  display: inline-flex;
  font-size: 0.72rem;
  gap: var(--space-1);
}

.proposal-workspace__changes-lock .material-symbols-rounded {
  font-size: 0.9rem;
}

.proposal-workspace__changes--locked .proposal-change-list {
  filter: saturate(0.35);
  opacity: 0.55;
}

.proposal-workspace__overview {
  display: grid;
  gap: 0;
  margin-bottom: var(--space-5);
  max-width: 46rem;
}

.proposal-workspace__overview:has(+ .proposal-rebase) {
  margin-bottom: 0;
}

.proposal-rebase-conflict__choices {
  display: grid;
  gap: var(--space-2);
}

.proposal-workspace__title-input,
.proposal-workspace__rationale-input {
  background: transparent;
  border: 0;
  border-radius: 0.65rem;
  color: inherit;
  display: block;
  font: inherit;
  margin-inline: -0.45rem;
  overflow: hidden;
  padding: 0.35rem 0.45rem;
  resize: none;
  width: calc(100% + 0.9rem);
}

.proposal-workspace__title-input {
  color: var(--color-ink-strong);
  font-size: var(--font-size-pane-title);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 1;
}

.proposal-workspace__rationale-input {
  font-size: 1rem;
  line-height: 1.65;
}

.proposal-workspace__title-input:focus,
.proposal-workspace__rationale-input:focus {
  background: transparent;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-ink) 18%, transparent);
  outline: 0;
}

.proposal-workspace__purpose-label {
  margin-top: var(--space-3);
}

.proposal-workspace__metadata-summary {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-5);
  justify-content: flex-start;
}

.proposal-metadata-save-status {
  color: var(--color-ink-strong);
  flex: none;
  font-size: 0.84rem;
  font-weight: 400;
  min-height: 1.2rem;
}

.proposal-metadata-save-status.is-error {
  color: var(--color-danger);
}

.proposal-workspace__metadata.htmx-request .proposal-metadata-save-status [data-save-state-saved] {
  display: none;
}

.proposal-workspace__metadata.htmx-request .proposal-metadata-save-status [data-save-state-saving] {
  display: inline;
}

.proposal-workspace__changes h2 {
  margin: 0;
}

.proposal-history {
  background: color-mix(in srgb, var(--color-surface) 58%, transparent);
  border-radius: var(--radius-surface);
  margin-bottom: var(--space-6);
  padding: var(--space-4);
}

.proposal-details {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-5);
  margin: 0;
}

.proposal-details div {
  display: grid;
  gap: 0.15rem;
}

.proposal-details dt {
  margin: 0;
}

.proposal-details dd {
  color: var(--color-ink-strong);
  font-size: 0.84rem;
  margin: 0;
}

.proposal-workspace__terminal-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  justify-content: flex-end;
  margin-top: calc(var(--space-6) + var(--space-3));
  padding-top: var(--space-4);
}

.proposal-workspace__terminal-actions form {
  flex: none;
  margin: 0;
}

.proposal-workspace__terminal-actions .primary-button,
.proposal-workspace__terminal-actions .secondary-button,
.proposal-rebase__actions .primary-button {
  align-items: center;
  display: inline-flex;
  height: 2.75rem;
  justify-content: center;
  margin: 0;
}

.proposal-list.proposal-change-list {
  border-bottom: 1px solid color-mix(in srgb, var(--color-ink) 10%, transparent);
  border-top: 1px solid color-mix(in srgb, var(--color-ink) 10%, transparent);
  display: grid;
  gap: 0;
  grid-template-columns: minmax(0, 1fr);
  margin-top: var(--space-2);
}

.proposal-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.proposal-list li {
  align-items: center;
  display: flex;
  gap: var(--space-3);
  justify-content: space-between;
  padding: var(--space-2);
}

.proposal-list:not(.proposal-change-list) li + li {
  border-top: 1px solid color-mix(in srgb, var(--color-ink) 8%, transparent);
}

.proposal-list li > div {
  display: grid;
  min-width: 0;
}

.proposal-list strong {
  font-size: 0.78rem;
  overflow-wrap: anywhere;
}

.proposal-list li > div span,
.proposal-change__description span {
  color: var(--color-muted);
  font-size: 0.7rem;
}

.proposal-list li.proposal-change {
  --proposal-change-color: oklch(0.62 0.11 255);

  background: transparent;
  display: grid;
  gap: 0.3rem;
  grid-template-columns: 7.25rem minmax(0, 1fr) 4rem;
  min-height: 0;
  padding: 0.3rem 0.2rem;
}

.proposal-change__unit-link {
  color: inherit;
  text-decoration: none;
}

.proposal-change__unit-link:hover,
.proposal-change__unit-link:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

.proposal-change + .proposal-change {
  border-top: 1px solid color-mix(in srgb, var(--color-ink) 8%, transparent);
}

.proposal-list li.proposal-change--addition {
  --proposal-change-color: var(--color-proposal-created);
}

.proposal-list li.proposal-change--removal {
  --proposal-change-color: var(--color-proposal-deleted);
}

.proposal-list li.proposal-change--rename {
  --proposal-change-color: var(--color-proposal-rename);
}

.proposal-list li.proposal-change--content {
  --proposal-change-color: var(--color-proposal-content);
}

.proposal-list li.proposal-change--dependency {
  --proposal-change-color: var(--color-proposal-dependency);
}

.proposal-list li.proposal-change--recognition {
  --proposal-change-color: var(--color-proposal-recognition);
}

.proposal-change__badge {
  align-items: center;
  color: var(--proposal-change-color);
  display: inline-flex;
  flex: none;
  font-size: 0.62rem;
  font-weight: 800;
  gap: var(--space-1);
  justify-content: flex-start;
  line-height: 1;
  text-transform: uppercase;
}

.proposal-change__badge .material-symbols-rounded {
  flex: 0 0 0.9rem;
  font-size: 0.85rem;
  text-align: center;
}

.proposal-list li > .proposal-change__description {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  gap: 0 var(--space-2);
}

.proposal-change__subject {
  color: var(--color-ink-strong);
}

.proposal-change__description .proposal-change__previous {
  align-self: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.proposal-change form {
  align-items: center;
  align-self: stretch;
  display: flex;
  justify-content: center;
  justify-self: end;
  opacity: 0;
  transition: opacity 120ms ease;
  width: 4rem;
}

.proposal-change:hover form,
.proposal-change:focus-within form {
  opacity: 1;
}

.proposal-change__remove {
  align-items: center;
  background: transparent;
  border: 0;
  color: var(--color-muted);
  display: inline-flex;
  font-size: 0.68rem;
  font-weight: 700;
  gap: 0.2rem;
  height: 1.75rem;
  justify-content: center;
  padding: 0;
}

.proposal-change__remove:hover,
.proposal-change__remove:focus-visible {
  color: var(--color-ink-strong);
}

.proposal-change__remove .material-symbols-rounded {
  display: block;
  font-size: 0.9rem;
  line-height: 1;
}

@media (hover: none) {
  .proposal-change form {
    opacity: 1;
  }
}

.proposal-status {
  color: var(--color-muted);
  flex: none;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
}

.proposal-status--warning {
  align-items: center;
  color: var(--color-ink-strong);
  display: inline-flex;
  gap: 0.25rem;
  justify-self: start;
}

.proposal-status--warning .material-symbols-rounded {
  font-size: 0.82rem;
}

.active-proposal-card__meta .proposal-status--warning {
  margin-left: auto;
}

.proposal-history-graph .proposal-status--warning {
  color: var(--color-ink-strong);
}

.proposal-history-graph__status {
  color: var(--color-muted);
  font-size: 0.7rem;
}

.proposal-history-graph__root-node {
  background: var(--color-surface);
  border: 1.5px solid var(--color-muted);
}

@container proposal-pane (max-width: 36rem) {
  .proposal-list.proposal-change-list {
    grid-template-columns: 1fr;
  }
}

@container proposal-pane (max-width: 30rem) {
  .section-heading {
    align-items: center;
  }

}

@container proposal-pane (max-width: 22rem) {
  .secondary-button {
    flex: 1 1 auto;
    justify-content: center;
    width: 100%;
  }
}