/* HOF Jobs reusable module styling, page-independent */
.hof-jobs {color:inherit}
.hof-jobs__intro{max-width:820px;margin-bottom:2rem}
.hof-jobs__filters{display:flex;gap:1rem;flex-wrap:wrap;align-items:end;margin:0 0 1.35rem}
.hof-jobs__field{display:grid;gap:.45rem;min-width:min(100%,240px);flex:1}
.hof-jobs__field label{font-size:.83rem;font-weight:700;letter-spacing:.03em}
.hof-jobs__field select{width:100%;min-height:46px;padding:.7rem 2.4rem .7rem .9rem;color:#17251c;background:#fff;border:1px solid #b8c9bd;border-radius:6px}
.hof-jobs__field select:focus-visible,.hof-job__link:focus-visible{outline:3px solid #00fb00;outline-offset:3px}
.hof-jobs__status{font-size:.9rem;margin-bottom:1.3rem}
.hof-jobs__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}
.hof-job{display:flex;flex-direction:column;padding:1.65rem;background:#f2f5f2;color:#13251a;border:1px solid #dbe5de;border-top:4px solid #00e000;border-radius:10px;min-width:0}
.hof-job__meta{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1rem}
.hof-job__meta span{font-size:.75rem;font-weight:700;padding:.3rem .55rem;background:#dce8df;border-radius:3px;color:#23412b}
.hof-job h3{font-size:clamp(1.2rem,2vw,1.65rem);line-height:1.18;margin:0 0 .75rem;color:#14251a}
.hof-job__description{flex:1;margin-bottom:1.2rem;line-height:1.55}
.hof-job__link{display:inline-flex;align-items:center;gap:.5rem;font-weight:800;color:#124b22;text-decoration:underline;text-underline-offset:4px}
.hof-job__link:hover{color:#006f13}
.hof-job[hidden],.hof-jobs__empty[hidden]{display:none!important}
.hof-jobs__empty{padding:1.4rem;border:1px solid currentColor;border-radius:8px}
/* Works regardless of WBCE band background: cards remain light and readable */
@media(max-width:767px){.hof-jobs__grid{grid-template-columns:1fr}.hof-job{padding:1.25rem}}


/* HOF Automation - job cards and Bootstrap 5 modal.
   Reusable component. Load AFTER theme.css, wbce-modules.css and hof-jobs.css. */
:root { --hof-job-ink:#14251b; --hof-job-green:#00e900; }

/* Light cards inside the dark WBCE band */
.hof-jobs .hof-job {
  background:#f1f5f1 !important;
  color:var(--hof-job-ink) !important;
  border:1px solid #d5e2d9;
  border-top:4px solid var(--hof-job-green);
  border-radius:12px;
  padding:clamp(1.2rem,2.1vw,1.8rem);
  box-shadow:0 10px 26px rgba(0,0,0,.13);
}
.hof-jobs .hof-job h3,
.hof-jobs .hof-job h3 a,
.hof-jobs .hof-job p,
.hof-jobs .hof-job .hof-job__description,
.hof-jobs .hof-job .hof-job__description p {
  color:var(--hof-job-ink) !important;
}
.hof-jobs .hof-job h3 { font-size:clamp(1.35rem,2.1vw,1.75rem);line-height:1.2;margin:0 0 1rem; }
.hof-jobs .hof-job__description {line-height:1.6;margin-bottom:1.5rem;}
.hof-jobs .hof-job__meta span {color:#174027 !important;background:#d9e8dd;}
.hof-jobs button.hof-job__link {
  appearance:none; border:0; background:none !important; padding:0;
  color:#096e28 !important; font:inherit;font-weight:800;
  text-decoration:none;cursor:pointer;align-self:flex-start;
  width:auto;min-width:0;box-shadow:none !important;
}
.hof-jobs button.hof-job__link:hover {color:#064d1b !important;text-decoration:underline;}
.hof-jobs button.hof-job__link:focus-visible {outline:3px solid var(--hof-job-green);outline-offset:4px;}

/* Bootstrap modal must not inherit white text / dark-band heading rules */
.hof-job-modal {
  --bs-modal-color:#17251c;
  --bs-modal-bg:#fff;
  --bs-modal-border-color:#d8e4db;
  color:#17251c !important;
}
.hof-job-modal .modal-dialog {max-width:min(860px,calc(100% - 1.25rem));margin:1.75rem auto;}
.hof-job-modal .modal-content {
  background:#fff !important;color:#17251c !important;
  border:0;border-radius:14px;overflow:hidden;
  box-shadow:0 30px 90px rgba(0,0,0,.28);
}
.hof-job-modal .modal-header {
  background:#f0f5f1 !important;color:#17251c !important;
  border-bottom:1px solid #d7e3d9;padding:1.4rem 1.7rem;
  gap:1rem;
}
.hof-job-modal .modal-title,
.hof-job-modal .modal-header h2 {
  font-size:clamp(1.25rem,2.25vw,1.75rem) !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  color:#14251b !important;
  margin:0 !important;
  max-width:none !important;
}
.hof-job-modal .btn-close {opacity:.85;flex-shrink:0;}
.hof-job-modal .modal-body {background:#fff !important;color:#17251c !important;padding:1.5rem 1.7rem;}
.hof-job-modal .modal-body h2,
.hof-job-modal .modal-body h3,
.hof-job-modal .modal-body h4,
.hof-job-modal .modal-body p,
.hof-job-modal .modal-body li,
.hof-job-modal .modal-body strong,
.hof-job-modal .modal-body .hof-job-modal-description,
.hof-job-modal .hof-job-modal-meta {
  color:#17251c !important;
  opacity:1 !important;
  visibility:visible !important;
  text-shadow:none !important;
}
.hof-job-modal .hof-job-modal-meta {color:#38614a !important;font-weight:700;margin:0 0 1.1rem;}
.hof-job-modal .modal-body h2 {font-size:1.15rem !important;line-height:1.3;margin:1.25rem 0 .5rem;}
.hof-job-modal .modal-body h2:first-child {margin-top:0;}
.hof-job-modal .modal-body ul {list-style:disc !important;padding-left:1.4rem !important;margin:.5rem 0 1rem;}
.hof-job-modal .modal-body li {display:list-item !important;padding:.12rem 0;line-height:1.55;}
.hof-job-modal .modal-body li::marker {color:#00bf20;}
.hof-job-modal .modal-footer {background:#fff !important;border-top:1px solid #d7e3d9;padding:1rem 1.7rem;gap:.65rem;}
.hof-job-modal .modal-footer .btn {width:auto;}
.hof-job-modal .modal-footer .hof-btn-primary {background:#00ed00;color:#12231a !important;border-radius:100px;}
@media(max-width:575px){
  .hof-job-modal .modal-dialog{max-width:calc(100% - 1rem);margin:.5rem auto;}
  .hof-job-modal .modal-header,.hof-job-modal .modal-body,.hof-job-modal .modal-footer{padding:1.1rem;}
  .hof-job-modal .modal-footer {justify-content:stretch;}
  .hof-job-modal .modal-footer .btn {flex:1;}
}
