/* Find Drivers — styled to what production's candidates page RENDERS.
   Palette read from the live page: brand blue #4aa3df on chips/buttons,
   #0a4356-family headings, green validated dates, panel top-borders
   (green = accreditation, red = about). */

/* The search form is baked into the page with inline stacked-grid styles;
   :has() lets this sheet lay it out as production's single bar without a
   content rebuild. Browsers without :has() keep the stacked layout, which
   still works — this is presentation, not capability. */
form:has(#ss-fd-company) {
  display: grid !important;
  grid-template-columns: 2fr 1.2fr 1.2fr .7fr .8fr auto;
  gap: .5rem !important;
  align-items: end;
  max-width: none !important;
}
form:has(#ss-fd-company) label { font-size: .8rem; }
/* The baked postcode hint stretches its cell and floats the field above the
   bar (seen live 2026-08-23). In bar layout the guidance already sits in the
   empty-state line below the chips, so the in-cell copy hides; the stacked
   fallback (no :has()) keeps it. */
form:has(#ss-fd-company) #ss-fd-postcode + span { display: none !important; }
form:has(#ss-fd-company) #ss-fd-postcode { width: 100% !important; }
@media (max-width: 900px) {
  form:has(#ss-fd-company) { grid-template-columns: 1fr 1fr; }
}

.ssfd-chips { margin: .9rem 0 .4rem; display: flex; flex-wrap: wrap; gap: .45rem; }
.ssfd-chip {
  display: inline-block; padding: .45rem 1.1rem; border-radius: 4px;
  background: #4aa3df; color: #fff !important; text-decoration: none;
  font-size: .9rem; border: 0;
}
.ssfd-chip:hover { background: #2f8dcc; }
.ssfd-chip-on { background: #5d2963; }

.ssfd-count { font-size: 1.05rem; margin: .8rem 0; }
.ssfd-muted { opacity: .7; font-size: .85rem; }
.ssfd-ok { color: #e8a33d; }

.ssfd-grid {
  display: grid; grid-template-columns: minmax(280px, 370px) 1fr;
  gap: 1.2rem; align-items: start;
}
@media (max-width: 900px) { .ssfd-grid { grid-template-columns: 1fr; } }

.ssfd-list { list-style: none; padding: 0; margin: 0; max-height: 75vh; overflow-y: auto; }
.ssfd-card { border: 1px solid #ddd; border-radius: 4px; margin: 0 0 .6rem; background: #fff; }
.ssfd-card > a { display: flex; gap: .7rem; padding: .8rem; color: inherit; text-decoration: none; }
.ssfd-sel { background: #eef4fb; border-color: #b9d5ec; }
.ssfd-ph { width: 52px; height: 52px; object-fit: cover; border-radius: 4px; flex: none; }
.ssfd-cbody { min-width: 0; }
.ssfd-cbody strong { font-size: 1.05rem; }
.ssfd-where { opacity: .75; font-size: .85rem; }
.ssfd-line { font-size: .82rem; margin-top: .15rem; }
.ssfd-line b { font-weight: 600; }

.ssfd-detail { border: 1px solid #ddd; border-radius: 4px; padding: 1rem 1.2rem; background: #fff; }
.ssfd-dhead { display: flex; justify-content: space-between; font-size: .9rem;
  border-bottom: 1px solid #eee; padding-bottom: .5rem; margin-bottom: .8rem; }
.ssfd-dtop { display: flex; gap: 1rem; align-items: flex-start; }
.ssfd-dph { width: 88px; height: 88px; object-fit: cover; border-radius: 4px; flex: none; }
.ssfd-dname { margin: 0 0 .2rem; }
.ssfd-ctas { margin-top: .5rem; display: flex; flex-wrap: wrap; gap: .8rem; }
.ssfd-cta { font-size: .88rem; text-decoration: none; color: #2f8dcc; }

.ssfd-panels { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1rem; }
@media (max-width: 700px) { .ssfd-panels { grid-template-columns: 1fr; } }
.ssfd-panel { border: 1px solid #e5e5e5; padding: .8rem 1rem; font-size: .88rem;
  max-height: 14rem; overflow-y: auto; }
.ssfd-panel h4 { margin: 0 0 .5rem; }
.ssfd-accr { border-top: 3px solid #7dc57f; }
.ssfd-about { border-top: 3px solid #e07d7d; }

.ssfd-wt { margin-top: 1rem; }
.ssfd-wt .ssfd-chip { font-size: .8rem; padding: .3rem .8rem; background: #eaf4fb;
  color: #2f8dcc !important; border: 1px solid #bcdcf0; }
.ssfd-wh { margin-top: 1.2rem; }
.ssfd-wh h4 { margin-bottom: .6rem; }
.ssfd-whitem { border-left: 2px solid #d9e6f2; padding: 0 0 .9rem 1rem; margin-left: .3rem; }

/* Candidate location indexes — /candidates/ and /candidates/searchbylocations/.
   Same palette as the chips above: brand blue #4aa3df, #0a4356 headings.
   Without these the A-Z strip renders as a run of bare links and the suburbs
   as a default bullet list, which is the wireframe look that fails the Phil
   bar — the same failure the bare find-drivers page had before it was dressed. */
.ssfd-azn { display: flex; flex-wrap: wrap; gap: .3rem; margin: .9rem 0 .6rem; }
.ssfd-az {
  display: inline-block; min-width: 2rem; padding: .35rem 0; text-align: center;
  border: 1px solid #d3dde3; border-radius: 4px; text-decoration: none;
  color: #0a4356; font-weight: 600; font-size: .9rem; line-height: 1;
}
.ssfd-az:hover { border-color: #4aa3df; color: #4aa3df; }
.ssfd-az.on { background: #4aa3df; border-color: #4aa3df; color: #fff; }
.ssfd-state {
  font-size: .95rem; color: #0a4356; margin: 1.1rem 0 .4rem;
  padding-bottom: .25rem; border-bottom: 1px solid #e3eaee;
}
/* Multi-column so 1,699 suburbs (letter B) read as an index rather than a
   single endless column. Count drops with width; the list itself is unchanged. */
.ssfd-locs {
  list-style: none; margin: 0; padding: 0;
  columns: 4; column-gap: 1.4rem;
}
@media (max-width: 1100px) { .ssfd-locs { columns: 3; } }
@media (max-width: 800px)  { .ssfd-locs { columns: 2; } }
@media (max-width: 520px)  { .ssfd-locs { columns: 1; } }
.ssfd-locs li { break-inside: avoid; margin: 0 0 .18rem; font-size: .88rem; }
.ssfd-locs a { text-decoration: none; color: #0a4356; }
.ssfd-locs a:hover { color: #4aa3df; text-decoration: underline; }
.ssfd-pc { opacity: .55; font-size: .8em; margin-left: .25rem; }