/* Recruiter "Mes Offres" (R7) — refonte maquette B3 (retour client 06/08).
   Styles portés depuis la maquette canonique /mockups/recruiter/positions
   (version mergée 15/07) : filtres établissement / pôle, KPIs, onglets statut,
   toolbar de tri, tableau d'offres. Tout est scopé .page-recruiter-positions ;
   zéro CSS inline dans la vue. Le panneau d'aperçu latéral JS de la maquette
   est remplacé par la vraie page « Aperçu » (preview vue candidat). */

.page-recruiter-positions { box-sizing: border-box; }
.page-recruiter-positions *, .page-recruiter-positions *::before, .page-recruiter-positions *::after { box-sizing: border-box; }
.page-recruiter-positions {
  --cream:#FAF9F6; --cream-line:#EFE2BC;
  --n-0:#FFF; --n-50:#FAFAF8; --n-100:#F4F2EE; --n-200:#E5E2DC; --n-300:#C9C5BC;
  --n-400:#A8A399; --n-500:#8A857A; --n-700:#4A4640; --n-900:#2C2C2C;
  --green:#1B7A4E; --green-600:#1B7A4E; --green-50:#EAF4EE; --green-200:#BFE0CC;
  --blue:#5B7A9B; --blue-50:#EEF2F6; --amber:var(--gold-500); --red:#B0432F; --red-50:#FBF4F1; --red-200:#F0D9D1;
  --violet:#7C5CBF; --violet-50:#F3F0FA;
  --gold-satin:linear-gradient(115deg,var(--gold-500) 0%,var(--gold-primary) 20%,var(--gold-200) 42%,#F7EDC9 50%,var(--gold-200) 63%,var(--gold-primary) 84%,var(--gold-500) 100%);
  --gold-satin-soft:linear-gradient(115deg,var(--gold-500) 0%,var(--gold-400) 22%,var(--gold-300) 45%,var(--gold-200) 52%,var(--gold-300) 66%,var(--gold-500) 84%,var(--gold-500) 100%);
  --font-sans:'Geist','Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --font-mono:'Geist Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --t:150ms ease; --shadow-sm:0 1px 2px rgba(44,44,44,.05);
  background:#FFFFFF; font-family:var(--font-sans); color:var(--n-900);
}
.page-recruiter-positions a { text-decoration:none; color:inherit; }
.page-recruiter-positions button { font-family:inherit; border:none; background:none; cursor:pointer; color:inherit; }
.page-recruiter-positions .ic { width:16px; height:16px; flex-shrink:0; }
.page-recruiter-positions .ic-sm { width:16px; height:16px; flex-shrink:0; }
.page-recruiter-positions .ic-sm svg { width:16px; height:16px; display:block; }

/* Le layout recruteur fournit déjà le conteneur (max-w-7xl + padding
   horizontal + pt-90) : le .wrap de la maquette ne garde ici que les
   espacements verticaux. */
.page-recruiter-positions .wrap { padding:24px 0 60px; }

/* ── En-tête ── */
.page-recruiter-positions .head-line { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.page-recruiter-positions h1 { font-family:'Playfair Display',Georgia,serif; font-size:32px; font-weight:600; letter-spacing:-.02em; line-height:1.1; margin:0; }
/* inline-block + padding droit : sans ça le jambage de la dernière lettre en
   italique sort de la boîte de peinture du background-clip:text et se retrouve
   rogné (le « s » coupé). Le margin négatif annule le décalage de mise en page. */
.page-recruiter-positions h1 em { font-style:italic; font-weight:600; display:inline-block; padding-right:.14em; margin-right:-.14em; background:var(--gold-text-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.page-recruiter-positions .sub { font-size:13.5px; color:var(--n-500); margin-top:6px; }
.page-recruiter-positions .btn-publish { display:inline-flex; align-items:center; gap:8px; height:46px; padding:0 22px; border-radius:999px; font-size:14px; font-weight:600; white-space:nowrap; color:#fff; text-shadow:0 1px 1px rgba(110,88,44,.55); background:var(--gold-satin-soft); box-shadow:0 3px 10px rgba(163,133,67,.28), inset 0 1px 0 rgba(255,255,255,.28); transition:all .18s ease; }
.page-recruiter-positions .btn-publish svg { width:18px; height:18px; flex-shrink:0; }
.page-recruiter-positions .btn-publish:hover { transform:translateY(-1px); filter:saturate(1.06) brightness(1.02); box-shadow:0 5px 16px rgba(163,133,67,.36), inset 0 1px 0 rgba(255,255,255,.28); }
.page-recruiter-positions .btn-publish:active { transform:translateY(0); filter:brightness(.97); }

.page-recruiter-positions .blk-lbl { font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-600); margin:0 0 12px; }

/* ── Filtres établissement / pôle ── */
.page-recruiter-positions .filters-row { display:flex; gap:32px; align-items:flex-start; margin-top:28px; }
.page-recruiter-positions .fblock { flex:1 1 0; min-width:0; }
.page-recruiter-positions .poles { display:flex; gap:11px; flex-wrap:nowrap; overflow-x:auto; padding-bottom:6px; scrollbar-width:thin; }
.page-recruiter-positions .pole { flex:0 0 104px; width:104px; cursor:pointer; display:block; }
.page-recruiter-positions .pole-card { height:77px; border-radius:14px; border:1px solid var(--n-200); background:var(--n-50); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; transition:all var(--t); overflow:hidden; position:relative; }
.page-recruiter-positions .pole:hover .pole-card { border-color:var(--gold-300); }
.page-recruiter-positions .pole.on .pole-card { border-color:var(--gold-400); box-shadow:0 2px 10px rgba(163,133,67,.18); }
.page-recruiter-positions .pole-card .allico { width:19px; height:19px; color:var(--gold-600); }
.page-recruiter-positions .pole-card .allico svg { width:19px; height:19px; display:block; }
.page-recruiter-positions .pole-card .allnum { font-size:16px; font-weight:700; line-height:1; }
.page-recruiter-positions .pole-card .allsub { font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--n-500); }
.page-recruiter-positions .pole-photo { width:100%; height:100%; position:relative; background-size:cover; background-position:center; }
.page-recruiter-positions .pp-a { background:linear-gradient(135deg,#2e2a22,var(--gold-700) 70%,var(--gold-600)); }
.page-recruiter-positions .pp-b { background:linear-gradient(135deg,#20302a,#3d5a4a 70%,var(--gold-700)); }
.page-recruiter-positions .pole-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.page-recruiter-positions .pole-photo .tag { position:absolute; top:8px; left:8px; font-family:var(--font-mono); font-size:8px; font-weight:700; letter-spacing:.06em; color:#fff; text-shadow:0 1px 2px rgba(60,44,10,.45); background:var(--gold-satin); border-radius:5px; padding:2px 6px; }
.page-recruiter-positions .pole-name { font-size:11px; font-weight:600; margin-top:6px; text-align:center; }
.page-recruiter-positions .pole-meta { font-size:10px; color:var(--gold-700); text-align:center; }
/* align-items:stretch obligatoire au passage en colonne : avec le flex-start
   herite, chaque bloc se dimensionne sur son contenu, donc sur la bande de poles
   non repliee (465px), et la page entiere part a droite. La bande, elle, defile
   deja toute seule (.poles est en overflow-x:auto). */
@media(max-width:900px){ .page-recruiter-positions .filters-row{ flex-direction:column; gap:20px; align-items:stretch; } }

/* ── KPIs ── */
.page-recruiter-positions .kpirow { display:flex; gap:12px; margin:22px 0 4px; flex-wrap:wrap; }
.page-recruiter-positions .kpi { flex:1 1 0; min-width:140px; display:flex; flex-direction:column; align-items:flex-start; gap:3px; border:1px solid var(--n-200); background:#fff; border-radius:12px; padding:13px 16px; text-align:left; }
.page-recruiter-positions .kpi-n { font-size:23px; font-weight:700; line-height:1; color:var(--n-900); }
.page-recruiter-positions .kpi-l { font-size:11px; color:var(--n-500); font-weight:500; }
.page-recruiter-positions .kpi-good { color:var(--green)!important; }
.page-recruiter-positions .kpi-weak { color:var(--amber)!important; }
/* Donnée sans modèle (entretiens planifiés) : grisée, annotée « Bientôt ». */
.page-recruiter-positions .kpi--soon { opacity:.55; background:var(--n-50); }
.page-recruiter-positions .kpi-soon-badge { font-family:var(--font-mono); font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--n-500); background:var(--n-100); border-radius:999px; padding:2px 8px; margin-left:6px; }

/* ── Onglets statut ── */
.page-recruiter-positions .tabs { display:flex; gap:4px; border-bottom:1px solid var(--n-200); margin:26px 0 0; overflow-x:auto; }
.page-recruiter-positions .tab { display:inline-flex; align-items:center; gap:8px; padding:13px 15px; font-size:13.5px; font-weight:500; color:var(--n-500); border-bottom:2px solid transparent; white-space:nowrap; transition:all var(--t); }
.page-recruiter-positions .tab:hover { color:var(--gold-700); }
.page-recruiter-positions .tab.on { color:var(--gold-700); border-bottom-color:var(--gold-500); font-weight:600; }
.page-recruiter-positions .tab .cnt { font-family:var(--font-mono); font-size:11px; font-weight:600; background:var(--n-100); border-radius:999px; padding:1px 7px; color:var(--n-700); }
.page-recruiter-positions .tab.on .cnt { background:var(--gold-100); color:var(--gold-700); }

/* ── Toolbar tri ── */
.page-recruiter-positions .toolbar { display:flex; align-items:center; gap:12px; margin:20px 0 8px; flex-wrap:wrap; }
.page-recruiter-positions .sort { margin-left:auto; display:inline-flex; align-items:center; gap:8px; font-size:13px; color:var(--n-500); }
.page-recruiter-positions .sort-seg { display:inline-flex; background:var(--n-100); border-radius:999px; padding:3px; }
.page-recruiter-positions .sort-seg a { font-size:12.5px; font-weight:600; color:var(--n-500); padding:6px 12px; border-radius:999px; }
.page-recruiter-positions .sort-seg a.on { background:#fff; color:var(--gold-700); box-shadow:var(--shadow-sm); }

/* ── Tableau des offres ── */
.page-recruiter-positions .otable { margin-top:8px; }
.page-recruiter-positions .ohead { display:grid; grid-template-columns:1.7fr 1.5fr .8fr .7fr .5fr .8fr 3fr; gap:14px; padding:0 18px 12px; border-bottom:1px solid var(--n-200); }
.page-recruiter-positions .ohead span { font-family:var(--font-mono); font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--n-500); }
.page-recruiter-positions .ohead .c { text-align:center; }
.page-recruiter-positions .ohead .r { text-align:right; }
.page-recruiter-positions .orow { display:grid; grid-template-columns:1.7fr 1.5fr .8fr .7fr .5fr .8fr 3fr; gap:14px; align-items:center; padding:18px; border-bottom:1px solid var(--n-100); transition:background var(--t); text-align:center; cursor:pointer; }
.page-recruiter-positions .orow:hover { background:var(--n-50); }
.page-recruiter-positions .orow.draft { background:var(--blue-50); border-radius:12px; border-bottom:1px solid transparent; }
.page-recruiter-positions .orow.paused { background:#FCF6EC; }
.page-recruiter-positions .orow.closed { background:var(--n-50); }

.page-recruiter-positions .o-etab { display:flex; align-items:center; justify-content:flex-start; gap:10px; }
.page-recruiter-positions .o-etab-link { border-radius:10px; padding:4px 6px; transition:background var(--t); }
.page-recruiter-positions .o-etab-link:hover { background:var(--gold-50); }
.page-recruiter-positions .o-etab-link:hover .o-etab-txt { color:var(--gold-700); }
.page-recruiter-positions .etab-mono { width:34px; height:34px; border-radius:9px; display:grid; place-items:center; color:#fff; font-weight:700; font-size:13px; flex-shrink:0; box-shadow:0 2px 6px rgba(44,44,44,.12); line-height:1; }
.page-recruiter-positions .mono-a { background:linear-gradient(135deg,var(--gold-700),var(--gold-500)); }
/* #2908 — pastille portant le logo de la Maison : l'image remplit la vignette,
   le dégradé de repli ne doit pas déborder derrière elle. */
.page-recruiter-positions .etab-mono.has-photo { overflow:hidden; background:none; }
.page-recruiter-positions .etab-mono.has-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.page-recruiter-positions .mono-b { background:linear-gradient(135deg,#3d5a4a,#6e8f76); }
.page-recruiter-positions .o-etab-txt { display:flex; flex-direction:column; text-align:left; font-size:13.5px; font-weight:600; color:var(--n-900); line-height:1.25; }
.page-recruiter-positions .o-etab-type { font-size:11.5px; color:var(--gold-700); margin-top:2px; font-weight:400; }

.page-recruiter-positions .o-poste { text-align:left; }
.page-recruiter-positions .o-poste-link { font-size:15px; font-weight:600; }
.page-recruiter-positions .o-poste-link:hover { color:var(--gold-700); text-decoration:underline; }
.page-recruiter-positions .o-meta { font-size:12px; color:var(--gold-700); font-weight:500; margin-top:3px; display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.page-recruiter-positions .o-meta .sep { color:var(--n-300); }
/* "Nouveau" (AC7.3) — offre publiée depuis moins de 7 jours. */
.page-recruiter-positions .o-new { display:inline-flex; align-items:center; margin-left:7px; padding:2px 8px; border-radius:100px; font-family:var(--font-mono); font-size:8px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; vertical-align:2px; color:#fff; text-shadow:0 1px 2px rgba(60,44,10,.35); background:var(--gold-satin); }

.page-recruiter-positions .o-status { font-size:12.5px; font-weight:600; display:inline-flex; align-items:center; justify-content:center; }
.page-recruiter-positions .o-status.active { color:var(--green); }
.page-recruiter-positions .o-status.pause { color:var(--amber); }
.page-recruiter-positions .o-status.draft { color:var(--blue); }
.page-recruiter-positions .o-status.closed { color:var(--n-400); }
.page-recruiter-positions .o-status.filled { color:var(--violet); }
.page-recruiter-positions .o-status .sdot { display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:6px; }
.page-recruiter-positions .o-status.active .sdot { background:var(--green); }
.page-recruiter-positions .o-status.pause .sdot { background:var(--amber); }
.page-recruiter-positions .o-status.draft .sdot { background:var(--blue); }
.page-recruiter-positions .o-status.closed .sdot { background:var(--n-400); }
.page-recruiter-positions .o-status.filled .sdot { background:var(--violet); }
/* R1 (revue Loïc 06/08) — modération : « En modération » (bleu, l'offre reste
   diffusée) et « Bloquée » (rouge, diffusion coupée), vocabulaire de la
   maquette dashboard B3. */
.page-recruiter-positions .o-status.mod { color:var(--blue); }
.page-recruiter-positions .o-status.mod .sdot { background:var(--blue); }
.page-recruiter-positions .o-status.blk { color:var(--red); }
.page-recruiter-positions .o-status.blk .sdot { background:var(--red); }

/* Note de modération : pleine largeur sous la ligne (grid-column 1/-1). */
.page-recruiter-positions .o-note { grid-column:1/-1; display:flex; align-items:center; gap:12px; margin-top:12px; padding:10px 14px; border-radius:10px; font-size:12px; line-height:1.45; text-align:left; }
.page-recruiter-positions .o-note b { display:block; margin-bottom:1px; }
.page-recruiter-positions .o-note.mod { background:var(--blue-50); color:var(--blue); }
.page-recruiter-positions .o-note.blk { background:var(--red-50); color:var(--red); }
.page-recruiter-positions .o-note form { margin-left:auto; }
.page-recruiter-positions .o-note-cta { white-space:nowrap; font-size:11.5px; font-weight:600; color:var(--red); background:#fff; border:1px solid var(--red-200); border-radius:100px; padding:6px 13px; cursor:pointer; transition:background var(--t); }
.page-recruiter-positions .o-note-cta:hover { background:var(--red-200); }
@media (max-width:900px) {
  .page-recruiter-positions .o-note { flex-direction:column; align-items:flex-start; }
  .page-recruiter-positions .o-note form { margin-left:0; }
}

.page-recruiter-positions .o-num { text-align:center; font-size:15px; font-weight:600; }
.page-recruiter-positions .o-num.mut { color:var(--n-300); }
.page-recruiter-positions .o-date { font-size:12.5px; color:var(--n-500); text-align:center; }

.page-recruiter-positions .o-actions { display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.page-recruiter-positions .oact-cand-btn { display:inline-flex; align-items:center; gap:7px; height:36px; padding:0 14px; font-size:12px; font-weight:600; color:#fff; text-shadow:0 1px 1px rgba(110,88,44,.55); background:var(--gold-satin-soft); border-radius:999px; box-shadow:0 2px 6px rgba(163,133,67,.26), inset 0 1px 0 rgba(255,255,255,.22); white-space:nowrap; transition:all .18s ease; }
.page-recruiter-positions .oact-cand-btn:hover { transform:translateY(-1px); filter:saturate(1.06) brightness(1.02); box-shadow:0 4px 12px rgba(163,133,67,.32), inset 0 1px 0 rgba(255,255,255,.22); }
.page-recruiter-positions .cand-badge { font-family:var(--font-mono); font-size:10px; font-weight:700; background:rgba(255,255,255,.28); color:#fff; border-radius:999px; padding:1px 6px; }
.page-recruiter-positions .oicons { display:flex; gap:6px; row-gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.page-recruiter-positions .oact-wrap { display:inline-flex; flex-direction:column; align-items:center; gap:3px; min-width:48px; }
.page-recruiter-positions .oact-wrap form { margin:0; display:flex; }
.page-recruiter-positions .oact { width:40px; height:40px; border-radius:11px; border:1px solid var(--n-200); background:#fff; display:grid; place-items:center; color:var(--n-500); transition:all var(--t); padding:0; }
.page-recruiter-positions .oact svg { width:16px; height:16px; }
.page-recruiter-positions .oact:hover { border-color:var(--gold-300); color:var(--gold-700); background:var(--gold-50); }
.page-recruiter-positions .oact.oact-edit { border-color:var(--green-200); color:var(--green); background:var(--green-50); }
.page-recruiter-positions .oact.oact-edit:hover { border-color:var(--green); color:#155e3c; background:#DFF0E6; }
.page-recruiter-positions .oact.danger:hover { border-color:var(--red-200); color:var(--red); background:var(--red-50); }
.page-recruiter-positions .oact-lbl { font-size:9px; line-height:1; font-weight:600; color:var(--n-500); white-space:nowrap; }

.page-recruiter-positions .empty { text-align:center; padding:56px 20px; color:var(--n-500); }

@media(max-width:1080px){
  .page-recruiter-positions .ohead { display:none; }
  .page-recruiter-positions .orow { grid-template-columns:1fr; gap:12px; padding:16px; border:1px solid var(--n-200); border-radius:14px; margin-bottom:12px; text-align:left; }
  .page-recruiter-positions .orow:hover { background:#fff; }
  .page-recruiter-positions .o-num, .page-recruiter-positions .o-date, .page-recruiter-positions .o-status { justify-content:flex-start; text-align:left; }
  .page-recruiter-positions .o-actions { align-items:flex-start; }
  .page-recruiter-positions .oicons { justify-content:flex-start; }
}
