/*
 * site-extra.css — small, minimal additions on top of pizzeria.css.
 * Only covers things the captured Pizzeria template never shipped styling
 * for: an ENABLED multi-field RSVP form (the template only captured a
 * disabled name-search input/button), a venue photo frame, and the
 * page-title spacing when several "Page" sections are stacked on one
 * document instead of split across routes. Colors/fonts/spacing all reuse
 * the palette + type scale documented in template/NOTES.md — nothing new
 * is introduced.
 */

/* Stack multiple template "Page" sections on one document with the same
   rhythm the template uses between routed pages. */
.pageSection { margin-bottom: 5rem; }
.pageSection:last-of-type { margin-bottom: 3.125rem; }

/* Venue photo frame (Travel section) — mirrors the hero image treatment
   (.fancyclothes-5ocjd1: full-width, block, rounded-free) at a contained
   size within an event row. */
.siteExtra-photo { display: block; width: 100%; max-width: 640px; height: auto; margin: 0 auto 20px; box-sizing: border-box; border-radius: 16px; }

/* Button-styled links (map links, calendar link) reusing the RSVP
   button's exact rules (.fancyclothes-9n02dn) but as inline anchors
   so several can sit side by side. */
.siteExtra-btnRow { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 12px; }
.siteExtra-btn { font-family: "Brandon Grotesque Medium"; font-weight: 400; font-style: normal; text-transform: uppercase; letter-spacing: 0.5px; font-size: 16.8px; display: inline-block; padding: 12px 20px; touch-action: manipulation; cursor: pointer; white-space: nowrap; border-width: 1px; border-style: solid; text-decoration: none; border-color: transparent; color: rgb(244, 239, 214); background-color: rgb(35, 62, 38); border-radius: 0px; }
.siteExtra-btn:hover, .siteExtra-btn:focus, .siteExtra-btn:active { color: rgb(254, 253, 250); background-color: rgb(32, 56, 34); }

/* RSVP form — enabled text/email/select/textarea inputs, built from the
   same box model as the template's disabled name-search input
   (.fancyclothes-y7tz28-.../.fancyclothes-1ntboiy-...) but with a white,
   enabled background instead of the disabled grey. */
.siteExtra-field { margin-bottom: 20px; text-align: left; }
.siteExtra-field label { display: block; margin-bottom: 8px; font-family: "Brandon Grotesque Medium"; font-weight: 400; text-transform: uppercase; letter-spacing: 0.5px; font-size: 14px; color: rgb(35, 62, 38); }
.siteExtra-inputBox { transition-duration: 250ms; transition-property: border-color, box-shadow; transition-timing-function: ease-in-out; background: rgb(255, 255, 255); border-radius: 0px; border: 0.0625rem solid rgb(204, 204, 204); display: flex; min-height: 2.5rem; overflow: hidden; position: relative; width: 100%; box-sizing: border-box; }
.siteExtra-inputBox:focus-within { border: 0.0625rem solid rgb(51, 51, 51); }
.siteExtra-input { font-family: "Brandon Grotesque Medium"; -webkit-font-smoothing: antialiased; color: rgb(51, 51, 51); font-weight: 400; font-size: 16px; line-height: 1.375; align-self: center; background-color: transparent; display: block; height: 100%; width: 100%; box-shadow: none; border-radius: 0px; padding: 10px 12px; border: none; box-sizing: border-box; }
.siteExtra-input:focus { outline: 0; }
textarea.siteExtra-input { resize: vertical; padding-top: 10px; }
.siteExtra-row { display: flex; flex-wrap: wrap; gap: 20px; }
.siteExtra-row .siteExtra-field { flex: 1 1 220px; }
.siteExtra-radios { display: flex; flex-wrap: wrap; gap: 20px; }
.siteExtra-radio { display: flex; align-items: center; gap: 8px; font-family: "Brandon Grotesque Medium"; font-size: 16px; color: rgb(35, 62, 38); cursor: pointer; }
.siteExtra-radio input { accent-color: rgb(35, 62, 38); width: 16px; height: 16px; }
.siteExtra-honey { position: absolute; left: -9999px; }
.siteExtra-submitWrap { margin-top: 8px; width: 260px; max-width: 100%; margin-left: auto; margin-right: auto; }
.siteExtra-submitWrap .fancyclothes-9n02dn { background-color: rgb(35, 62, 38); }
.siteExtra-status { font-family: "Brandon Grotesque Medium"; font-size: 14px; margin-top: 12px; min-height: 1.2em; }
.siteExtra-status.is-error { color: rgb(190, 24, 48); }
.siteExtra-thanks { display: none; text-align: center; }
.siteExtra-thanks.is-visible { display: block; }
.siteExtra-form.is-hidden { display: none; }
.siteExtra-fallback, .siteExtra-note { text-align: center; font-size: 14px; margin-top: 16px; }
.siteExtra-fallback a { color: rgb(136, 170, 140); }