.contract-form {
  inline-size: 100%;
  max-width: 48rem;
  margin-inline-start: auto;
  margin-inline-end: auto;
}

/* ── Header ─────────────────────────────────────── */

.contract-form__header {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-xs);
  margin-block-end: var(--wa-space-l);
}

.contract-form__title {
  margin: 0;
  font-family: var(--wa-font-family-heading);
  font-weight: var(--wa-font-weight-heading);
  font-size: var(--wa-font-size-2xl);
}

.contract-form__subtitle {
  margin: 0;
  color: var(--wa-color-text-quiet);
  font-size: var(--wa-font-size-s);
}

/* ── Step indicator ─────────────────────────────── */

.contract-form__steps {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0 0 var(--wa-space-l) 0;
  gap: var(--wa-space-m);
}

.contract-form__step {
  font-size: var(--wa-font-size-s);
  color: var(--wa-color-text-quiet);
}

.contract-form__step--current {
  color: var(--wa-color-text-normal);
  font-weight: var(--wa-font-weight-heading);
}

/* ── Groups ─────────────────────────────────────── */

.contract-form__group {
  padding-block-start: var(--wa-space-l);
  border-block-start: 1px solid var(--wa-color-surface-border);
}

.contract-form__heading {
  margin: 0 0 var(--wa-space-m) 0;
  font-size: var(--wa-font-size-l);
}

/* ── Field grid ─────────────────────────────────── */

.contract-form__fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: var(--wa-space-m);
}

/* ── Error panel ────────────────────────────────── */

.contract-form__errors {
  list-style: none;
  padding: var(--wa-space-m);
  margin: 0 0 var(--wa-space-l) 0;
  border: 1px solid var(--wa-color-neutral-border-quiet);
  border-radius: var(--wa-border-radius-m);
  background: var(--wa-color-surface-lowered);
}

.contract-form__errors li {
  padding-block: var(--wa-space-2xs);
  font-size: var(--wa-font-size-s);
}

/* ── Actions ────────────────────────────────────── */

.contract-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wa-space-s);
  margin-block-start: var(--wa-space-l);
}

/* ── Empty state ────────────────────────────────── */

.contract-form__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--wa-space-xs);
  padding: var(--wa-space-xl);
  margin-block-start: var(--wa-space-l);
  border: 1px solid var(--wa-color-neutral-border-quiet);
  border-radius: var(--wa-border-radius-l);
}

.contract-form__empty-title {
  margin: 0;
  font-size: var(--wa-font-size-m);
}

.contract-form__empty-hint {
  margin: 0;
  color: var(--wa-color-text-quiet);
  font-size: var(--wa-font-size-s);
}

/* ── Wizard panels ──────────────────────────────── */

.contract-form__panel {
  display: block;
}

.contract-form__panel[hidden] {
  display: none;
}

/* ── Step indicator states ──────────────────────── */

.contract-form__step--done {
  color: var(--wa-color-brand-fill-loud);
}

/* ── Field grid (wizard variant) ────────────────── */

.contract-form__fields--grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--wa-space-m);
}

/* ── Group header ───────────────────────────────── */

.contract-form__group-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* ── Rate matrix ────────────────────────────────── */

.contract-form__matrix-wrap {
  overflow-x: auto;
  width: 100%;
  /* Right-edge shadow hints the table scrolls — same scroll-inside-the-wrap
     contract as .admin-table-wrap / .hotel-access__table-wrap. */
  box-shadow: inset -10px 0 10px -10px var(--wa-color-neutral-border-quiet);
}

.contract-form__matrix,
.contract-form__policy-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.contract-form__matrix th,
.contract-form__matrix td,
.contract-form__policy-table th,
.contract-form__policy-table td {
  padding: var(--wa-space-xs);
  text-align: left;
  border-bottom: 1px solid var(--wa-color-neutral-border-normal);
}

.contract-form__matrix-dates td {
  padding: var(--wa-space-s);
  background: var(--wa-color-neutral-fill-quiet);
}

.contract-form__dategrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  gap: var(--wa-space-xs);
}

.contract-form__pays,
.contract-form__rowtotal {
  font-weight: 600;
}

.contract-form__matrix-hint {
  color: var(--wa-color-text-quiet);
  font-size: 0.875rem;
  margin-top: var(--wa-space-xs);
}

/* ── Policies ───────────────────────────────────── */

.contract-form__policy-label {
  color: var(--wa-color-text-quiet);
  font-size: 0.875rem;
}

.contract-form__policy-value {
  font-weight: 600;
  margin-left: var(--wa-space-xs);
}

/* ── Review ─────────────────────────────────────── */

.contract-form__review {
  display: grid;
  grid-template-columns: minmax(160px, auto) 1fr;
  gap: var(--wa-space-xs) var(--wa-space-m);
  margin: 0;
}

.contract-form__review dt {
  color: var(--wa-color-text-quiet);
}

.contract-form__review dd {
  margin: 0;
  font-weight: 500;
}

.contract-form__review-rooms {
  margin: 0;
  padding-left: 1.25rem;
}

.contract-form__review-empty {
  color: var(--wa-color-text-quiet);
}

/* ── Wizard navigation ──────────────────────────── */

.contract-form__nav {
  display: flex;
  gap: var(--wa-space-s);
  margin-top: var(--wa-space-l);
}

.contract-form__submit[hidden],
.contract-form__nav wa-button[hidden] {
  display: none;
}

/* ── Success dialog ─────────────────────────────── */

.contract-form__dialog-body {
  display: grid;
  gap: var(--wa-space-m);
}

/* wa-input's :host display beats the UA [hidden] rule — the dialog's
   new-category field would stay visible without this guard. */
.contract-form__dialog-body wa-input[hidden] {
  display: none;
}

.contract-form__dialog-footer {
  display: flex;
  gap: var(--wa-space-s);
  justify-content: flex-end;
}

/* ── Conditional groups ─────────────────────────── */

.contract-form__shoulder-fields[hidden] {
  display: none;
}