/* Jobs board + the ONE job card (also used on the homepage). Moved out of pages/vacancies/index.php 2026-09-28. */
  /* Jobs landing. Sizes follow the theme's text settings (--bf-type / --bf-type-sm). */
  .jb-page{background:var(--wb-bg);padding:12px 0 30px}
  .jb-hero{padding:14px 18px 12px;margin-bottom:10px;position:relative;z-index:5;overflow:visible}
  .jb-hero-h{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap;margin:0 0 10px}
  .jb-h1{font-family:var(--wb-display);font-size:calc(22px*var(--bf-type,1));font-weight:800;letter-spacing:-.02em;color:var(--wb-ink);margin:0}
  .jb-hero-post{margin-left:auto;align-self:center}
  .jb-lede{font-size:calc(13px*var(--bf-type,1));color:var(--wb-muted);margin:0}
  .jb-main{margin-top:0}
  .jb-icon:hover{color:var(--wb-ink);border-color:var(--wb-muted-2)} .jb-icon.on{color:var(--wb-brand);border-color:var(--wb-brand)}
  .jb-card .wb-input{width:100%;margin-bottom:8px} .jb-inline .wb-input{margin:0}
  .jb-chips{margin-top:8px}
  #jbPayCard{display:contents}
  .jb-bar .wb-input{width:auto;min-width:0}
  .jb-more>summary,.jb-filters>summary{list-style:none;cursor:pointer}
  .jb-more>summary::-webkit-details-marker,.jb-filters>summary::-webkit-details-marker{display:none}
  .jb-more-in .wb-field{display:grid;gap:4px} .jb-more-in .wb-field>span{font-size:calc(12px*var(--bf-type-sm,1));font-weight:600;color:var(--wb-muted)}
  .jb-note{margin:0 0 12px} .jb-note a{color:var(--wb-brand);font-weight:600}
  .jb-bar{display:flex;align-items:flex-start;gap:8px;margin-bottom:4px}
  .jb-filters{flex:1;min-width:0}
  .jb-filters>summary{display:none}
  .jb-bar-in{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
  .jb-more{position:relative}
  .jb-more-in{position:absolute;z-index:30;top:42px;left:0;width:250px;padding:12px;display:grid;gap:10px}
  .jb-more-in label{display:grid;gap:4px;font-size:calc(12px*var(--bf-type-sm,1));font-weight:600;color:var(--wb-muted)}
  .jb-more-in label select{width:100%}
  .jb-more-in .jb-check{display:flex;gap:7px;align-items:center;color:var(--wb-ink);font-weight:500}
  .jb-bar-end{display:flex;gap:6px;align-items:center;flex:none}
  .jb-icon{width:34px;height:34px;display:inline-grid;place-items:center;border:1px solid var(--wb-line);border-radius:var(--bf-radius-sm,9px);background:var(--wb-panel);color:var(--wb-muted);font-size:calc(14px*var(--bf-type,1));padding:0}
  .jb-cmp.on{color:#fff;background:var(--wb-navy,#1e3a5f);border-color:var(--wb-navy,#1e3a5f)}
  .jb-count{font-size:calc(13px*var(--bf-type,1));color:var(--wb-muted);margin:2px 2px 6px} .jb-count b{color:var(--wb-ink)} .jb-count a{color:var(--wb-brand);font-weight:600}
  .jb-list{padding:0;overflow:hidden}
  .jb-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:start;padding:14px 16px;border-top:1px solid var(--wb-line-2)}
  .jb-row:first-child{border-top:0} .jb-row:hover{background:var(--wb-panel-2,#fafafa)}
  .jb-av{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;object-fit:cover;color:#fff;font-weight:800;font-size:calc(13px*var(--bf-type,1))}
  .jb-person{background:var(--wb-line-2);color:var(--wb-muted);font-size:calc(17px*var(--bf-type,1))}
  .jb-body{min-width:0}
  .jb-title{display:block;font-size:calc(15.5px*var(--bf-type,1));font-weight:700;color:var(--wb-ink);text-decoration:none;line-height:1.3}
  .jb-title:hover{color:var(--wb-brand)}
  .jb-meta{display:flex;flex-wrap:wrap;gap:0 12px;font-size:calc(13px*var(--bf-type,1));color:var(--wb-muted);margin-top:3px}
  .jb-tick{color:var(--wb-green);font-size:calc(12px*var(--bf-type-sm,1))}
  .jb-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px;align-items:center}
  .jb-tag{font-size:calc(12px*var(--bf-type-sm,1));color:var(--wb-muted);background:var(--wb-line-2);border-radius:6px;padding:2px 7px}
  .jb-mt{font-size:calc(12px*var(--bf-type-sm,1));font-weight:700;color:var(--wb-green)}
  .jb-side{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
  .jb-pay{font-size:calc(14px*var(--bf-type,1));font-weight:700;color:var(--wb-green);white-space:nowrap}
  .jb-acts{display:flex;gap:6px;align-items:center}
  /* Whole row / card opens the job (stretched title link); buttons and forms stay clickable. */
  .jb-row{position:relative;cursor:pointer}
  .jb-row .jb-title::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}
  .jb-row .jb-acts,.jb-row .jb-mt,.jb-row .jb-tick{position:relative;z-index:2}
  .jb-row:hover .jb-title{color:var(--wb-brand)}
  .jb-row:focus-within{outline:2px solid var(--wb-brand);outline-offset:-2px}
  .jb-desc,.jb-foot{display:none}
  /* Compact list (about 15% tighter than before) */
  .jb-list.is-list .jb-row{gap:10px;padding:11px 14px;grid-template-columns:34px minmax(0,1fr) auto}
  .jb-list.is-list .jb-av{width:34px;height:34px;border-radius:9px;font-size:calc(12px*var(--bf-type-sm,1))}
  .jb-list.is-list .jb-title{font-size:calc(14.5px*var(--bf-type,1))}
  .jb-list.is-list .jb-meta{margin-top:1px;font-size:calc(12.5px*var(--bf-type-sm,1))}
  .jb-list.is-list .jb-tags{margin-top:5px}
  .jb-list.is-list .jb-side{gap:6px}
  .jb-list.is-list .jb-pay{font-size:calc(13.5px*var(--bf-type,1))}
  /* Cards with details */
  .jb-list.is-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;background:none;border:0;box-shadow:none;overflow:visible;padding:0}
  .jb-list.is-grid .jb-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"av meta meta" "title title title" "pay pay pay" "tags tags tags" "desc desc desc" "foot foot acts";gap:6px 10px;align-items:center;padding:16px;border:1px solid var(--wb-line);border-radius:var(--wb-radius,12px);background:var(--wb-panel);box-shadow:var(--wb-shadow);min-width:0}
  .jb-list.is-grid .jb-row:first-child{border-top:1px solid var(--wb-line)}
  .jb-list.is-grid .jb-row:hover{background:var(--wb-panel);border-color:var(--bf-border-2,#cfcfcf);box-shadow:0 6px 18px rgba(17,19,28,.07)}
  .jb-list.is-grid .jb-body,.jb-list.is-grid .jb-side{display:contents}
  .jb-list.is-grid .jb-av{grid-area:av}
  /* employer hidden (config/pro_privacy.php): no logo column in the list view */
  .jb-row.jb-noav{grid-template-columns:minmax(0,1fr) auto}
  .jb-list.is-list .jb-row.jb-noav{grid-template-columns:minmax(0,1fr) auto}
  /* Card view, title first (2026-09-27): title → pay → chips → description → where/when → applicants + Apply */
  .jb-list.is-grid .jb-row,.jb-list.is-grid .jb-row.jb-noav{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title title" "pay pay" "tags tags" "desc desc" "meta meta" "foot acts";gap:6px 10px}
  .jb-list.is-grid .jb-av{display:none}
  .jb-list.is-grid .jb-title{margin-top:0}
  .jb-list.is-grid .jb-desc{border-bottom:0;padding-bottom:0}
  .jb-list.is-grid .jb-meta{padding-top:8px;border-top:1px solid var(--wb-line-2);color:var(--wb-muted);font-size:calc(12px*var(--bf-type-sm,1))}
  .jb-list.is-grid .jb-meta>span:first-child{flex-basis:auto;font-size:inherit;font-weight:600;color:var(--wb-ink)}
  .jb-list.is-grid .jb-row.jb-noav .jb-meta>span:first-child{font-weight:400;color:var(--wb-muted)}
  .jb-list.is-grid .jb-meta{grid-area:meta;margin:0;line-height:1.35;min-width:0;gap:0 8px}
  .jb-list.is-grid .jb-meta>span+span::before{content:"·";margin-right:8px;color:var(--wb-muted-2,#9ca3af)}
  .jb-list.is-grid .jb-title{grid-area:title;font-size:calc(17px*var(--bf-type,1));font-weight:800;margin-top:6px}
  .jb-list.is-grid .jb-pay{grid-area:pay;text-align:left;white-space:normal;font-size:calc(15px*var(--bf-type,1))}
  .jb-list.is-grid .jb-tags{grid-area:tags;margin:0}
  .jb-list.is-grid .jb-desc{grid-area:desc;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:2px 0 0;padding-bottom:10px;border-bottom:1px solid var(--wb-line-2);font-size:calc(13px*var(--bf-type,1));color:var(--wb-muted);line-height:1.55}
  .jb-list.is-grid .jb-foot{grid-area:foot;display:flex;flex-wrap:wrap;gap:4px 12px;font-size:calc(12.5px*var(--bf-type-sm,1));color:var(--wb-muted);min-width:0}
  .jb-list.is-grid .jb-foot i{margin-right:3px}
  .jb-list.is-grid .jb-acts{grid-area:acts;justify-self:end}
  .jb-viewtabs button{padding:5px 9px}
  .jb-foot-note{font-size:calc(13px*var(--bf-type,1));color:var(--wb-muted);margin:12px 2px 0} .jb-foot-note a{color:var(--wb-brand);font-weight:700}
  .jb-side-col{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;position:sticky;top:14px}
  .jb-card{padding:14px 16px}
  .jb-h2{font-family:var(--wb-display);font-size:calc(14.5px*var(--bf-type,1));font-weight:800;color:var(--wb-ink);margin:0 0 8px;display:flex;gap:7px;align-items:center}
  .jb-small{font-size:calc(12.5px*var(--bf-type-sm,1));color:var(--wb-muted);margin:0 0 8px} .jb-small b{color:var(--wb-ink)}
  .jb-link{display:block;margin:8px 0 0;color:var(--wb-brand);font-weight:600;text-decoration:none}
  .jb-inline{display:flex;gap:6px} .jb-inline select{flex:1}
  .jb-steps{margin:0;padding-left:18px;font-size:calc(13px*var(--bf-type,1));color:var(--wb-muted);display:grid;gap:5px} .jb-steps b{color:var(--wb-ink)}
  .jb-bignum{font-size:calc(19px*var(--bf-type,1));font-weight:800;color:var(--wb-ink)} .jb-bignum span{font-size:calc(12.5px*var(--bf-type-sm,1));font-weight:500;color:var(--wb-muted)}
  .jb-post{display:flex;gap:6px;align-items:center;justify-content:center;border:1px dashed var(--wb-line);border-radius:var(--wb-radius,12px);padding:12px;font-size:calc(13.5px*var(--bf-type,1));font-weight:700;color:var(--wb-ink);text-decoration:none}
  .jb-post span{color:var(--wb-muted);font-weight:500} .jb-post:hover{border-color:var(--wb-muted-2)}
  .jb-recs{padding:10px 16px 6px;margin-bottom:12px}
  .jb-recs-h{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:calc(13.5px*var(--bf-type,1));margin-bottom:4px}
  .jb-recs-h b{color:var(--wb-ink)} .jb-recs-h a{font-size:calc(12.5px*var(--bf-type-sm,1));color:var(--wb-brand);font-weight:600;text-decoration:none}
  .jb-rec{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--wb-line-2);text-decoration:none;color:inherit}
  .jb-rec:first-of-type{border-top:0}
  .jb-rec-m{font-size:calc(13px*var(--bf-type,1));font-weight:800;color:var(--wb-green);text-align:center}
  .jb-rec-t{min-width:0} .jb-rec-t b{display:block;font-size:calc(14px*var(--bf-type,1));color:var(--wb-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .jb-rec-t small{display:block;font-size:calc(12.5px*var(--bf-type-sm,1));color:var(--wb-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .jb-rec-w{font-size:calc(12px*var(--bf-type-sm,1));color:var(--wb-muted);white-space:nowrap}
  .jb-rec:hover b{color:var(--wb-brand)}
  .jb-tray{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:1040;display:flex;align-items:center;gap:10px;padding:8px 10px 8px 14px;background:var(--wb-panel,#fff);border:1px solid var(--wb-line,#e5e5e5);border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.14);font-size:calc(12.5px*var(--bf-type-sm,1));max-width:calc(100% - 24px)}
  .jb-tray[hidden]{display:none}
  .jb-tray-items{display:flex;gap:4px;overflow:hidden}
  .jb-tray-items em{font-style:normal;font-size:calc(11px*var(--bf-type-sm,1));background:var(--wb-line-2,#f2f2f2);border-radius:20px;padding:2px 8px;white-space:nowrap;max-width:120px;overflow:hidden;text-overflow:ellipsis}
  @media (max-width:991.98px){ .jb-side-col{position:static} }
  @media (max-width:767.98px){
    .jb-page{padding-top:12px}
    .jb-hero{padding:12px 12px 10px}
    .jb-chips{flex-wrap:wrap;row-gap:4px;padding-bottom:2px} .jb-chips::-webkit-scrollbar{display:none} .jb-chips .wb-chip{flex:none}
    .jb-more-in{position:static;width:auto;margin-top:6px}
    .jb-row{grid-template-columns:36px minmax(0,1fr);padding:12px}
    .jb-av{width:36px;height:36px}
    .jb-side{grid-column:2;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;text-align:left}
    .jb-pay{white-space:normal}
    .jb-rec{grid-template-columns:40px minmax(0,1fr)} .jb-rec-w{display:none}
    .jb-tray-items{display:none}
    .jb-list.is-grid{grid-template-columns:minmax(0,1fr)}
    .jb-list.is-list .jb-row{grid-template-columns:32px minmax(0,1fr);padding:10px 12px}
    .jb-list.is-list .jb-av{width:32px;height:32px}
    .jb-row.jb-noav,.jb-list.is-list .jb-row.jb-noav{grid-template-columns:minmax(0,1fr)}
    .jb-row.jb-noav .jb-side{grid-column:1}
  }