.sbr-listing {
  --sbr-listing-line: #d7e2dd;
  --sbr-listing-panel: #f5f9f6;
}

.sbr-listing .sbr-hero,
.sbr-listing .sbr-listing-form,
.sbr-listing .sbr-listing-notice {
  margin-bottom: 1.25rem;
}

.sbr-listing-form {
  display: grid;
  gap: 1rem;
  max-width: 850px;
  margin-top: 1rem;
  padding: clamp(1rem, 3vw, 2rem);
  border: 1px solid var(--sbr-listing-line);
  border-radius: 16px;
  background: #fff;
}

.sbr-listing-form > :is(.sbr-button, .sbr-back) {
  justify-self: start;
}

.sbr-listing-form .sbr-field {
  min-width: 0;
}

.sbr-listing-form .sbr-field :is(input, select, textarea) {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 0.65rem 0.75rem;
  color: inherit;
  border: 1px solid #b8cfc4;
  border-radius: 8px;
  background: #fff;
}

.sbr-listing-form input[type="file"] {
  padding: .4rem;
}

.sbr-listing-form :is(p, h2, h3, fieldset) {
  margin: 0;
}

.sbr-listing-form fieldset {
  min-width: 0;
  border: 1px solid var(--sbr-listing-line);
  padding: 0.75rem;
}

.sbr-listing-grid,
.sbr-listing-steps,
.sbr-listing-checks {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
}

.sbr-listing-steps {
  padding: 0;
  list-style: none;
  margin: 1rem 0;
}

.sbr-listing-steps li {
  border-radius: 9px;
  padding: 0.65rem 0.8rem;
  background: var(--sbr-listing-panel);
}

.sbr-listing-steps [aria-current="step"] {
  color: #fff;
  background: #177653;
  font-weight: 700;
}

.sbr-listing-steps a,
.sbr-listing-own a {
  color: #115d49;
}

.sbr-listing-map {
  border: 1px solid var(--sbr-listing-line);
  border-radius: 10px;
  padding: 0.75rem;
}

.sbr-listing-map-inner {
  height: min(340px, 54vh);
  margin-block: 0.75rem;
}

.sbr-listing-map > p,
.sbr-listing-map > button,
.sbr-listing-upload > :not(.sbr-field) {
  margin-block: 0.6rem;
}

.sbr-listing-preview,
.sbr-listing-notice {
  padding: 0.85rem 1rem;
  background: var(--sbr-listing-panel, #f5f9f6);
  border-radius: 10px;
}

.sbr-listing-description {
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.sbr-listing-notice.notice-error {
  background: #fff0ec;
}

.sbr-listing-photos {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 0.65rem;
}

.sbr-listing-photos img {
  display: block;
  width: 140px;
  height: 94px;
  object-fit: cover;
  border-radius: 8px;
}

.sbr-listing-submit {
  display: grid;
  gap: 0.75rem;
  justify-items: start;
}

.sbr-listing-own {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sbr-listing-own li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.25rem 0.75rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--sbr-listing-line);
}
