/* Recruiter "Mes Offres" list (R7). Pixel-perfect copy of the canonical mockup
   /mockups/recruiter/positions, bound to real JobPositions. All rules scoped
   under .page-recruiter-positions so they never leak into the shared chrome.
   Zero inline CSS in the view. */

/* Le mockup enveloppe le contenu dans .rp-main (padding-top: 24px) en plus du
   pt-90 du layout ; ici le layout fournit déjà max-width/padding horizontal, on
   ne rajoute que cet espacement haut pour matcher exactement la maquette. */
.page-recruiter-positions { font-family: 'Geist', system-ui, sans-serif; color: #1a1a1a; padding-top: 24px; }
.page-recruiter-positions *, .page-recruiter-positions *::before, .page-recruiter-positions *::after { box-sizing: border-box; }

/* ── Page top ── */
.rp-page-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.rp-page-title { font-family: 'Geist', system-ui, sans-serif; font-size: 26px; font-weight: 700; }
.rp-page-title em { font-style: italic; color: #B8975A; font-weight: 400; }
.rp-page-sub { font-size: 12px; color: #999; margin-top: 2px; }

/* ── KPI Strip ── */
.rp-kpi-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
.rp-kpi { padding: 16px; border-radius: 12px; background: linear-gradient(180deg, #FFFFFF 0%, #FBF7EA 100%); border: 1px solid rgba(184, 145, 42, .16); box-shadow: 0 2px 12px rgba(184, 145, 42, .05); }
.rp-kpi-num { font-family: 'Geist', system-ui, sans-serif; font-size: 28px; font-weight: 700; color: #1a1a1a; }
.rp-kpi-num.rp-gold { color: #B8975A; }
.rp-kpi-label { font-size: 10px; color: #999; margin-top: 2px; font-weight: 600; }

/* ── Filters ── */
.rp-filters { display: flex; gap: 6px; margin-bottom: 16px; flex-wrap: wrap; }
.rp-filter-btn { padding: 7px 16px; border-radius: 100px; font-size: 11px; font-weight: 600; border: 1.5px solid rgba(0, 0, 0, .08); color: #777; transition: .2s; background: #fff; cursor: pointer; font-family: inherit; text-decoration: none; display: inline-flex; align-items: center; }
.rp-filter-btn:hover { border-color: #B8975A; color: #B8975A; }
.rp-filter-btn.rp-active { background: #1a1a1a; color: #fff; border-color: #1a1a1a; }

/* ── Jobs Table ── */
.rp-jt-head { display: grid; grid-template-columns: 2.2fr 1.2fr .8fr .7fr .7fr .7fr .5fr; padding: 10px 16px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: #999; border-bottom: 1.5px solid rgba(0, 0, 0, .06); }
.rp-jt-row { display: grid; grid-template-columns: 2.2fr 1.2fr .8fr .7fr .7fr .7fr .5fr; padding: 14px 16px; align-items: center; border-bottom: 1px solid rgba(0, 0, 0, .03); transition: .15s; }
.rp-jt-row { cursor: pointer; }
.rp-jt-row:hover { background: #FAFAFA; }
.rp-jt-row.rp-draft { opacity: 0.6; background: rgba(59, 130, 246, .05); }
.rp-jt-row.rp-row-active { background: rgba(16, 185, 129, .06); }
.rp-jt-row.rp-row-paused { background: rgba(217, 119, 6, .06); }
.rp-jt-row.rp-row-closed { background: rgba(107, 114, 128, .05); }
.rp-jt-title { font-size: 13px; font-weight: 700; color: #1a1a1a; display: flex; align-items: center; gap: 7px; }
.rp-jt-type { font-size: 10px; color: #B8975A; font-weight: 600; margin-top: 1px; }
.rp-jt-venue { font-size: 11px; color: #777; }
.rp-jt-venue-badge { margin-top: 6px; transform: scale(0.65); transform-origin: left center; display: inline-flex; }

/* "Nouveau" flag (AC7.3) */
.rp-jt-new { display: inline-flex; align-items: center; padding: 2px 7px; border-radius: 100px; font-size: 8px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; background: linear-gradient(135deg, #C4A559, #EFE2B8); color: #fff; }

/* ── Status badges ── */
.rp-jt-stat { display: inline-flex; padding: 3px 10px; border-radius: 100px; font-size: 9px; font-weight: 700; }
.rp-jt-stat.rp-stat-active { background: #F0FAF4; color: #10B981; }
.rp-jt-stat.rp-stat-pause { background: #FFFBEB; color: #D97706; }
.rp-jt-stat.rp-stat-draft { background: #EFF6FF; color: #3B82F6; }
.rp-jt-stat.rp-stat-closed { background: #F3F4F6; color: #6B7280; }
.rp-jt-stat.rp-stat-filled { background: #F5F3FF; color: #7C3AED; }

/* ── Numbers / date / actions ── */
.rp-jt-head span:nth-child(4), .rp-jt-head span:nth-child(5) { text-align: center; }
.rp-jt-num { font-size: 13px; font-weight: 700; color: #1a1a1a; text-align: center; }
.rp-jt-num-muted { font-size: 13px; font-weight: 700; color: #777; text-align: center; }
.rp-jt-date { font-size: 10px; color: #999; }
.rp-jt-actions { display: flex; gap: 4px; }
.rp-jt-act { width: 28px; height: 28px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, .06); display: flex; align-items: center; justify-content: center; font-size: 12px; transition: .15s; background: #fff; cursor: pointer; font-family: inherit; color: inherit; padding: 0; }
.rp-jt-act:hover { border-color: #B8975A; background: rgba(184, 151, 90, .04); }
.rp-jt-act form { margin: 0; display: flex; }

/* ── Hotel badge (inline replica) ── */
.rp-marker-hotel5 { display: inline-flex; align-items: center; gap: 10px; padding: 12px 26px; border-radius: 9999px; font-family: 'Geist', system-ui, sans-serif; font-size: 16px; font-weight: 800; letter-spacing: 1.5px; line-height: 1; white-space: nowrap; background: linear-gradient(175deg, #E8D5A3 0%, #C9A96E 50%, #9E7A44 100%); color: #fff; }
.rp-marker-hotel5 svg { flex-shrink: 0; }

/* ── Empty state ── */
.rp-empty { padding: 48px 16px; text-align: center; color: #999; font-size: 13px; }

/* ── Responsive ── */
@media (max-width: 900px) {
  .rp-kpi-strip { grid-template-columns: repeat(2, 1fr); }
  .rp-jt-head { display: none; }
  .rp-jt-row { grid-template-columns: minmax(0, 1.6fr) auto auto; gap: 10px; padding: 14px 12px; }
  .rp-jt-venue, .rp-jt-date, .rp-jt-num-muted { display: none; }
  .rp-jt-actions { justify-content: flex-end; }
}
@media (max-width: 600px) {
  .rp-page-top { flex-direction: column; align-items: flex-start; gap: 12px; }
  .rp-kpi-strip { grid-template-columns: 1fr 1fr; }
}