/* ==========================================================================
   CREBB GROUP — job posting styles
   Enqueue AFTER the crebb-advisory theme stylesheet.

   Deliberately small. Fonts and colors are inherited from the live theme
   rather than declared here, so a posting always matches the site it sits on
   and never drifts when the theme is updated. Only two elements are styled:
   the posting record and the apply block. Everything else uses theme defaults.
   ========================================================================== */

.crebb-posting { --crebb-hairline: rgba(0,0,0,0.14); }

/* --------------------------------------------------------------------------
   THE POSTING RECORD
   Label, dotted leader, value. The way a county auditor record or a rent roll
   prints. A candidate on a phone gets the whole offer in eight lines before
   they read a paragraph.
   -------------------------------------------------------------------------- */
.crebb-record {
  margin: 0 0 2rem;
  padding: 1.25rem 0;
  border-top: 2px solid currentColor;
  border-bottom: 1px solid var(--crebb-hairline);
}
.crebb-record > div {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.3rem 0;
}
.crebb-record dt {
  flex: 0 0 auto;
  font-size: 0.8125rem;
  letter-spacing: 0.01em;
  opacity: 0.7;
  margin: 0;
}
.crebb-record > div::after {
  content: "";
  flex: 1 1 auto;
  order: 1;
  align-self: end;
  height: 0;
  margin-bottom: 0.28rem;
  border-bottom: 1px dotted var(--crebb-hairline);
}
.crebb-record dd {
  order: 2;
  flex: 0 1 auto;
  margin: 0;
  font-weight: 600;
  text-align: right;
}

@media (max-width: 34rem) {
  .crebb-record > div { flex-wrap: wrap; }
  .crebb-record > div::after { flex-basis: 100%; }
  .crebb-record dd { text-align: left; width: 100%; order: 3; }
}

/* --------------------------------------------------------------------------
   LEDE
   -------------------------------------------------------------------------- */
.crebb-lede {
  font-size: 1.15em;
  line-height: 1.55;
  max-width: 62ch;
}

/* --------------------------------------------------------------------------
   APPLY BLOCK
   One panel, set apart from body copy so it survives a fast scroll. Same
   treatment for both variants so the page structure never changes when the
   apply route does.
   -------------------------------------------------------------------------- */
.crebb-apply {
  margin: 2.5rem 0;
  padding: clamp(1.5rem, 4vw, 2.25rem);
  border: 1px solid var(--crebb-hairline);
  border-left: 4px solid currentColor;
  border-radius: 3px;
  background: rgba(0,0,0,0.025);
}
.crebb-apply > :first-child { margin-top: 0; }
.crebb-apply > :last-child { margin-bottom: 0; }
.crebb-apply p { max-width: 62ch; }

.crebb-note {
  font-size: 0.875rem;
  opacity: 0.75;
  margin-top: 1rem;
}

.crebb-footnote {
  font-size: 0.85rem;
  opacity: 0.7;
  border-top: 1px solid var(--crebb-hairline);
  padding-top: 1.25rem;
  margin-top: 2rem;
  max-width: 70ch;
}

/* Keyboard focus stays visible even if the theme suppresses it. */
.crebb-posting a:focus-visible,
.crebb-apply a:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }

@media print {
  .crebb-apply--form iframe { display: none; }
  .crebb-record { border-top-width: 1px; }
}

/* ==========================================================================
   CAREERS DIRECTORY
   Cards are generated from Open postings. Nothing here is hand-maintained.
   ========================================================================== */

.crebb-directory { --crebb-hairline: rgba(0,0,0,0.14); }

.crebb-filter {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin: 0 0 2rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--crebb-hairline);
}
.crebb-filter label { font-size: 0.9375rem; opacity: 0.75; }
.crebb-filter select {
  font: inherit;
  padding: 0.4rem 0.6rem;
  border: 1px solid var(--crebb-hairline);
  border-radius: 3px;
  background: transparent;
  max-width: 22em;
}

.crebb-card {
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--crebb-hairline);
}
.crebb-card:first-of-type { border-top: 2px solid currentColor; }
.crebb-card__title { margin: 0 0 0.4rem; font-size: 1.25rem; }
.crebb-card__title a { text-decoration: none; }
.crebb-card__title a:hover { text-decoration: underline; }
.crebb-card__meta,
.crebb-card__states {
  margin: 0 0 0.35rem;
  font-size: 0.9375rem;
  opacity: 0.75;
}
.crebb-card__excerpt { margin: 0.6rem 0; max-width: 68ch; }
.crebb-card__link { font-size: 0.9375rem; }

.crebb-empty {
  padding: 2rem 0;
  max-width: 60ch;
  opacity: 0.8;
}

.crebb-posting__title { margin-bottom: 1.5rem; }

.crebb-closed {
  margin: 0 0 1.75rem;
  padding: 0.9rem 1.1rem;
  border: 1px dashed var(--crebb-hairline);
  border-radius: 3px;
  font-size: 0.9375rem;
}

a.crebb-btn {
  display: inline-block;
  padding: 0.7rem 1.2rem;
  border: 1px solid currentColor;
  border-radius: 3px;
  text-decoration: none;
  font-weight: 600;
}
a.crebb-btn:hover { text-decoration: underline; }