/* ===========================================================================
   Samcruit careers site — job detail + apply page.
   Loaded alongside careers.css (shared header/footer) on careers-job.html.
   =========================================================================== */

.job-page-inner {
  --od-gap: var(--s-4);
  max-width: 1240px;
  margin-inline: auto;
  padding: var(--s-4) var(--s-4) var(--s-12);
  display: flex;
  flex-direction: column;
}

/* .dash-grid sets its own display:grid (app.css), which otherwise outranks
   the [hidden] attribute's user-agent default — force it back off. */
#job-content[hidden] { display: none; }

.summary-row { --od-gap: var(--s-4); flex-wrap: wrap; }
.summary-text { --od-gap: var(--s-2); }

.desc-body { display: grid; gap: var(--s-4); }
.bullet-list { list-style: disc; padding-left: var(--s-6); }
.bullet-list > li { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--ink-muted); margin-bottom: var(--s-1); }
.bullet-list > li:last-child { margin-bottom: 0; }

/* ---------- apply form ------------------------------------------------------ */

.apply-grid { display: grid; gap: var(--s-4); }
.apply-grid[hidden] { display: none; }
@media (min-width: 640px) {
  .apply-grid { grid-template-columns: 1fr 1fr; }
  .field-span-2 { grid-column: 1 / -1; }
}

.field-opt {
  display: inline-block; margin-left: var(--s-2); padding: 0 var(--s-2);
  border-radius: var(--r-pill); background: var(--surface-sunken);
  font-size: var(--fs-micro); line-height: 18px; font-weight: 400; color: var(--ink-muted);
}

.apply-submit { --od-gap: var(--s-3); flex-wrap: wrap; padding-top: var(--s-2); }

.success-card { margin-top: var(--s-4); border: 1px solid var(--border); }
.success-body { display: grid; gap: var(--s-3); justify-items: start; padding: var(--s-8) var(--s-4); }
.success-disc { display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--r-pill); background: var(--primary-soft); color: var(--primary); }
.success-disc.is-neutral { background: var(--surface-sunken); color: var(--ink-muted); }
.success-actions { --od-gap: var(--s-2); flex-wrap: wrap; }

/* ---------- quick-facts aside ----------------------------------------------- */

.apply-aside-body { --od-gap: var(--s-3); }
.btn-block { width: 100%; justify-content: center; }

/* ---------- not-found state -------------------------------------------------- */

#job-not-found { max-width: 560px; margin: var(--s-12) auto; text-align: left; }

/* ---------- footer legal row ------------------------------------------------- */

.footer-legal-row { padding-top: var(--s-3); border-top: 1px solid var(--border); }
.footer-legal { --od-gap: var(--s-4); }
.footer-powered { text-align: right; }