:root { --brand:#c8102e; --bg:#f7f7f9; --text:#222; --muted:#666; }

*{ box-sizing:border-box }
body{ margin:0; background:var(--bg); color:var(--text); font:16px/1.5 system-ui,Segoe UI,Roboto,Arial }

/* Conteneurs */
.wrap{ max-width:min(1600px,95vw); margin:auto; padding:24px }
.wrap.narrow{ max-width:520px }

/* Titres & petits textes */
h1{ font-size:1.8rem; margin:.2rem 0 1rem }
h2{ font-size:1.1rem; margin:.6rem 0 .3rem }
.muted{ color:var(--muted) }
.small{ font-size:.9rem }

/* Grille de la page LISTE (cartes de reportages) */
.grid{
  display:grid;
  gap:18px;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.card{
  background:#fff;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 4px 16px rgba(0,0,0,.08);
}
.card img{ width:100%; height:180px; object-fit:cover; display:block }
.card-body{ padding:14px }

/* Boutons & formulaires */
.btn{
  display:inline-block;
  background:var(--brand);
  color:#fff;
  padding:10px 14px;
  border-radius:10px;
  text-decoration:none;
  border:0;
  cursor:pointer;
}
.btn.ghost{ background:transparent; color:var(--brand); border:1px solid var(--brand) }
.btn:hover{ filter:brightness(.95) }

.form-card{
  background:#fff; padding:18px; border-radius:12px;
  box-shadow:0 4px 16px rgba(0,0,0,.08); display:grid; gap:12px
}
label{ display:grid; gap:6px }
input[type="text"], input[type="password"], input[type="date"], input[type="file"], select{
  padding:10px; border:1px solid #ddd; border-radius:8px; width:100%
}

.alert{
  background:#fff3cd; color:#7a5a00; border:1px solid #ffe08a;
  padding:10px 12px; border-radius:8px; margin:10px 0
}

.header-inline{
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap
}

/* === Grille de la GALERIE (plein écran, responsive) === */
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
}
@media (min-width:1400px){
  .gallery-grid{ grid-template-columns:repeat(auto-fit,minmax(260px,1fr)) }
}

.gallery-item{
  position:relative;
  display:block;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.06);
}
.gallery-item a{ display:block; text-decoration:none }
/* Par ceci : vignettes recadrées et cohérentes */
.gallery-item img{
  width:100%;
  height:220px;          /* hauteur de vignette */
  object-fit:cover;      /* recadre au lieu d'étirer */
  display:block;
}
@media (min-width:900px){ .gallery-item img{ height:260px } }
@media (min-width:1400px){ .gallery-item img{ height:300px } }

/* === Sélection des photos === */
.sel{
  position:absolute; top:8px; left:8px;
  background:rgba(255,255,255,.9);
  padding:6px 8px; border-radius:8px;
  box-shadow:0 1px 4px rgba(0,0,0,.15);
  display:flex; align-items:center; gap:6px; font-size:14px;
  z-index:2;
}
.sel input{ width:18px; height:18px }

/* Barre d’actions sélection (collée en bas) */
.selection-bar{
  position:fixed; left:50%; transform:translateX(-50%);
  bottom:16px; background:#fff; border:1px solid #ddd;
  border-radius:12px; box-shadow:0 8px 22px rgba(0,0,0,.12);
  padding:10px 12px; display:flex; gap:12px; align-items:center; z-index:9999
}
@media (max-width:480px){
  .selection-bar{ width:calc(100% - 20px); left:10px; transform:none }
}

/* (Nettoyage : plus d’ancienne masonry) */
/* .masonry, .masonry-item { supprimées } */
/* Centrage spécifique à la page d'index des galeries */
.page-private-index .header-centered{
  display:flex;         /* on garde la base .header-inline */
  flex-direction:column; /* titre au-dessus, bouton dessous */
  align-items:center;
  gap:10px;
  text-align:center;
}
.page-private-index .page-intro{
  text-align:center;
  margin:8px 0 20px;
}