/* ── choose the venue, before anything else ─────────────────
   The first thing Step 2 asks, so it is a card on the warm paper
   rather than a form: same white, same 22px radius, same #EADDE4
   line as every other contextual panel in the workflow. §3. */
.venue-picker { max-width: 720px; margin: 0 auto; padding: 30px; background: #fff; border: 1px solid #eadde4; border-radius: 22px; color: #3a2a38; box-shadow: 0 8px 28px rgba(58,42,56,.04); }
.venue-picker-head h2 { margin: 0 0 8px; font: 650 28px/34px Fraunces, Georgia, serif; }
.venue-picker-options h3, .venue-picker-custom h3 { margin: 0 0 8px; font: 650 20px/26px Fraunces, Georgia, serif; }
.venue-picker-head p, .venue-picker-muted, .venue-picker-help, .venue-picker-quiet { margin: 0 0 16px; color: #705a6c; font-size: 14px; line-height: 20px; }
.venue-picker-quiet, .venue-picker-help { font-size: 13px; line-height: 19px; }
.venue-picker-search { display: grid; gap: 8px; font-size: 14px; line-height: 20px; font-weight: 700; }
.venue-picker input { box-sizing: border-box; min-height: 48px; width: 100%; padding: 12px; border: 1px solid #cfbcc8; border-radius: 14px; font: inherit; font-size: 16px; }
.venue-picker input:focus-visible { outline: 3px solid #c23a61; outline-offset: 2px; }
.venue-picker-results, .venue-picker-layouts { display: grid; gap: 8px; margin: 16px 0; }
.venue-picker-result, .venue-picker-layout, .venue-picker-manual, .venue-picker-text, .venue-picker-cancel { min-height: 44px; padding: 12px 14px; text-align: left; border: 1px solid #eadde4; border-radius: 14px; background: #fff; color: inherit; font: inherit; font-size: 14px; line-height: 20px; font-weight: 700; }
.venue-picker-layout { display: grid; gap: 3px; }
.venue-picker-preview { color: #705a6c; font-weight: 400; }
.venue-picker-result { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; }
.venue-picker-result strong { font-size: 16px; line-height: 22px; }
.venue-picker-result small { grid-column: 1; color: #705a6c; font-size: 13px; line-height: 19px; }
/* A saved layout is good news, so it is said in the positive pair and
   not only in green. */
.venue-picker-badge { grid-column: 2; grid-row: 1 / span 2; align-self: center; padding: 4px 10px; border-radius: 999px; background: #e4f0e6; color: #356649; font-size: 13px; line-height: 19px; font-weight: 700; }
/* A pointer gets 2px of lift; a finger gets the colour only. */
.venue-picker-result, .venue-picker-layout, .venue-picker-manual { transition: transform 120ms cubic-bezier(.22,1,.36,1), border-color 120ms; }
@media (hover: hover) and (pointer: fine) {
  .venue-picker-result:hover, .venue-picker-layout:hover, .venue-picker-manual:hover { border-color: #ce8da1; transform: translateY(-2px); }
}
.venue-picker-options, .venue-picker-custom { display: grid; gap: 12px; }
.venue-picker-primary, .venue-picker-upload { min-height: 48px; border: 0; border-radius: 14px; background: #c23a61; color: #fff; font: inherit; font-size: 14px; line-height: 20px; font-weight: 800; }
/* Colour never says it alone: each state leads with its own mark. */
.venue-picker-positive, .venue-picker-error { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; line-height: 20px; font-weight: 700; }
.venue-picker-positive { color: #356649; }
.venue-picker-positive::before { content: '✓'; }
.venue-picker-error { color: #a92f4b; }
.venue-picker-error::before { content: '⛔'; }
/* A lookup that could not run is advisory, not blocking: naming the
   venue by hand is right there, so it must not read like a failure. */
.venue-picker-status.venue-picker-error { padding: 12px 14px; border-radius: 14px; background: #fbf0d7; color: #805718; }
.venue-picker-status.venue-picker-error::before { content: '⚠'; }
.venue-picker-status { margin: 16px 0; font-size: 14px; line-height: 20px; }
.venue-picker-text { margin-top: 16px; border: 0; color: #694597; text-decoration: underline; text-underline-offset: 3px; }
.venue-picker-cancel { margin-left: 8px; color: #705a6c; }
@media (max-width: 767px) {
  .venue-picker { padding: 20px 16px; border-radius: 18px; }
  .venue-picker-head h2 { font-size: 24px; line-height: 30px; }
  .venue-picker-result { min-height: 52px; }
  .venue-picker-cancel { margin-left: 0; }
}

/* A map result is a name and a town; a saved venue is a room somebody drew.
   The two badges never read the same. */
.venue-picker-badge-map { background:#fff; border:1px solid var(--line,#eadde4); color:var(--text-2,#705a6c); }

/* ── a room somebody already mapped ─────────────────────────
   One tap, no scan and no money: the best answer this panel has, so it is the
   first thing in it and the only card in the positive pair. */
.venue-picker-community { display:grid; gap:10px; padding:16px; border-radius:18px; background:#e4f0e6; border:1px solid #c9e2ce;
  animation:vpcIn 380ms cubic-bezier(.34,1.56,.64,1) both; }
@keyframes vpcIn { from { opacity:0; transform:scale(.96); } }
.venue-picker-community .venue-picker-positive { margin:0; color:#356649; font-size:15px; line-height:21px; }
.vpc-body { display:grid; grid-template-columns:180px minmax(0,1fr); gap:14px; align-items:start; }
.vpc-body .venue-picker-layout-preview { width:180px; height:120px; border-radius:12px; border:1px solid #eadde4; background:#fff9f3; }
.vpc-meta { display:grid; gap:4px; justify-items:start; font-size:13px; line-height:19px; color:#705a6c; }
.vpc-meta strong { color:#3a2a38; font-size:14px; line-height:20px; }
.vpc-meta .venue-picker-primary { margin-top:4px; padding:0 18px; }
.venue-picker-community.compact { background:#fff; border-color:#eadde4; padding:12px; }
.venue-picker-more > summary { min-height:44px; display:flex; align-items:center; color:#356649;
  font:700 13px/19px inherit; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.venue-picker-more[open] { display:grid; gap:8px; }
@media (max-width:600px) {
  .vpc-body { grid-template-columns:minmax(0,1fr); }
  .vpc-body .venue-picker-layout-preview { width:100%; height:132px; }
}
@media (prefers-reduced-motion:reduce) { .venue-picker-community { animation:none; } }

/* A locked action says so on itself rather than going grey and silent. The
   badge sits on a rose button, so it borrows the button's ink rather than the
   gold it wears against warm paper. */
.venue-picker-primary { display:inline-flex; align-items:center; gap:8px; }
.venue-picker-primary .pro { background:rgba(255,255,255,.22); color:#fff; }
.venue-picker-layout .pro, .venue-picker-manual .pro { margin-inline-start:6px; }