/* Front-end RSVP form + login form. Minimal, mobile-first, palette-driven.
   Falls back gracefully if the child theme palette vars are absent. */

.wm-rsvp,
.wm-login {
  --_text: var(--w-text-primary, #3F4638);
  --_muted: var(--w-text-secondary, #6E665D);
  --_line: var(--w-linen, #CFC5BA);
  --_surface: var(--w-warm-white, #F6F3EE);
  --_accent: var(--w-heritage-olive, #6D755B);

  max-width: var(--w-content-max, 640px);
  margin: 0 auto;
  color: var(--_text);
  font-family: "EB Garamond", Georgia, serif;
}

/* Notices */
.wm-notice {
  padding: 12px 16px;
  border-radius: 12px;
  margin: 0 0 18px;
  font-size: 1rem;
}
.wm-notice--ok   { background: var(--w-sage-mist, #D9DDD1); color: var(--w-deep-olive, #4E5643); }
.wm-notice--info { background: var(--w-porcelain, #F1ECE5); color: var(--_muted); }
.wm-notice--error{ background: #f3ddd2; color: var(--w-dark-copper, #6D4937); }

.wm-rsvp__intro { color: var(--_muted); margin-bottom: 22px; }

/* Sections */
.wm-rsvp__section {
  border: 1px solid var(--_line);
  border-radius: var(--w-radius, 18px);
  padding: 18px 18px 8px;
  margin: 0 0 22px;
  background: var(--_surface);
}
.wm-rsvp__section[disabled] { opacity: 0.96; }
.wm-rsvp__section legend {
  font-size: 1.25rem;
  padding: 0 8px;
  color: var(--_text);
}

.wm-rsvp__guest-name {
  display: block;
  font-size: 1.05rem;
  margin: 14px 0 8px;
  color: var(--_accent);
}
.wm-rsvp__meal {
  margin: 18px 0 6px;
  font-size: 1.1rem;
  border-top: 1px solid var(--_line);
  padding-top: 14px;
}

/* Chips (checkbox / radio pills) */
.wm-rsvp__days,
.wm-course__choices {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}
/* Day / accept-decline chip labels a touch larger. */
.wm-rsvp__days .wm-chip span { font-size: 1.15rem; }

/* Arrival mode (transport) options — more breathing room between buttons. */
.wm-rsvp__transport {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.wm-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 1.1rem;
  padding: 8px 14px;
  border: 1px solid var(--_line);
  border-radius: 999px;
  background: #fff;
  cursor: pointer;
  user-select: none;
  transition: all 0.15s ease;
}
/* Hide the radio/checkbox dot itself — selection is shown by the chip styling.
   visibility:hidden + absolute positioning takes it out of flow so it leaves
   no gap/offset before the label text, while staying keyboard-focusable. */
.wm-chip { gap: 0; }
.wm-chip input {
  visibility: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  border: 0;
}
.wm-chip:has(input:checked) {
  background: var(--_accent);
  border-color: var(--_accent);
  color: var(--w-btn-text, #FCFBF8);
}
/* Keyboard focus ring on the chip when its hidden input is focused. */
.wm-chip:has(input:focus-visible) { outline: 2px solid var(--w-soft-olive, #B8BEA8); outline-offset: 2px; }
.wm-chip:has(input:disabled) { cursor: default; }

/* Courses */
.wm-course { margin: 0 0 14px; padding: 0 0 14px; }
/* Subtle separator between consecutive courses. */
.wm-course + .wm-course {
  border-top: 1px solid var(--_line);
  padding-top: 14px;
  margin-top: 2px;
}
.wm-course__name { font-weight: 600; font-size: 1.15rem; }
.wm-course__desc { color: var(--_muted); font-size: 0.95rem; margin-bottom: 6px; }

/* Both options listed together (separated by "or") above the radio buttons. */
.wm-course__options { margin: 4px 0 12px; }
.wm-course__option { display: block; }
.wm-course__option-title { display: block; font-weight: 600; font-size: 1.15rem; }
.wm-course__option-desc { display: block; color: var(--_muted); font-size: 0.95rem; }
.wm-course__or {
  display: block;
  font-style: italic;
  color: var(--_muted);
  margin: 5px 0;
}

/* Per-guest selection row inside a choice course. */
.wm-course__guest { margin-top: 8px; }
.wm-course__guest-name {
  display: block;
  font-size: 1.05rem;
  color: var(--_accent);
  margin: 10px 0 4px;
}

/* Meat/veggie option chips: title + description stacked inside the radio. */
.wm-course__choices { align-items: stretch; }
.wm-chip--option {
  align-items: flex-start;
  flex: 1 1 200px;
  padding: 12px 14px;
  text-align: left;
  border-radius: 12px; /* rounded rectangle, not a pill */
}
.wm-chip--option input { margin-top: 3px; }
.wm-option { display: flex; flex-direction: column; gap: 2px; }
.wm-option__title { font-weight: 600; line-height: 1.3; font-size: 1.15rem; }
.wm-option__desc { font-size: 0.9rem; opacity: 0.85; line-height: 1.35; }

/* Free-text fields */
.wm-field { margin: 0 0 20px; }
.wm-field label { display: block; font-size: 1.05rem; margin-bottom: 4px; }
.wm-field__help { display: block; color: var(--_muted); font-size: 0.9rem; margin-bottom: 6px; }
.wm-rsvp textarea,
.wm-rsvp input[type="text"] {
  width: 100%;
  box-sizing: border-box;
  font-family: inherit;
  font-size: 1rem;
  padding: 12px 14px;
  border: 1px solid var(--_line);
  border-radius: 12px;
  background: #fff;
  color: var(--_text);
}
.wm-rsvp textarea:focus,
.wm-rsvp input:focus { outline: 2px solid var(--w-soft-olive, #B8BEA8); border-color: var(--_accent); }

.wm-rsvp__actions { margin-top: 8px; }

/* ---- Login form ---- */
.wm-login { max-width: 420px; }
.wm-login .wm-field { margin-bottom: 16px; }
.wm-login input[type="text"] {
  width: 100%;
  box-sizing: border-box;
  font-family: inherit;
  font-size: 1.05rem;
  padding: 13px 15px;
  border: 1px solid var(--_line);
  border-radius: 12px;
  background: #fff;
}
.wm-login .wm-btn { width: 100%; margin-top: 6px; }