/* Opt-in presentation primitives. Do not apply to legacy forms wholesale. */
.hp-ui { color: var(--hp-text); font-family: var(--hp-font-ui); }
.hp-ui, .hp-ui * { box-sizing: border-box; }
.hp-ui :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--hp-gold-light); outline-offset: 3px; box-shadow: var(--hp-focus);
}
.hp-ui .hp-button {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--hp-space-2);
  min-height: 46px; padding: .75rem 1.5rem; border: 1px solid var(--hp-border-accent);
  border-radius: var(--hp-radius-pill); font: 700 .95rem/1.4 var(--hp-font-ui);
  background: linear-gradient(135deg,var(--hp-gold-light),var(--hp-gold)); color: var(--hp-navy);
  cursor: pointer; text-decoration: none; transition: filter .16s ease, border-color .16s ease;
}
.hp-ui .hp-button--secondary { background: var(--hp-surface); color: var(--hp-text); }
.hp-ui .hp-button:hover { filter: brightness(1.1); border-color: var(--hp-gold-light); }
.hp-ui .hp-button:active { filter: brightness(.95); }
.hp-ui .hp-button:disabled { opacity: .55; cursor: not-allowed; }
.hp-ui :is(.hp-card,.hp-form-surface,.hp-modal-surface) {
  padding: var(--hp-space-6); border: 1px solid var(--hp-border); border-radius: var(--hp-radius-lg);
  background: var(--hp-surface); color: var(--hp-text); box-shadow: var(--hp-shadow); min-width: 0;
}
.hp-ui .hp-modal-surface { width: min(100%,38rem); max-height: 85svh; overflow-y: auto; }
.hp-ui :is(.hp-input,.hp-select) {
  width: 100%; min-height: 46px; padding: .75rem; border: 1px solid var(--hp-border);
  border-radius: var(--hp-radius-sm); background: var(--hp-navy); color: var(--hp-text);
  font: inherit; color-scheme: dark;
}
.hp-ui :is(.hp-input,.hp-select):hover { border-color: var(--hp-border-accent); }
.hp-ui .hp-input::placeholder { color: var(--hp-muted); }
.hp-ui [aria-invalid="true"] { border-color: var(--hp-danger); }
.hp-ui .hp-chip { display: inline-flex; padding: .35rem .75rem; border: 1px solid var(--hp-border); border-radius: var(--hp-radius-pill); background: var(--hp-surface-raised); color: var(--hp-text); font: 600 .85rem/1.4 var(--hp-font-ui); }
.hp-ui .hp-chip[aria-pressed="true"] { border-color: var(--hp-gold); color: var(--hp-gold-light); }
.hp-ui .hp-notice { padding: var(--hp-space-4); border: 1px solid var(--hp-border); border-inline-start: 3px solid var(--hp-info); border-radius: var(--hp-radius-sm); background: var(--hp-surface); color: var(--hp-text); }
.hp-ui .hp-notice--success { border-inline-start-color: var(--hp-success); }
.hp-ui .hp-notice--warning { border-inline-start-color: var(--hp-warning); }
.hp-ui .hp-notice--danger { border-inline-start-color: var(--hp-danger); }
.hp-ui .hp-page-header { padding: var(--hp-space-12) var(--hp-space-6); background: var(--hp-navy); }
.hp-ui .hp-page-header h1 { margin: 0 0 var(--hp-space-4); font: 700 clamp(2rem,4vw,3.5rem)/1.1 var(--hp-font-display); color: var(--hp-text); }
.hp-ui .hp-page-header p { color: var(--hp-muted); max-width: 65ch; line-height: 1.6; }
.hp-ui.hp-footer { padding: var(--hp-space-8) var(--hp-space-6); background: var(--hp-navy); border-top: 1px solid var(--hp-border); }
.hp-ui.hp-footer a { color: var(--hp-gold-light); text-underline-offset: .2em; }
.hp-ui.hp-footer p { color: var(--hp-muted); line-height: 1.6; }
@media (prefers-reduced-motion: reduce) { .hp-ui * { transition: none; scroll-behavior: auto; } }
.hp-location-field{position:relative;min-width:0}
.hp-location-list{position:absolute;z-index:1200;top:calc(100% + 6px);left:0;right:0;max-height:min(18rem,45vh);overflow:auto;padding:6px;border:1px solid rgba(215,181,95,.42);border-radius:12px;background:#071a2d;box-shadow:0 18px 48px rgba(0,0,0,.38)}
.hp-location-list[hidden]{display:none}
.hp-location-option{display:grid;width:100%;min-height:48px;padding:9px 11px;border:0;border-radius:8px;background:transparent;color:#f7f9fc;text-align:left;cursor:pointer}
.hp-location-option strong{font-size:.9rem;line-height:1.25}
.hp-location-option span{margin-top:2px;color:rgba(235,241,248,.7);font-size:.75rem;line-height:1.3}
.hp-location-option:hover,.hp-location-option.active,.hp-location-option[aria-selected="true"]{background:rgba(215,181,95,.14);outline:1px solid rgba(215,181,95,.35)}
.hp-location-status{margin-top:6px;color:rgba(235,241,248,.76);font-size:.72rem;line-height:1.35}
.hp-location-status[hidden]{display:none}
.connect-guest-actions,.connect-form-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.connect-guest-actions>*{flex:1 1 12rem}
@media(max-width:680px){.hp-location-list{position:fixed;z-index:2200;top:auto;left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));max-height:min(19rem,48vh)}}
