.customer-create-title {
  align-items: center;
  display: flex;
  gap: 10px;
  margin: 0 !important;
}

.customer-create-title svg {
  color: var(--lime);
  flex: none;
  height: 24px;
  width: 24px;
}

.customer-required-marker {
  color: #ff737d;
  font-size: 13px;
}

.editor-grid input.customer-required-invalid {
  background: #261519;
  border-color: #d95059;
  box-shadow: 0 0 0 3px #d9505926;
}

.editor-grid input.customer-generated-pin-input {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 16px;
  font-weight: 750;
  letter-spacing: 0.18em;
}

.customer-editor .editor-grid > label {
  align-content: start;
}

.editor-grid .customer-generated-pin-help {
  color: #77828b;
  font-size: 10px;
}

.customer-editor-accordion {
  border: 1px solid #2d3740;
  border-radius: 7px;
  overflow: hidden;
}

.customer-editor-accordion summary {
  background: #151c22;
  color: #aab4bc;
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .7px;
  list-style: none;
  padding: 11px 13px;
  text-transform: uppercase;
}

.customer-editor-accordion summary::-webkit-details-marker {
  display: none;
}

.customer-editor-accordion summary::after {
  color: var(--lime);
  content: "+";
  float: right;
  font-size: 16px;
  line-height: 11px;
}

.customer-editor-accordion[open] summary::after {
  content: "−";
}

.customer-editor-accordion-grid {
  border-top: 1px solid #2d3740;
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr 1fr;
  padding: 13px;
}

.customer-editor-accordion-grid label {
  display: grid;
  gap: 6px;
}

.customer-editor-accordion-grid label > span {
  color: #6b7781;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .55px;
  text-transform: uppercase;
}

.customer-editor-accordion-grid input,
.customer-editor-accordion-grid select {
  background: #0e1419;
  border: 1px solid #28323a;
  border-radius: 6px;
  color: #d6dce1;
  font-size: 12px;
  height: 36px;
  padding: 0 10px;
  width: 100%;
}

.customer-editor-accordion-grid textarea {
  background: #0e1419;
  border: 1px solid #28323a;
  border-radius: 6px;
  color: #d6dce1;
  font: 12px/1.45 inherit;
  padding: 10px;
  resize: vertical;
  width: 100%;
}

@media (max-width: 680px) {
  .customer-editor-accordion-grid {
    grid-template-columns: 1fr;
  }

  .customer-editor-accordion-grid .editor-wide {
    grid-column: 1;
  }
}