/* Form validation styling. The theme has no error colour of its own, so define one
   that stays readable on the light card backgrounds used by the forms. */
:root {
  --form-error: 192 57 43;
}

.field-error {
  margin-top: 0.35rem;
  font-size: 0.75rem;
  line-height: 1.1rem;
  color: rgb(var(--form-error));
}

.input--invalid,
.input.input--invalid {
  border-color: rgb(var(--form-error));
  box-shadow: inset 0 0 0 1px rgb(var(--form-error));
}

/* Server-side error summaries (contact form, account pages). */
.errors {
  margin-bottom: 0.5rem;
  padding: 0.75rem 1rem;
  border-radius: var(--media-border-radius, 0.375rem);
  border: 1px solid rgb(var(--form-error));
  color: rgb(var(--form-error));
  font-size: 0.875rem;
}

.errors ul { margin: 0; padding-left: 1.1rem; list-style: disc; }
.errors li + li { margin-top: 0.25rem; }

.form-success {
  padding: 0.75rem 1rem;
  border-radius: var(--media-border-radius, 0.375rem);
  border: 1px solid rgb(var(--color-scheme-text));
  font-size: 0.875rem;
}

/* Pick-up point map */
.pickup-map {
  height: 340px;
  width: 100%;
  border: var(--border-general-width, 1px) solid rgb(var(--color-scheme-text));
  border-radius: var(--rounded-button, 0);
  overflow: hidden;
  z-index: 0;
}

.pickup-popup {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-family: var(--font-main-family, inherit);
  font-size: 0.8125rem;
}

.pickup-popup__hours {
  opacity: 0.7;
}

.pickup-popup__choose {
  margin-top: 0.35rem;
  cursor: pointer;
  border: var(--border-general-width, 1px) solid rgb(var(--color-scheme-text));
  border-radius: var(--rounded-button, 0);
  padding: 0.3rem 0.75rem;
  background: rgb(var(--color-scheme-text));
  color: rgb(var(--color-scheme-background));
}

.leaflet-container {
  font: inherit;
}

/* Comparison table: three columns of 35vw each overflow a phone screen, so below
   the desktop breakpoint the columns share the width instead of scrolling away. */
@media (max-width: 1023px) {
  .comparison-table__scroll {
    overflow-x: hidden !important;
  }

  .comparison-table {
    font-size: 0.8125rem;
    line-height: 1.25;
  }

  .comparison-table th,
  .comparison-table td {
    width: 30% !important;
    padding: 0.625rem 0.375rem !important;
    hyphens: auto;
  }

  .comparison-table th:first-child,
  .comparison-table td:first-child {
    width: 40% !important;
  }

  /* The scroll hint has nothing left to hint at. */
  .comparison-table .top-left-cell > span {
    display: none !important;
  }

  .comparison-table td > span {
    width: 1.75rem;
  }
}