/**
 * Header Override FINAL - Force absolue
 *
 * ÉCRASE TOUS les styles WordPress/Gutenberg avec !important
 *
 * Problèmes:
 * - WordPress ajoute is-layout-constrained qui limite la largeur
 * - Logo pas à 64px
 * - Bandeau pas full-width
 *
 * Version: 1.0.0
 * Date: 9 novembre 2025
 */

/* ============================================
   SPÉCIFICITÉ MAXIMALE - HEADER FULL WIDTH
   ============================================ */

/* Header <header> element - FULL WIDTH ABSOLU */
header.wp-block-group.site-header,
header.site-header,
.site-header {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Container - ENLEVER max-width de is-layout-constrained */
.site-header .header-container,
.site-header .wp-block-group.header-container,
.site-header div.header-container {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 2rem !important;
  padding-right: 2rem !important;
  box-sizing: border-box !important;
}

/* Wrapper - Contenu centré MAIS header full-width */
.site-header .header-wrapper,
.site-header .wp-block-group.header-wrapper {
  width: 100% !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* ============================================
   LOGO - FORCE 200PX ABSOLU
   ============================================ */

/* Logo container */
.site-header .site-logo,
.site-header .wp-block-group.site-logo {
  width: auto !important;
  max-width: none !important;
  min-width: 200px !important;
  height: auto !important;
  gap: 0 !important;
  flex-shrink: 0 !important;
}

/* Logo WordPress block */
.site-header .wp-block-site-logo,
.site-header figure.wp-block-site-logo {
  width: 200px !important;
  height: auto !important;
  min-width: 200px !important;
  max-width: 200px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Logo IMG */
.site-header .wp-block-site-logo img,
.site-header .wp-block-site-logo .custom-logo,
.site-header img.custom-logo {
  width: 200px !important;
  height: auto !important;
  min-width: 200px !important;
  max-width: 200px !important;
  object-fit: contain !important;
  display: block !important;
}

/* ============================================
   SITE TITLE - MASQUER ABSOLU
   ============================================ */

/* Masquer le texte "Clémence Fouquet" */
.site-header .wp-block-site-title,
.site-header p.wp-block-site-title,
.site-header h1.wp-block-site-title {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* ============================================
   NAVIGATION
   ============================================ */

/* Navigation container */
.site-header .site-nav,
.site-header .wp-block-navigation,
.site-header nav.wp-block-navigation {
  /* margin-left: auto !important; -- Commenté pour rapprocher logo et navigation */
  flex-shrink: 0 !important;
}

/* Navigation items */
.site-header .wp-block-navigation__container {
  gap: 2.5rem !important;
}

.site-header .wp-block-navigation-item a {
  font-size: 1.125rem !important;
  font-weight: 500 !important;
  color: #44403c !important;
  text-decoration: none !important;
}

.site-header .wp-block-navigation-item a:hover,
.site-header .wp-block-navigation-item a:focus {
  color: #f89420 !important;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media screen and (max-width: 1024px) {
  .site-header .header-container {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
}

@media screen and (max-width: 767px) {
  .site-header .header-container {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  /* Logo proportionnel sur mobile */
  .site-header .wp-block-site-logo,
  .site-header figure.wp-block-site-logo {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
  }

  .site-header .wp-block-site-logo img {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
  }
}

@media screen and (max-width: 480px) {
  .site-header .wp-block-site-logo,
  .site-header figure.wp-block-site-logo {
    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;
  }

  .site-header .wp-block-site-logo img {
    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;
  }
}

/* ============================================
   DEBUG - Vérifier que ce fichier charge
   ============================================ */

/* Marquer le body pour confirmer le chargement */
body.home {
  --header-override-final-loaded: true;
}