/* PRJ-004 event site: entry page (EMS-12). Uses Quartz tokens with fallbacks. */
[hidden] { display: none !important; }

body {
  margin: 0;
  background: var(--qds-theme-main-background, #f0f1f2);
  color: var(--qds-theme-text-standard, #090b0c);
  font-family: var(--qds-font-family-brand, Nunito, system-ui, sans-serif);
}

.entry {
  display: flex;
  justify-content: center;
  padding: 2rem 1rem;
}

.entry-card {
  width: 100%;
  max-width: 32rem;
  padding: 1.5rem;
  background: var(--qds-theme-main-subsection-standard-background, #fafafa);
  border-radius: var(--qds-main-subsection-border-radius, 8px);
}

.entry-card h1 { margin: 0 0 0.75rem; font-size: 1.5rem; }
.entry-card p  { margin: 0; color: var(--qds-theme-text-subdued, #636a6e); }
.consent-text p { margin: 0 0 0.75rem; color: var(--qds-theme-text-standard, #090b0c); }
.consent-version { font-size: 0.875rem; margin-top: 0.5rem !important; }

.entry-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.25rem;
}
.entry-actions button,
.entry-actions .entry-link {
  flex: 1 1 10rem;
  min-height: 2.75rem;
  padding: 0.5rem 1rem;
  border-radius: var(--qds-main-subsection-border-radius, 8px);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
/* EMS-19: a link that looks like the primary button (continue after registering). */
.entry-actions .entry-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  text-decoration: none;
  box-sizing: border-box;
}
.btn-primary {
  border: 0;
  background: var(--qds-theme-main-button-primary-background, #3dcd58);
  color: var(--qds-theme-main-button-primary-text, #090b0c);
}
.btn-secondary {
  border: 1px solid var(--qds-theme-text-subdued, #636a6e);
  background: transparent;
  color: var(--qds-theme-text-standard, #090b0c);
}
.entry-actions button:focus-visible,
.entry-actions .entry-link:focus-visible,
.entry-card h1:focus-visible { outline: 3px solid #3dcd58; outline-offset: 2px; }

/* ---------- Form fields (EMS-19) ----------
   Used by sign-in and registration. Each .field stacks its label above a full-width input.
   Inputs use 1rem (16px) text so iPhone Safari does not zoom in when a field is focused. */
.entry-card > p + .field,
.field + .field { margin-top: 1rem; }
.field {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.field label {
  font-weight: 600;
  color: var(--qds-theme-text-standard, #090b0c);
}
.field input {
  box-sizing: border-box;
  width: 100%;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--qds-theme-text-subdued, #636a6e);
  border-radius: var(--qds-main-subsection-border-radius, 8px);
  background: var(--qds-theme-control-background-default, #ffffff);
  color: var(--qds-theme-text-standard, #090b0c);
  font: inherit;
  font-size: 1rem;
}
.field input:focus-visible {
  outline: 3px solid #3dcd58;
  outline-offset: 1px;
  border-color: #3dcd58;
}
#signin-code { letter-spacing: 0.05em; text-transform: uppercase; }
.entry-card .field-hint { font-size: 0.875rem; }
/* Status and error text under the fields. Empty until the script writes to it. */
.entry-card .field-message {
  margin-top: 0.75rem;
  color: var(--qds-theme-text-standard, #090b0c);
}
.field-message:empty { display: none; }
.entry-card .entry-footnote { margin-top: 1rem; font-size: 0.875rem; }
