/* Become a guide page ([ggt_become_a_guide]). Loaded only on that page, after app.css, the flow sheets and
 * how-it-works.css (shared hero, steps, cards, closing row). Restyles the application form through CSS only:
 * every field, name and id stays as the form renderer prints it. Theme tokens, flat fills, hairlines, one accent. */

/* ---------- Hero ---------- */
body.ggt-theme .ggt-bag-alert { display: flex; flex-wrap: wrap; gap: 4px 8px; margin: 0 0 20px; padding: 12px 16px; border: 1px solid #FECDCA; border-radius: var(--ggt-radius-sm); background: var(--ggt-danger-soft); color: var(--ggt-danger-ink); font-size: 15px; font-weight: 600; }
body.ggt-theme .ggt-bag-alert a { color: var(--ggt-danger-ink); text-decoration: underline; text-underline-offset: 2px; }

/* ---------- What you earn ---------- */
body.ggt-theme .ggt-bag-earn__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; }
body.ggt-theme .ggt-bag-earn__copy { min-width: 0; }
body.ggt-theme .ggt-bag-earn .ggt-section__lead { max-width: 520px; }
body.ggt-theme .ggt-bag-earn__stats { grid-template-columns: minmax(0, 1fr); gap: 12px; max-width: none; margin: 8px 0 0; }
body.ggt-theme .ggt-bag-earn__stats .ggt-stats__item { gap: 4px; padding: 18px 20px; border: 1px solid var(--ggt-line); border-radius: var(--ggt-radius-md); background: var(--ggt-paper); }
body.ggt-theme .ggt-bag-earn__stats .ggt-stats__item:last-child:nth-child(odd) { grid-column: auto; }
body.ggt-theme .ggt-bag-earn__stats .ggt-stats__value { font-size: 28px; white-space: nowrap; }
body.ggt-theme .ggt-bag-earn__stats .ggt-stats__label { font-size: 14px; }

body.ggt-theme .ggt-bag-calc { min-width: 0; padding: 24px 20px; border: 1px solid var(--ggt-line); border-radius: 24px; background: var(--ggt-paper); }
body.ggt-theme .ggt-bag-calc__kicker { margin: 0 0 6px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ggt-accent); }
body.ggt-theme .ggt-bag-calc__title { margin: 0 0 20px; font-family: var(--ggt-font-display); font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -0.02em; color: var(--ggt-ink); }
body.ggt-theme .ggt-bag-calc__rows { margin: 0; padding: 0; border-top: 1px solid var(--ggt-line); }
body.ggt-theme .ggt-bag-calc__row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--ggt-line); }
body.ggt-theme .ggt-bag-calc__row dt { min-width: 0; margin: 0; font-size: 15px; line-height: 1.45; color: var(--ggt-ink-2); }
body.ggt-theme .ggt-bag-calc__row dd { flex: none; margin: 0; font-size: 17px; font-weight: 600; color: var(--ggt-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
body.ggt-theme .ggt-bag-calc__row--fee dd { color: var(--ggt-muted); font-weight: 500; }
body.ggt-theme .ggt-bag-calc__row--keep { padding: 18px 0 4px; border-bottom: 0; }
body.ggt-theme .ggt-bag-calc__row--keep dt { font-size: 16px; font-weight: 700; color: var(--ggt-ink); }
body.ggt-theme .ggt-bag-calc__row--keep dd { font-family: var(--ggt-font-display); font-size: 36px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; color: var(--ggt-accent); }
body.ggt-theme .ggt-bag-calc__note { margin: 16px 0 0; padding: 14px 16px; border-radius: var(--ggt-radius-sm); background: var(--ggt-canvas); font-size: 13px; line-height: 1.55; color: var(--ggt-muted); }
@media (min-width: 640px) {
	body.ggt-theme .ggt-bag-earn__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	body.ggt-theme .ggt-bag-calc { padding: 32px; }
}
@media (min-width: 1024px) {
	body.ggt-theme .ggt-bag-earn__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 460px); gap: 64px; align-items: center; }
	body.ggt-theme .ggt-bag-earn__stats { margin-top: 16px; }
	body.ggt-theme .ggt-bag-earn__stats .ggt-stats__value { font-size: 30px; }
	body.ggt-theme .ggt-bag-calc { padding: 40px; }
	body.ggt-theme .ggt-bag-calc__row--keep dd { font-size: 44px; }
}

/* ---------- Steps (on sand) ---------- */
body.ggt-theme .ggt-bag-steps .ggt-hiw-step__detail { border-top-color: var(--ggt-sand-line); }

/* ---------- Guides on Locals Guide ---------- */
body.ggt-theme .ggt-bag-people__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin: 0; padding: 0; list-style: none; }
body.ggt-theme .ggt-bag-person { display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 24px; border: 1px solid var(--ggt-sand-line); border-radius: var(--ggt-radius); background: var(--ggt-paper); }
body.ggt-theme .ggt-bag-person__link { display: flex; align-items: center; gap: 14px; min-width: 0; color: var(--ggt-ink); text-decoration: none; }
body.ggt-theme .ggt-bag-person__link:hover .ggt-bag-person__name { color: var(--ggt-accent); }
body.ggt-theme .ggt-bag-person__img { flex: none; display: block; width: 64px; height: 64px; max-width: none; border-radius: 50%; object-fit: cover; background: var(--ggt-sand); }
body.ggt-theme .ggt-bag-person__text { display: flex; flex-direction: column; min-width: 0; }
body.ggt-theme .ggt-bag-person__name { font-size: 17px; font-weight: 700; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.ggt-theme .ggt-bag-person__meta { font-size: 14px; line-height: 1.4; color: var(--ggt-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.ggt-theme .ggt-bag-person__rating { display: inline-flex; align-items: center; gap: 4px; margin-top: 2px; font-size: 13px; font-weight: 600; color: var(--ggt-ink); }
body.ggt-theme .ggt-bag-person__rating .ggt-icon { width: 14px; height: 14px; fill: var(--ggt-warning); stroke: var(--ggt-warning); }
body.ggt-theme .ggt-bag-person__quote { flex: 1 1 auto; margin: 20px 0 0; padding: 18px 0 0; border: 0; border-top: 1px solid var(--ggt-line); }
body.ggt-theme .ggt-bag-person__quote p { margin: 0 0 12px; font-size: 16px; line-height: 1.6; color: var(--ggt-ink-2); }
body.ggt-theme .ggt-bag-person__quote footer { font-size: 13px; font-weight: 600; color: var(--ggt-muted); }
@media (min-width: 768px) {
	body.ggt-theme .ggt-bag-people__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
	body.ggt-theme .ggt-bag-person { padding: 28px; }
}

/* ---------- Application ---------- */
body.ggt-theme .ggt-bag-apply { scroll-margin-top: var(--ggt-header-h); }
body.ggt-theme .ggt-bag-apply__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
body.ggt-theme .ggt-bag-apply__form { min-width: 0; }

/* Sticky summary card. */
body.ggt-theme .ggt-bag-next { min-width: 0; padding: 24px 20px; border: 1px solid var(--ggt-sand-line); border-radius: var(--ggt-radius); background: var(--ggt-paper); }
body.ggt-theme .ggt-bag-next__title, body.ggt-theme .ggt-bag-next__sub { margin: 0 0 16px; font-size: 18px; line-height: 1.3; }
body.ggt-theme .ggt-bag-next__sub { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--ggt-line); }
body.ggt-theme .ggt-bag-next__steps { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
body.ggt-theme .ggt-bag-next__steps li { display: flex; align-items: flex-start; gap: 12px; margin: 0; font-size: 15px; line-height: 1.5; color: var(--ggt-ink-2); }
body.ggt-theme .ggt-bag-next__num { flex: none; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: var(--ggt-accent-soft); color: var(--ggt-accent); font-size: 13px; font-weight: 700; line-height: 1; }
body.ggt-theme .ggt-bag-next__pay { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
body.ggt-theme .ggt-bag-next__pay li { display: flex; align-items: flex-start; gap: 10px; margin: 0; font-size: 15px; line-height: 1.5; color: var(--ggt-ink); }
body.ggt-theme .ggt-bag-next__pay .ggt-icon { flex: none; width: 20px; height: 20px; margin-top: 1px; padding: 3px; border-radius: 50%; background: var(--ggt-accent-soft); color: var(--ggt-accent); stroke-width: 2.6; }
body.ggt-theme .ggt-bag-next__small { margin: 20px 0 0; font-size: 13px; line-height: 1.55; color: var(--ggt-muted); }
body.ggt-theme .ggt-bag-next__small a { color: var(--ggt-ink-2); text-decoration: underline; text-underline-offset: 2px; }
body.ggt-theme .ggt-bag-next__small a:hover { color: var(--ggt-accent); }
@media (min-width: 1024px) {
	body.ggt-theme .ggt-bag-apply__grid { grid-template-columns: 320px minmax(0, 1fr); gap: 40px; }
	body.ggt-theme .ggt-bag-next { position: sticky; top: calc(var(--ggt-header-h) + 24px); padding: 28px; }
}
@media (min-width: 1200px) {
	body.ggt-theme .ggt-bag-apply__grid { grid-template-columns: 360px minmax(0, 1fr); gap: 48px; }
}

/* The form itself: full width of its column, the hero already says what the intro said. */
body.ggt-theme .ggt-bag .ggt-register { max-width: none; margin: 0; }
body.ggt-theme .ggt-bag .ggt-register__intro { display: none; }
body.ggt-theme .ggt-bag .ggt-register .ggt-notice { margin-bottom: 16px; }

/* Sections: clean cards, the legend sits inside the card with its step badge. */
body.ggt-theme .ggt-bag .ggt-form__section { margin: 0 0 16px; padding: 20px 16px; border: 1px solid var(--ggt-sand-line); border-radius: var(--ggt-radius); background: var(--ggt-paper); }
body.ggt-theme .ggt-bag .ggt-form__legend { float: left; width: 100%; margin: 0 0 4px; padding: 0 0 16px; border-bottom: 1px solid var(--ggt-line); font-size: 19px; }
body.ggt-theme .ggt-bag .ggt-form__legend + * { clear: both; }
body.ggt-theme .ggt-bag .ggt-form__step { width: 30px; height: 30px; flex: none; }
body.ggt-theme .ggt-bag .ggt-form__note { font-size: 14px; }
body.ggt-theme .ggt-bag .ggt-form__legend + .ggt-form__note { margin-top: 16px; }
@media (min-width: 640px) {
	body.ggt-theme .ggt-bag .ggt-form__section { padding: 28px; }
}

/* Languages: toggle chips. The real checkbox stays in the chip (visually hidden, focusable, clickable via the label). */
body.ggt-theme .ggt-bag .ggt-checks { gap: 8px; margin-top: 4px; }
body.ggt-theme .ggt-bag .ggt-checks .ggt-chip { position: relative; display: inline-flex; align-items: center; gap: 0; min-height: 40px; padding: 8px 14px; border: 1px solid var(--ggt-line-strong); border-radius: var(--ggt-pill); background: var(--ggt-paper); color: var(--ggt-ink-2); font-size: 14px; font-weight: 500; line-height: 1.2; cursor: pointer; user-select: none; transition: border-color .15s, background-color .15s, color .15s; }
body.ggt-theme .ggt-bag .ggt-checks .ggt-chip input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
body.ggt-theme .ggt-bag .ggt-checks .ggt-chip span::before { content: ""; display: inline-block; width: 0; height: 9px; margin-right: 0; border: solid transparent; border-width: 0 2px 2px 0; transform: rotate(45deg) translateY(-2px); vertical-align: middle; transition: width .15s, margin-right .15s; }
body.ggt-theme .ggt-bag .ggt-checks .ggt-chip:hover { border-color: var(--ggt-accent); color: var(--ggt-accent); }
body.ggt-theme .ggt-bag .ggt-checks .ggt-chip:has(input:checked) { border-color: var(--ggt-accent); background: var(--ggt-accent); color: #fff; }
body.ggt-theme .ggt-bag .ggt-checks .ggt-chip:has(input:checked) span::before { width: 5px; margin-right: 9px; border-color: #fff; }
body.ggt-theme .ggt-bag .ggt-checks .ggt-chip:has(input:focus-visible) { outline: 2px solid var(--ggt-accent); outline-offset: 2px; }
body.ggt-theme .ggt-bag .ggt-field--error .ggt-checks .ggt-chip { border-color: var(--ggt-danger); }

/* File inputs: a dashed drop zone around the real input (drag and drop works on the input itself). */
body.ggt-theme .ggt-bag .ggt-file { display: block; width: 100%; min-height: 88px; padding: 24px 16px; border: 1.5px dashed var(--ggt-line-strong); border-radius: var(--ggt-radius-md); background: var(--ggt-canvas); color: var(--ggt-muted); font-size: 14px; line-height: 40px; cursor: pointer; transition: border-color .15s, background-color .15s; }
body.ggt-theme .ggt-bag .ggt-file:hover { border-color: var(--ggt-accent); background: var(--ggt-accent-soft); }
body.ggt-theme .ggt-bag .ggt-file:focus-visible { outline: 2px solid var(--ggt-accent); outline-offset: 2px; }
body.ggt-theme .ggt-bag .ggt-file::file-selector-button { height: 40px; margin-right: 14px; padding: 0 16px; border: 1px solid var(--ggt-accent); border-radius: var(--ggt-radius-sm); background: var(--ggt-paper); color: var(--ggt-accent); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
body.ggt-theme .ggt-bag .ggt-file:hover::file-selector-button { background: var(--ggt-accent); color: #fff; }
body.ggt-theme .ggt-bag .ggt-field--error .ggt-file { border-color: var(--ggt-danger); background: #FFFBFA; }

/* Payout method: three option cards. */
body.ggt-theme .ggt-bag .ggt-segmented { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; margin-top: 16px; }
body.ggt-theme .ggt-bag .ggt-segmented__opt { min-height: 56px; padding: 14px 16px; border-color: var(--ggt-line-strong); border-radius: var(--ggt-radius-md); background: var(--ggt-paper); font-weight: 600; color: var(--ggt-ink); }
body.ggt-theme .ggt-bag .ggt-segmented__opt input { flex: none; width: 18px; height: 18px; margin: 0; accent-color: var(--ggt-accent); }
body.ggt-theme .ggt-bag .ggt-segmented__opt:hover { border-color: var(--ggt-accent); }
body.ggt-theme .ggt-bag .ggt-segmented__opt:has(input:checked) { border-color: var(--ggt-accent); background: var(--ggt-accent-soft); color: var(--ggt-accent); }
body.ggt-theme .ggt-bag .ggt-segmented__opt:has(input:focus-visible) { outline: 2px solid var(--ggt-accent); outline-offset: 2px; }
@media (min-width: 560px) {
	body.ggt-theme .ggt-bag .ggt-segmented { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Terms + submit: the last card. */
body.ggt-theme .ggt-bag .ggt-form__footer { gap: 20px; padding: 20px 16px; border: 1px solid var(--ggt-sand-line); border-radius: var(--ggt-radius); background: var(--ggt-paper); }
body.ggt-theme .ggt-bag .ggt-form__footer .ggt-field { flex: 1 1 auto; }
body.ggt-theme .ggt-bag .ggt-form__footer .ggt-check { font-size: 15px; color: var(--ggt-ink-2); }
body.ggt-theme .ggt-bag .ggt-form__footer .ggt-btn { flex: none; }
@media (min-width: 640px) {
	body.ggt-theme .ggt-bag .ggt-form__footer { padding: 24px 28px; }
}

/* Signed-in guides: the status screen, centred. */
body.ggt-theme .ggt-bag--status .ggt-bag-status { padding-top: 48px; }
body.ggt-theme .ggt-bag--status .ggt-register--status { max-width: none; }

/* Hero on phones: the page title fits two lines. */
@media (max-width: 479px) {
	body.ggt-theme .ggt-bag-hero .ggt-hero__title { font-size: 40px; }
}