/* ================== FONTS GLOBALES ================== */
@font-face{
  font-family:'Maison Neue';
  src:url('/lib/fonts/fonnts.com-Maison_Neue_Light.ttf') format('truetype');
  font-weight:300;
  font-style:normal;
}
@font-face{
  font-family:'Maison Neue';
  src:url('/lib/fonts/fonnts.com-Maison_Neue_Book.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
}
@font-face{
  font-family:'Maison Neue';
  src:url('/lib/fonts/fonnts.com-Maison_Neue_Bold.ttf') format('truetype');
  font-weight:700;
  font-style:normal;
}
@font-face{
  font-family:'Maison Neue Mono';
  src:url('/lib/fonts/fonnts.com-Maison_Neue_Mono.ttf') format('truetype');
  font-style:normal;
}

/* ================== VARIABLES GLOBALES ================== */
:root{
  --site-bg: #F4F1EB;      /* demandé : fond global beige */
  --site-text: #141414;
  --site-muted: #555;

  --nav-h: 72px;           /* hauteur du header, mise à jour par le JS */

  /* petites vars utilisées plus bas pour le header */
  --container-maxw: 1320px;
  --links-gap: 1.8rem;
  --link-pad-y: 0.35rem;

  /* demandé : accent Contact / Rencontre */
  --contact-accent: #ED9772;
}

/* Fond global du site = même couleur que le header */
html,
body{
  margin:0;
  padding:0;
  background: var(--site-bg);
  color: var(--site-text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* On laisse le script du header gérer l’espace sous la navbar */
body{
  padding-top: var(--nav-h);
}

/* ================== NAVBAR FIXE ================== */
.navbar{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:1040;

  /* même couleur que tout le site */
  background:var(--site-bg);

  -webkit-backdrop-filter:saturate(120%) blur(6px);
  backdrop-filter:saturate(120%) blur(6px);

  border-bottom:1px solid #e2dfd8; /* léger trait, ton sur ton */
  transition:transform .35s ease, box-shadow .25s ease, background .25s ease;
  padding:.35rem 0;
}

/* thème sombre : header foncé */
[data-bs-theme="dark"] .navbar{
  background:rgba(15,18,22,.95);
  border-bottom-color:#262b33;
}

/* quand on scrolle : même couleur, juste une ombre */
.navbar.is-scrolled{
  background:var(--site-bg);
  box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.navbar.nav-hidden{
  transform:translateY(-110%);
}
.navbar.nav-hidden:hover{
  transform:translateY(-110%) !important;
}

/* Toggler icon */
.navbar-toggler{ border:0; }
.navbar-toggler-icon{
  width:1.5em;
  height:1.5em;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23000' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16'/%3E%3C/svg%3E");
}
[data-bs-theme="dark"] .navbar-toggler-icon{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23fff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16'/%3E%3C/svg%3E");
}

/* Conteneur du header */
.navbar .container-fluid{
  max-width:var(--container-maxw);
  margin-inline:auto;
  padding-inline:16px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:.9rem;
}
.brand, .nav-center, .nav-tools{ flex:0 0 auto; }

@media (min-width:992px){
  .nav-center.navbar-collapse{
    display:block !important;
    width:auto !important;
    flex-basis:auto !important;
  }
}

/* Logo */
.logo-navbar{
  height:48px;
  width:auto;
  display:block;
}
@media (min-width:1200px){
  .logo-navbar{ height:52px; }
}
@media (max-width:992px){
  .logo-navbar{ height:44px; }
}

/* ================== MENU ================== */
.navbar-nav{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:var(--links-gap);
}
.nav-link{
  font-size:.9rem;
  text-transform:uppercase;
  letter-spacing:.35px;
  color:var(--site-text);
  font-weight:400; /* demandé : pas en gras (au lieu de 700) */
  padding:var(--link-pad-y) 0;
  position:relative;
}
.nav-link::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  height:2px;
  width:0;
  background:var(--site-text);
  transition:width .25s ease;
}
.nav-link:hover::after,
.nav-link.active::after{
  width:100%;
}
[data-bs-theme="dark"] .nav-link{
  color:#f3f4f6;
}
[data-bs-theme="dark"] .nav-link::after{
  background:#f3f4f6;
}

/* demandé : couleur Contact / Rencontre */
.contact-accent{
  color: var(--contact-accent) !important;
}
[data-bs-theme="dark"] .contact-accent{
  color: var(--contact-accent) !important;
}

/* ================== OUTILS ADMIN (desktop) ================== */
.icon-nav img{
  max-height:28px;
  transition:transform .2s ease;
}
.icon-nav img:hover{
  transform:translateY(-2px);
}
.views-counter{
  font-size:.85rem;
  display:flex;
  align-items:center;
  gap:.4rem;
}
.btn-reset-views{
  font-size:.75rem;
  padding:2px 6px;
  background:none;
  border:none;
  color:inherit;
  cursor:pointer;
}
.btn-reset-views:hover{
  text-decoration:underline;
}

/* Boutons nav-tools */
.nav-tools .btn{
  border-radius:999px;
  padding:.35rem .9rem;
  font-weight:600;
  font-size:.85rem;
  border:1px solid #e5e7eb !important;
  background:rgba(255,255,255,0.98) !important;
  color:#111827 !important;
  box-shadow:0 8px 18px rgba(15,23,42,.06);
  display:inline-flex;
  align-items:center;
  gap:.35rem;
}
.nav-tools .btn i{
  font-size:0.95em;
}
.nav-tools .btn:hover{
  border-color:#cbd5e1 !important;
  box-shadow:0 10px 22px rgba(15,23,42,.10);
  background:#ffffff !important;
}
[data-bs-theme="dark"] .nav-tools .btn{
  background:#0f172a !important;
  border-color:#1f2937 !important;
  color:#e5e7eb !important;
  box-shadow:0 14px 30px rgba(0,0,0,.55);
}
[data-bs-theme="dark"] .nav-tools .btn:hover{
  background:#111827 !important;
  border-color:#374151 !important;
}

/* ================== MOBILE FULL SCREEN MENU ================== */
@media (max-width:992px){
  .navbar .container-fluid{
    justify-content:space-between;
  }
  .brand .navbar-brand{
    display:none;
  }

  .navbar-collapse{
    position:fixed;
    inset:0;
    width:100%;
    height:100vh;
    background:var(--site-bg);   /* même fond en mobile */
    display:flex!important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transform:translateX(100%);
    transition:transform .35s ease;
    padding:110px 2rem 2rem;
  }
  [data-bs-theme="dark"] .navbar-collapse{
    background:#0f1216;
  }
  .navbar-collapse.show{
    transform:translateX(0);
  }

  .navbar-nav{
    flex-direction:column;
    gap:1.2rem;
  }
  .nav-link{
    font-size:1.25rem;
    padding:.75rem 0;
  }

  .nav-close{
    position:absolute;
    top:14px;
    right:16px;
    padding:.25rem;
    background:transparent;
    border:0;
    color:inherit;
    z-index:1061;
    line-height:1;
    opacity:.9;
    transition:transform .2s ease, opacity .2s ease;
  }
  .nav-close:hover{
    opacity:1;
    transform:rotate(90deg);
  }
  .nav-close svg{
    width:26px;
    height:26px;
    display:block;
  }

  .mobile-brand{
    position:absolute;
    top:22px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    z-index:1060;
  }
  .mobile-logo{
    height:52px;
    width:auto;
    display:block;
  }
}

/* ================== WHATSAPP FLOAT ================== */
.whatsapp-float{
  position:fixed!important;
  bottom:20px!important;
  right:20px!important;
  width:60px;
  height:60px;
  opacity:.6;
  transition:opacity .2s, transform .2s;
  z-index:2000;
}
.whatsapp-float:hover{
  opacity:1;
  transform:scale(1.1);
}
.whatsapp-float img{
  width:100%;
  height:100%;
}

/* Badge inbox (admin) */
.inbox-badge{
  position:absolute;
  top:-6px;
  right:-10px;
}