/* ==========================================================================
   Webena demos · Responsive guard V20
   Objectif: aucune collision de navigation avant bascule burger.
   Chargé EN DERNIER sur les 6 démonstrations.
   ========================================================================== */

/* Règles structurelles communes */
.t-nav{box-sizing:border-box!important;max-width:100%!important}
.t-nav>*{min-width:0}
.t-nav__links{min-width:0}
.t-nav__links a{white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important;hyphens:none!important;flex:0 0 auto}
.t-nav__right{min-width:max-content!important;flex:0 0 auto!important}
.t-lang{flex:0 0 auto!important;white-space:nowrap!important}
.t-lang button{flex:0 0 auto!important;white-space:nowrap!important;word-break:keep-all!important;overflow-wrap:normal!important}
.t-burger{flex:0 0 44px!important}

/* Le JS peut forcer l'un ou l'autre état après mesure réelle. */
.t-nav.demo-nav-compact .t-nav__links{display:none!important}
.t-nav.demo-nav-compact .t-burger{display:grid!important}
.t-nav.demo-nav-measure .t-nav__links{display:flex!important}
.t-nav.demo-nav-measure .t-burger{display:none!important}

/* Céline : 7 entrées, on bascule avant que « Espace mariés » se rapproche. */
@media(max-width:1180px){
  body[data-demo-theme="minimal"] .t-nav__links{display:none!important}
  body[data-demo-theme="minimal"] .t-burger{display:grid!important}
}
/* Fara : menu le plus long, breakpoint volontairement plus précoce. */
@media(max-width:1320px){
  body[data-demo-theme="afro"] .t-nav__links{display:none!important}
  body[data-demo-theme="afro"] .t-burger{display:grid!important}
}
/* Alice : 3 langues + 6 entrées. */
@media(max-width:1140px){
  body[data-demo-theme="destination"] .t-nav__links{display:none!important}
  body[data-demo-theme="destination"] .t-burger{display:grid!important}
}
/* Salomé : même logique préventive, sans modifier son esthétique. */
@media(max-width:1080px){
  body[data-demo-theme="black"] .t-nav__links{display:none!important}
  body[data-demo-theme="black"] .t-burger{display:grid!important}
}

/* Mobile : aucun bouton langue ne se comprime jusqu'à devenir illisible. */
@media(max-width:560px){
  .t-nav{padding-inline:16px!important;gap:10px!important}
  .t-nav__right{gap:8px!important}
  .t-burger{width:40px!important;height:40px!important;flex-basis:40px!important}

  body[data-demo-theme="destination"] .brand{font-size:19px!important;white-space:nowrap!important}
  body[data-demo-theme="destination"] .t-lang button{
    min-width:46px!important;padding:8px 9px!important;font-size:10.5px!important;letter-spacing:.10em!important
  }
  body[data-demo-theme="minimal"] .t-lang button,
  body[data-demo-theme="afro"] .t-lang button,
  body[data-demo-theme="black"] .t-lang button{
    min-width:44px!important;padding:8px 9px!important;font-size:10px!important;letter-spacing:.10em!important
  }
}
@media(max-width:350px){
  .t-nav{padding-inline:10px!important;gap:6px!important}
  .t-nav__right{gap:5px!important}
  .t-burger{width:36px!important;height:36px!important;flex-basis:36px!important}
  body[data-demo-theme="destination"] .brand{font-size:17px!important}
  body[data-demo-theme="destination"] .t-lang button{min-width:40px!important;padding-inline:6px!important}
}

/* Nour : la manchette s'adapte réellement au rétrécissement. */
body[data-demo-theme="editorial"] .mast__in,
body[data-demo-theme="editorial"] .nav2 ul.pg{box-sizing:border-box}
@media(max-width:640px){
  body[data-demo-theme="editorial"] .mast .pg{
    padding-left:20px!important;padding-right:20px!important
  }
  body[data-demo-theme="editorial"] .mast__in{
    display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;
    align-items:start!important;column-gap:18px!important;row-gap:6px!important;
    padding-top:10px!important;padding-bottom:10px!important
  }
  body[data-demo-theme="editorial"] .mast__c{display:none!important}
  body[data-demo-theme="editorial"] .mast__in>[data-i18n="mast_l"]{
    min-width:0;white-space:nowrap;font-size:9.5px;letter-spacing:.16em;line-height:1.35;padding-top:3px
  }
  body[data-demo-theme="editorial"] .mast__r{
    display:grid!important;grid-template-columns:auto!important;justify-items:end!important;
    align-items:center!important;gap:6px!important;min-width:max-content!important
  }
  body[data-demo-theme="editorial"] .mast__r>[data-i18n="mast_r"]{
    white-space:nowrap;font-size:9px;letter-spacing:.14em;line-height:1.2
  }
  body[data-demo-theme="editorial"] .mast .t-lang button{
    min-width:48px!important;padding:8px 10px!important;font-size:10px!important;letter-spacing:.10em!important
  }
  body[data-demo-theme="editorial"] .nav2 ul.pg{
    padding-left:20px!important;padding-right:20px!important
  }
  body[data-demo-theme="editorial"] .nav2 a{
    white-space:nowrap!important;word-break:keep-all!important
  }
}
@media(max-width:410px){
  body[data-demo-theme="editorial"] .mast .pg{padding-left:16px!important;padding-right:16px!important}
  body[data-demo-theme="editorial"] .mast__in{column-gap:12px!important}
  body[data-demo-theme="editorial"] .mast__in>[data-i18n="mast_l"]{font-size:9px;letter-spacing:.12em}
  body[data-demo-theme="editorial"] .mast__r>[data-i18n="mast_r"]{font-size:8.5px;letter-spacing:.10em}
  body[data-demo-theme="editorial"] .mast .t-lang button{min-width:44px!important;padding-inline:8px!important}
  body[data-demo-theme="editorial"] .nav2 ul.pg{padding-left:16px!important;padding-right:16px!important}
}

/* Marion : marges stables et onglets scrollables, jamais empilés l'un sur l'autre. */
@media(max-width:880px){
  body[data-demo-theme="botanical"] .bot-head{padding-left:20px!important;padding-right:20px!important}
  body[data-demo-theme="botanical"] .bot-brand{min-width:0;white-space:nowrap}
  body[data-demo-theme="botanical"] .bot-lang{flex:0 0 auto;white-space:nowrap}
  body[data-demo-theme="botanical"] .bot-nav{width:100%!important;max-width:100%!important;overflow-x:auto!important;overscroll-behavior-inline:contain}
  body[data-demo-theme="botanical"] .bot-nav button{white-space:nowrap!important;flex:0 0 auto!important}
}
@media(max-width:420px){
  body[data-demo-theme="botanical"] .bot-head{padding-left:16px!important;padding-right:16px!important}
  body[data-demo-theme="botanical"] .bot-brand{font-size:clamp(22px,7vw,30px)!important}
}