/* mobile-fixes.css - correctifs mobile et bandeau cookies (23/10/2026, audit visuel SEO s2).
   Charge depuis templates/ifce-formation.footer.tpl sur toutes les pages.
   Regles desktop limitees au panneau cookies ; le reste est sous media query mobile. */

/* 1. Panneau cookies ferme : plus d'ombre ni de rendu hors ecran (l'ombre de 40 px debordait
      sur le bord droit de toutes les pages). visibility retardee pour conserver l'animation. */
#ck-panel{visibility:hidden;box-shadow:none;transition:transform .3s cubic-bezier(.4,0,.2,1),visibility 0s linear .3s}
#ck-panel.ck-visible{visibility:visible;box-shadow:-8px 0 40px rgba(11,31,58,.18);transition:transform .3s cubic-bezier(.4,0,.2,1),visibility 0s}
/* Titre du panneau : ancien h2 remplace par un div role=heading (structure Hn des pages). */
#ck-header .ck-titre{font-size:1rem;font-weight:700;color:var(--white,#fff);margin:0}

/* 2. Bandeau cookies affiche : le bouton rond des preferences est inutile (le bandeau a
      « Personnaliser ») et il recouvrait « Postuler maintenant » sur les offres. */
body:has(#ck-banner:not(.hidden)) #ck-fab{display:none}
/* Bouton « haut de page » et barre d'action des offres remontes de la hauteur du bandeau
   (--ck-banner-h posee par le script du pied de page). */
#ifce-totop{bottom:calc(24px + var(--ck-banner-h,0px)) !important}
body:has(.of-barre-action) #ifce-totop{bottom:calc(92px + var(--ck-banner-h,0px)) !important}
body:has(#ck-banner:not(.hidden)) .of-barre-action{bottom:var(--ck-banner-h,0px)}

@media (max-width:599px){
  /* 3. Bandeau cookies plus compact sur mobile (80 px -> environ 68 px). */
  #ck-banner{padding:.3rem .6rem .4rem;gap:.15rem;box-shadow:0 -2px 12px rgba(0,0,0,.25)}
  #ck-banner p{font-size:.72rem;line-height:1.3}
  .ck-banner-btns{gap:.35rem}
  .ck-banner-btn{min-height:44px;padding:.3rem .2rem;font-size:.76rem}
}

@media (max-width:767px){
  /* 4. Accueil : le bouton « Candidater » et la rangee de boutons passent juste sous le H1,
        avant le paragraphe de description (ordre dans .hero-left, deja en flex colonne). */
  .hero-left{display:flex;flex-direction:column}
  .hero-badge{order:0;margin-bottom:1.1rem}
  .hero h1{order:1;margin-bottom:1rem}
  .hero-btns{order:2;margin-bottom:1.4rem;gap:.6rem}
  .hero-desc{order:3;margin-bottom:1.6rem;font-size:.98rem;line-height:1.6}
  .hero-kpis{order:4}
  .hero-btns .btn-gold,.hero-btns .btn-white-ghost{min-height:44px}

  /* 5. Cibles tactiles a 44 px minimum. */
  .ifce-breadcrumb{padding:.15rem 0}
  .ifce-breadcrumb a,.fv2-ariane a{display:inline-block;padding:.95rem 0}
  .topbar-qualiopi a,.topbar-intranet{display:inline-flex;align-items:center;padding:.85rem 0;margin:-.85rem 0}
  .iform-input,.iform-select,.iform-textarea{min-height:44px;font-size:1rem}
  .footer-col a{padding:.9rem 0;margin-bottom:0;line-height:1.3}
  .footer-col h5{margin-bottom:.4rem}
  .footer-bottom p a{display:inline-block;padding:.75rem .15rem}
}
