/*
 * FFJ employer portal (Batch 06). Extends ffj.css on the same Batch 03 tokens.
 * Radii: controls 10px, cards 16px, chips pill. Flat; no decorative motion.
 */

.ffj-ui.ffj-portal { display: grid; gap: 1.5rem; width: 100%; max-width: 46rem; margin: 0 auto; padding: 1rem 0 2rem; }
.ffj-ui.ffj-portal--dashboard { max-width: var(--width-content, 75rem); }
.ffj-ui.ffj-portal--dashboard .ffj-form { max-width: var(--width-form, 35rem); }
.ffj-ui.ffj-portal h1 { margin: 0; font-size: var(--type-h1, clamp(2.125rem, 1.7rem + 1.9vw, 3.25rem)); font-weight: 800; line-height: 1.1; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.ffj-ui.ffj-portal h2 { margin: 0 0 0.75rem; font-size: clamp(1.375rem, 1.25rem + 0.55vw, 1.75rem); font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.ffj-ui.ffj-portal h3 { margin: 0; font-size: 1.125rem; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.ffj-ui.ffj-portal section { min-width: 0; }
.ffj-ui .ffj-lead { margin: 0; font-size: clamp(1.0625rem, 1.03rem + 0.2vw, 1.1875rem); line-height: 1.6; color: var(--ffj-ink-2); }
.ffj-ui .ffj-meta-line { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; margin: 0; color: var(--ffj-ink-2); font-weight: 600; overflow-wrap: anywhere; }
.ffj-ui .ffj-dev-tag { font-size: 0.875rem; font-weight: 600; color: var(--warning, #8A4600); }

/* Forms */
.ffj-ui .ffj-form { display: grid; gap: 1.25rem; width: 100%; max-width: var(--width-form, 35rem); }
.ffj-ui .ffj-form--inline { display: inline-flex; width: auto; max-width: none; gap: 0; margin: 0; }
.ffj-ui .ffj-req { font-weight: 400; color: var(--ffj-ink-2); }
.ffj-ui .ffj-textarea { min-height: 6rem; line-height: 1.5; resize: vertical; }
.ffj-ui .ffj-input[type="file"] { padding: 0.5rem; min-height: auto; }
.ffj-ui .ffj-input--date { max-width: 14rem; }
/* 0.15.0 accessibility pass: Chrome focuses a segment inside a date input, so the field itself shows the focus ring. */
.ffj-ui .ffj-input--date:focus, .ffj-ui .ffj-input--date:focus-within { outline: 3px solid var(--ffj-ink); outline-offset: 2px; }
.ffj-ui .ffj-field--error { padding-left: 0.875rem; border-left: 4px solid var(--error, #B42318); }
.ffj-ui .ffj-error-text { margin: 0; color: var(--error, #B42318); font-size: 0.9375rem; font-weight: 600; line-height: 1.4; }
.ffj-ui .ffj-choices { display: grid; gap: 0; }
@media (min-width: 640px) { .ffj-ui .ffj-choices--cols { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; } }
.ffj-ui .ffj-choice label { cursor: pointer; overflow-wrap: anywhere; }
.ffj-ui .ffj-choice label a { text-decoration: underline; text-underline-offset: 0.18em; }
.ffj-ui .ffj-field-group { display: grid; gap: 0.5rem; }
.ffj-ui .ffj-inline-fields { display: grid; gap: 1rem; }
@media (min-width: 560px) { .ffj-ui .ffj-inline-fields { grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); align-items: start; } }
.ffj-ui .ffj-inline-fields .ffj-input--short { max-width: none; }
.ffj-ui .ffj-password-toggle { align-self: flex-start; min-height: 2.75rem; }
.ffj-ui .ffj-actions-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin: 0; }
.ffj-ui .ffj-actions-row--form { padding-top: 0.5rem; }
.ffj-ui .ffj-turnstile { display: grid; gap: 0.5rem; }
.ffj-ui .ffj-turnstile .cf-turnstile { min-height: 65px; max-width: 100%; }

/* Error summary: focus target at the top of a form. */
.ffj-ui .ffj-error-summary { padding: 1rem 1.25rem; border: 3px solid var(--error, #B42318); border-radius: var(--ffj-r-control); background: var(--error-bg, #FDECEA); }
.ffj-ui .ffj-error-summary__title { margin: 0 0 0.5rem; font-size: 1.125rem; }
.ffj-ui .ffj-error-summary ul { margin: 0; padding-left: 1.25rem; }
.ffj-ui .ffj-error-summary li { margin: 0.25rem 0; }
.ffj-ui .ffj-error-summary a { color: var(--error, #B42318); font-weight: 600; text-decoration: underline; text-underline-offset: 0.18em; }
.ffj-ui .ffj-error-summary p { margin: 0 0 0.5rem; }
/* 0.20.0 (owner approval 2026-10-16, N4): "One quick check" on the organization form. Information, not an error. */
.ffj-ui .ffj-quick-check { display: grid; gap: 0.75rem; padding: 1rem 1.25rem; border: 1px solid transparent; border-left: 4px solid var(--info, #1D4E89); border-radius: var(--ffj-r-control); background: var(--info-bg, #E8F0FA); }
.ffj-ui .ffj-quick-check > * { margin: 0; }
.ffj-ui .ffj-quick-check__title { font-size: 1.125rem; }
.ffj-ui .ffj-quick-check .ffj-field { margin: 0; }
@media (forced-colors: active) { .ffj-ui .ffj-quick-check { border: 1px solid CanvasText; border-left-width: 4px; } }

/* Dashboard chrome */
.ffj-ui .ffj-portal-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; padding-bottom: 1rem; border-bottom: 1px solid var(--ffj-border); }
.ffj-ui .ffj-portal-nav ul { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.ffj-ui .ffj-portal-nav a.ffj-tab, .ffj-ui .ffj-steps a.ffj-tab { text-decoration: none; }
.ffj-ui .ffj-portal-nav a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0.5rem 1rem; border: 1px solid var(--ffj-border-strong); border-radius: var(--ffj-r-pill); color: var(--ffj-ink); font-weight: 600; text-decoration: none; }
.ffj-ui .ffj-portal-nav a:hover { background: var(--ffj-teal-tint); color: var(--ffj-ink); }
.ffj-ui .ffj-portal-nav a[aria-current="page"] { background: var(--ffj-teal-deep); border-color: var(--ffj-teal-deep); color: #FFFFFF; }
.ffj-ui .ffj-org-switch { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.75rem; }
.ffj-ui .ffj-org-switch .ffj-field { min-width: min(100%, 18rem); }
.ffj-ui .ffj-confirm-reminder > div { display: grid; gap: 0.5rem; }

/* Cards, lists, stats */
.ffj-ui .ffj-card-title { margin: 0; font-size: 1.125rem; font-weight: 700; overflow-wrap: anywhere; }
.ffj-ui .ffj-card-meta { margin: 0; font-size: 0.875rem; color: var(--ffj-muted); }
.ffj-ui .ffj-joblist { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.ffj-ui .ffj-dash-job { display: grid; gap: 0.625rem; }
.ffj-ui .ffj-dash-job__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; }
.ffj-ui .ffj-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr)); gap: 0.75rem; margin: 0 0 1rem; }
.ffj-ui .ffj-stats > div { padding: 1rem; background: var(--ffj-surface-alt); border-radius: var(--ffj-r-card); }
.ffj-ui .ffj-stats dt { font-size: 0.875rem; font-weight: 600; color: var(--ffj-ink-2); }
.ffj-ui .ffj-stats dd { margin: 0.25rem 0 0; font-size: 1.75rem; font-weight: 800; line-height: 1.1; }
.ffj-ui .ffj-review-message { padding: 0.875rem 1rem; background: var(--ffj-surface-alt); border-radius: var(--ffj-r-control); }
.ffj-ui .ffj-review-message p { margin: 0 0 0.375rem; }
.ffj-ui .ffj-review-message p:last-child { margin-bottom: 0; }

/* Hiring timeline (0.13.0): described choices in the job editor and the dashboard job-card facts.
   Status lines always carry text and an icon, never color alone. */
.ffj-ui .ffj-field--described-choices .ffj-choice { padding: 0.625rem 0; }
.ffj-ui .ffj-choice__title { display: block; font-weight: 600; }
.ffj-ui .ffj-choice__desc { display: block; margin-top: 0.125rem; font-size: 0.9375rem; line-height: 1.45; color: var(--ffj-ink-2); }
.ffj-ui .ffj-card-meta__sep { margin: 0 0.25rem; }
.ffj-ui .ffj-timeline-facts { display: flex; flex-wrap: wrap; gap: 0.25rem 1.5rem; margin: 0; font-size: 0.9375rem; line-height: 1.45; }
.ffj-ui .ffj-timeline-facts > div { display: flex; flex-wrap: wrap; gap: 0 0.375rem; min-width: 0; }
.ffj-ui .ffj-timeline-facts dt { color: var(--ffj-ink-2); font-weight: 400; }
.ffj-ui .ffj-timeline-facts dt::after { content: ":"; }
.ffj-ui .ffj-timeline-facts dd { margin: 0; font-weight: 600; color: var(--ffj-ink); overflow-wrap: anywhere; }
.ffj-ui .ffj-timeline-status { display: flex; align-items: flex-start; gap: 0.5rem; margin: 0; padding: 0.625rem 0.875rem; background: var(--ffj-surface-alt); border: 1px solid var(--ffj-border); border-radius: var(--ffj-r-control); font-size: 0.9375rem; line-height: 1.45; }
.ffj-ui .ffj-timeline-status .ffj-icon { margin-top: 0.15rem; }
.ffj-ui .ffj-timeline-status--due { background: var(--ffj-teal-tint); border-color: var(--ffj-teal); }
.ffj-ui .ffj-timeline-status--due .ffj-icon { color: var(--ffj-teal); }
.ffj-ui .ffj-timeline-status--overdue { background: var(--warning-bg, #FFF1DB); border-color: var(--warning, #8A4600); }
.ffj-ui .ffj-timeline-status--overdue .ffj-icon { color: var(--warning, #8A4600); }
.ffj-ui .ffj-activity { display: grid; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.ffj-ui .ffj-activity li { padding: 0.5rem 0; border-bottom: 1px solid var(--ffj-border); overflow-wrap: anywhere; }
.ffj-ui .ffj-activity__when { display: block; font-size: 0.875rem; color: var(--ffj-muted); }
.ffj-ui .ffj-next-step { background: var(--ffj-sun-tint); border-color: #E9D48F; }
.ffj-ui .ffj-report-target { display: grid; gap: 0.25rem; }
.ffj-ui .ffj-report-target p { margin: 0; overflow-wrap: anywhere; }
.ffj-ui .ffj-report-target__title { font-weight: 700; }

/* Status chips: icon + word + color (never color alone). */
.ffj-ui .ffj-status { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 1.75rem; padding: 0.25rem 0.75rem; border: 1px solid transparent; border-radius: var(--ffj-r-pill); font-size: 0.875rem; font-weight: 600; line-height: 1.25; white-space: nowrap; }
.ffj-ui .ffj-status-active { background: var(--success-bg, #E6F4EA); color: var(--success, #1B6B3A); border-color: var(--success, #1B6B3A); }
.ffj-ui .ffj-status-pending { background: var(--warning-bg, #FFF1DB); color: var(--warning, #8A4600); border-color: var(--warning, #8A4600); }
.ffj-ui .ffj-status-draft { background: var(--ffj-surface); color: var(--ffj-ink); border-color: var(--ffj-border-strong); }
.ffj-ui .ffj-status-expired { background: var(--ffj-sunken); color: var(--ffj-ink-2); border-color: var(--ffj-border-strong); }
.ffj-ui .ffj-status-rejected { background: var(--error-bg, #FDECEA); color: var(--error, #B42318); border-color: var(--error, #B42318); }

/* Stepped job form */
.ffj-ui .ffj-steps { display: grid; gap: 0.5rem; }
.ffj-ui .ffj-steps__status { margin: 0; font-weight: 700; }
.ffj-ui .ffj-steps ol { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.ffj-ui .ffj-steps a, .ffj-ui .ffj-steps li > span { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0.375rem 0.875rem; border: 1px solid var(--ffj-border-strong); border-radius: var(--ffj-r-pill); font-size: 0.9375rem; font-weight: 600; text-decoration: none; }
.ffj-ui .ffj-steps a { color: var(--ffj-teal); background: var(--ffj-surface); }
.ffj-ui .ffj-steps a:hover { background: var(--ffj-teal-tint); }
.ffj-ui .ffj-steps li > span { color: var(--ffj-muted); background: var(--ffj-surface-alt); }
.ffj-ui .ffj-steps a[aria-current="step"] { background: var(--ffj-teal-deep); border-color: var(--ffj-teal-deep); color: #FFFFFF; }
@media (max-width: 639px) {
	/* Phones (closeout 2026-10-02): numbers only; the name stays in the accessible name and the status line names the current step. */
	.ffj-ui .ffj-steps ol { gap: 0.375rem; }
	.ffj-ui .ffj-steps a, .ffj-ui .ffj-steps li > span { min-width: 2.75rem; justify-content: center; padding: 0.375rem 0.5rem; font-size: 0.9375rem; }
	.ffj-ui .ffj-steps__name { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
}
.ffj-ui .ffj-tip { display: flex; align-items: flex-start; gap: 0.625rem; margin: 0; padding: 0.875rem 1rem; background: var(--ffj-sun-tint); border-radius: var(--ffj-r-control); line-height: 1.5; }
.ffj-ui .ffj-tip .ffj-icon { margin-top: 0.2rem; color: var(--ffj-ink); }
/* 0.17.0 (owner request 2026-10-08): the job-posting workflow is one centered column. Input steps are fluid up to
   54rem (864px), the review step (full job preview + application summary) up to 66rem; forms use the column's full
   width. Only the column is centered: headings, labels, help, fields and errors stay left-aligned. */
.ffj-ui .ffj-job-flow { display: grid; gap: 1.5rem; width: 100%; max-width: 54rem; margin-inline: auto; min-width: 0; text-align: left; }
.ffj-ui .ffj-job-flow--review { max-width: 66rem; }
.ffj-ui.ffj-portal--dashboard .ffj-job-flow .ffj-form { max-width: none; }
.ffj-ui .ffj-job-flow .ffj-form > .ffj-field, .ffj-ui .ffj-job-flow .ffj-form > .ffj-fieldset { min-width: 0; }
@media (max-width: 479px) { .ffj-ui .ffj-job-flow { gap: 1.25rem; } }
.ffj-ui .ffj-preview-frame { display: grid; gap: 1.5rem; padding: var(--space-card, 1.25rem); border: 2px dashed var(--ffj-border-strong); border-radius: var(--ffj-r-card); min-width: 0; }
/* Post-QA polish 2026-10-02: the frame's own heading labels the preview; it is not a second job title. */
.ffj-ui.ffj-portal .ffj-preview-frame__heading { display: flex; align-items: center; gap: 0.5rem; margin: 0; padding-bottom: 0.75rem; border-bottom: 1px solid var(--ffj-border); font-size: 1rem; font-weight: 700; line-height: 1.35; color: var(--ffj-ink-2); }
.ffj-ui .ffj-preview-frame__heading .ffj-icon { color: var(--info, #1D4E89); }

@media (max-width: 479px) {
	.ffj-ui.ffj-portal { gap: 1.25rem; padding-top: 0.5rem; }
	.ffj-ui .ffj-actions-row > .ffj-btn:not(.ffj-btn-sm), .ffj-ui .ffj-actions-row > a.ffj-btn:not(.ffj-btn-sm) { width: 100%; }
}
@media (forced-colors: active) {
	.ffj-ui .ffj-status, .ffj-ui .ffj-portal-nav a[aria-current="page"], .ffj-ui .ffj-steps a[aria-current="step"] { border: 2px solid CanvasText; }
}
/* ------------------------------------------------------------------
 * Batch 09: job-seeker account screens.
 * ------------------------------------------------------------------ */
/* Closeout 2026-10-02: one focused column for job-seeker screens (forms stay 35rem inside it). */
.ffj-ui.ffj-portal--seeker_dashboard { max-width: 48rem; }
.ffj-ui.ffj-portal--seeker_dashboard .ffj-form { max-width: var(--width-form, 35rem); }
.ffj-ui.ffj-portal--youth_rules { max-width: var(--width-reading, 42rem); }
.ffj-ui .ffj-portal-nav a, .ffj-ui .ffj-saved__item .ffj-btn, .ffj-ui .ffj-exp .ffj-btn { min-height: 44px; }
.ffj-ui .ffj-youth-ack { display: grid; gap: 0.5rem; }
.ffj-ui .ffj-youth-ack__more summary { min-height: 44px; display: flex; align-items: center; font-weight: 600; color: var(--ffj-teal); cursor: pointer; }
.ffj-ui .ffj-youth-ack__more p { margin: 0.5rem 0 0; }
.ffj-ui .ffj-saved, .ffj-ui .ffj-exp-list { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.ffj-ui .ffj-saved__item { display: grid; gap: 0.375rem; }
.ffj-ui .ffj-saved__title { margin: 0; font-size: 1.125rem; font-weight: 700; overflow-wrap: anywhere; }
.ffj-ui .ffj-saved__org, .ffj-ui .ffj-saved__meta, .ffj-ui .ffj-saved__when { margin: 0; color: var(--ffj-ink-2); }
.ffj-ui .ffj-saved__when { font-size: 0.875rem; color: var(--ffj-muted); }
.ffj-ui .ffj-saved__item--unavailable { background: var(--ffj-surface-alt); }
.ffj-ui .ffj-exp { display: grid; gap: 0.25rem; padding-bottom: 1rem; border-bottom: 1px solid var(--ffj-border); }
.ffj-ui .ffj-exp:last-child { border-bottom: 0; }
.ffj-ui .ffj-exp__title, .ffj-ui .ffj-exp__meta { margin: 0; overflow-wrap: anywhere; }
.ffj-ui .ffj-exp__meta { font-size: 0.875rem; color: var(--ffj-ink-2); }
.ffj-ui .ffj-resume { display: grid; gap: 0.5rem; max-width: var(--width-reading, 42rem); }
.ffj-ui .ffj-resume__name { margin: 0; }
.ffj-ui .ffj-resume h3 { margin: 0.75rem 0 0.25rem; padding-bottom: 0.25rem; border-bottom: 1px solid var(--ffj-border); }
.ffj-ui .ffj-resume__contact, .ffj-ui .ffj-resume__type, .ffj-ui .ffj-resume__when { color: var(--ffj-ink-2); }
.ffj-ui .ffj-resume__list { margin: 0; padding-left: 1.25rem; display: grid; gap: 0.5rem; }
.ffj-ui .ffj-danger-zone { border: 2px solid var(--error, #B42318); }
.ffj-ui .ffj-btn-danger, .ffj-ui .ffj-btn-danger:focus { background: var(--error, #B42318); color: #FFFFFF; border-color: var(--error, #B42318); }
.ffj-ui .ffj-btn-danger:hover { background: #8F1C13; color: #FFFFFF; border-color: #8F1C13; }
@media (forced-colors: active) {
	.ffj-ui .ffj-danger-zone, .ffj-ui .ffj-btn-danger { border: 2px solid CanvasText; }
}

/* ------------------------------------------------------------------ Batch 10: FFJ Apply */
.ffj-ui .ffj-h2-lead { margin-top: var(--ffj-space-6, 32px); }
.ffj-ui .ffj-app-snapshot .ffj-dl { margin: 0; }
.ffj-ui .ffj-dl--stack > div { display: block; padding: 8px 0; border-bottom: 1px solid var(--ffj-border, #DDE3E1); }
.ffj-ui .ffj-dl--stack > div:last-child { border-bottom: 0; }
.ffj-ui .ffj-dl--stack dt { font-weight: 600; margin-bottom: 4px; }
.ffj-ui .ffj-dl--stack dd { margin: 0; overflow-wrap: anywhere; }
.ffj-ui .ffj-app-item .ffj-card-title { font-size: 1.125rem; margin: 0 0 4px; }
.ffj-ui .ffj-app-list { display: grid; gap: 12px; padding: 0; list-style: none; }
.ffj-ui .ffj-draft-note { color: var(--warning, #8A4600); font-weight: 600; }
.ffj-ui .ffj-card h3 { margin-top: 16px; }
.ffj-ui .ffj-card select.ffj-input { max-width: 100%; }
.ffj-ui .ffj-meta { color: var(--ffj-ink-2, #3D4A47); }
.ffj-ui [data-ffj-inline-choices] .ffj-choices { display: flex; flex-wrap: wrap; gap: 0 24px; }
.ffj-ui .ffj-form > .ffj-card { display: grid; gap: 1rem; align-content: start; }
.ffj-ui .ffj-form > .ffj-card > h2, .ffj-ui .ffj-form > .ffj-card > h3 { margin-bottom: 0; }

/* ------------------------------------------------------------------ Batch 11: recruiting workspace */
.ffj-ui .ffj-table-wrap { overflow-x: auto; max-width: 100%; }
.ffj-ui .ffj-metrics { width: 100%; border-collapse: collapse; margin: 0 0 1rem; }
.ffj-ui .ffj-metrics caption { text-align: left; font-weight: 600; padding: 0 0 0.5rem; color: var(--ffj-ink-2, #3D4A47); }
.ffj-ui .ffj-metrics th, .ffj-ui .ffj-metrics td { text-align: left; vertical-align: top; padding: 0.75rem 0.5rem; border-bottom: 1px solid var(--ffj-border, #DDE3E1); }
.ffj-ui .ffj-metrics td { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ffj-ui .ffj-metrics td[colspan] { font-weight: 400; white-space: normal; }
.ffj-ui .ffj-metrics thead th { font-size: 0.875rem; }
.ffj-ui .ffj-metrics__def { display: block; font-weight: 400; font-size: 0.875rem; color: var(--ffj-ink-2, #3D4A47); margin-top: 0.25rem; }
.ffj-ui .ffj-applicant__answers { list-style: none; margin: 0.5rem 0; padding: 0; display: grid; gap: 0.25rem; }
.ffj-ui .ffj-applicant__q { color: var(--ffj-ink-2, #3D4A47); }
.ffj-ui .ffj-applicant__chips { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.ffj-ui .ffj-history li, .ffj-ui .ffj-notes > li { margin-bottom: 0.5rem; }
.ffj-ui .ffj-notes > li { padding-bottom: 0.5rem; border-bottom: 1px solid var(--ffj-border, #DDE3E1); }
.ffj-ui .ffj-notes p { margin: 0 0 0.25rem; overflow-wrap: anywhere; }
.ffj-ui .ffj-form--filter { margin: 0 0 1rem; }

/* ------------------------------------------------------------------ Closeout 2026-10-02: signed-in polish */
/* Overview cards: two columns where there is room, one on phones; actions sit at the bottom. */
.ffj-ui .ffj-dash-cards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); }
.ffj-ui .ffj-dash-card { display: flex; flex-direction: column; gap: 0.5rem; }
.ffj-ui .ffj-dash-card > h2 { margin-bottom: 0.25rem; }
.ffj-ui .ffj-dash-card > p { margin: 0; }
.ffj-ui .ffj-dash-card > .ffj-actions-row, .ffj-ui .ffj-dash-card > p:last-child { margin-top: auto; padding-top: 0.5rem; }
/* List titles in saved jobs and applications share one size (the portal h2 rule made saved titles larger). */
.ffj-ui.ffj-portal .ffj-saved__title, .ffj-ui.ffj-portal .ffj-app-item .ffj-card-title { margin: 0 0 0.25rem; font-size: 1.25rem; line-height: 1.3; }
/* Snapshot sections are h3 under "What you sent" / "Review your application" / "What they sent". */
.ffj-ui .ffj-app-snapshot > h3:first-child { margin-top: 0; font-size: 1.25rem; }
.ffj-ui .ffj-app-snapshot h4 { margin: 1rem 0 0.25rem; font-size: 1rem; font-weight: 700; }
/* Back links above a page title. */
.ffj-ui .ffj-backlink { margin: 0; }
.ffj-ui .ffj-backlink a { display: inline-flex; align-items: center; gap: 0.25rem; min-height: 2.75rem; font-weight: 600; text-decoration: none; }
.ffj-ui .ffj-backlink a:hover { text-decoration: underline; text-underline-offset: 0.18em; }
/* Native disclosures (age range update, folded youth guidance): keep the browser marker; 44px rows. */
.ffj-ui .ffj-disclosure > summary, .ffj-ui .ffj-youth__collapse > summary { display: list-item; padding: 0.625rem 0; font-weight: 600; color: var(--ffj-teal); cursor: pointer; }
.ffj-ui .ffj-disclosure[open] > summary, .ffj-ui .ffj-youth__collapse[open] > summary { margin-bottom: 0.75rem; }
.ffj-ui .ffj-youth__collapse { display: grid; gap: 0.75rem; }
/* Phones: compact dashboard tabs (two rows instead of three); targets stay 44px. */
@media (max-width: 639px) {
	.ffj-ui .ffj-portal-nav ul { gap: 0.375rem; }
	.ffj-ui .ffj-portal-nav a { padding: 0.375rem 0.75rem; font-size: 0.9375rem; }
	.ffj-ui .ffj-portal-head { padding-bottom: 0.75rem; }
}
/* Employer overview to-do list (closeout 2026-10-02). */
.ffj-ui .ffj-todo { display: grid; gap: 0.5rem; margin: 0; padding-left: 1.25rem; }
.ffj-ui .ffj-todo a { font-weight: 600; }

/* ------------------------------------------------------------------ Post-QA polish 2026-10-02 */
/* Organization settings: one focused column, a card per area, titled field groups. */
.ffj-ui .ffj-org-page { display: grid; gap: 1.5rem; width: 100%; max-width: 40rem; min-width: 0; }
.ffj-ui .ffj-org-page > .ffj-notice, .ffj-ui .ffj-org-page > form, .ffj-ui .ffj-org-page > p { margin: 0; }
.ffj-ui .ffj-org-page .ffj-meta-line a { font-weight: 600; }
.ffj-ui .ffj-org-jump { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 1.25rem; padding: 0.5rem 1rem; background: var(--ffj-surface-alt); border-radius: var(--ffj-r-control); }
.ffj-ui .ffj-org-jump__label { margin: 0; font-size: 0.875rem; font-weight: 700; color: var(--ffj-ink-2); }
.ffj-ui .ffj-org-jump ul { display: flex; flex-wrap: wrap; gap: 0 1.25rem; margin: 0; padding: 0; list-style: none; }
.ffj-ui .ffj-org-jump a { display: inline-flex; align-items: center; min-height: 2.75rem; font-weight: 600; text-decoration: underline; text-underline-offset: 0.18em; }
.ffj-ui .ffj-org-section { display: grid; gap: 1.25rem; min-width: 0; scroll-margin-top: 1rem; }
.ffj-ui .ffj-section-head { display: grid; gap: 0.375rem; }
.ffj-ui.ffj-portal .ffj-section-head > h2, .ffj-ui.ffj-portal .ffj-org-section > h2 { margin: 0; }
.ffj-ui .ffj-form-intro { margin: 0; }
.ffj-ui .ffj-form-group { display: grid; gap: 1rem; min-width: 0; padding-top: 1.25rem; border-top: 1px solid var(--ffj-border); }
.ffj-ui .ffj-form-intro + .ffj-form-group, .ffj-ui .ffj-form > .ffj-form-group:first-of-type { padding-top: 0; border-top: 0; }
.ffj-ui.ffj-portal .ffj-form-group__title { margin: 0; font-size: 1.125rem; font-weight: 700; line-height: 1.3; letter-spacing: 0; }
.ffj-ui .ffj-form-group > .ffj-notice, .ffj-ui .ffj-form-group > .ffj-help { margin: 0; }
.ffj-ui .ffj-form-group__title + .ffj-help { margin-top: -0.5rem; }
@media (min-width: 560px) {
	/* Inputs line up along the bottom even when a label wraps (no per-field help in these rows). */
	.ffj-ui .ffj-inline-fields--pair { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; }
	.ffj-ui .ffj-inline-fields--address { grid-template-columns: minmax(0, 2fr) minmax(0, 1.5fr) minmax(0, 1.25fr); align-items: end; }
}
.ffj-ui .ffj-team { display: grid; margin: 0; padding: 0; list-style: none; }
.ffj-ui .ffj-team li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem; min-height: 3rem; padding: 0.5rem 0; border-bottom: 1px solid var(--ffj-border); }
.ffj-ui .ffj-team li:last-child { border-bottom: 0; }
.ffj-ui .ffj-team__name { font-weight: 600; overflow-wrap: anywhere; }
.ffj-ui .ffj-team__role { display: inline-flex; align-items: center; min-height: 1.75rem; padding: 0.125rem 0.75rem; border: 1px solid var(--ffj-border-strong); border-radius: var(--ffj-r-pill); font-size: 0.875rem; font-weight: 600; color: var(--ffj-ink-2); }
.ffj-ui .ffj-org-more { margin: 0; }
/* Logo upload (0.17.1): the control, then the current logo, a logo waiting for review and the live
 * preview of a chosen file beside it when there is room (stacked on phones). Each logo keeps its shape. */
.ffj-ui .ffj-logo-field { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1rem 1.5rem; min-width: 0; }
.ffj-ui .ffj-logo-field > .ffj-field { flex: 1 1 16rem; min-width: 0; }
.ffj-ui .ffj-logo-panel { display: flex; flex: 1 1 14rem; flex-wrap: wrap; align-items: flex-start; gap: 1rem; min-width: 0; max-width: 100%; }
.ffj-ui .ffj-logo-figure { display: grid; flex: 1 1 12rem; gap: 0.5rem; min-width: 0; max-width: 100%; margin: 0; padding: 0.75rem; border: 1px solid var(--ffj-border); border-radius: var(--ffj-r-control); background: var(--ffj-surface-alt); }
.ffj-ui .ffj-logo-figure--pending { border-style: dashed; border-color: var(--ffj-border-strong); }
.ffj-ui .ffj-logo-figure--preview { border-color: var(--ffj-teal); border-width: 2px; }
.ffj-ui .ffj-logo-figure__label { margin: 0; font-size: 0.875rem; font-weight: 700; line-height: 1.35; color: var(--ffj-ink); }
.ffj-ui .ffj-logo-figure__media { width: 100%; min-width: 0; }
.ffj-ui .ffj-logo-figure .ffj-help, .ffj-ui .ffj-logo-figure__actions { margin: 0; }
.ffj-ui .ffj-logo-figure .ffj-help.ffj-logo-figure__problem { font-weight: 600; color: var(--danger, #B42318); }
@media (max-width: 479px) {
	.ffj-ui .ffj-org-page { gap: 1.25rem; }
	.ffj-ui .ffj-org-jump { padding: 0.25rem 0.75rem; }
}
/* Launch growth foundation (2026-10-02): saved searches and weekly job alerts. */
.ffj-ui .ffj-alerts { display: grid; gap: 1rem; margin: 0 0 1.5rem; padding: 0; list-style: none; }
.ffj-ui .ffj-alerts__item { display: grid; gap: 0.5rem; }
.ffj-ui .ffj-alerts__title { margin: 0; font-size: 1.125rem; font-weight: 700; overflow-wrap: anywhere; }
.ffj-ui .ffj-alerts__criteria, .ffj-ui .ffj-save-search__criteria { margin: 0; color: var(--ffj-ink-2); overflow-wrap: anywhere; }
.ffj-ui .ffj-alerts__status { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0; }
.ffj-ui .ffj-alerts__meta { font-size: 0.875rem; color: var(--ffj-muted); }
.ffj-ui .ffj-alerts__actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.ffj-ui .ffj-alerts__actions .ffj-btn, .ffj-ui .ffj-alerts__item summary { min-height: 44px; }
.ffj-ui .ffj-alerts__item summary { display: flex; align-items: center; font-weight: 600; color: var(--ffj-teal); cursor: pointer; }
.ffj-ui .ffj-alerts-how { margin-top: 1.5rem; }

/* Advertise page and employer Advertising section (advertising & monetization foundation, 2026-10-02). */
.ffj-ui .ffj-adv-hero { margin-bottom: 1rem; }
.ffj-ui .ffj-adv-free { margin: 0 0 2rem; padding: 1rem 1.25rem; background: var(--ffj-teal-tint); border-left: 6px solid var(--ffj-teal); border-radius: 0 var(--ffj-r-card) var(--ffj-r-card) 0; }
.ffj-ui .ffj-adv-free h2 { margin: 0 0 0.5rem; font-size: 1.5rem; line-height: 1.3; }
.ffj-ui.ffj-portal--advertise section { margin: 0 0 2rem; }
.ffj-ui .ffj-adv-points { padding-left: 1.25rem; }
.ffj-ui .ffj-adv-points li, .ffj-ui .ffj-adv-steps li { margin: 0 0 0.5rem; line-height: 1.55; }
.ffj-ui .ffj-adv-packages, .ffj-ui .ffj-adv-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) { .ffj-ui .ffj-adv-packages { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ffj-ui .ffj-adv-package h3 { margin: 0 0 0.5rem; font-size: 1.25rem; }
.ffj-ui .ffj-adv-package h4 { margin: 0.75rem 0 0.25rem; font-size: 1rem; }
.ffj-ui .ffj-adv-package ul { padding-left: 1.25rem; margin: 0 0 0.75rem; }
.ffj-ui .ffj-adv-facts { margin: 0.5rem 0 1rem; display: grid; gap: 0.25rem; }
.ffj-ui .ffj-adv-facts > div { display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; }
.ffj-ui .ffj-adv-facts dt { font-weight: 600; }
.ffj-ui .ffj-adv-facts dt::after { content: ":"; }
.ffj-ui .ffj-adv-facts dd { margin: 0; }
.ffj-ui .ffj-adv-faq { border-top: 1px solid var(--ffj-border); padding: 0.5rem 0; }
.ffj-ui .ffj-adv-faq summary { min-height: 44px; display: flex; align-items: center; font-weight: 600; color: var(--ffj-teal); cursor: pointer; }
.ffj-ui .ffj-adv-faq summary:focus-visible { outline: 3px solid var(--ffj-ink); outline-offset: 2px; }
.ffj-ui .ffj-adv-cta { padding: 1rem 1.25rem; background: var(--ffj-surface-alt); border-radius: var(--ffj-r-card); }
.ffj-ui .ffj-adv-example .ffj-ad-label { display: inline-block; padding: 0.0625rem 0.5rem; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ffj-ink-2); background: #FFFFFF; border: 1px solid var(--ffj-border-strong); border-radius: 4px; }

/* Addendum 2026-10-09: an application withdrawn by the applicant, on employer screens. A soft rose state,
   never error red, always with an icon and the words "Withdrawn by applicant" (color is never the only cue). */
.ffj-ui .ffj-status-withdrawn { background: #FBEDEF; color: #8C1D2C; border-color: #D9A2AB; }
.ffj-ui .ffj-applicant--withdrawn { background: #FFF8F9; border-left: 4px solid #D9A2AB; }
.ffj-ui .ffj-withdrawn-banner { display: flex; gap: 0.75rem; align-items: flex-start; margin: 1rem 0; padding: 1rem 1.125rem; background: #FBEDEF; border: 1px solid #D9A2AB; border-left-width: 4px; border-radius: 12px; color: #5E1420; }
.ffj-ui .ffj-withdrawn-banner .ffj-icon { flex: none; width: 1.25rem; height: 1.25rem; margin-top: 0.125rem; color: #8C1D2C; }
.ffj-ui .ffj-withdrawn-banner p { margin: 0 0 0.25rem; }
.ffj-ui .ffj-withdrawn-banner p:last-child { margin-bottom: 0; }
.ffj-ui .ffj-app-download { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; margin: 1rem 0 1.25rem; }
.ffj-ui .ffj-app-download .ffj-help { margin: 0; }
.ffj-ui .ffj-app-group { margin-top: 1.5rem; }
.ffj-ui .ffj-alerts__item--focus { box-shadow: 0 0 0 3px var(--ffj-focus, #0B6E69); }
.ffj-ui .ffj-alerts__spelling { margin: 0.25rem 0; }
/* 0.18.0 browser pass: long action labels wrap instead of widening the page at 320px (danger zones, alert actions, inline forms). */
.ffj-ui .ffj-danger-zone .ffj-btn, .ffj-ui .ffj-alerts__actions .ffj-btn, .ffj-ui .ffj-form--inline .ffj-btn, .ffj-ui .ffj-app-download .ffj-btn { white-space: normal; overflow-wrap: anywhere; text-align: center; max-width: 100%; }
.ffj-ui .ffj-alerts__item > *, .ffj-ui .ffj-danger-zone > *, .ffj-ui .ffj-danger-zone form > * { min-width: 0; }
.ffj-ui .ffj-alerts__actions .ffj-form--inline, .ffj-ui .ffj-danger-zone .ffj-form--inline { max-width: 100%; }
@media (forced-colors: active) {
	.ffj-ui .ffj-withdrawn-banner, .ffj-ui .ffj-applicant--withdrawn, .ffj-ui .ffj-status-withdrawn { border-color: CanvasText; }
}

/* 0.19.0 (Employer Workspace Batch 6): reflow at 320px (WCAG 1.4.10) on portal pages. Long button labels in an
   action row wrap (whole words) instead of widening the page; long email addresses break; card contents may
   shrink to the card (select and file controls included). The hiring-group search keeps its field and button
   together and wraps the button below on narrow screens. */
.ffj-ui.ffj-portal .ffj-actions-row > .ffj-btn { white-space: normal; overflow-wrap: normal; word-break: normal; }
.ffj-ui.ffj-portal .ffj-team__email { overflow-wrap: anywhere; }
.ffj-ui.ffj-portal .ffj-card > *, .ffj-ui.ffj-portal .ffj-form-group > * { min-width: 0; }
.ffj-ui.ffj-portal select.ffj-input, .ffj-ui.ffj-portal input[type="file"] { min-width: 0; max-width: 100%; }
.ffj-ui .ffj-find-group__form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.75rem; }
.ffj-ui .ffj-find-group__form .ffj-field { flex: 1 1 14rem; }
.ffj-ui .ffj-find-group__form .ffj-btn { flex: none; }
