/* Liste des offres : chargée par cette seule page, hors du budget des pages publiques. La carte d'offre (.job-card),
   commune à plusieurs pages, reste dans site.css. */
.page-header { align-items: end; gap: 10px; margin-bottom: 16px; }
.page-header > div { flex: 1 1 340px; min-width: 0; }
.page-header h1 { margin-bottom: 2px; }
.list-sub { color: var(--muted); font-size: 14px; }
.list-sub p, .page-metrics { display: inline; margin: 0; }
.metric { display: inline-flex; flex-direction: row-reverse; gap: .3em; margin: 0; }
.metric dt { font-weight: 400; text-transform: lowercase; }
.metric dd { margin: 0; font-weight: 600; color: var(--text); font-variant-numeric: tabular-nums; }
.page-metrics + .freshness::before { content: "· "; }
.freshness:first-child { display: block; }
.freshness:first-child::first-letter { text-transform: uppercase; }

/* Recherche : trois champs libellés sur une ligne. */
.searchbar.card { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) auto; gap: 8px; align-items: end;
  padding: 12px; margin: 0 0 18px; border-radius: var(--radius-lg); }
.search-field { display: grid; gap: 3px; min-width: 0; margin: 0; font-size: 12.5px; font-weight: 400; color: var(--muted); }
.search-field input { width: 100%; max-width: none; height: 40px; padding: 0 10px; font-size: 15px; color: var(--text); }
.search-field input::placeholder { color: var(--muted); opacity: 1; }
.searchbar > button { height: 40px; padding-inline: 22px; justify-content: center; white-space: nowrap; }

/* Filtres en colonne, résultats à côté. */
.layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 20px; align-items: start; }
.results-col { min-width: 0; margin: 0; }
.filters { position: sticky; top: 12px; max-height: calc(100vh - 24px); overflow-y: auto; scrollbar-width: thin;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.filters-toggle { display: none; align-items: center; min-height: 44px; padding: 0 14px; cursor: pointer; list-style: none; font-weight: 600; }
.filters-box:not([open]) > .filters-toggle { display: flex; }
.filters-body { display: grid; gap: 12px; padding: 2px 14px 14px; }
.filters-toggle::-webkit-details-marker, .facet > summary::-webkit-details-marker { display: none; }
.facet { border-block-end: 1px solid var(--border); }
.facet > summary { display: flex; align-items: center; gap: 8px; min-height: 42px; cursor: pointer; list-style: none; font-size: 14px; font-weight: 600; }
.filters-toggle::after, .facet > summary::after { content: "+"; margin-inline-start: auto; color: var(--muted); font-size: 18px; font-weight: 400; line-height: 1; }
.filters-box[open] > .filters-toggle::after, .facet[open] > summary::after { content: "\2212"; }
.filters-toggle:focus-visible, .facet > summary:focus-visible { outline-offset: -2px; border-radius: 6px; }
.facet-n { min-width: 20px; padding: 0 6px; border-radius: 999px; background: var(--action); color: var(--on-action); font-size: 12px; line-height: 20px; text-align: center; }
.facet fieldset { min-width: 0; margin: 0; padding: 0 0 10px; border: 0; }
.filters .checks { gap: 0; margin: 0; }
.checks.scroll { max-height: 224px; overflow-y: auto; scrollbar-width: thin; padding-inline-end: 6px; }
.checks label, .filters .check { display: flex; align-items: flex-start; gap: 8px; min-height: 30px; margin: 0; padding-block: 4px; font-size: 14px; font-weight: 400; line-height: 1.4; cursor: pointer; }
.checks label.muted { color: var(--muted); }
.checks label:hover .check-label-text { color: var(--link); }
.check-label-text { min-width: 0; overflow-wrap: anywhere; }
.checks .count { margin-inline-start: auto; padding-inline-start: 8px; color: var(--muted); font-size: 12.5px; line-height: 1.6; white-space: nowrap; font-variant-numeric: tabular-nums; }
.checks input, .filters .check input { width: 16px; height: 16px; margin-block-start: 2px; }
.checks .group { margin: 8px 0 2px; color: var(--muted); font-size: 12px; font-weight: 600; }
.checks .group:first-child { margin-top: 0; }
.filter-actions { gap: 8px; }
.live-filters .live-hide { display: none; }
.filter-scope { margin: 0; font-size: 12.5px; line-height: 1.45; }

/* En-tête des résultats. */
.results-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 0 0 12px; }
.result-count { font: 700 18px/1.3 "Space Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; letter-spacing: -.02em; }
[dir=rtl] .result-count { font-family: inherit; letter-spacing: 0; }
.map-link { min-height: 34px; }
.map-link .inline-icon { width: 14px; height: 14px; }
.results-toolbar label { display: inline-flex; align-items: center; margin: 0; font-size: 13px; font-weight: 400; color: var(--muted); }
.results-toolbar select { width: auto; height: 34px; padding: 0 8px; font-size: 14px; }
.results-col[aria-busy="true"] .results { opacity: .55; transition: opacity .15s; }
.results.grid { grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); align-items: stretch; }

/* Critères actifs et alerte. */
.criteria { justify-content: space-between; gap: 8px 12px; margin-bottom: 12px; }
.criteria p { margin: 0; }
.active-criteria { list-style: none; margin: 0; padding: 0; }
.active-criteria a { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; background: var(--green-100); border-color: transparent; color: var(--link); }
.active-criteria a:hover { border-color: var(--action); }
.active-criteria a.clear { background: none; color: var(--muted); }
.save-search { flex-wrap: nowrap; margin: 0; }
.save-search input { width: 12rem; max-width: 40vw; height: 32px; padding: 0 9px; font-size: 13px; }
.criteria .btn-primary { white-space: nowrap; }
.alert-login { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--action); border-radius: 10px; text-decoration: none; }
.criteria .btn-primary .inline-icon { width: 14px; height: 14px; }
.opp h3 mark { padding: 0 1px; border-radius: 2px; background: #fff0a6; color: inherit; }
[data-theme=dark] .opp h3 mark { background: #5a4a00; color: #fff; }

/* Aucune offre. */
.results .empty { padding: 40px 24px; text-align: center; }
.empty > .inline-icon { width: 40px; height: 40px; color: var(--muted); }
.empty h2 { margin: 10px 0 6px; font-size: 19px; }
.empty p { max-width: 54ch; margin: 0 auto 12px; }
.empty p:last-child { margin-bottom: 0; }

/* Pagination. */
.results-col .pager { gap: 6px; margin-top: 22px; }
.results-col .pager a, .results-col .pager .current { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 36px; height: 36px;
  padding: 0 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text); font-size: 14px; font-weight: 400; text-decoration: none; }
.results-col .pager a:hover { border-color: var(--action); color: var(--action); background: var(--surface); }
.results-col .pager .current { border-color: var(--action); background: var(--action); color: var(--on-action); font-weight: 600; }
.results-col .pager .gap { min-width: 14px; text-align: center; }

@media (prefers-reduced-motion: reduce) {
  .results-col[aria-busy="true"] .results { transition: none; }
}
@media (max-width: 900px) {
  .layout { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .filters { position: static; max-height: none; overflow: visible; }
  .filters-toggle { display: flex; }
  .filters-box[open] > .filters-toggle { border-block-end: 1px solid var(--border); }
  .filters-body { padding-top: 0; }
  /* Avec JavaScript, le bloc démarre replié sans éclair (site.js pose .ready) ; sans JavaScript, il reste ouvert et repliable. */
  .js .filters-box:not(.ready) > .filters-body { display: none; }
  .facet > summary, .checks label, .filters .check { min-height: 44px; align-items: center; }
  .checks input, .filters .check input { width: 20px; height: 20px; margin: 0; }
  .search-field input { height: 44px; font-size: 16px; }
  .searchbar > button { height: 44px; }
  .map-link, .results-toolbar select { min-height: 44px; }
  .active-criteria a { min-height: 44px; }
  .save-search input { height: 44px; }
  .results-col .pager a, .results-col .pager .current { min-width: 44px; height: 44px; }
}
@media (max-width: 760px) {
  .searchbar.card { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .search-field:first-child, .searchbar > button { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  .view-toggle { display: none !important; }
}
@media (max-width: 640px) {
  .page-header { margin-bottom: 12px; }
  /* Nombre et carte sur une ligne, tri sur la suivante. */
  .results-toolbar .spacer { order: 1; flex: 0 0 100%; height: 0; }
  .results-toolbar .map-link { margin-inline-start: auto; }
  .results-toolbar label, .results-toolbar select { order: 2; }
  .results-toolbar select { flex: 1 1 0; min-width: 0; }
  .results-col .pager { gap: 4px; }
  .results-col .pager a[rel] { flex: 1 1 40%; order: 2; }
  .results-col .pager a:not([rel]), .results-col .pager .current { padding: 0 6px; }
}
