/**
 * actualites.css — Liste des actualités (actualites-bs5.php), Bootstrap 5 Randozone.
 * Dépend de rz-bs5.css (tokens --rz-*) et rz-icons.svg.
 * Hero : hero-photo.css (.rz-hero-photo) page 1 / .rz-hero (rz-bs5.css) pages suivantes.
 * Shared (rz-bs5.css) : .eyebrow, .stat-chip, .rz-ico, .sb-card, .sb-head, .sb-links.
 */

/* ═══ Hero ═══ */
.rz-hero-photo .hp-body .actus-hero-eyebrow { margin-bottom: 0; }
.rz-hero.actus-hero h1 .lt { color: oklch(0.62 0.12 235); }

/* ═══ Note éditoriale (« pour publier une actualité… ») ═══ */
.actus-note {
  display: flex; align-items: flex-start; gap: .7rem;
  font-size: .88rem; line-height: 1.6; color: var(--rz-inksoft);
  background: var(--rz-surface); border: 1px solid var(--rz-border);
  border-radius: 14px; padding: .95rem 1.15rem; margin: 0 0 1.5rem;
}
.actus-note .rz-ico { width: 18px; height: 18px; color: var(--rz-blue); flex-shrink: 0; margin-top: .15rem; }
.actus-note a { color: var(--rz-blue); text-decoration: underline; text-underline-offset: 2px; }

/* ═══ En-tête de section ═══ */
.actus-sechead { margin-bottom: 1.25rem; }
.actus-h2 {
  font-family: 'Work Sans', system-ui, sans-serif;
  font-weight: 600; letter-spacing: -.02em; color: var(--rz-ink);
  font-size: 1.45rem; margin: .4rem 0 0;
}
@media (min-width: 768px) { .actus-h2 { font-size: 2rem; } }
.actus-h2 .actus-h2-count { font-size: .65em; font-weight: 500; color: var(--rz-inksoft); letter-spacing: 0; }

/* ═══ Liste des actualités ═══ */
/* La liste est scindée en plusieurs blocs .actus-list quand une pub est
   intercalée (rangs 5, 10, 15) : la marge basse reprend la valeur du gap
   pour que l'espacement reste régulier. */
.actus-list { display: flex; flex-direction: column; gap: 1rem; margin: 0 0 1rem; }

.actu-item {
  display: grid; grid-template-columns: 208px 1fr; gap: 1.15rem;
  background: var(--rz-surface); border: 1px solid var(--rz-border);
  border-radius: 16px; padding: .85rem;
  transition: border-color .15s, box-shadow .18s, transform .15s;
}
.actu-item:hover {
  border-color: color-mix(in oklch, var(--rz-blue) 50%, white);
  box-shadow: 0 16px 38px -26px rgba(20,40,80,.55);
  transform: translateY(-2px);
}

/* Visuel */
.actu-item .im {
  display: block; position: relative; border-radius: 12px; overflow: hidden;
  min-height: 158px; background: var(--rz-surface-2);
}
.actu-item .im img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; display: block; transition: transform .4s ease;
}
.actu-item:hover .im img { transform: scale(1.04); }

/* Corps */
.actu-item .bd { display: flex; flex-direction: column; min-width: 0; padding: .25rem .4rem .3rem 0; }
.actu-item .kick {
  display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;
  font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--rz-primary);
}
.actu-item .kick .sep { color: var(--rz-border); font-weight: 400; }
.actu-item .kick .date { color: var(--rz-inksoft); font-weight: 600; letter-spacing: .02em; }
.actu-item .kick .edit { text-transform: none; letter-spacing: 0; font-weight: 600; }
.actu-item h2 {
  font-family: 'Work Sans', system-ui, sans-serif;
  font-weight: 700; font-size: 1.25rem; letter-spacing: -.02em; line-height: 1.12;
  margin: .45rem 0 .35rem;
}
.actu-item h2 a { color: var(--rz-ink); text-decoration: none; }
.actu-item:hover h2 a { color: var(--rz-blue); }
.actu-item .chapo { font-size: .88rem; color: var(--rz-inksoft); line-height: 1.55; margin: 0; }

@media (max-width: 620px) {
  .actu-item { grid-template-columns: 1fr; }
  .actu-item .im { height: 170px; min-height: 0; }
}

/* ═══ Message liste vide ═══ */
.actus-empty {
  display: flex; align-items: center; gap: .6rem;
  padding: 1.5rem 1.15rem; color: var(--rz-inksoft); font-size: .9rem;
  background: var(--rz-surface); border: 1px solid var(--rz-border); border-radius: 16px;
}
.actus-empty .rz-ico { width: 18px; height: 18px; color: var(--rz-blue); flex-shrink: 0; }

/* ═══ Pagination ═══ */
.actus-pager { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 2rem; justify-content: center; }
.actus-pager a,
.actus-pager .cur {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.25rem; height: 2.25rem; padding: 0 .5rem; border-radius: 9px;
  font-family: monospace; font-size: .82rem; font-weight: 600;
  text-decoration: none; border: 1px solid var(--rz-border); background: var(--rz-surface);
  color: var(--rz-ink); transition: border-color .14s, background .14s, color .14s;
}
.actus-pager a:hover {
  border-color: var(--rz-blue); color: var(--rz-blue);
  background: color-mix(in oklch, var(--rz-blue) 6%, white);
}
.actus-pager .cur { background: var(--rz-blue); border-color: var(--rz-blue); color: #fff; cursor: default; }
.actus-pager .nav-btn { padding: 0 .6rem; }
.actus-pager .nav-btn .rz-ico { width: 14px; height: 14px; }
.actus-pager .dots {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.25rem; height: 2.25rem; font-size: .82rem;
  color: var(--rz-inksoft); letter-spacing: .05em; cursor: default;
}

/* ═══ Bloc admin (filtre + sections) — @mutualisable, repris de categorie.css ═══ */
.rz-admin-block {
  background: #fff3cd; border-left: 3px solid #ffc107;
  border-radius: 0 8px 8px 0; padding: .75rem 1rem;
  font-size: .82rem; margin-bottom: 1.25rem;
}
.rz-admin-title { font-weight: 700; margin: 0 0 .4rem; font-size: .85rem; }
.rz-admin-block a { color: var(--rz-ink); text-decoration: underline; }
.rz-admin-block ul { padding-left: 1.1rem; margin: 0; }
.rz-admin-block li { margin-bottom: .2rem; }

.actus-filter { display: flex; gap: .4rem; margin: 0 0 .75rem; }
.actus-filter input {
  flex: 1 1 auto; min-width: 0; padding: .35rem .6rem;
  border: 1px solid var(--rz-border); border-radius: 8px;
  font-size: .82rem; background: #fff; color: var(--rz-ink);
}
.actus-filter button {
  padding: .35rem .8rem; border: 1px solid var(--rz-border); border-radius: 8px;
  background: var(--rz-surface); color: var(--rz-ink);
  font-size: .82rem; font-weight: 600; cursor: pointer;
}
.actus-filter button:hover { border-color: var(--rz-blue); color: var(--rz-blue); }