/* ============================================================================
   new-ui/apply-closed.css — the job page's notice for an ad that is not open for applications (stage bug round 2026-10-20, track
   applyend, bug 30: "You can still apply on job ads with expired date - disable that option"). jobs.php prints the notice instead of
   its apply buttons — the header's (.kj-jobhead__cta) and the deadline bar's (.kj-deadline__actions, docked to a phone's screen) —
   and links this sheet only then (kj-apply-live.php decides). An amber note in the B3 tokens, navy text (the contrast of a body text),
   a lock; the bar's copy is the short title. Its own names only (kj-applyclosed). Doc: docs/features/apply-live-gate.md
   ========================================================================== */
.kj-applyclosed { display: inline-flex; align-items: center; gap: 9px; min-height: 46px; padding: 10px 16px; box-sizing: border-box; border: 1px solid var(--kj-gold-300);
  border-radius: 14px; background: var(--kj-b3-warning-bg); color: var(--kj-b3-title); font-family: var(--kj-font-mulish); font-size: 15px; font-weight: 700;
  line-height: 1.35; text-align: left; }
.kj-applyclosed svg { flex: none; color: var(--kj-gold-600); }
.kj-deadline__closed { white-space: nowrap; }
@media (max-width: 767px) {
  .kj-jobhead__cta .kj-applyclosed { width: 100%; justify-content: center; text-align: center; }
  /* the bar docked to the screen (job.css gives every action flex 1): the reminder keeps its own width, the notice takes the rest and may
     wrap to two lines; no lock there (it would push the words off the screen) */
  .kj-deadline__actions:has(> .kj-deadline__closed) > * { flex: 0 1 auto; }
  .kj-deadline__actions:has(> .kj-deadline__closed) > .kj-deadline__closed { flex: 1 1 auto; min-width: 0; justify-content: center; padding: 6px 12px; font-size: 13.5px;
    line-height: 1.25; white-space: normal; text-align: center; }
  .kj-deadline__closed svg { display: none; }
}