/* Program Edit Form Base Styles */
.edit-program-form {
  max-width: var(--content-max-width);
  margin: var(--spacing-sm) auto;
  padding: var(--spacing-sm);
  background-color: var(--color-background);
  border: var(--border-thin) solid var(--color-border);
  border-radius: var(--radius-base);
  box-shadow: var(--shadow-base);
}

/* Program Header */
.program-header {
  margin-bottom: var(--spacing-base);
}

.program-header p {
  margin: 0;
  line-height: var(--leading-loose);
}

/* Program Details Table */
.program-details {
  display: table;  /* Added this */
  width: auto;
  margin: var(--spacing-base) auto;
  border-collapse: collapse;
  border-spacing: 0;
}

.program-details td {
  padding: var(--spacing-md);
  vertical-align: middle;
}

.program-details td.total {
  border-top: var(--border-thin) solid var(--color-border);
  font-weight: var(--font-semibold);
}

.program-details td.nowrap {
  white-space: nowrap;
}

/* Form Field Sizes */
#id_privateLessons,
#id_groupClasses,
#id_parties {
  width: var(--input-width-xs);
}

#id_receiptNumber {
  width: var(--input-width-xs);
}

#id_privateLessonPrice,
#id_groupClassPrice,
#id_partyPrice,
#id_amount,
#id_downPayment,
#id_receiptNumber,
#id_discount,
#id_recurringPaymentAmount,
#id_sundry,
#id_unlimitedGroupClassesAndPartiesPrice {
  width: calc(var(--input-width-xs) * 1.375);
}

#id_notes {
  width: 96%;
  margin: 0 auto;
  min-height: 100px;
  resize: vertical;
}

#id_date,
#id_unlimitedGroupClassesAndPartiesUntil {
  width: var(--input-width-sm);
}

#id_name {
  width: 100%;
}

/* Input Styling */
.edit-program-form input[type="text"],
.edit-program-form input[type="number"],
.edit-program-form select,
.edit-program-form textarea {
  padding: var(--spacing-md);
  border: var(--border-thin) solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
  transition: border-color var(--transition-fast);
}

.edit-program-form input:focus,
.edit-program-form select:focus,
.edit-program-form textarea:focus {
  border-color: var(--color-primary);
  outline: none;
  box-shadow: var(--shadow-sm);
}

/* Staff/Instructor Lists */
.instructors,
.staff {
  margin: var(--spacing-xs) 0;
}

.instructors table,
.staff table {
  width: 100%;
  border-collapse: collapse;
}

.instructors th,
.staff th {
  text-align: left;
  padding: var(--spacing-sm);
  background-color: var(--color-table-header);
  font-weight: var(--font-semibold);
}

.instructors td,
.staff td {
  padding: var(--spacing-sm);
  vertical-align: top;
}

/* Button Styles */
.form-buttons {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: var(--spacing-base);
  padding-top: var(--spacing-base);
  border-top: var(--border-thin) solid var(--color-border);
}

.form-buttons .refund {
  background-color: var(--color-warning);
  color: var(--color-background);
}

.form-buttons .refund:hover {
  background-color: var(--color-warning-hover);
}

/* Form Buttons Remove/Refund */
.form-buttons-remove-refund {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: var(--spacing-lg);
  padding-top: var(--spacing-lg);
  border-top: var(--border-thin) solid var(--color-border);
}

.form-buttons-remove-refund button {
  color: var(--color-primary);
  background-color: var(--color-background);
  transition: all var(--transition-normal);
}

.form-buttons-remove-refund button:hover {
  background-color: var(--color-primary);
  color: var(--color-background);
}

/* Responsive Design */
@media (max-width: 768px) /* --breakpoint-md */ {
  .edit-program-form {
    margin: var(--spacing-sm);
    padding: var(--spacing-sm);
  }

  .program-details {
    width: 100%;
  }

  .program-details td {
    padding: var(--spacing-sm);
  }

  .instructors table,
  .staff table {
    display: block;
    overflow-x: auto;
  }

  .form-buttons,
  .form-buttons-remove-refund {
    flex-direction: column;
    gap: var(--spacing-sm);
    align-items: stretch;
  }

  .form-buttons button,
  .form-buttons-remove-refund button {
    width: 100%;
  }
}