/* =========================================================
   WeatherNCo – barre de navigation partagée
   Charte « pages cartes » (index_bretagne_new) + cours :
   barre blanche, titres Barlow Condensed, bleu WeatherNCo,
   touche orange, panneaux blancs à ombre douce.
   Fichier unique : modifier ici = toutes les pages à jour.
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&display=swap');

:root{
  --wn-primary:   #2874a6;   /* bleu WeatherNCo (cours) */
  --wn-primary-2: #1f5f8a;
  --wn-blue:      #3C5FA6;   /* bleu des pages cartes */
  --wn-orange:    #F28C1E;   /* accent (outil mesure, POI) */
  --wn-txt:       #1d2430;
  --wn-muted:     #6b7480;
  --wn-line:      rgba(0,0,0,.08);
  --wn-soft:      #eef2f8;   /* fond doux (calendrier des runs) */
  --wn-page:      #f6f8fb;
  --wn-font:      "Segoe UI", Verdana, system-ui, -apple-system, Roboto, Arial, sans-serif;
  --wn-font-cond: "Barlow Condensed", "Segoe UI", Arial, sans-serif;
}

/* ---------- Barre ---------- */
.navbar-wnco{
  background:#fff;
  border-bottom:1px solid var(--wn-line);
  min-height:64px; padding-top:.35rem; padding-bottom:.35rem;
  font-family:var(--wn-font);
  transition:box-shadow .2s ease;
}
.navbar-wnco.is-scrolled{ box-shadow:0 6px 22px rgba(10,20,40,.10); }

/* Logo + filet vertical (comme le bandeau des cartes) */
.navbar-wnco .wn-brand{
  display:flex; align-items:center; padding:0 18px 0 0; margin-right:12px;
  border-right:1px solid var(--wn-line);
}
.navbar-wnco .wn-brand img{ display:block; width:132px; height:auto; }

/* Liens principaux : Barlow Condensed, majuscules, soulignement orange */
.navbar-wnco .nav-link{
  position:relative;
  font-family:var(--wn-font-cond); font-weight:700; font-size:17px;
  letter-spacing:.4px; text-transform:uppercase;
  color:var(--wn-txt) !important;
  padding:.55rem .75rem !important;
  transition:color .15s ease;
}
.navbar-wnco .nav-link::before{
  content:""; position:absolute; left:.75rem; right:.75rem; bottom:.2rem; height:3px; border-radius:2px;
  background:var(--wn-orange); transform:scaleX(0); transform-origin:left; transition:transform .2s ease;
}
.navbar-wnco .nav-link:hover,
.navbar-wnco .nav-link:focus,
.navbar-wnco .nav-link.show{ color:var(--wn-primary) !important; background:transparent !important; }
.navbar-wnco .nav-link:hover::before,
.navbar-wnco .nav-link.show::before,
.navbar-wnco .nav-link.active::before{ transform:scaleX(1); }
.navbar-wnco .nav-link.active{ color:var(--wn-primary) !important; border-bottom:0 !important; }
.navbar-wnco .dropdown-toggle::after{ vertical-align:.18em; opacity:.45; margin-left:.3em; }

/* ---------- Menus déroulants : panneaux blancs ---------- */
.navbar-wnco .dropdown-menu{
  background:#fff; border:1px solid var(--wn-line); border-radius:14px;
  box-shadow:0 14px 44px rgba(0,0,0,.16);
  padding:.45rem; min-width:16rem; margin-top:.35rem;
  font-family:var(--wn-font);
}
.navbar-wnco .dropdown-item{
  color:var(--wn-txt) !important; background:transparent;
  font-family:var(--wn-font); font-size:13.5px; font-weight:500;
  letter-spacing:0; text-transform:none;
  padding:.45rem .7rem; border:0 !important; border-radius:8px;
  transition:background .12s ease, color .12s ease;
}
.navbar-wnco .dropdown-item:hover,
.navbar-wnco .dropdown-item:focus{ background:var(--wn-soft) !important; color:var(--wn-blue) !important; }
.navbar-wnco .dropdown-item[aria-current="page"],
.navbar-wnco .dropdown-item.active{
  background:var(--wn-soft) !important; color:var(--wn-blue) !important; font-weight:700;
  box-shadow:inset 3px 0 0 var(--wn-orange);
}
.navbar-wnco .dropdown-divider{ border-top:1px solid #eceef2; margin:.35rem .2rem; opacity:1; }
/* Titres de colonnes (comme .lp-sec des cartes) */
.navbar-wnco .dropdown-header{
  font-family:var(--wn-font); font-size:10.5px; font-weight:700; letter-spacing:.8px; text-transform:uppercase;
  color:var(--wn-muted); background:none; padding:.7rem .7rem .3rem; margin:0; cursor:default;
}

/* Méga-menus */
.dropdown-mega{ position:static; }
.dropdown-menu-mega{ width:min(100%,1000px); padding:.8rem 1rem !important; }
.navbar-wnco .dropdown-menu-mega > .row > [class*="col-"]{ border-right:1px solid #eceef2; }
.navbar-wnco .dropdown-menu-mega > .row > [class*="col-"]:last-child{ border-right:0; }

/* Sous-menu (Analyses > Prévision) */
.dropdown-submenu{ position:relative; }
.dropdown-submenu > .dropdown-item{ display:flex; align-items:center; justify-content:space-between; padding-right:1.75rem; }
.dropdown-submenu > .dropdown-item::after{
  content:""; margin-left:.5rem; border:.3em solid transparent; border-left-color:currentColor; opacity:.5;
}
.navbar-wnco .dropdown-submenu > .dropdown-menu{ top:-.45rem; left:calc(100% - 4px); margin:0; }

/* ---------- Réseaux & langues (cercles légers, comme .lp-btn) ---------- */
.social-links{ gap:.3rem !important; margin:0 !important; }
.social-links .list-inline-item{ margin:0 !important; }
.navbar-wnco .social-links a{
  width:34px; height:34px; padding:0; display:inline-grid !important; place-items:center;
  border-radius:50%; background:transparent; transition:background .15s ease;
}
.navbar-wnco .social-links a:hover{ background:var(--wn-soft); }
.navbar-wnco .social-links img{ width:20px; height:20px; filter:none !important; }
.lang-flag img{ width:22px !important; height:16px !important; border-radius:3px; box-shadow:0 0 0 1px var(--wn-line); }

/* Burger visible sur fond blanc */
.navbar-wnco .navbar-toggler{ border-color:rgba(0,0,0,.12); }
.navbar-wnco .navbar-toggler-icon{ filter:none !important; }

/* ---------- Mobile ---------- */
@media (max-width: 991.98px){
  .navbar-wnco .wn-brand{ border-right:0; padding-right:0; }
  .navbar-wnco .navbar-collapse{ max-height:75vh; overflow:auto; padding:.4rem 0 .8rem; background:#fff !important; }
  .navbar-wnco .dropdown-menu{ box-shadow:none; background:var(--wn-soft); border:0; }
  .navbar-wnco .dropdown-menu-mega > .row > [class*="col-"]{ border-right:0; }
  .navbar-wnco .nav-link::before{ display:none; }
  .dropdown-submenu > .dropdown-menu{ left:0 !important; }
  .dropdown-submenu > .dropdown-item::after{ display:none; }
}

/* La barre est injectée dans #site-nav : c'est ce conteneur qui reste collé en haut */
#site-nav{ position:sticky; top:0; z-index:1030; }
#site-nav .navbar-wnco.sticky-top{ position:relative; }
#site-nav:empty{ min-height:64px; background:#fff; border-bottom:1px solid var(--wn-line); }

/* ---------- Neutralise l'ancien thème (modern-business.css / main.css) ---------- */
.navbar.navbar-wnco{ height:auto; justify-content:flex-start; background:#fff !important; }
.navbar-wnco .navbar-nav > li{ margin-right:0 !important; }
.navbar-wnco .navbar-nav > li > a.nav-link{
  font-family:var(--wn-font-cond) !important; font-weight:700 !important; font-size:17px !important;
  letter-spacing:.4px; text-transform:uppercase;
}
.navbar-wnco .navbar-nav > li > a.nav-link:hover{ background-color:transparent !important; }
.navbar-wnco .dropdown-menu .dropdown-item:last-child{ border-bottom:0 !important; }
.navbar-wnco .navbar-toggler-icon{
  width:1.5em !important; height:1.5em !important; margin:0 !important; background-color:transparent !important;
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2829,36,48,.8%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}
.navbar-wnco .social-links a:hover{ transform:none !important; }

/* Pas de cadre bleu Bootstrap au survol ; anneau discret au clavier seulement */
.navbar-wnco .nav-link:focus{ box-shadow:none !important; outline:0; }
.navbar-wnco .nav-link:focus-visible{ outline:2px solid var(--wn-orange); outline-offset:2px; border-radius:6px; }
