body,
#page {
  background: var(--wp--preset--color--base-2, #f7f7f8);
}

/* scope everything to this page section */
.auri-outer-column {
  --gap: 20px;
  --section-gap: 5px;
  --section-pad: 20px;
}

.auri-main-inner-column,
.auri-main-column {
  margin: 0;
  column-gap: 0;
  gap: var(--gap);
}

/* the two main columns */
.auri-outer-column .auri-input-column,
.auri-outer-column .auri-main-column {
  display: flex;
  flex-direction: column;
  padding: var(--section-gap);
}

.auri-map-column.auri-section-column {
  padding: 0;
  overflow: hidden;
}

/* a single content section */
.auri-section-column {
  display: flex;
  flex-direction: column;
  gap: calc(var(--section-gap));
  padding: var(--section-pad);
  border-radius: 8px;
  background: var(--wp--preset--color--base-3, #f7f7f8);
}

/* make Naive UI cards/forms breathe when inside Gutenberg columns */
.auri-outer-column .n-card,
.auri-outer-column .n-form,
.auri-outer-column .n-space {
  width: 100%;
}

/* responsive: stack main columns on small screens */
@media (max-width: 782px) {
  /* WP’s column breakpoint */
  .auri-outer-column.wp-block-columns {
    flex-wrap: wrap;
  }
  .auri-outer-column .wp-block-column {
    flex-basis: 100% !important;
  }
}

@media all and (max-width: 1400px) {
  .auri-input-column {
    display: none !important;
  }
}
@media all and (min-width: 1400px) {
  #input-toggle-btn {
    display: none !important;
  }
}

.admin-bar .n-drawer-header {
  margin-top: 38px;
}

#content {
  max-width: 1800px;
  padding: 40px 20px;
}

.result-item {
  margin: 0;
}

.n-button.n-button {
  margin: 0;
  font-weight: var(--n-font-weight);
  line-height: 1;
  font-family: inherit;
  padding: var(--n-padding);
  height: var(--n-height);
  font-size: var(--n-font-size);
  border-radius: var(--n-border-radius);
  color: var(--n-text-color);
  background-color: var(--n-color);
  width: var(--n-width);
  white-space: nowrap;
  outline: none;
  position: relative;
  z-index: auto;
  border: none;
  display: inline-flex;
  flex-wrap: nowrap;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  user-select: none;
  -webkit-user-select: none;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
  transition:
    color 0.3s var(--n-bezier),
    background-color 0.3s var(--n-bezier),
    opacity 0.3s var(--n-bezier),
    border-color 0.3s var(--n-bezier);
}