/* ============================================================
 * DP UI Pack - 18 Header (additif strict)
 * Cible : .navbar / .hestia-top-bar / #main-navigation (Hestia)
 * Règles : pas de !important, pas de drawer custom,
 *          on laisse Hestia gérer width/padding/positions/display.
 * On ajoute uniquement : ombre, couleurs, hover subtil,
 *          radius dropdown, CTA pill rouge sur menu-item-298 / 3110.
 * ============================================================ */

/* ------------------------------------------------------------
 * Topbar Hestia (réseaux sociaux + widget tel/email)
 * Additif : couleur de fond + taille de police, sans toucher
 * au layout (float / pull-left / pull-right de Hestia).
 * ------------------------------------------------------------ */
.hestia-top-bar {
  background: linear-gradient(90deg, var(--dp-bg-darker) 0%, var(--dp-bg-dark) 100%);
  border-bottom: 1px solid var(--dp-border-on-dark);
  font-size: 0.82rem;
  letter-spacing: 0.01em;
}
.hestia-top-bar a,
.hestia-top-bar .top-bar-nav li a {
  color: var(--dp-text-on-dark);
  transition: color var(--dp-tr-fast);
}
.hestia-top-bar a:hover {
  color: var(--dp-primary-light);
}

/* ------------------------------------------------------------
 * Navbar - ombre + transitions, sans toucher au layout
 * (Hestia gère .navbar width / padding / .navbar-collapse / display).
 * ------------------------------------------------------------ */
.navbar {
  box-shadow: var(--dp-shadow-sm);
  transition: box-shadow var(--dp-tr);
}
/* Force fond blanc sur TOUTE navbar (Hestia .navbar-default ET moulinette/lawyeriax .navbar-main),
   pour battre le body bg rouge bordeau de la moulinette (#ad3a3a inline) */
.navbar.navbar-default,
.navbar.navbar-main,
.navbar.navbar-default:not(.navbar-transparent),
.main-navigation,
nav#site-navigation,
nav#site-navigation.main-navigation {
  background-color: #fff !important;
  border-bottom: 1px solid var(--dp-border);
}
/* Les liens du menu de la moulinette en couleur lisible */
nav#site-navigation a,
nav#site-navigation .main-navigation a,
.main-navigation-wrap a,
.navbar.navbar-main a {
  color: #1e293b !important;
}
nav#site-navigation a:hover,
nav#site-navigation .main-navigation a:hover,
.main-navigation-wrap a:hover,
.navbar.navbar-main a:hover {
  color: var(--dp-primary-dark) !important;
}

/* Liens menu : couleur sombre lisible sur fond blanc forcé */
.navbar a {
  color: #1e293b !important; /* dp-text-strong, force pour battre les overrides moulinette `a { color: #db3936 }` */
  transition: color var(--dp-tr-fast), background var(--dp-tr-fast);
}
.navbar a:hover,
.navbar a:focus {
  color: var(--dp-primary-dark) !important;
  text-decoration: none;
}

/* Underline animé subtil sur les items principaux uniquement */
.navbar .nav.navbar-nav > li > a {
  position: relative;
}
.navbar .nav.navbar-nav > li > a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0.25rem;
  width: 0;
  height: 2px;
  background: var(--dp-primary);
  border-radius: 2px;
  transform: translateX(-50%);
  transition: width var(--dp-tr);
  pointer-events: none;
}
.navbar .nav.navbar-nav > li:hover > a::after,
.navbar .nav.navbar-nav > li.active > a::after,
.navbar .nav.navbar-nav > li.current-menu-item > a::after,
.navbar .nav.navbar-nav > li.current-menu-parent > a::after,
.navbar .nav.navbar-nav > li.current-menu-ancestor > a::after {
  width: calc(100% - 1.6rem);
}

.navbar .nav.navbar-nav > li.active > a,
.navbar .nav.navbar-nav > li.current-menu-item > a {
  color: var(--dp-primary-dark);
}

/* Logo / brand : couleur titre soutenue */
.navbar .navbar-brand,
.navbar .navbar-brand p {
  color: var(--dp-text-strong);
  font-family: var(--dp-font-h);
  font-weight: 700;
  letter-spacing: -0.01em;
}
.navbar .navbar-brand:hover,
.navbar .navbar-brand:hover p {
  color: var(--dp-primary-dark);
}

/* ------------------------------------------------------------
 * Dropdown menu : background, radius, shadow plus douce
 * (Hestia gère la position / display / animations).
 * ------------------------------------------------------------ */
.navbar .dropdown-menu {
  background-color: #fff;
  border: 1px solid var(--dp-border);
  border-radius: var(--dp-radius);
  box-shadow: var(--dp-shadow);
}
.navbar .dropdown-menu > li > a {
  color: var(--dp-text-soft);
  border-radius: var(--dp-radius-xs);
  transition: background var(--dp-tr-fast), color var(--dp-tr-fast);
}
.navbar .dropdown-menu > li > a:hover,
.navbar .dropdown-menu > li > a:focus,
.navbar .dropdown-menu > li.active > a,
.navbar .dropdown-menu > li.current-menu-item > a {
  background: var(--dp-primary-soft);
  color: var(--dp-primary-dark);
}

/* Cache l'underline animé desktop dans les sous-menus */
.navbar .dropdown-menu > li > a::after {
  display: none;
}

/* ------------------------------------------------------------
 * CTA Contact / Devis : pill rouge.
 * Ne force PAS width / grid / display — on garde la mise en
 * page native du <li> dans la liste du menu.
 * ------------------------------------------------------------ */
.navbar .nav.navbar-nav > li.menu-item-298 > a,
.navbar .nav.navbar-nav > li.menu-item-3110 > a {
  background: linear-gradient(135deg, var(--dp-primary) 0%, var(--dp-primary-dark) 100%);
  color: #fff;
  border-radius: var(--dp-radius-pill);
  box-shadow: 0 4px 12px rgba(239, 68, 68, 0.22);
  transition: transform var(--dp-tr-fast), box-shadow var(--dp-tr-fast), background var(--dp-tr-fast);
}
.navbar .nav.navbar-nav > li.menu-item-298 > a:hover,
.navbar .nav.navbar-nav > li.menu-item-298 > a:focus,
.navbar .nav.navbar-nav > li.menu-item-3110 > a:hover,
.navbar .nav.navbar-nav > li.menu-item-3110 > a:focus {
  background: linear-gradient(135deg, var(--dp-primary-dark) 0%, var(--dp-primary) 100%);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(239, 68, 68, 0.32);
}
.navbar .nav.navbar-nav > li.menu-item-298 > a::after,
.navbar .nav.navbar-nav > li.menu-item-3110 > a::after {
  display: none;
}

/* ------------------------------------------------------------
 * Accessibilité : focus visible
 * ------------------------------------------------------------ */
.navbar a:focus-visible,
.navbar button:focus-visible,
.hestia-top-bar a:focus-visible {
  outline: 2px solid var(--dp-primary);
  outline-offset: 2px;
  border-radius: var(--dp-radius-xs);
}