.enrollment-form-container {
  padding: 16px;
  max-width: 700px;

  // RTL support
  [dir="rtl"] & {
    .form-field {
      label,
      input,
      select,
      textarea {
        text-align: right;
      }
    }
  }
}

.enrollment-form {
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  padding: 20px;
  margin-top: 12px;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.form-field {
  display: flex;
  flex-direction: column;
  margin-bottom: 16px;
  gap: 5px;

  label {
    font-size: 13px;
    color: #616161;
    font-weight: 500;
  }

  input,
  select,
  textarea {
    padding: 8px 10px;
    border: 1px solid #bdbdbd;
    border-radius: 4px;
    font-size: 14px;
    font-family: inherit;
    outline: none;

    &:focus {
      border-color: #1976d2;
      box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.1);
    }

    &[readonly] {
      background: #f5f5f5;
      color: #757575;
      cursor: default;
    }
  }

  textarea {
    resize: vertical;
    min-height: 72px;
  }
}