/**
 * Contact form feedback styling.
 *
 * Scoped entirely to plugin-owned class names (cb-*) so it can never collide
 * with the theme's design. Colours reuse the theme's CSS custom properties
 * where they exist, with hard-coded fallbacks for any page that lacks them.
 */

#cb-form-alert[hidden] {
  display: none !important;
}

.cb-form-alert {
  border-left: 3px solid var(--orange, #C8622A);
  background: var(--cream, #F5F0EA);
  padding: 0.95rem 1.15rem;
  margin-top: 0.25rem;
  font-family: var(--font-body, 'Lato', sans-serif);
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--dark, #1A1409);
}

.cb-form-alert--success {
  border-left-color: #4a7a4a;
  background: #eef3ec;
}

.cb-form-alert--error {
  border-left-color: #b3452c;
  background: #fbeeea;
}

.cb-form-alert__text {
  margin: 0;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.cb-form-alert__list {
  margin: 0.5rem 0 0;
  padding-left: 1.1rem;
  font-weight: 400;
  color: var(--mid, #4A4A4A);
}

.cb-form-alert__list li + li {
  margin-top: 0.15rem;
}

/* Field-level error highlight — deliberately minimal so it reads as part of
   the existing form rather than a Bootstrap validation state. */
.cb-invalid.form-control,
.cb-invalid.form-select {
  border-color: #b3452c !important;
}

/* CAPTCHA widget sits in its own grid column and inherits the row gutter. */
.cb-captcha-col {
  min-height: 0;
}

.cb-captcha:empty {
  display: none;
}

/* Busy state on the theme's submit button — no colour or size change, just a
   cursor hint, so the design is untouched. */
.btn-cb-primary[disabled] {
  cursor: progress;
  opacity: 0.85;
}

/* Spinner shown inside a submit button while its form is sending. Sized off
   the surrounding font so it drops into either button (contact or
   newsletter) without its own overrides, and its border colour is
   currentColor so it always matches the button's (white) text. */
.cb-spinner {
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 0.1em;
  vertical-align: -0.15em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  opacity: 0.85;
  animation: cb-spin 0.7s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .cb-spinner {
    animation-duration: 1.6s;
  }
}

@keyframes cb-spin {
  to {
    transform: rotate(360deg);
  }
}

/* ─────────────────────────────────────────────
   Newsletter strip
   Sits on the sage background, so the feedback
   is light-on-dark rather than the cream panel
   used inside the contact form.
───────────────────────────────────────────── */
#cb-nl-alert[hidden] {
  display: none !important;
}

.cb-nl-alert {
  margin-top: 1rem;
  padding: 0.7rem 1rem;
  font-family: var(--font-body, 'Lato', sans-serif);
  font-size: 0.88rem;
  line-height: 1.6;
  color: #fff;
  border-left: 3px solid rgba(255, 255, 255, 0.75);
  background: rgba(255, 255, 255, 0.14);
}

.cb-nl-alert--success {
  border-left-color: #ffffff;
  background: rgba(255, 255, 255, 0.2);
}

.cb-nl-alert--error {
  border-left-color: #7a1f0d;
  background: rgba(122, 31, 13, 0.24);
}

.nl-input.cb-invalid {
  border-color: #7a1f0d !important;
}

.nl-btn[disabled] {
  cursor: progress;
  opacity: 0.8;
}