/* Get Started page (/GetStarted). Every rule is scoped under .gs so no other page changes. */
.gs {
  --gs-blue: #245D7B; --gs-blue-dk: #1b4a63; --gs-blue-lt: #6FA1BC; --gs-blue-bg: #eaf2f7;
  --gs-green: #83AE33; --gs-green-dk: #4f6b1c; --gs-ink: #212529; --gs-muted: #5a5a5a;
  --gs-line: #c9d3da; --gs-field: #6b7c89; --gs-err: #b3261e; --gs-ok-bg: #eef6e3;
  color: var(--gs-ink);
}
.gs .gs-lead { margin: 0 0 20px; color: var(--gs-muted); }
.gs .gs-h2 { margin: 0 0 4px; font-size: 1.6rem; color: var(--gs-blue); font-weight: 700; }
.gs .gs-h3 { margin: 0 0 8px; font-size: 1.1rem; color: var(--gs-blue); font-weight: 700; }

/* The steps are shown one at a time only when the script runs (.gs-js). Without it, all show. */
.gs.gs-js .gs-view, .gs.gs-js .gs-step { display: none; }
.gs.gs-js .gs-view.gs-active, .gs.gs-js .gs-step.gs-active { display: block; }
.gs.gs-js .gs-cond:not(.gs-shown) { display: none; }
/* Pieces for one path or one kind of visitor (the script sets gs-path-cw and gs-signed-in on #gsRoot) */
.gs.gs-js:not(.gs-path-cw) .gs-cw-only, .gs.gs-js.gs-path-cw .gs-vol-only { display: none; }
.gs.gs-js .gs-steps { display: flex; }
.gs .gs-steps { display: none; }

/* Spam trap: off screen, not display:none, so simple bots still fill it. */
.gs .gs-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Landing */
.gs .gs-doors { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.gs .gs-door { display: flex; flex-direction: column; gap: 6px; text-align: left; font: inherit; border: 2px solid var(--gs-line);
  border-radius: 12px; background: #fff; padding: 18px; cursor: pointer; color: var(--gs-ink); min-height: 150px; }
.gs .gs-door:hover { border-color: var(--gs-blue-lt); }
.gs .gs-door:focus-visible { outline: 3px solid var(--gs-blue-lt); outline-offset: 2px; }
.gs .gs-door strong { font-size: 1.25rem; color: var(--gs-blue); line-height: 1.2; }
.gs .gs-door .gs-d { color: var(--gs-muted); font-size: .95rem; }
.gs .gs-door .gs-go { margin-top: auto; font-weight: 700; color: var(--gs-blue); }

/* Progress and navigation */
.gs .gs-steps { gap: 6px; list-style: none; padding: 0; margin: 0 0 18px; flex-wrap: wrap; }
.gs .gs-steps li { font-size: 13px; padding: 3px 10px; border-radius: 999px; background: #eef1f4; color: var(--gs-muted); white-space: nowrap; margin: 0; }
.gs .gs-steps li.gs-step-done { background: var(--gs-ok-bg); color: var(--gs-green-dk); }
.gs .gs-steps li.gs-step-cur { background: var(--gs-blue); color: #fff; }
.gs .gs-crumb { margin: 0 0 14px; font-size: 14px; }
.gs .gs-link { font: inherit; background: none; border: 0; color: var(--gs-blue); text-decoration: underline; cursor: pointer; padding: 0; min-height: 32px; }

/* Cards */
.gs .gs-group { margin: 18px 0 6px; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--gs-muted); }
.gs .gs-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.gs .gs-card { display: flex; gap: 10px; align-items: flex-start; border: 1.5px solid var(--gs-line); border-radius: 10px; padding: 12px;
  cursor: pointer; background: #fff; margin: 0; font-weight: 400; }
.gs .gs-card.gs-checked { border-color: var(--gs-blue); background: var(--gs-blue-bg); }
.gs .gs-card input { margin-top: 4px; width: 18px; height: 18px; accent-color: var(--gs-blue); flex: none; }
.gs .gs-card input:focus-visible { outline: 3px solid var(--gs-blue-lt); outline-offset: 2px; }
.gs .gs-card b { display: block; }
.gs .gs-card .gs-d { display: block; font-size: 14px; color: var(--gs-muted); }
.gs .gs-tag { display: inline-block; margin-top: 4px; font-size: 12.5px; padding: 1px 8px; border-radius: 999px; background: #fff4c2; color: #5c4b00; }
.gs .gs-helper { display: block; margin-top: 6px; font-size: 13.5px; font-style: italic; color: #2c3e50; }

/* Panels and fields */
.gs .gs-panel { border: 1px solid var(--gs-line); border-radius: 10px; padding: 14px 16px; margin: 12px 0; background: #fff; }
.gs .gs-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.gs .gs-full { grid-column: 1 / -1; }
.gs .gs-field { margin: 0 0 10px; min-width: 0; border: 0; padding: 0; }
.gs .gs-field > label, .gs .gs-field > legend { display: block; font-weight: 600; font-size: 15px; margin-bottom: 4px; padding: 0; width: auto; }
.gs .gs-opt { font-weight: 400; font-size: 13px; color: var(--gs-muted); }
.gs .gs-hint { display: block; font-weight: 400; font-size: 13px; color: var(--gs-muted); }
.gs .gs-hint.gs-hint-inline { display: inline; margin-left: 6px; }
.gs .gs-req { color: var(--gs-err); }
.gs .gs-field input[type=text], .gs .gs-field input[type=email], .gs .gs-field input[type=tel], .gs .gs-field input[type=password],
.gs .gs-field input[type=search], .gs .gs-field input[type=date], .gs .gs-field input[type=number], .gs .gs-field select, .gs .gs-field textarea {
  display: block; width: 100%; font: inherit; padding: 9px 10px; border: 1.5px solid var(--gs-field); border-radius: 6px; background: #fff; min-height: 44px; }
.gs .gs-field textarea { min-height: 110px; resize: vertical; }
.gs .gs-field input:focus, .gs .gs-field select:focus, .gs .gs-field textarea:focus { outline: 3px solid var(--gs-blue-lt); outline-offset: 1px; border-color: var(--gs-blue); }
.gs .gs-filter { margin-bottom: 6px; }
.gs .gs-check { display: flex; gap: 8px; align-items: flex-start; margin: 6px 0; cursor: pointer; font-weight: 400; }
.gs .gs-check input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--gs-blue); flex: none; }
.gs .gs-count { display: block; text-align: right; font-size: 12.5px; color: var(--gs-muted); margin-top: 2px; }
.gs .gs-err-msg { display: none; color: var(--gs-err); font-size: 13.5px; margin: 3px 0 0; }
.gs .gs-invalid .gs-err-msg, .gs .gs-err-msg.gs-shown-err { display: block; }
.gs .gs-invalid input, .gs .gs-invalid select { border-color: var(--gs-err); }
.gs .gs-note { margin: 8px 0 0; padding: 8px 10px; border-radius: 6px; background: #fff8d6; font-size: 14px; color: #4a3d00; }
.gs .gs-note.gs-info { background: #e8eef2; color: #2c3e50; }
.gs .gs-alert { border-left: 6px solid var(--gs-err); background: #fdecea; padding: 10px 14px; border-radius: 6px; margin: 0 0 14px; }
.gs .gs-alert ul { margin: 4px 0 0; padding-left: 20px; }
.gs .gs-alert p { margin: 0; }

/* Buttons */
.gs .gs-actions { display: flex; align-items: center; gap: 10px; margin-top: 24px; flex-wrap: wrap; }
.gs .gs-spacer { flex: 1; }
.gs .gs-btn { font: inherit; font-weight: 700; border-radius: 999px; padding: 10px 24px; min-height: 44px; cursor: pointer;
  border: 2px solid var(--gs-blue); display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.gs .gs-primary { background: var(--gs-blue); color: #fff; }
.gs .gs-primary:hover { background: var(--gs-blue-dk); color: #fff; }
.gs .gs-ghost { background: #fff; color: var(--gs-blue); }
.gs .gs-btn:focus-visible { outline: 3px solid var(--gs-blue-lt); outline-offset: 2px; }
.gs.gs-js .gs-hide { display: none; }

/* Result */
.gs .gs-done { border-left: 6px solid var(--gs-green); background: var(--gs-ok-bg); padding: 16px 18px; border-radius: 8px; margin-bottom: 16px; }
.gs .gs-done h2 { margin: 0 0 6px; font-size: 1.4rem; color: var(--gs-green-dk); font-weight: 700; }
.gs .gs-done p { margin: 0 0 6px; }
.gs .gs-links { border: 1px solid var(--gs-line); border-radius: 10px; padding: 6px 16px 14px; }
.gs .gs-links h3 { font-size: 1.05rem !important; }
.gs .gs-again { margin-top: 18px; }

/* Lists of checkboxes (counties, ethnicity) and committees */
.gs .gs-checkgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0 16px; }
.gs .gs-check.gs-sub { margin-left: 28px; }
.gs .gs-check .gs-hint { margin-top: 1px; }
.gs .gs-pair { gap: 0 16px; }
.gs .gs-pair .gs-field { margin-bottom: 0; }
.gs .gs-done .gs-btn { margin-top: 6px; }

/* Next steps (thank-you page, Volunteer Opportunities) */
.gs .gs-nextsteps { margin-top: 24px; }
.gs .gs-next { border: 1px solid var(--gs-line); border-radius: 10px; padding: 14px 16px; margin: 0 0 12px; background: #fff; }
.gs .gs-next .gs-h3 { margin-bottom: 4px; }
.gs .gs-next-d { margin: 0 0 8px; color: var(--gs-muted); font-size: 15px; }
.gs .gs-next .gs-note { margin: 0 0 8px; }
.gs .gs-next .gs-note ul { margin: 4px 0 0; padding-left: 20px; }
.gs .gs-next-links { margin: 0; padding-left: 20px; }
.gs .gs-next-links li { margin: 4px 0; }

/* Party Request page (/PartyRequest): birthday child blocks */
.gs .gs-child { border-top: 1px solid var(--gs-line); padding-top: 12px; margin-top: 12px; }
.gs .gs-child:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }
.gs .gs-child .gs-h3 { display: flex; align-items: center; gap: 12px; }
.gs .gs-child-remove { font-size: 14px; font-weight: 400; }
.gs.gs-js .gs-child-hidden { display: none; }

@media (max-width: 767px) {
  .gs .gs-doors, .gs .gs-fields, .gs .gs-cards { grid-template-columns: 1fr; }
  .gs .gs-pair { grid-template-columns: 1fr 1fr; }
  .gs .gs-door { min-height: 0; }
}
@media (prefers-reduced-motion: reduce) { .gs * { transition: none !important; animation: none !important; } }
