/* TentoniNumérik R44.3.17
   Correctif ciblé : accueil PUBLIC téléphone/tablette uniquement.
   - aucun changement de structure DOM ;
   - 4 cartes strictement homogènes ;
   - pas de météo/date/heure au premier rendu public, donc plus de flash/reflow. */

/* IMPORTANT : on cible home-route, posé par app.js AVANT l'injection du contenu.
   On ne dépend donc plus de tn-reference-phone/tablet, qui arrive plus tard. */
@media (max-width:1050px){
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .top-meta,
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .top-weather-inline,
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .top-date,
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .top-time,
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .language-btn{
    display:none!important;
    visibility:hidden!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .mobile-menu-btn{
    display:none!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .topbar{
    background:#fff!important;
    min-height:68px!important;
    height:auto!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .topbar-inner{
    width:100%!important;
    max-width:none!important;
    min-height:68px!important;
    height:auto!important;
    padding:8px 10px!important;
    margin:0!important;
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:7px!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .brand{
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:5px!important;
    overflow:visible!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .brand-copy{
    min-width:0!important;
    overflow:visible!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .top-actions{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:4px!important;
  }

  /* La grille doit toujours contenir les quatre accès. */
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    align-items:stretch!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access,
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access:nth-child(4),
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access:nth-child(n+4){
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    position:relative!important;
    box-sizing:border-box!important;
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
    overflow:hidden!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-copy,
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-copy strong,
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-copy small{
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    white-space:normal!important;
  }
}

/* TABLETTE : 2 × 2, quatre cartes exactement identiques. */
@media (min-width:721px) and (max-width:1050px){
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-auto-rows:260px!important;
    gap:14px!important;
    width:100%!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access{
    width:100%!important;
    height:260px!important;
    min-height:260px!important;
    max-height:260px!important;
    margin:0!important;
    padding:0!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    border-radius:18px!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .tn-ref-quick-photo{
    position:static!important;
    display:block!important;
    flex:0 0 94px!important;
    width:100%!important;
    height:94px!important;
    min-height:94px!important;
    max-height:94px!important;
    margin:0!important;
    background-size:cover!important;
    background-position:center!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-icon-shell{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    flex:0 0 50px!important;
    width:50px!important;
    height:50px!important;
    margin:-25px auto 2px!important;
    align-self:center!important;
    z-index:3!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-icon{
    width:34px!important;
    height:34px!important;
    object-fit:contain!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-copy{
    flex:1 1 auto!important;
    width:100%!important;
    min-width:0!important;
    padding:4px 16px 13px!important;
    margin:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    text-align:center!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-copy strong{
    width:100%!important;
    margin:0!important;
    font-size:17px!important;
    line-height:1.12!important;
    text-align:center!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-copy small{
    display:block!important;
    width:100%!important;
    max-width:96%!important;
    margin:0 auto!important;
    font-size:10px!important;
    line-height:1.25!important;
    text-align:center!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-cta{
    position:static!important;
    inset:auto!important;
    right:auto!important;
    top:auto!important;
    transform:none!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    align-self:center!important;
    min-width:114px!important;
    min-height:30px!important;
    margin:5px auto 0!important;
    padding:6px 14px!important;
    font-size:10px!important;
    text-align:center!important;
  }
}

/* TÉLÉPHONE : quatre cartes verticales strictement identiques.
   La 4e carte Services ne peut plus retomber dans l'ancien format horizontal. */
@media (max-width:720px){
  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-auto-rows:330px!important;
    gap:14px!important;
    width:100%!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access{
    width:100%!important;
    height:330px!important;
    min-height:330px!important;
    max-height:330px!important;
    margin:0!important;
    padding:0!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    border-radius:20px!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .tn-ref-quick-photo{
    position:static!important;
    display:block!important;
    flex:0 0 145px!important;
    width:100%!important;
    height:145px!important;
    min-height:145px!important;
    max-height:145px!important;
    margin:0!important;
    background-size:cover!important;
    background-position:center!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-icon-shell{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    transform:none!important;
    flex:0 0 54px!important;
    width:54px!important;
    height:54px!important;
    margin:-27px auto 2px!important;
    align-self:center!important;
    justify-self:auto!important;
    z-index:3!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-icon{
    width:36px!important;
    height:36px!important;
    object-fit:contain!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-copy{
    position:static!important;
    grid-column:auto!important;
    grid-row:auto!important;
    flex:1 1 auto!important;
    width:100%!important;
    min-width:0!important;
    padding:3px 20px 17px!important;
    margin:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    text-align:center!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-copy strong{
    width:100%!important;
    margin:0!important;
    font-size:20px!important;
    line-height:1.12!important;
    text-align:center!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-copy small{
    display:block!important;
    width:100%!important;
    max-width:94%!important;
    margin:0 auto!important;
    font-size:11px!important;
    line-height:1.28!important;
    text-align:center!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-cta{
    position:static!important;
    inset:auto!important;
    right:auto!important;
    left:auto!important;
    top:auto!important;
    bottom:auto!important;
    transform:none!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    align-self:center!important;
    min-width:150px!important;
    min-height:38px!important;
    margin:6px auto 0!important;
    padding:8px 18px!important;
    font-size:11px!important;
    text-align:center!important;
  }

  html:not(.tn-r42-desktop) body.home-route:not(.tn-auth-home) .quick-access-121 .quick-access-cta b{
    font-size:14px!important;
  }
}
