/* =========================================================
   CIDSA — Feuille de style principale
   Charte graphique : Bleu #1a3a6b / Rouge #c0392b / Blanc
   ========================================================= */

:root{
  --cidsa-blue: #1a3a6b;
  --cidsa-blue-dark: #12294d;
  --cidsa-blue-light: #e8edf5;
  --cidsa-red: #c0392b;
  --cidsa-red-dark: #9c2e22;
  --cidsa-white: #ffffff;
  --cidsa-gray: #6b7280;
  --cidsa-gray-light: #f5f7fa;
  --cidsa-border: #e2e6ee;
  --radius: 10px;
  --shadow: 0 6px 24px rgba(26,58,107,.08);
  font-size: 16px;
}

*{ box-sizing: border-box; }

body{
  font-family: 'Open Sans', 'Segoe UI', Arial, sans-serif;
  color: #253347;
  margin:0;
  background: var(--cidsa-white);
  line-height: 1.6;
}

h1,h2,h3,h4,h5{
  font-family:'Roboto','Open Sans',sans-serif;
  color: var(--cidsa-blue);
  font-weight:700;
  line-height:1.25;
}

a{ text-decoration:none; color:inherit; }
img{ max-width:100%; display:block; }
ul{ list-style:none; margin:0; padding:0; }

.container{ max-width:1200px; margin:0 auto; padding:0 20px; }
.section{ padding:70px 0; }
.section-title{ text-align:center; margin-bottom:12px; font-size:2rem; }
.section-subtitle{ text-align:center; color:var(--cidsa-gray); max-width:680px; margin:0 auto 40px; font-size:1.05rem; }
.text-red{ color: var(--cidsa-red); }
.bg-light{ background: var(--cidsa-gray-light); }

/* ---------- Boutons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 28px; border-radius:50px; font-weight:600;
  border:2px solid transparent; cursor:pointer; font-size:.98rem;
  transition:.25s; white-space:nowrap;
}
.btn-primary{ background:var(--cidsa-red); color:#fff; }
.btn-primary:hover{ background:var(--cidsa-red-dark); transform:translateY(-2px); }
.btn-outline{ background:transparent; border-color:#fff; color:#fff; }
.btn-outline:hover{ background:#fff; color:var(--cidsa-blue); }
.btn-blue{ background:var(--cidsa-blue); color:#fff; }
.btn-blue:hover{ background:var(--cidsa-blue-dark); transform:translateY(-2px); }
.btn-ghost{ background:transparent; border-color:var(--cidsa-blue); color:var(--cidsa-blue); }
.btn-ghost:hover{ background:var(--cidsa-blue); color:#fff; }
.btn-sm{ padding:8px 18px; font-size:.85rem; }
.btn-block{ width:100%; justify-content:center; }
.btn[disabled]{ opacity:.5; cursor:not-allowed; }

/* ---------- Topbar ---------- */
.topbar{
  background:var(--cidsa-blue-dark); color:#dbe4f2; font-size:.85rem;
  padding:7px 0;
}
.topbar .container{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px; }
.topbar span{ margin-right:18px; }
.topbar i{ color:var(--cidsa-red); margin-right:6px; }
.topbar a{ color:#dbe4f2; }
.topbar a:hover{ color:#fff; }

/* ---------- Header / Nav ---------- */
.site-header{
  background:#fff; position:sticky; top:0; z-index:1000;
  box-shadow:0 2px 10px rgba(0,0,0,.06);
}
.site-header .container{ display:flex; align-items:center; justify-content:space-between; padding-top:12px; padding-bottom:12px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand-emblem{
  width:52px; height:52px; border-radius:50%;
  background: linear-gradient(135deg, var(--cidsa-blue), var(--cidsa-blue-dark));
  display:flex; align-items:center; justify-content:center;
  position:relative; flex-shrink:0;
  border:3px solid var(--cidsa-red);
}
.brand-emblem i{ color:#fff; font-size:1.4rem; }
.brand-text{ line-height:1.1; }
.brand-text .name{ font-weight:800; font-size:1.25rem; color:var(--cidsa-blue); letter-spacing:.5px; }
.brand-text .tagline{ font-size:.68rem; color:var(--cidsa-red); font-weight:700; text-transform:uppercase; letter-spacing:1px; }
.brand-logo-img{ height:56px; width:auto; max-width:260px; object-fit:contain; display:block; }
.footer-logo-box{ display:inline-block; background:#fff; padding:10px 16px; border-radius:10px; margin-bottom:16px; }
.footer-logo-box img{ height:44px; width:auto; display:block; }

.main-nav{ display:flex; align-items:center; gap:26px; }
.main-nav > a, .main-nav .nav-item > a{ font-weight:600; font-size:.93rem; color:#374253; padding:8px 0; position:relative; display:inline-block; }
.main-nav > a:hover, .main-nav > a.active, .main-nav .nav-item > a:hover{ color:var(--cidsa-blue); }
.main-nav > a.active::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--cidsa-red); border-radius:3px;
}
.nav-cta{ display:flex; align-items:center; gap:10px; }
.nav-toggle{ display:none; font-size:1.6rem; background:none; border:none; color:var(--cidsa-blue); cursor:pointer; }

/* ---------- Dropdown menus (Nos services / Le centre / A propos) ---------- */
.main-nav .nav-item{ position:relative; }
.main-nav .dropdown-toggle{ cursor:pointer; }
.main-nav .dropdown-toggle::after{
  content:'\f078'; font-family:'Font Awesome 6 Free'; font-weight:900; font-size:.6em; margin-left:6px; vertical-align:middle;
}
.main-nav .dropdown-menu{
  display:none; position:absolute; top:100%; left:0; min-width:260px; background:#fff;
  border-radius:10px; box-shadow:0 16px 34px rgba(26,58,107,.18); padding:8px 0; z-index:1200; margin-top:10px;
}
.main-nav .nav-item:hover .dropdown-menu,
.main-nav .nav-item.open .dropdown-menu{ display:block; }
.main-nav .dropdown-menu .dropdown-item{
  display:block; padding:10px 22px; font-size:.86rem; font-weight:600; color:#374253; white-space:nowrap;
}
.main-nav .dropdown-menu .dropdown-item:hover{ background:var(--cidsa-blue-light); color:var(--cidsa-blue); }
.nav-espace-link{ display:flex; align-items:center; gap:6px; font-size:.86rem; font-weight:600; color:var(--cidsa-blue); white-space:nowrap; }

@media (max-width: 992px){
  .main-nav{
    position:fixed; top:0; right:-300px; height:100vh; width:300px; overflow-y:auto;
    background:#fff; flex-direction:column; align-items:flex-start;
    padding:90px 24px 24px; box-shadow:-4px 0 20px rgba(0,0,0,.1);
    transition:right .3s ease; gap:6px;
  }
  .main-nav.open{ right:0; }
  .nav-toggle{ display:block; }
  .nav-cta .btn span{ display:none; }
  .main-nav .nav-item{ width:100%; }
  .main-nav .dropdown-menu{
    display:none; position:static; box-shadow:none; padding:0 0 0 14px; margin-top:6px; min-width:0;
    border-left:2px solid var(--cidsa-blue-light);
  }
  .main-nav .nav-item:hover .dropdown-menu{ display:none; }
  .main-nav .nav-item.open .dropdown-menu{ display:block; }
  .main-nav .dropdown-menu .dropdown-item{ padding:9px 0; white-space:normal; }
  .main-nav > a, .main-nav .nav-item > a{ padding:12px 0; width:100%; border-bottom:1px solid var(--cidsa-gray-light); }
  .nav-espace-link{ padding:12px 0; }
  .brand-logo-img{ height:42px; }
}

/* ---------- Slider accueil (5 images) ---------- */
.hero-slider{ position:relative; overflow:hidden; }
.hero-slider .slide{
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0; transform:scale(1.06); transition:opacity 1.4s ease, transform 7s ease; z-index:0;
}
.hero-slider .slide.active{ opacity:1; transform:scale(1); z-index:1; }
.hero.hero-slider::before{ z-index:2; }
.hero-slider .container{ z-index:3; }
.slider-dots{ position:absolute; bottom:26px; left:0; right:0; display:flex; justify-content:center; gap:10px; z-index:5; }
.slider-dots button{
  width:34px; height:5px; border-radius:50px; border:none; background:rgba(255,255,255,.4); cursor:pointer; padding:0; transition:.25s;
}
.slider-dots button:hover{ background:rgba(255,255,255,.7); }
.slider-dots button.active{ background:var(--cidsa-red); width:44px; }
.slider-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:5; width:46px; height:46px; border-radius:50%;
  background:rgba(18,41,77,.4); border:1.5px solid rgba(255,255,255,.5); color:#fff; display:flex; align-items:center;
  justify-content:center; font-size:1.1rem; cursor:pointer; transition:.25s; backdrop-filter:blur(4px);
}
.slider-arrow:hover{ background:var(--cidsa-red); border-color:var(--cidsa-red); }
.slider-arrow.prev{ left:22px; }
.slider-arrow.next{ right:22px; }
@media (max-width: 768px){ .slider-arrow{ display:none; } }

/* ---------- Assurances ---------- */
.insurance-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:18px; }
.insurance-card{
  background:#fff; border:1.5px solid var(--cidsa-border); border-radius:12px; padding:22px 12px; text-align:center;
  transition:.2s; box-shadow:var(--shadow);
}
.insurance-card:hover{ border-color:var(--cidsa-blue); transform:translateY(-3px); }
.insurance-card i{ font-size:1.6rem; color:var(--cidsa-blue); margin-bottom:10px; display:block; }
.insurance-card span{ font-weight:700; font-size:.85rem; color:#253347; }
@media (max-width: 1024px){ .insurance-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width: 640px){ .insurance-grid{ grid-template-columns:repeat(2,1fr); } }

/* ---------- Galerie photo / vidéo ---------- */
.gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.gallery-item{
  position:relative; border-radius:12px; overflow:hidden; box-shadow:var(--shadow); cursor:pointer;
  aspect-ratio:4/3; background:#000;
}
.gallery-item img, .gallery-item video{ width:100%; height:100%; object-fit:cover; transition:.3s; }
.gallery-item:hover img{ transform:scale(1.06); }
.gallery-item .gallery-caption{
  position:absolute; left:0; right:0; bottom:0; padding:10px 14px; font-size:.8rem; font-weight:600; color:#fff;
  background:linear-gradient(180deg, transparent, rgba(0,0,0,.75));
}
.gallery-item .play-badge{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:52px; height:52px; border-radius:50%; background:rgba(192,57,43,.9); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.3rem;
}
.gallery-tabs{ display:flex; gap:6px; justify-content:center; margin-bottom:34px; }
@media (max-width: 1024px){ .gallery-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width: 640px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }

/* ---------- Mini-slider "Aperçu du centre" (accueil) ---------- */
.mini-slider{
  position:relative; overflow:hidden; border-radius:18px; box-shadow:0 16px 40px rgba(26,58,107,.18);
  height:460px;
}
.mini-slider .slide{
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0; transform:scale(1.05); transition:opacity 1.4s ease, transform 6s ease; z-index:0;
}
.mini-slider .slide.active{ opacity:1; transform:scale(1); z-index:1; }
.mini-slider .slide::after{
  content:''; position:absolute; inset:0; background:linear-gradient(0deg, rgba(10,22,45,.85) 0%, rgba(10,22,45,.15) 45%, transparent 70%);
}
.mini-slider .slide .cap{
  position:absolute; left:28px; right:28px; bottom:26px; z-index:2; color:#fff; font-weight:700; font-size:1.15rem;
  text-shadow:0 3px 12px rgba(0,0,0,.4);
}
.mini-slider .slider-dots{ bottom:16px; }
@media (max-width: 640px){ .mini-slider{ height:280px; } .mini-slider .slide .cap{ font-size:.95rem; } }

/* ---------- Section "pub" / campagnes de sensibilisation ---------- */
.pub-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.pub-card{
  border-radius:14px; overflow:hidden; box-shadow:var(--shadow); background:#fff; position:relative;
  display:flex; flex-direction:column;
}
.pub-card .pub-img{ height:190px; background-size:cover; background-position:center; position:relative; }
.pub-card .pub-ribbon{
  position:absolute; top:14px; left:0; background:var(--cidsa-red); color:#fff; font-weight:700; font-size:.72rem;
  text-transform:uppercase; letter-spacing:.5px; padding:6px 16px 6px 12px; border-radius:0 50px 50px 0;
}
.pub-card .pub-body{ padding:20px 22px; flex:1; display:flex; flex-direction:column; }
.pub-card .pub-body h4{ margin-bottom:8px; font-size:1.05rem; }
.pub-card .pub-body p{ color:var(--cidsa-gray); font-size:.9rem; flex:1; }
.pub-card .pub-meta{ display:flex; align-items:center; gap:8px; font-size:.8rem; color:var(--cidsa-blue); font-weight:700; margin-top:12px; }
.pub-card .pub-meta i{ color:var(--cidsa-red); }
@media (max-width: 1024px){ .pub-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width: 640px){ .pub-grid{ grid-template-columns:1fr; } }

/* ---------- Bandeau événements à venir (accueil) ---------- */
.events-strip{ background:var(--cidsa-blue-dark); color:#fff; padding:0; }
.events-strip .container{ display:flex; align-items:center; gap:16px; padding:14px 20px; flex-wrap:wrap; }
.events-strip .events-label{
  background:var(--cidsa-red); padding:6px 16px; border-radius:50px; font-weight:700; font-size:.8rem;
  text-transform:uppercase; letter-spacing:.5px; white-space:nowrap;
}
.events-strip .events-track{ flex:1; display:flex; gap:36px; overflow-x:auto; font-size:.88rem; color:#dbe4f2; }
.events-strip .events-track span{ white-space:nowrap; }
.events-strip .events-track i{ color:#ffb4ab; margin-right:6px; }

/* ---------- Bloc "Nous contacter" (remplace les prix) ---------- */
.contact-cta-box{
  margin-top:14px; padding:12px 16px; background:var(--cidsa-blue-light); border-radius:8px;
  font-size:.85rem; color:var(--cidsa-blue); font-weight:600; display:flex; align-items:center; gap:8px;
}
.contact-cta-box i{ color:var(--cidsa-red); }

/* ---------- Hero ---------- */
.hero{
  position:relative; color:#fff; background-size:cover; background-position:center;
  min-height:620px; display:flex; align-items:center;
}
.hero::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(10,22,45,.72) 0%, rgba(10,22,45,.42) 45%, rgba(10,22,45,.15) 75%),
              linear-gradient(0deg, rgba(10,22,45,.55) 0%, rgba(10,22,45,0) 40%);
}
.hero .container{ position:relative; z-index:2; }
.hero-content-box{
  max-width:640px; background:rgba(12,26,52,.38); backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.15); border-radius:18px; padding:34px 38px;
  box-shadow:0 20px 50px rgba(0,0,0,.25);
}
.hero-badge{
  display:inline-block; background:rgba(192,57,43,.2); border:1px solid var(--cidsa-red);
  color:#ffcfc8; padding:7px 18px; border-radius:50px; font-size:.8rem; font-weight:700; margin-bottom:20px;
  letter-spacing:.3px;
}
.hero h1{ color:#fff; font-size:2.7rem; max-width:640px; margin-bottom:18px; text-shadow:0 4px 18px rgba(0,0,0,.35); }
.hero p{ max-width:600px; font-size:1.12rem; color:#eaf0fb; margin-bottom:30px; text-shadow:0 2px 10px rgba(0,0,0,.3); }
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }
@media (max-width: 640px){
  .hero-content-box{ padding:26px 22px; border-radius:14px; }
  .hero h1{ font-size:2rem; }
}

.page-hero{
  background:linear-gradient(120deg, var(--cidsa-blue-dark), var(--cidsa-blue));
  color:#fff; padding:70px 0 50px; text-align:center;
}
.page-hero h1{ color:#fff; font-size:2.2rem; margin-bottom:10px; }
.page-hero p{ color:#c9d6ea; max-width:640px; margin:0 auto; }
.breadcrumb{ margin-top:14px; font-size:.85rem; color:#aebdd8; }
.breadcrumb a{ color:#fff; }

/* ---------- Zones ---------- */
.zones-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:30px; }
.zone-card{
  border-radius:var(--radius); padding:40px 32px; box-shadow:var(--shadow);
  border-top:5px solid var(--cidsa-blue); background:#fff; transition:.25s;
}
.zone-card.red{ border-top-color:var(--cidsa-red); }
.zone-card:hover{ transform:translateY(-6px); }
.zone-icon{
  width:64px; height:64px; border-radius:16px; display:flex; align-items:center; justify-content:center;
  background:var(--cidsa-blue-light); color:var(--cidsa-blue); font-size:1.6rem; margin-bottom:20px;
}
.zone-card.red .zone-icon{ background:#fbe9e7; color:var(--cidsa-red); }
.zone-card h3{ margin-bottom:10px; }
.zone-card p{ color:var(--cidsa-gray); margin-bottom:20px; }

/* ---------- Chiffres clés ---------- */
.stats-bar{ background:var(--cidsa-blue); color:#fff; padding:50px 0; }
.stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; text-align:center; }
.stat-item .num{ font-size:2.4rem; font-weight:800; color:#fff; }
.stat-item .num i{ color:#ffb4ab; }
.stat-item .lbl{ color:#c9d6ea; font-size:.9rem; margin-top:6px; }

/* ---------- Cards génériques ---------- */
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }

.card{
  background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden;
  border:1px solid var(--cidsa-border); transition:.25s;
}
.card:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(26,58,107,.14); }

.doctor-card{ text-align:center; padding-bottom:22px; }
.doctor-card .photo{ height:230px; overflow:hidden; }
.doctor-card .photo img{ width:100%; height:100%; object-fit:cover; }
.doctor-card h4{ margin:16px 0 2px; }
.doctor-card .spe{ color:var(--cidsa-red); font-weight:600; font-size:.88rem; margin-bottom:10px; }
.doctor-card .bio{ font-size:.85rem; color:var(--cidsa-gray); padding:0 18px; margin-bottom:16px; min-height:60px; }
.doctor-card .actions{ padding:0 18px; display:flex; gap:8px; flex-direction:column; }

.service-card{ padding:28px; }
.service-card .icon{
  width:56px; height:56px; border-radius:14px; background:var(--cidsa-blue-light); color:var(--cidsa-blue);
  display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:18px;
}
.service-card h4{ margin-bottom:8px; }
.service-card p{ color:var(--cidsa-gray); font-size:.9rem; margin-bottom:14px; }
.service-card .tarif{ font-weight:700; color:var(--cidsa-red); margin-bottom:14px; }

.news-card img{ height:190px; object-fit:cover; width:100%; }
.news-card .body{ padding:22px; }
.news-card .cat{ display:inline-block; background:var(--cidsa-blue-light); color:var(--cidsa-blue); font-size:.72rem; font-weight:700; padding:4px 12px; border-radius:50px; margin-bottom:10px; text-transform:uppercase; }
.news-card .date{ color:var(--cidsa-gray); font-size:.8rem; margin-bottom:8px; }
.news-card h4{ margin-bottom:10px; font-size:1.08rem; }
.news-card p{ color:var(--cidsa-gray); font-size:.9rem; }

/* ---------- Formulaires ---------- */
.form-group{ margin-bottom:18px; }
.form-group label{ display:block; font-weight:600; margin-bottom:7px; font-size:.9rem; color:#344054; }
.form-group .req{ color:var(--cidsa-red); }
.form-control{
  width:100%; padding:12px 14px; border:1.5px solid var(--cidsa-border); border-radius:8px;
  font-size:.95rem; font-family:inherit; background:#fff; color:#253347;
}
.form-control:focus{ outline:none; border-color:var(--cidsa-blue); box-shadow:0 0 0 3px rgba(26,58,107,.1); }
textarea.form-control{ resize:vertical; min-height:110px; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.checkbox-row{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.checkbox-row input{ width:18px; height:18px; accent-color:var(--cidsa-blue); }
.checkbox-row label{ margin:0; font-weight:400; font-size:.9rem; }
.form-card{ background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:36px; border:1px solid var(--cidsa-border); }

.alert{ padding:14px 18px; border-radius:8px; font-size:.9rem; margin-bottom:18px; display:none; }
.alert.show{ display:block; }
.alert-success{ background:#e7f6ec; color:#1d7a3c; border:1px solid #b6e7c5; }
.alert-error{ background:#fbe9e7; color:var(--cidsa-red-dark); border:1px solid #f0c4bd; }
.alert-info{ background:var(--cidsa-blue-light); color:var(--cidsa-blue); border:1px solid #c8d6ec; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--cidsa-blue-dark); color:#c9d6ea; padding-top:60px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:36px; padding-bottom:40px; }
.footer-grid h5{ color:#fff; margin-bottom:18px; font-size:1rem; }
.footer-grid p, .footer-grid li{ font-size:.88rem; margin-bottom:10px; color:#aebdd8; }
.footer-grid a:hover{ color:#fff; }
.footer-brand{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.footer-brand .name{ color:#fff; font-weight:800; font-size:1.15rem; }
.social-links{ display:flex; gap:10px; margin-top:16px; }
.social-links a{
  width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:center; color:#fff;
}
.social-links a:hover{ background:var(--cidsa-red); }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1); padding:18px 0; text-align:center; font-size:.82rem; color:#8ea0c2;
}
.footer-bottom a{ color:#dbe4f2; }

/* ---------- Tables & Dashboard commun (back-office) ---------- */
.dash-body{ background:#f2f5fa; min-height:100vh; }
.dash-shell{ display:flex; min-height:100vh; }
.dash-sidebar{
  width:250px; background:var(--cidsa-blue-dark); color:#c9d6ea; flex-shrink:0;
  padding:24px 0; display:flex; flex-direction:column;
}
.dash-sidebar .brand{ padding:0 22px 22px; border-bottom:1px solid rgba(255,255,255,.08); margin-bottom:14px; }
.dash-sidebar .brand .name{ color:#fff; font-size:1.05rem; }
.dash-nav a{
  display:flex; align-items:center; gap:12px; padding:12px 22px; font-size:.9rem; font-weight:600; color:#aebdd8;
  border-left:3px solid transparent;
}
.dash-nav a i{ width:18px; text-align:center; }
.dash-nav a:hover{ background:rgba(255,255,255,.05); color:#fff; }
.dash-nav a.active{ background:rgba(255,255,255,.08); color:#fff; border-left-color:var(--cidsa-red); }
.dash-sidebar .poste-tag{
  margin:16px 22px 0; padding:10px 12px; background:rgba(192,57,43,.18); border:1px solid rgba(192,57,43,.4);
  border-radius:8px; font-size:.78rem; color:#ffcfc8;
}
.dash-sidebar .logout-link{ margin-top:auto; }
.dash-main{ flex:1; min-width:0; }
.dash-topbar{
  background:#fff; padding:16px 30px; display:flex; justify-content:space-between; align-items:center;
  box-shadow:0 2px 8px rgba(0,0,0,.05); position:sticky; top:0; z-index:50;
}
.dash-topbar h1{ font-size:1.3rem; margin:0; }
.dash-user{ display:flex; align-items:center; gap:12px; font-size:.9rem; }
.dash-user .avatar{ width:38px; height:38px; border-radius:50%; background:var(--cidsa-blue-light); color:var(--cidsa-blue); display:flex; align-items:center; justify-content:center; font-weight:700; }
.dash-content{ padding:28px 30px; }

.kpi-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-bottom:28px; }
.kpi-card{ background:#fff; border-radius:12px; padding:22px; box-shadow:var(--shadow); border-left:4px solid var(--cidsa-blue); }
.kpi-card.red{ border-left-color:var(--cidsa-red); }
.kpi-card .kpi-value{ font-size:1.8rem; font-weight:800; color:var(--cidsa-blue); }
.kpi-card .kpi-label{ color:var(--cidsa-gray); font-size:.85rem; margin-top:4px; }
.kpi-card .kpi-icon{ float:right; font-size:1.6rem; color:var(--cidsa-blue-light); }

.panel{ background:#fff; border-radius:12px; box-shadow:var(--shadow); padding:24px; margin-bottom:24px; }
.panel-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; flex-wrap:wrap; gap:10px; }
.panel-head h3{ font-size:1.1rem; margin:0; }

table.data-table{ width:100%; border-collapse:collapse; font-size:.88rem; }
table.data-table th{ text-align:left; padding:12px 14px; background:var(--cidsa-gray-light); color:var(--cidsa-blue); font-weight:700; border-bottom:2px solid var(--cidsa-border); }
table.data-table td{ padding:12px 14px; border-bottom:1px solid var(--cidsa-border); vertical-align:middle; }
table.data-table tr:hover td{ background:#fafbfd; }

.badge{ display:inline-block; padding:4px 12px; border-radius:50px; font-size:.75rem; font-weight:700; }
.badge-en_attente{ background:#fff4e0; color:#a3690a; }
.badge-confirme{ background:#e0eefc; color:#1d5fa8; }
.badge-enregistre_accueil{ background:#eae5ff; color:#5b3fb5; }
.badge-en_cours{ background:#fff0e0; color:#c0630a; }
.badge-termine{ background:#e0f7e9; color:#1d7a3c; }
.badge-annule{ background:#fde8e8; color:#c0392b; }
.badge-absent{ background:#eee; color:#666; }
.badge-disponible{ background:#e0f7e9; color:#1d7a3c; }
.badge-occupe{ background:#fde8e8; color:#c0392b; }
.badge-actif{ background:#e0f7e9; color:#1d7a3c; }
.badge-lu{ background:#e0eefc; color:#1d5fa8; }
.badge-non_lu{ background:#fff4e0; color:#a3690a; }
.badge-traite{ background:#e0f7e9; color:#1d7a3c; }
.badge-archive{ background:#eee; color:#666; }
.badge-publie{ background:#e0f7e9; color:#1d7a3c; }
.badge-brouillon{ background:#fff4e0; color:#a3690a; }
.badge-inactif{ background:#fde8e8; color:#c0392b; }

/* ---------- Icon buttons (tableaux CRUD back-office) ---------- */
.icon-btn{
  width:32px; height:32px; border-radius:8px; border:1.5px solid var(--cidsa-border); background:#fff;
  color:var(--cidsa-blue); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; margin-right:4px;
  transition:.2s; font-size:.85rem;
}
.icon-btn:hover{ background:var(--cidsa-blue); color:#fff; border-color:var(--cidsa-blue); }
.icon-btn.danger:hover{ background:var(--cidsa-red); color:#fff; border-color:var(--cidsa-red); }

/* ---------- Admin : cartes stats mini, graphiques, switch ---------- */
.chart-card{ background:#fff; border-radius:12px; box-shadow:var(--shadow); padding:22px; margin-bottom:24px; }
.chart-card h3{ font-size:1.05rem; margin-bottom:16px; }
.chart-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:24px; }
.chart-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }

.switch{ position:relative; display:inline-block; width:44px; height:24px; flex-shrink:0; }
.switch input{ opacity:0; width:0; height:0; }
.switch .slider{ position:absolute; cursor:pointer; inset:0; background:#ccc; border-radius:24px; transition:.25s; }
.switch .slider::before{ position:absolute; content:''; height:18px; width:18px; left:3px; bottom:3px; background:#fff; border-radius:50%; transition:.25s; }
.switch input:checked + .slider{ background:var(--cidsa-blue); }
.switch input:checked + .slider::before{ transform:translateX(20px); }

.modal-overlay{ display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:2000; align-items:center; justify-content:center; padding:20px; overflow-y:auto; }
.modal-overlay.open{ display:flex; }
.modal-box{ background:#fff; border-radius:14px; padding:32px; max-width:560px; width:100%; box-shadow:0 20px 60px rgba(0,0,0,.3); max-height:90vh; overflow-y:auto; }

.csv-btn{ background:#1d7a3c; color:#fff; }
.csv-btn:hover{ background:#155c2c; }

.filter-bar{ display:flex; gap:12px; margin-bottom:18px; flex-wrap:wrap; align-items:flex-end; }
.filter-bar .form-group{ margin-bottom:0; min-width:160px; }

@media (max-width: 1024px){
  .chart-grid, .chart-grid-3{ grid-template-columns:1fr; }
}

.search-bar{ display:flex; gap:10px; margin-bottom:18px; }
.search-bar input{ flex:1; }

.tabs{ display:flex; gap:6px; border-bottom:2px solid var(--cidsa-border); margin-bottom:22px; flex-wrap:wrap; }
.tabs button{
  padding:11px 20px; background:none; border:none; font-weight:600; color:var(--cidsa-gray); cursor:pointer;
  border-bottom:3px solid transparent; font-size:.9rem;
}
.tabs button.active{ color:var(--cidsa-blue); border-bottom-color:var(--cidsa-red); }

.empty-state{ text-align:center; padding:50px 20px; color:var(--cidsa-gray); }
.empty-state i{ font-size:2.4rem; margin-bottom:14px; color:var(--cidsa-border); }

.step-progress{ display:flex; justify-content:space-between; margin-bottom:44px; position:relative; }
.step-progress::before{ content:''; position:absolute; top:19px; left:5%; right:5%; height:3px; background:var(--cidsa-border); z-index:0; }
.step-progress .step{ position:relative; z-index:1; flex:1; text-align:center; }
.step-progress .circle{
  width:40px; height:40px; border-radius:50%; background:#fff; border:3px solid var(--cidsa-border); margin:0 auto 8px;
  display:flex; align-items:center; justify-content:center; font-weight:800; color:var(--cidsa-gray);
}
.step-progress .step.active .circle{ border-color:var(--cidsa-red); color:var(--cidsa-red); background:#fff5f4; }
.step-progress .step.done .circle{ border-color:var(--cidsa-blue); background:var(--cidsa-blue); color:#fff; }
.step-progress .step-label{ font-size:.78rem; color:var(--cidsa-gray); font-weight:600; }
.step-progress .step.active .step-label{ color:var(--cidsa-red); }

.option-card{
  border:2px solid var(--cidsa-border); border-radius:12px; padding:26px; cursor:pointer; text-align:center; transition:.2s;
}
.option-card:hover{ border-color:var(--cidsa-blue); }
.option-card.selected{ border-color:var(--cidsa-red); background:#fff8f7; }
.option-card i{ font-size:1.8rem; color:var(--cidsa-blue); margin-bottom:12px; }
.option-card.selected i{ color:var(--cidsa-red); }
.option-card h4{ margin-bottom:6px; font-size:1rem; }
.option-card p{ font-size:.82rem; color:var(--cidsa-gray); margin:0; }

.slot-btn{
  padding:9px 6px; border:1.5px solid var(--cidsa-border); border-radius:8px; background:#fff; cursor:pointer;
  font-size:.85rem; font-weight:600; text-align:center; color:#374253;
}
.slot-btn:hover{ border-color:var(--cidsa-blue); }
.slot-btn.selected{ background:var(--cidsa-red); border-color:var(--cidsa-red); color:#fff; }
.slot-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }

.recap-row{ display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid var(--cidsa-border); font-size:.92rem; }
.recap-row:last-child{ border-bottom:none; }
.recap-row .lbl{ color:var(--cidsa-gray); }
.recap-row .val{ font-weight:700; color:#253347; }

.bed-card{ border:2px solid var(--cidsa-border); border-radius:12px; padding:18px; text-align:center; }
.bed-card.occupied{ border-color:var(--cidsa-red); background:#fff8f7; }
.bed-card.free{ border-color:#1d7a3c; background:#f4fbf6; }
.bed-card i{ font-size:1.6rem; margin-bottom:8px; }

.login-shell{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(120deg, var(--cidsa-blue-dark), var(--cidsa-blue)); padding:30px;
}
.login-card{ background:#fff; border-radius:16px; padding:44px; max-width:440px; width:100%; box-shadow:0 20px 60px rgba(0,0,0,.3); }
.login-card .brand{ justify-content:center; margin-bottom:26px; }
.login-card h2{ text-align:center; margin-bottom:6px; }
.login-card .subtitle{ text-align:center; color:var(--cidsa-gray); margin-bottom:28px; font-size:.9rem; }
.demo-creds{ background:var(--cidsa-blue-light); border-radius:8px; padding:14px; font-size:.78rem; color:var(--cidsa-blue); margin-top:18px; }
.demo-creds strong{ display:block; margin-bottom:4px; }

.postes-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.poste-tile{
  background:#fff; border-radius:12px; padding:22px 14px; text-align:center; box-shadow:var(--shadow);
  border:2px solid transparent; transition:.2s;
}
.poste-tile:hover{ border-color:var(--cidsa-blue); transform:translateY(-4px); }
.poste-tile .num{
  width:36px; height:36px; border-radius:50%; background:var(--cidsa-blue); color:#fff; display:flex;
  align-items:center; justify-content:center; font-weight:800; margin:0 auto 12px; font-size:.85rem;
}
.poste-tile i{ font-size:1.5rem; color:var(--cidsa-red); margin-bottom:10px; display:block; }
.poste-tile h4{ font-size:.88rem; margin-bottom:4px; }
.poste-tile p{ font-size:.75rem; color:var(--cidsa-gray); margin:0; }

/* Responsive */
@media (max-width: 1024px){
  .zones-grid, .grid-2{ grid-template-columns:1fr; }
  .grid-3{ grid-template-columns:repeat(2,1fr); }
  .grid-4{ grid-template-columns:repeat(2,1fr); }
  .stats-grid{ grid-template-columns:repeat(2,1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .kpi-grid{ grid-template-columns:repeat(2,1fr); }
  .postes-grid{ grid-template-columns:repeat(3,1fr); }
  .dash-sidebar{ position:fixed; left:-260px; top:0; height:100vh; z-index:1100; transition:.3s; }
  .dash-sidebar.open{ left:0; }
  .form-row{ grid-template-columns:1fr; }
}
@media (max-width: 640px){
  .hero h1{ font-size:1.9rem; }
  .grid-3,.grid-4{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .kpi-grid{ grid-template-columns:1fr; }
  .postes-grid{ grid-template-columns:repeat(2,1fr); }
  .slot-grid{ grid-template-columns:repeat(2,1fr); }
  .dash-content{ padding:18px; }
  .dash-topbar{ padding:14px 18px; }
}

/* ---------- Bouton WhatsApp flottant (discussion instantanée) ---------- */
.whatsapp-float{
  position:fixed; right:22px; bottom:22px; z-index:1500;
  width:60px; height:60px; border-radius:50%; background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.9rem;
  box-shadow:0 8px 24px rgba(37,211,102,.5); transition:.25s;
  animation:whatsapp-pulse 2.4s infinite;
}
.whatsapp-float:hover{ transform:scale(1.08); background:#1ebe57; }
.whatsapp-float .whatsapp-tooltip{
  position:absolute; right:72px; bottom:14px; background:#fff; color:#253347; font-size:.82rem; font-weight:600;
  padding:10px 16px; border-radius:8px; box-shadow:0 6px 20px rgba(0,0,0,.18); white-space:nowrap;
  opacity:0; transform:translateX(8px); transition:.2s; pointer-events:none;
}
.whatsapp-float:hover .whatsapp-tooltip{ opacity:1; transform:translateX(0); }
@keyframes whatsapp-pulse{
  0%{ box-shadow:0 8px 24px rgba(37,211,102,.5), 0 0 0 0 rgba(37,211,102,.5); }
  70%{ box-shadow:0 8px 24px rgba(37,211,102,.5), 0 0 0 14px rgba(37,211,102,0); }
  100%{ box-shadow:0 8px 24px rgba(37,211,102,.5), 0 0 0 0 rgba(37,211,102,0); }
}
@media (max-width: 640px){
  .whatsapp-float{ right:16px; bottom:16px; width:54px; height:54px; font-size:1.7rem; }
  .whatsapp-float .whatsapp-tooltip{ display:none; }
}

/* PHP responsive/social polish */
.topbar-socials{ display:inline-flex; align-items:center; gap:8px; margin-left:14px; }
.topbar-socials a{
  width:26px; height:26px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%; background:rgba(255,255,255,.14); color:#fff;
}
.topbar-socials a:hover{ background:var(--cidsa-red); color:#fff; }
.main-nav.open{ overflow-y:auto; }
img, video{ max-width:100%; height:auto; }
table{ max-width:100%; }

@media (max-width: 768px){
  .topbar .container{ gap:8px; }
  .topbar .container > div{ flex-wrap:wrap; justify-content:center; text-align:center; }
  .topbar-socials{ width:100%; justify-content:center; margin-left:0; }
  .site-header .container{ gap:10px; }
  .brand-logo-img{ max-width:170px; height:auto; }
  .hero-actions, .section-actions, .form-actions{ display:flex; flex-direction:column; align-items:stretch; }
  .hero-actions .btn, .section-actions .btn, .form-actions .btn{ width:100%; justify-content:center; }
  .table-responsive{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
}

@media (max-width: 480px){
  .container{ width:min(100% - 24px, var(--container)); }
  .nav-cta{ gap:6px; }
  .nav-cta .btn{ padding:10px 12px; }
  .brand-logo-img{ max-width:145px; }
  .site-footer{ padding-top:42px; }
}

/* Payment and insurance prefooter */
.events-strip .container{ flex-wrap:nowrap; overflow:hidden; }
.events-strip .events-marquee{
  flex:1; min-width:0; overflow:hidden;
  mask-image:linear-gradient(90deg, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%);
}
.events-strip .events-track{
  width:max-content; overflow:visible; animation:cidsa-events-scroll 36s linear infinite;
}
.events-strip .events-marquee:hover .events-track{ animation-play-state:paused; }
@keyframes cidsa-events-scroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

.prefooter-services{
  background:linear-gradient(180deg, #f7f9fd 0%, #eef3fa 100%);
  border-top:1px solid var(--cidsa-border);
  padding:54px 0;
}
.prefooter-grid{
  display:grid; grid-template-columns:minmax(280px,.9fr) minmax(0,1.35fr); gap:24px; align-items:stretch;
}
.payment-panel,
.insurance-marquee-panel{
  background:#fff; border:1px solid var(--cidsa-border); border-radius:8px;
  box-shadow:var(--shadow); padding:26px;
}
.section-kicker{
  display:inline-flex; align-items:center; gap:8px; color:var(--cidsa-red); font-weight:800;
  text-transform:uppercase; font-size:.76rem; letter-spacing:.08em; margin-bottom:10px;
}
.payment-panel h2,
.insurance-panel-head h2{ color:var(--cidsa-blue); font-size:1.35rem; margin:0 0 10px; }
.payment-panel p{ color:var(--cidsa-gray); margin-bottom:18px; }
.payment-methods{ display:flex; flex-wrap:wrap; gap:10px; }
.payment-methods span{
  display:inline-flex; align-items:center; gap:8px; padding:10px 12px; border-radius:8px;
  background:var(--cidsa-blue-light); color:#213653; font-weight:700; font-size:.88rem;
}
.payment-methods i{ color:var(--cidsa-blue); font-size:1.05rem; }
.insurance-panel-head{
  display:flex; justify-content:space-between; gap:18px; align-items:flex-start; margin-bottom:18px;
}
.insurance-marquee{
  overflow:hidden; padding:8px 0;
  mask-image:linear-gradient(90deg, transparent 0, #000 42px, #000 calc(100% - 42px), transparent 100%);
}
.insurance-marquee-track{
  display:flex; gap:14px; width:max-content; animation:cidsa-insurance-scroll 34s linear infinite;
}
.insurance-marquee:hover .insurance-marquee-track{ animation-play-state:paused; }
.insurance-logo{
  min-width:152px; height:74px; border:1.5px solid var(--cidsa-border); border-radius:8px;
  display:flex; align-items:center; justify-content:center; gap:9px; background:#fff;
  color:#24364f; font-weight:900; letter-spacing:.03em; box-shadow:0 8px 18px rgba(10,31,68,.06);
}
.insurance-logo i{ width:28px; height:28px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-size:.9rem; }
.insurance-logo-chorus i{ background:#1a3a6b; }
.insurance-logo-haner i{ background:#c0392b; }
.insurance-logo-allianz i{ background:#0067b1; }
.insurance-logo-sunu i{ background:#f1a208; }
.insurance-logo-nsia i{ background:#244c89; }
.insurance-logo-ascoma i{ background:#2b8c67; }
.insurance-logo-mge i{ background:#7a3eb1; }
.insurance-logo-olea i{ background:#4c9f38; }
@keyframes cidsa-insurance-scroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

@media (max-width: 900px){
  .prefooter-grid{ grid-template-columns:1fr; }
  .insurance-panel-head{ align-items:flex-start; }
}
@media (max-width: 640px){
  .events-strip .container{ gap:10px; padding:12px; }
  .events-strip .events-label{ padding:6px 12px; font-size:.72rem; }
  .events-strip .btn{ padding:8px 12px; min-width:max-content; }
  .prefooter-services{ padding:36px 0; }
  .payment-panel,.insurance-marquee-panel{ padding:20px; }
  .insurance-panel-head{ flex-direction:column; }
  .insurance-panel-head .btn{ width:100%; justify-content:center; }
  .insurance-logo{ min-width:132px; height:66px; font-size:.84rem; }
}
@media (prefers-reduced-motion: reduce){
  .events-strip .events-track,
  .insurance-marquee-track{ animation:none; transform:none; }
}

/* Enhanced payment and insurance icons */
.payment-methods .payment-chip{
  min-height:44px; border:1px solid transparent; background:#f6f8fc;
}
.payment-methods .payment-chip i{
  width:28px; height:28px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  color:#fff; font-size:.95rem; flex:0 0 28px;
}
.payment-cash i{ background:#228b52; }
.payment-orange i{ background:#ff7900; }
.payment-mtn i{ background:#f5c400; color:#1b2638 !important; }
.payment-wave i{ background:#1ec9ff; }
.payment-visa i{ background:#1a1f71; }
.payment-mastercard i{ background:#eb001b; }
.payment-djamo i{ background:#111827; }
.payment-orange{ border-color:rgba(255,121,0,.22); }
.payment-mtn{ border-color:rgba(245,196,0,.3); }
.payment-wave{ border-color:rgba(30,201,255,.25); }
.payment-visa{ border-color:rgba(26,31,113,.2); }
.payment-mastercard{ border-color:rgba(235,0,27,.18); }

.insurance-logo{ min-width:164px; }
.insurance-logo-towerus i{ background:#8a4b2a; }
.insurance-logo-amsa i{ background:#008f8c; }
.insurance-logo-ankara i{ background:#bd3346; }
.insurance-logo-graas i{ background:#546a7b; }
.insurance-logo-leadway i{ background:#e87822; }
.insurance-logo-ivoir i{ background:#169b62; }
.insurance-logo-serenity i{ background:#7c6df0; }
.insurance-logo-sidam i{ background:#244c89; }
.insurance-logo-vita i{ background:#c0392b; }
@media (max-width: 640px){
  .payment-methods .payment-chip{ width:100%; }
  .insurance-logo{ min-width:142px; }
}

/* Admin vitrine messages */
.vitrine-message-kpis{ grid-template-columns:repeat(4,1fr); }
.vitrine-message-filters{ margin-bottom:0; }
.table-responsive{ width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.muted-line{ display:block; color:var(--cidsa-gray); font-size:.78rem; margin-top:3px; }
.row-actions{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.message-unread td{ background:#fffaf3; }
.whatsapp-mini i{ color:#25D366; }
.modal-title-row{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px; }
.modal-title-row h3{ margin:0; }
.vitrine-message-modal{ max-width:760px; }
.message-detail{ margin:14px 0 18px; }
.message-body{ margin-top:14px; padding:16px; background:var(--cidsa-gray-light); border-radius:8px; line-height:1.65; }
.message-actions{ display:flex; gap:10px; margin-top:12px; flex-wrap:wrap; }
.whatsapp-action{ background:#25D366; color:#fff; border-color:#25D366; }
.whatsapp-action:hover{ background:#1ebe57; color:#fff; transform:translateY(-2px); }
.badge-non_lu{ background:#fff4e0; color:#a3690a; }
.badge-lu{ background:#e0eefc; color:#1d5fa8; }
.badge-traite{ background:#e3f7ec; color:#1d7a3c; }
.badge-archive{ background:#edf0f5; color:#61708a; }
@media (max-width: 1024px){
  .vitrine-message-kpis{ grid-template-columns:repeat(2,1fr); }
  .vitrine-message-table{ min-width:760px; }
}
@media (max-width: 640px){
  .vitrine-message-kpis{ grid-template-columns:1fr; }
  .message-actions .btn{ width:100%; justify-content:center; }
  .vitrine-message-modal{ padding:22px; }
}
