/* =====================================================================================
   Cnaturel — footer.css
   Rôle : styles UNIQUEMENT du footer (footer.inc.php)
   ===================================================================================== */

/* =====================================================================================
   CHAPITRE 1 — CONTENEUR GLOBAL
   ===================================================================================== */
.site-footer{
  background:#ffffff;
  border-top:1px solid var(--border, #e6e6e6);
  padding:10px 0;
}

/* =====================================================================================
   CHAPITRE 2 — GRILLE INTERNE
   ===================================================================================== */
.footer-inner{
  max-width:1200px;
  margin:0 auto;
  padding:0 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  font-family:var(--font, Arial, sans-serif);
  font-size:0.85rem;
  line-height:1.2;
  color:var(--muted, #666666);
}

/* =====================================================================================
   CHAPITRE 3 — BLOC GAUCHE (LOGO)
   ===================================================================================== */
.footer-left{
  display:flex;
  align-items:center;
}

.footer-brand{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
}

.footer-logo{
  height:34px;
  width:auto;
  display:block;
}

/* =====================================================================================
   CHAPITRE 4 — BLOC DROIT (INFOS)
   ===================================================================================== */
.footer-right{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
  text-align:right;
}

.footer-right a{
  color:var(--muted, #666666);
  text-decoration:none;
  font-weight:600;
}

.footer-right a:hover{
  text-decoration:underline;
}

.footer-right .sep{
  opacity:.5;
}

/* =====================================================================================
   CHAPITRE 5 — LIENS MOBILE
   ===================================================================================== */
.footer-mobile-links{
  display:none;
}

/* =====================================================================================
   CHAPITRE 6 — RESPONSIVE TABLETTE / MOBILE
   ===================================================================================== */
@media (max-width:720px){
  .footer-inner{
    flex-direction:column;
    justify-content:center;
    text-align:center;
  }

  .footer-right{
    justify-content:center;
    text-align:center;
  }
}

/* =====================================================================================
   CHAPITRE 7 — HOME MOBILE : footer fixe + ordre mobile spécifique
   ===================================================================================== */
@media (max-width:900px){

  /* réserve la place du footer fixe en bas sur la home */
  body.home{
    padding-bottom:135px;
  }

  /* footer fixé en bas uniquement sur la home */
  body.home .site-footer{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1000;
    background:#fff;
    box-shadow:0 -6px 18px rgba(0,0,0,.08);
    display:flex;
    flex-direction:column;
    padding:0;
  }

  /* 3 liens en premier */
  body.home .footer-mobile-links{
    display:flex;
    order:1;
    width:100%;
    border-top:1px solid rgba(0,0,0,.08);
    background:#fff;
  }

  body.home .footer-mobile-links a{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:10px 8px;
    text-align:center;
    text-decoration:none;
    font-size:.86rem;
    font-weight:600;
    line-height:1.2;
    color:#222;
    border-right:1px solid rgba(0,0,0,.06);
    box-sizing:border-box;
  }

  body.home .footer-mobile-links a:last-child{
    border-right:none;
  }

  /* bloc du dessous */
  body.home .footer-inner{
    order:2;
    max-width:none;
    width:100%;
    padding:10px 14px 12px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-align:center;
  }

  /* on masque le logo sur mobile */
  body.home .footer-left{
    display:none;
  }

  /* ligne infos en dessous */
  body.home .footer-right{
    display:flex;
    width:100%;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:6px;
    text-align:center;
    font-size:.92rem;
  }

  body.home .footer-right .sep{
    opacity:.6;
  }
}