/* ========================================================
   THÈME BDS UTBM : NOIR & BLANC (CORRECTIF MENU FIXE)
   ======================================================== */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');

/* Style global */
body, p, div, span, li, a, input, button {
  font-family: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

body {
  background-color: #fcfcfc !important;
  color: #1a1a1a !important;
  line-height: 1.6 !important;
}

/* 1. FOND DU HEADER */
header, .s-header, nav, .navbar, .module-menu, .s-nav, #menu, .navigation {
  background-color: #000000 !important;
  border-bottom: 1px solid #222222 !important;
}

/* 2. FORCER L'AFFICHAGE DU MENU HORIZONTAL SUR PC (Déplie le menu caché) */
@media (min-width: 768px) {
  /* Masque le bouton burger sur ordinateur */
  .navbar-toggler, .navbar-toggle, [class*="burger"] {
    display: none !important;
  }
  
  /* Force l'affichage à plat des liens */
  .navbar-collapse, .collapse, .module-menu, nav, ul.nav, ul.menu, .navbar-nav {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
  }

  ul.nav, ul.menu, .navbar-nav {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  ul.nav > li, ul.menu > li, .navbar-nav > li {
    display: inline-block !important;
    background-color: transparent !important;
  }
}

/* 3. STYLE DES LIENS DU MENU (BLANC SUR NOIR) */
header a, .s-header a, nav a, .navbar a, .module-menu a, .s-nav a, #menu a, 
.navigation a, ul.nav li a, ul.menu li a, .navbar-nav li a, .nav-link, .menu-item a {
  color: #ffffff !important;
  background-color: transparent !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  opacity: 1 !important;
  padding: 12px 18px !important;
  display: inline-block !important;
  transition: all 0.2s ease !important;
}

/* Survol des liens */
header a:hover, nav a:hover, .module-menu a:hover, .s-header a:hover,
ul.nav li a:hover, ul.menu li a:hover, .navbar-nav li a:hover {
  color: #a0a0a0 !important;
  background-color: transparent !important;
}

/* 4. ÉLÉMENT ACTIF (ACCUEIL) : SOULIGNÉ EN BLANC SANS BLOC BLANC */
.active > a, li.active a, .current-menu-item a, a.active, 
.navbar-nav .active > .nav-link, .module-menu .active a {
  color: #ffffff !important;
  background-color: transparent !important;
  background: none !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-decoration-color: #ffffff !important;
  text-underline-offset: 6px !important;
  text-decoration-thickness: 2px !important;
}

/* 5. TITRES ET BOUTONS */
h1, h2, h3, h4, h5, h6 {
  color: #000000 !important;
  font-family: 'Outfit', sans-serif !important;
}

h1 {
  font-size: 2.5rem !important;
  font-weight: 800 !important;
  letter-spacing: -1px !important;
  text-transform: uppercase !important;
  margin-bottom: 1.5rem !important;
}

h2 {
  font-size: 1.8rem !important;
  font-weight: 700 !important;
  border-bottom: 2px solid #000000 !important;
  padding-bottom: 0.5rem !important;
  margin-top: 2rem !important;
  display: inline-block !important;
}

.btn, button, input[type="submit"], .s-button, .button {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: 1px solid #000000 !important;
  border-radius: 4px !important;
  padding: 12px 28px !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  display: inline-block !important;
  text-decoration: none !important;
}

.btn:hover, button:hover, input[type="submit"]:hover, .s-button:hover, .button:hover {
  background-color: #ffffff !important;
  color: #000000 !important;
  border-color: #000000 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.12) !important;
}