/* RSVP page — hand-written on top of the site's tokens (cream #efe5d7, brown #3d2b11, olive #a3991d). */

.rsvp-hero { color: var(--text-color--text-secondary); padding-left: 1rem; padding-right: 1rem; }
.rsvp-hero .cta-video_background { min-height: 58svh; margin-top: 1rem; margin-bottom: 0; padding: 8rem 1rem 3rem; }
/* the lace cloth (.div, as on the home page's RSVP card) sits below the nav and hugs the text */
.rsvp-hero .div { min-height: 0; min-width: 0; width: min(30rem, 100%); aspect-ratio: 901 / 934; padding: 18%; }
.rsvp-hero .cta_content { padding: 0; }
.rsvp-hero_title { margin: 0; }

.rsvp-main { color: #3d2b11; padding-top: 6rem; padding-bottom: 10rem; }
.container-small { width: 100%; max-width: 46rem; margin-left: auto; margin-right: auto; }

.rsvp-panel { display: flex; flex-direction: column; align-items: center; gap: 2.5rem; text-align: center; }
.rsvp-panel[hidden] { display: none; }
.page-headings.is-rsvp { max-width: 40ch; }
.page-headings.is-rsvp .heading-style-h2 { font-size: 1.8rem; line-height: 1.3; }

/* fields: stationery-style underline inputs */
.rsvp-field { display: flex; flex-direction: column; gap: .4rem; width: 100%; text-align: left; }
.rsvp-label { font-family: Justinia, Georgia, sans-serif; text-transform: uppercase; letter-spacing: .08em; font-size: .8rem; }
.rsvp-optional { text-transform: none; letter-spacing: 0; opacity: .6; }
.rsvp-input { -webkit-appearance: none; appearance: none; width: 100%; background: transparent; border: 0; border-bottom: 1px solid rgba(61, 43, 17, .5); border-radius: 0; padding: .55rem 0; color: #3d2b11; font-family: Justinia, Georgia, sans-serif; font-size: 1.5rem; line-height: 1.3; outline: none; transition: border-color .25s; }
.rsvp-input:focus-visible { border-bottom-color: #3d2b11; box-shadow: 0 1px 0 #3d2b11; }
.rsvp-input::placeholder { color: rgba(61, 43, 17, .4); }
.rsvp-input.is-invalid { border-bottom-color: #9a3b22; }
.rsvp-textarea { resize: vertical; min-height: 3.2rem; }

.rsvp-search { display: flex; align-items: flex-end; gap: 1.5rem; width: 100%; flex-wrap: wrap; }
.rsvp-search .rsvp-field { flex: 1 1 16rem; }

/* buttons reuse .button from style.css; this just resets the <button> element */
.rsvp-button { border: 0; font: inherit; cursor: pointer; flex: 0 0 auto; }
.rsvp-button[aria-busy="true"] { pointer-events: none; }
.rsvp-button[aria-busy="true"] .button-text { opacity: .45; transition: opacity .3s; }

.rsvp-message { font-family: Justinia, Georgia, sans-serif; font-size: 1.15rem; line-height: 1.5; max-width: 40ch; margin: 0; min-height: 0; }
.rsvp-message:empty { display: none; }
.rsvp-message.is-error { color: #9a3b22; }
.rsvp-message.is-notice { background: rgba(163, 153, 29, .16); border-radius: .75rem; padding: 1rem 1.5rem; max-width: none; }

/* search results */
.rsvp-results { display: grid; gap: 1rem; width: 100%; }
.rsvp-results:empty { display: none; }
.rsvp-party { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; text-align: left; background: rgba(61, 43, 17, .06); border-radius: 1rem; padding: 1.5rem 2rem; }
.rsvp-party_name { font-family: Justinia, Georgia, sans-serif; font-size: 1.5rem; line-height: 1.2; }
.rsvp-party_guests { margin-top: .3rem; opacity: .7; }

/* per-guest rows */
.rsvp-guests { width: 100%; border-top: 1px solid rgba(61, 43, 17, .2); }
.rsvp-guest { display: grid; grid-template-columns: 1fr auto; gap: 1rem 2rem; align-items: center; padding: 1.5rem 0; border-bottom: 1px solid rgba(61, 43, 17, .2); text-align: left; }
.rsvp-guest_name { font-family: Justinia, Georgia, sans-serif; font-size: 1.5rem; line-height: 1.2; }
.rsvp-guest .rsvp-field { grid-column: 1 / -1; }
.rsvp-guest .rsvp-input { font-size: 1.1rem; font-family: Cabinetgrotesk Variable, Georgia, sans-serif; }
.rsvp-guest.is-invalid .rsvp-toggle { box-shadow: 0 0 0 2px #9a3b22; }

.rsvp-toggle { position: relative; display: inline-flex; padding: .25rem; background: rgba(61, 43, 17, .08); border-radius: 999px; }
.rsvp-toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.rsvp-toggle label { padding: .6rem 1.15rem; border-radius: 999px; font-family: Justinia, Georgia, sans-serif; font-size: .95rem; line-height: 1; white-space: nowrap; cursor: pointer; transition: background-color .25s, color .25s; }
.rsvp-toggle label:hover { background: rgba(61, 43, 17, .08); }
.rsvp-toggle input:checked + label { background: #a3991d; color: #fff; }
.rsvp-toggle input:focus-visible + label { outline: 2px solid #3d2b11; outline-offset: 2px; }

.rsvp-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 1.5rem 2.5rem; }
.rsvp-link { background: none; border: 0; padding: .25rem 0; cursor: pointer; color: #3d2b11; font-family: Justinia, Georgia, sans-serif; font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; text-decoration: underline; text-underline-offset: .35em; text-decoration-color: rgba(61, 43, 17, .4); transition: text-decoration-color .25s; }
.rsvp-link:hover { text-decoration-color: #3d2b11; }
.rsvp-icon { width: 3rem; height: 3rem; }
.rsvp-note { margin: 3rem 0 0; text-align: center; font-size: .8rem; opacity: .5; }

@media screen and (max-width: 767px) {
  .rsvp-hero .cta-video_background { min-height: 48svh; }
  .rsvp-hero .cta_content { padding-top: 8rem; }
  .rsvp-main { padding-top: 4rem; padding-bottom: 6rem; }
  .rsvp-panel { gap: 2rem; }
  .rsvp-party { flex-direction: column; align-items: flex-start; padding: 1.25rem 1.5rem; }
  .rsvp-guest { grid-template-columns: 1fr; }
  .rsvp-input { font-size: 1.25rem; }
}

/* phones: let the lace use the full card width so the subtitle stays on the cloth */
@media screen and (max-width: 479px) {
  .rsvp-hero .cta-video_background { padding-left: 0; padding-right: 0; }
  .rsvp-hero .div { width: 100%; padding: 15%; }
}