:root { --cr-red:#FF0000; }
body { font-feature-settings:"kern"; }
.navbar-brand { letter-spacing:.3px; }
.hero-video { aspect-ratio:16/9; width:100%; object-fit:cover; border-radius:.75rem; }
.alert-live { border-left:6px solid var(--cr-red); }
.card-img-top { height:220px; object-fit:cover; background:#f6f6f6; }
.post-excerpt { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
/* ===============================
   CRRDC Tanganyika — assets/site.css
   Design propre, lisible, responsive
   Palette: Rouge CR (FF0000), Gris neutres
================================== */

/* Variables */
:root{
  --cr-red:#FF0000;
  --cr-red-600:#e00000;
  --txt:#1f2328;
  --muted:#6b7280;
  --bg:#ffffff;
  --bg-weak:#f6f7fb;
  --card:#ffffff;
  --border:#e5e7eb;
  --shadow:0 8px 20px rgba(0,0,0,.08);
  --radius:14px;
}

/* Reset doux */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  color:var(--txt);
  background:var(--bg);
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji";
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;height:auto}
a{text-decoration:none}
a:hover{text-decoration:underline}

/* Typo */
h1,h2,h3,h4{font-weight:700;letter-spacing:.2px}
h1{font-size:clamp(1.8rem,2.5vw,2.4rem)}
h2{font-size:clamp(1.5rem,2vw,2rem)}
h3{font-size:clamp(1.25rem,1.6vw,1.5rem)}
.lead{font-size:1.1rem;color:var(--muted)}
.small, .text-muted{color:var(--muted)!important}

/* Layout utilitaires */
.container-narrow{max-width:960px;margin-inline:auto}
.section{padding-block:48px}
.section-tight{padding-block:28px}
.hr{height:1px;background:var(--border);margin:28px 0}

/* Navbar */
.navbar{box-shadow:0 2px 0 rgba(0,0,0,.03)}
.navbar-brand{letter-spacing:.3px}
.nav-link{font-weight:600}
.nav-link.active,.nav-link:focus,.nav-link:hover{color:var(--cr-red)!important}

/* Boutons */
.btn{border-radius:10px;font-weight:700;letter-spacing:.2px}
.btn-danger{
  background:var(--cr-red);border-color:var(--cr-red);
  box-shadow:0 6px 16px rgba(255,0,0,.18)
}
.btn-danger:hover{background:var(--cr-red-600);border-color:var(--cr-red-600)}
.btn-outline-danger{color:var(--cr-red);border-color:var(--cr-red)}
.btn-outline-danger:hover{background:var(--cr-red);color:#fff}

/* Badges / Tag */
.badge{border-radius:999px;padding:.4rem .6rem}

/* Cartes */
.card{
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  background:var(--card);
}
.card .card-img-top{
  height:220px;object-fit:cover;background:#f3f4f6
}
.card .card-title{font-weight:800;line-height:1.25;margin-bottom:.35rem}

/* Grilles d’actus */
.post-excerpt{
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden
}

/* Hero vidéo */
.hero-video{
  width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:18px;border:1px solid var(--border);
  box-shadow:0 18px 36px rgba(0,0,0,.12)
}

/* Encarts “Urgences en direct” */
.alert-live{
  border-left:6px solid var(--cr-red);
  border-radius:12px;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
}
.alert-live .small{color:var(--muted)}

/* Formulaires */
.form-control,.form-select{
  border-radius:10px;border:1px solid var(--border);
  padding:.65rem .9rem
}
.form-control:focus,.form-select:focus{
  border-color:var(--cr-red);
  box-shadow:0 0 0 .2rem rgba(255,0,0,.1)
}
label.form-label{font-weight:600}

/* Tableaux */
.table{
  --bs-table-striped-bg:#fafafa;
  border-color:var(--border)
}
.table thead th{font-weight:700;border-bottom:2px solid var(--border)}
.table td,.table th{vertical-align:middle}

/* Pagination */
.pagination .page-link{
  border-radius:10px;border:1px solid var(--border);color:var(--txt);font-weight:600
}
.pagination .page-item.active .page-link{
  background:var(--cr-red);border-color:var(--cr-red);color:#fff
}

/* List-group (rapports) */
.list-group-item{
  border-color:var(--border);
  padding:.8rem 1rem;
  border-radius:10px;
  margin-bottom:.5rem;
}
.list-group-item:hover{background:#f9fafb}

/* Footer */
footer{background:var(--bg-weak)!important}
footer h6{font-weight:800;letter-spacing:.3px}
footer a{color:inherit}
footer a:hover{color:var(--cr-red)}

/* Bannières seconde */
.page-header{
  background:linear-gradient(180deg, rgba(255,0,0,.06), transparent);
  border-bottom:1px solid var(--border)
}

/* Figures / Media */
.figure{display:block;margin:0}
.figure img{border-radius:12px;border:1px solid var(--border)}

/* Cards “statistiques” admin */
.kpi-card{
  display:flex;gap:.5rem;align-items:flex-end;justify-content:space-between;
  padding:18px;border:1px solid var(--border);border-radius:14px;background:#fff;box-shadow:var(--shadow)
}
.kpi-card .kpi-title{font-size:.9rem;color:var(--muted)}
.kpi-card .kpi-value{font-size:1.6rem;font-weight:800}

/* Alerts bootstrap affinées */
.alert{border-radius:12px;border:1px solid var(--border)}
.alert-success{border-color:#86efac;background:#f0fdf4}
.alert-danger{border-color:#fecaca;background:#fef2f2}
.alert-info{border-color:#bae6fd;background:#f0f9ff}

/* Chips de catégorie */
.chips{display:flex;gap:.5rem;flex-wrap:wrap}
.chip{
  padding:.35rem .7rem;border:1px solid var(--border);border-radius:999px;font-weight:600;font-size:.85rem;background:#fff
}
.chip.is-active{border-color:var(--cr-red);background:rgba(255,0,0,.06);color:var(--cr-red)}

/* Formes décoratives légères */
.shadow-soft{box-shadow:var(--shadow)}
.round{border-radius:var(--radius)}
.border{border:1px solid var(--border)!important}

/* Sections spécifiques */
.section-urgent{
  background:linear-gradient(90deg, rgba(255,0,0,.05), transparent);
  border:1px solid var(--border);
  border-radius:16px;
  padding:18px
}

/* Placeholders */
.placeholder{
  background:repeating-linear-gradient(45deg,#f3f4f6,#f3f4f6 10px,#eee 10px,#eee 20px)
}

/* Liens d’action */
.link{font-weight:700}
.link-danger{color:var(--cr-red)}
.link-danger:hover{text-decoration:underline}

/* Cards “média” (grille actualités) */
.card-media{
  display:flex;flex-direction:column;height:100%;
}
.card-media .meta{
  display:flex;gap:.6rem;align-items:center;color:var(--muted);font-size:.87rem
}

/* Forms en lignes newsletter */
.newsletter form{display:flex;gap:.5rem}
@media (max-width: 480px){
  .newsletter form{flex-direction:column}
}

/* Tables responsive */
.table-responsive{border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#fff}

/* Map iframe */
.ratio iframe{border-radius:12px;border:1px solid var(--border)}

/* ======= Responsive fine-tuning ======= */
@media (max-width: 992px){
  .hero-video{border-radius:14px}
  .card .card-img-top{height:200px}
}
@media (max-width: 576px){
  .card .card-img-top{height:180px}
  .btn{padding:.6rem 1rem}
  .navbar-brand{font-size:1.05rem}
}

/* ======= Mode contraste élevé (préférence OS) ======= */
@media (prefers-contrast: more){
  :root{--border:#d1d5db}
  .btn-danger{box-shadow:none}
  .alert-live{box-shadow:none}
}

/* ======= Dark (optionnel via .dark sur <html>) ======= */
html.dark{
  --txt:#e5e7eb; --muted:#9ca3af; --bg:#0b0d10; --bg-weak:#0f1115; --card:#12151a; --border:#1f242b; --shadow:0 8px 20px rgba(0,0,0,.35);
}
html.dark body{background:var(--bg);color:var(--txt)}
html.dark .navbar, html.dark .card, html.dark .table-responsive, html.dark .list-group-item, html.dark .alert-live{background:var(--card);border-color:var(--border)}
html.dark .form-control, html.dark .form-select{background:#0f1216;color:var(--txt);border-color:var(--border)}
html.dark .pagination .page-link{background:var(--card);color:var(--txt);border-color:var(--border)}
html.dark footer{background:var(--bg-weak)!important}