/* ==========================================================================
   Candidate register, candidate profile and hiring-companies directory.
   Loaded with 'css' => ['pages/candidates']. Design-system tokens only:
   squares and hairlines, pills for actions only.
   ========================================================================== */

/* ---------- Shared: long button labels wrap instead of overflowing small screens ---------- */
.cand-cat-head .btn,
.cand-profile .btn,
.detail__aside .btn,
.cand-emp-cta .btn,
.empty .btn,
.locked .btn { white-space: normal; text-align: center; }

.cand-break, .cand-contact__email { overflow-wrap: anywhere; }

/* Paper panels: outline buttons and labels need dark ink */
.panel--paper .btn--outline { border-color: var(--paper-ink); color: var(--paper-ink); }
.panel--paper .btn--outline:hover { background: var(--paper-ink); color: var(--paper); }
.panel--paper .label { color: var(--paper-ink); opacity: 0.72; }
.panel--paper a:not(.btn) { color: var(--paper-ink); }

.breadcrumb { padding-left: 0; }

/* Notices above the page body */
.cand-notice { margin-top: var(--sp-5); }
.cand-notice p { margin-bottom: var(--sp-2); }
.cand-notice__list { margin: 0 0 var(--sp-2); padding-left: 1.2em; }

/* ---------- Register: catalogue head ---------- */
.cand-cat-head h1 { margin-bottom: var(--sp-3); }
.cand-count {
  font-family: var(--font-label); font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; font-size: var(--fs-sm); color: var(--ink-muted); margin-bottom: var(--sp-3);
}
.cand-count strong { color: var(--ink); font-size: var(--fs-lg); letter-spacing: 0.04em; }
.cand-intro { color: var(--ink-muted); max-width: 70ch; margin-bottom: var(--sp-4); }
.cand-cta { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: center; }
.cand-cta__note { flex-basis: 100%; margin: 0; font-size: var(--fs-sm); color: var(--ink-muted); }
.cand-cta__note .badge { margin-right: var(--sp-2); }

/* ---------- Register: filter sidebar ---------- */
.cand-filters .filters__body { gap: var(--sp-3); }
.cand-filters .field__label { display: block; }
.cand-fs { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: var(--sp-1); }
.cand-legend { padding: 0; margin-bottom: var(--sp-1); font-weight: 600; font-size: var(--fs-sm); }
.cand-range { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); }
.cand-range .field__label { font-size: var(--fs-xs); }
.cand-ee-note { margin: 0; font-size: var(--fs-xs); color: var(--ink-muted); border-left: 2px solid var(--line-strong); padding-left: var(--sp-3); }
.cand-locked-filters { display: grid; gap: var(--sp-2); }
.cand-locked-filters .filters__title { cursor: default; margin: 0; }
.cand-locked-filters .link-arrow { justify-self: start; font-size: var(--fs-xs); }

.cand-cat-list > li > a { align-items: baseline; }
.cand-cat-list > li > a > span:first-child { display: flex; align-items: baseline; }
.cand-no {
  flex-shrink: 0; display: inline-block; min-width: 1.9em; font-family: var(--font-label); font-size: 0.72rem;
  letter-spacing: 0.1em; color: var(--ink-subtle); font-variant-numeric: tabular-nums;
}
.cand-cat-list .sub { margin-left: 1.9em; }

@media (max-width: 999px) {
  .cand-cat-list a { padding: 0.55rem 0; }
  .cand-filters .check { padding: 0.45rem 0; }
  .js .cand-filters .filters__actions { display: none; }
  /* Without JavaScript the drawer cannot open: show the filters inline above the results instead */
  html:not(.js) .cand-filters { position: static; transform: none; visibility: visible; padding: 0; overflow: visible; }
  html:not(.js) .cand-filters .filters-drawer__head,
  html:not(.js) .cand-filters .filters-drawer__foot,
  html:not(.js) .filter-toggle { display: none; }
}

/* ---------- Register: results ---------- */
.cand-results { min-width: 0; }
.cand-results .results-meta .cluster { gap: var(--sp-2) var(--sp-4); }
.cand-sort { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--sp-4); font-size: var(--fs-sm); }
.cand-sort a {
  display: inline-flex; align-items: center; min-height: 44px;
  color: var(--ink-muted); text-decoration: none;
}
.cand-sort a:hover { color: var(--ink); }
.cand-sort a[aria-current="true"] {
  color: var(--ink); font-weight: 600;
  text-decoration: underline; text-decoration-color: var(--ink); text-underline-offset: 0.35em;
}
.cand-results .applied { margin-bottom: var(--sp-4); flex-wrap: wrap; overflow: visible; }

/* Hairlines drawn by the frames themselves, so a part-filled last row has no grey filler cells */
.cand-register, .cand-similar .register { background: none; gap: 0; border: 0; border-top: var(--hair); border-left: var(--hair); }
.cand-register .frame, .cand-similar .register .frame { border-right: var(--hair); border-bottom: var(--hair); }

/* Keep the badges clear of the shortlist bookmark (absolute, bottom-right of the frame) */
.cand-register .frame:has(.frame__save) .frame__flags,
.cand-similar .frame:has(.frame__save) .frame__flags { padding-right: 46px; min-height: 40px; align-content: flex-start; }

.panel .link-arrow { justify-self: start; }
.panel > p.label { margin: 0; }

/* ---------- Register: how it works ---------- */
.cand-how__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-6) var(--sp-5); }
@media (min-width: 700px) { .cand-how__list { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .cand-how__list { grid-template-columns: repeat(4, 1fr); } }
.cand-how__list li { border-top: 1px solid var(--line-strong); padding-top: var(--sp-4); display: grid; gap: var(--sp-2); align-content: start; }
.cand-how__no { font-family: var(--font-display); font-size: 2.4rem; line-height: 1; color: var(--ink-subtle); }
.cand-how__list h3 { margin: 0; }
.cand-how__list p { margin: 0; color: var(--ink-muted); font-size: var(--fs-sm); }
.cand-how__list .link-arrow { justify-self: start; margin-top: var(--sp-2); }

/* ---------- Profile ---------- */
.cand-detail { padding-top: var(--sp-5); }
.cand-profile { min-width: 0; }
.cand-top { display: grid; gap: var(--sp-5); padding-bottom: var(--sp-6); border-bottom: var(--hair); }
@media (min-width: 640px) { .cand-top { grid-template-columns: 220px 1fr; align-items: end; } }
@media (min-width: 1200px) { .cand-top { grid-template-columns: 260px 1fr; } }
.cand-photo { width: 100%; max-width: 320px; aspect-ratio: 1; overflow: hidden; background: var(--surface-2); border: var(--hair); }
.cand-photo img { width: 100%; height: 100%; object-fit: cover; }
.cand-top__text .ref { margin-bottom: var(--sp-2); }
.cand-name { font-size: var(--fs-2xl); margin: 0 0 var(--sp-3); overflow-wrap: anywhere; }
.cand-headline { font-size: var(--fs-lg); color: var(--ink-muted); margin-bottom: var(--sp-3); max-width: 46ch; }
.cand-role {
  display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-3); margin-bottom: var(--sp-2);
  font-family: var(--font-label); font-weight: 600; font-size: var(--fs-sm); letter-spacing: 0.1em; text-transform: uppercase;
}
.cand-role a { text-decoration: none; border-bottom: 1px solid var(--line-strong); }
.cand-role a:hover { border-color: var(--ink); }
.cand-role__sep { color: var(--ink-subtle); }
.cand-loc { color: var(--ink-muted); font-size: var(--fs-sm); margin-bottom: var(--sp-3); }
.cand-badges { gap: var(--sp-2); }

.cand-sec { padding-top: var(--sp-6); }
.cand-sec__title {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-3);
  font-family: var(--font-display); font-size: var(--fs-xl); font-weight: 500; margin-bottom: var(--sp-4);
}
.cand-sec__no { font-family: var(--font-label); font-size: var(--fs-xs); font-weight: 600; letter-spacing: var(--track-label); color: var(--ink-subtle); }
.cand-sec__count { font-family: var(--font-body); font-size: var(--fs-md); color: var(--ink-muted); }
.cand-about p { margin: 0; }
.cand-full__note { display: flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-4); }
.cand-sub {
  font-family: var(--font-label); font-weight: 600; text-transform: uppercase; letter-spacing: 0.12em;
  font-size: var(--fs-sm); color: var(--ink-muted); margin: var(--sp-6) 0 var(--sp-4);
}
.cand-history { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--line-strong); }
.cand-history li { position: relative; padding: 0 0 var(--sp-5) var(--sp-5); }
.cand-history li:last-child { padding-bottom: 0; }
.cand-history li::before { content: ""; position: absolute; left: -4px; top: 0.5em; width: 7px; height: 7px; background: var(--ink); }
.cand-history__title { font-weight: 600; margin: 0; }
.cand-history__meta { font-size: var(--fs-sm); color: var(--ink-muted); margin: 0 0 var(--sp-2); }
.cand-history__duties { font-size: var(--fs-sm); margin: 0; max-width: 68ch; }
.cand-locked-facts dd { color: var(--ink-subtle); }
.cand-report { margin-top: var(--sp-7); padding-top: var(--sp-5); border-top: var(--hair); }

/* Profile aside */
@media (min-width: 1000px) { .detail__aside.cand-aside--static { position: static; } }
.cand-shortlist-panel { gap: var(--sp-2); }
.cand-shortlist-row { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-3); }
.cand-shortlist { min-height: 44px; }
.cand-shortlist__on { display: none; }
.cand-shortlist[aria-pressed="true"] .cand-shortlist__on { display: inline; }
.cand-shortlist[aria-pressed="true"] .cand-shortlist__off { display: none; }
.cand-contact a { font-weight: 600; }
.cand-contact .icon { margin-right: 0.25em; }
.cand-cv { display: grid; gap: var(--sp-2); padding-top: var(--sp-3); border-top: var(--hair); }
.cand-form { gap: var(--sp-4); }
.cand-form .textarea { min-height: 140px; }

/* ---------- Hiring companies ---------- */
.cand-toolbar { display: grid; gap: var(--sp-4); padding: var(--sp-5) 0; }
.cand-toolbar__field { display: grid; gap: var(--sp-2); min-width: 0; }
.cand-toolbar__check { display: flex; align-items: center; min-height: 48px; }
.cand-toolbar__submit .btn { width: 100%; }
@media (min-width: 720px) {
  .cand-toolbar { grid-template-columns: 1fr 1fr; align-items: end; }
  .cand-toolbar__field--grow { grid-column: 1 / -1; }
  .cand-toolbar__submit .btn { width: auto; }
}
@media (min-width: 1100px) {
  .cand-toolbar { grid-template-columns: minmax(0, 2fr) minmax(0, 1.3fr) minmax(0, 1fr) auto auto; }
  .cand-toolbar__field--grow { grid-column: auto; }
}

.cand-eb {
  display: grid; grid-template-columns: 56px 1fr; gap: var(--sp-4) var(--sp-5);
  padding: var(--sp-5); margin-bottom: var(--sp-6); border: 1px solid var(--line-strong); background: var(--surface);
}
.cand-eb__mark { width: 56px; height: 56px; padding: 6px; display: grid; place-items: center; border: var(--hair); background: var(--bg); }
.cand-eb__mark img { height: 100%; width: auto; }
.cand-eb__title { font-family: var(--font-display); font-size: var(--fs-xl); line-height: 1.1; margin: var(--sp-1) 0 var(--sp-2); }
.cand-eb__jobs, .cand-eb > .cand-ledger-more { grid-column: 1 / -1; }
.cand-eb__jobs a { background: var(--bg); }
.cand-eb__jobs a:hover { background: var(--surface-2); }
@media (min-width: 900px) {
  .cand-eb { grid-template-columns: 96px 1.1fr 1fr; }
  .cand-eb__mark { width: 96px; height: 96px; padding: var(--sp-3); }
  .cand-eb__jobs { grid-column: 3; align-self: start; }
  .cand-eb > .cand-ledger-more { grid-column: 3; justify-self: end; }
}

.cand-ledger .ledger-row__jobs, .cand-eb__jobs { align-self: start; align-content: start; }
.cand-ledger-more { grid-column: 1 / -1; margin: 0; }
@media (min-width: 900px) { .ledger-row > .cand-ledger-more { grid-column: 3; justify-self: end; } }

.cand-emp-cta { display: grid; gap: var(--sp-5); align-items: end; }
.cand-emp-cta h2 { margin-bottom: var(--sp-3); }
.cand-emp-cta .lead { margin: 0; }
.cand-emp-cta__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
@media (min-width: 900px) { .cand-emp-cta { grid-template-columns: minmax(0, 1.4fr) auto; } }

/* Employer profile head */
.emp-top { display: grid; gap: var(--sp-5); padding-bottom: var(--sp-6); border-bottom: var(--hair); }
@media (min-width: 640px) { .emp-top { grid-template-columns: 160px 1fr; align-items: center; } }
.emp-logo { width: 120px; aspect-ratio: 1; overflow: hidden; display: grid; place-items: center; background: var(--paper); border: var(--hair); }
@media (min-width: 640px) { .emp-logo { width: 160px; } }
.emp-logo img { width: 100%; height: 100%; object-fit: cover; }
.emp-logo__mono { font-family: var(--font-display); font-size: 3rem; color: var(--paper-ink); }
.emp-top__text .ref { margin-bottom: var(--sp-2); }

/* Error summaries inside aside panels keep their spacing (.panel h2 resets margins) */
.panel .error-summary h2 { margin-bottom: var(--sp-2); }

/* Shortcut from the profile header to the employer action panels (only needed when they sit below the profile) */
.cand-jump { margin: var(--sp-4) 0 0; }
@media (min-width: 1000px) { .cand-jump { display: none; } }
#contact, #connect, #introduce { scroll-margin-top: calc(var(--header-h) + var(--sp-4)); }