/* ============================================================
   BengalTutors — the tuition job card (css/job-card.css)

   ONE card, wherever a tuition job is shown: the board at
   /tuition-jobs and the "Latest tuition jobs" row on the homepage.

   It used to be two. The board had .job and the homepage had its own
   .jb-card, written to look roughly the same — which is precisely how
   two pages come to show the same job in two different shapes, and
   how a fix applied to one of them silently misses the other.

   Colours are literal with a var() in front, so this file works on
   a page that loads /css/pages.css and on one that does not.
   ============================================================ */

.job-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}

.job{background:#fff;border:1px solid var(--bd,#e5e7eb);border-radius:15px;padding:20px 22px;
  box-shadow:0 3px 14px rgba(17,24,39,.05);display:flex;flex-direction:column;
  transition:transform .16s,box-shadow .16s}
.job:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(17,24,39,.10)}

.job-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.job-mode{display:inline-flex;align-items:center;gap:5px;background:var(--gp,#e8f5ee);
  color:var(--g-dark,#085029);border-radius:999px;padding:4px 11px;font-size:.76rem;font-weight:700}
.job-mode.on{background:var(--bluep,#dbeafe);color:#1e3a8a}
.job-ref{font-size:.76rem;color:var(--inksx,#9ca3af);font-weight:600;letter-spacing:.03em}
.job-ago{margin-left:auto;font-size:.76rem;color:var(--inksx,#9ca3af)}

.job h3{font-family:'Sora','Hind Siliguri',sans-serif;font-size:1.04rem;margin:0 0 4px;
  line-height:1.35;color:var(--ink,#111827)}
.job .place{font-size:.87rem;color:var(--inks,#4b5563);margin:0 0 12px}

.job .tags{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 12px}
.job .tags span{background:var(--bd2,#f3f4f6);border-radius:6px;padding:3px 9px;
  font-size:.78rem;color:#374151}

.job dl{margin:0 0 14px;display:grid;grid-template-columns:78px 1fr;gap:6px 10px;font-size:.86rem}
.job dt{color:var(--inksx,#9ca3af);font-weight:600}
.job dd{margin:0;color:var(--ink,#111827)}

/* Only printed when the parent asked for a specific gender — "Any tutor
   preferred" is a line that tells a tutor nothing, on every card, forever. */
.job .pref{display:inline-flex;align-items:center;gap:6px;font-size:.87rem;font-weight:600;margin:0 0 10px}
.job .pref-female{color:#be185d}
.job .pref-male{color:#1e40af}

.job .money{font-family:'Sora','Hind Siliguri',sans-serif;font-weight:700;
  color:var(--g-dark,#085029);font-size:.98rem;margin:auto 0 12px}

.job .jbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.job .jb{border:0;border-radius:9px;padding:9px 15px;font-family:inherit;font-weight:600;
  font-size:.87rem;cursor:pointer;text-decoration:none;display:inline-block;line-height:1.2}
.job .jb-apply{background:var(--g,#0d6b3e);color:#fff}
.job .jb-apply:hover{text-decoration:none;opacity:.92;color:#fff}
.job .jb-ghost{background:#fff;color:var(--g,#0d6b3e);border:1px solid var(--g,#0d6b3e)}
.job .jb-ghost:hover{text-decoration:none;color:var(--g,#0d6b3e)}
.job .jb-share{background:#fff;color:#6b7280;border:1px solid #e5e7eb}
.job .jb-share.done{color:#0d6b3e;border-color:#0d6b3e}

.job .go{display:block;text-align:center;background:var(--g,#0d6b3e);color:#fff;border-radius:9px;
  padding:10px;font-family:'Sora','Hind Siliguri',sans-serif;font-weight:600;font-size:.88rem;
  text-decoration:none}
.job .go:hover{background:var(--g-dark,#085029);color:#fff}