/* Bonjour 1.22.65 — Système transversal de dialogues et notifications.
   Charte issue des tokens natifs du Bridge; aucun remplacement de texte ni d'action.
   N'affecte ni la visio plein écran, ni les notifications système iOS/Windows. */
:root{
 --bonjour-popup-gold:var(--bonjour-gold,#ffcb48);
 --bonjour-popup-ivory:var(--bonjour-ivory,#f5f8f6);
 --bonjour-popup-muted:var(--bonjour-description,#e3eee9);
 --bonjour-popup-surface:linear-gradient(155deg,#103b35 0%,#082a25 46%,#031713 100%);
 --bonjour-popup-edge:rgba(255,207,92,.52);
}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded{
 background:var(--bonjour-popup-surface)!important;
 border:1px solid var(--bonjour-popup-edge)!important;
 color:var(--bonjour-popup-ivory)!important;
 box-shadow:0 24px 76px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.045)!important;
}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded > .modal-head{
 display:flex!important;align-items:center!important;justify-content:flex-start!important;
 gap:clamp(10px,2vw,16px)!important;min-width:0!important;
 border-bottom:1px solid rgba(255,225,146,.14)!important;
 padding-bottom:12px!important;margin-bottom:12px!important;
}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded > .modal-head::before{content:none!important;display:none!important}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded > .modal-head > div{min-width:0!important;flex:1 1 auto!important}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded > .modal-head :is(h2,h3){
 color:var(--bonjour-popup-ivory)!important;
 font:700 clamp(18px,2vw,24px)/1.2 var(--bonjour-display-font,Roboto,Arial,sans-serif)!important;
 letter-spacing:-.015em!important;overflow-wrap:anywhere;
}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded > .modal-head :is(.eyebrow,.kicker){
 color:var(--bonjour-popup-gold)!important;font-size:10px!important;letter-spacing:.11em!important;
}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded :is(.modal-subtitle,.bonjour-push-note){
 color:var(--bonjour-popup-muted)!important;line-height:1.55!important;
}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded .modal-close{
 flex:0 0 auto!important;position:relative;z-index:2;
 border:1px solid rgba(255,205,79,.58)!important;
 background:linear-gradient(155deg,#13473f,#05241f)!important;
 color:var(--bonjour-popup-gold)!important;
}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded .modal-close:focus-visible,
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded button:focus-visible,
body[data-bonjour-pwa="1"] #bonjourInboxPanel button:focus-visible{
 outline:2px solid var(--bonjour-popup-gold)!important;outline-offset:3px!important;
}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded :is(button.primary-button,button.bonjour-enable-push):not(:disabled):not(.danger):not(.danger-button):not([data-variant="danger"]):not([data-action="delete"]){
 background:var(--bonjour-gold-gradient,linear-gradient(180deg,#ffe17b,#ffcb48,#f5ad27))!important;
 color:#103a33!important;border:1px solid rgba(255,213,90,.55)!important;
 font-weight:700!important;
}
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded button.secondary-button:not(:disabled):not(.danger):not(.danger-button){
 background:linear-gradient(160deg,#15483f,#082a24)!important;
 color:#ffe09a!important;border:1px solid rgba(255,205,79,.5)!important;
}
/* Les commandes destructrices gardent leur signal visuel et les boutons désactivés ne sont pas rehaussés. */
body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded button:disabled{opacity:.55!important;cursor:not-allowed!important}
/* Couronne native Bonjour, mêmes trois barres et rythme posé que le logo animé. */
body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-crown{
 display:inline-flex!important;flex:0 0 48px!important;
 width:48px!important;max-width:48px!important;height:49px!important;
 margin:0!important;align-self:center!important;justify-content:center!important;
 align-items:flex-end!important;gap:5px!important;
 padding:6px 7px!important;pointer-events:none!important;
 border-radius:11px!important;
 border:1px solid rgba(255,209,95,.27)!important;
 background:rgba(255,225,132,.035)!important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;
}
body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-crown > span{
 display:block!important;flex:none!important;width:9px!important;
 border-radius:9px!important;transform-origin:50% 100%;
 background:var(--bonjour-gold-gradient,linear-gradient(#ffe17b,#ffae1f))!important;
}
body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-crown > span:nth-child(1){height:22px!important}
body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-crown > span:nth-child(2){height:35px!important}
body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-crown > span:nth-child(3){height:28px!important}
body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-speaking > span{
 animation:bonjour-popup-talk 1.65s ease-in-out infinite alternate!important;
}
body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-speaking > span:nth-child(2){animation-delay:.22s!important}
body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-speaking > span:nth-child(3){animation-delay:.4s!important}
@keyframes bonjour-popup-talk{0%,100%{transform:scaleY(.77)}35%{transform:scaleY(1)}65%{transform:scaleY(.61)}}
/* Centre de notifications : le même signe animé remplace l'image statique, sans changer la boîte de réception. */
body[data-bonjour-pwa="1"] #bonjourNotificationsModal .modal-head::before{content:none!important;display:none!important}
body[data-bonjour-pwa="1"] #bonjourInboxPanel.bonjour-popup-branded{
 border-color:var(--bonjour-popup-edge)!important;
 background:var(--bonjour-popup-surface)!important;color:var(--bonjour-popup-ivory)!important;
}
body[data-bonjour-pwa="1"] #bonjourInboxPanel .bonjour-inbox-heading{
 display:flex!important;justify-content:flex-start!important;align-items:center!important;gap:12px!important;
}
body[data-bonjour-pwa="1"] #bonjourInboxPanel .bonjour-inbox-heading strong{
 flex:1 1 auto!important;min-width:0!important;color:var(--bonjour-popup-gold)!important;
 font:700 16px/1.3 var(--bonjour-display-font,Roboto,Arial,sans-serif)!important;
}
body[data-bonjour-pwa="1"] #bonjourInboxPanel .bonjour-inbox-heading button{
 color:var(--bonjour-popup-gold)!important;border-color:rgba(255,205,79,.44)!important;
 background:linear-gradient(155deg,#15483f,#082720)!important;
}
/* Notifications brèves : même couronne animée, lisibilité et accessibilité mobile. */
body[data-bonjour-pwa="1"] #toast.toast{
 display:flex!important;align-items:center!important;gap:12px!important;
 min-height:66px!important;padding:10px 16px!important;
 background:var(--bonjour-popup-surface)!important;
 border-color:var(--bonjour-popup-edge)!important;
 color:var(--bonjour-popup-ivory)!important;
 font-size:clamp(12px,2.8vw,14px)!important;
}
body[data-bonjour-pwa="1"] #toast.toast::before{content:none!important;display:none!important}
body[data-bonjour-pwa="1"] #toast.toast.hidden{display:none!important}
body[data-bonjour-pwa="1"] #toast.toast .bonjour-toast-message{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
body[data-bonjour-pwa="1"] #toast.toast .bonjour-popup-crown{flex-basis:40px!important;width:40px!important;max-width:40px!important;height:42px!important;padding:4px!important;gap:4px!important}
body[data-bonjour-pwa="1"] #toast.toast .bonjour-popup-crown > span{width:7px!important}
body[data-bonjour-pwa="1"] #toast.toast .bonjour-popup-crown > span:nth-child(1){height:19px!important}
body[data-bonjour-pwa="1"] #toast.toast .bonjour-popup-crown > span:nth-child(2){height:29px!important}
body[data-bonjour-pwa="1"] #toast.toast .bonjour-popup-crown > span:nth-child(3){height:23px!important}
/* Les deux variantes sans en-tête standard reprennent le même symbole, sans déplacer les commandes. */
body[data-bonjour-pwa="1"] .stage-invite-modal>.bonjour-popup-crown{margin:8px 0 14px!important}
body[data-bonjour-pwa="1"] .whats-new-hero-copy>.bonjour-popup-crown{margin:0 0 10px!important}
/* Le guide volontaire et la fenêtre d'installation conservent leur structure ; les modales ne sont jamais bloquées par le décor. */
body[data-bonjour-pwa="1"] .guide-card,
body[data-bonjour-pwa="1"] .bonjour-pwa-install-inner{border-color:rgba(255,205,79,.48)!important}
@media(max-width:600px){
 body[data-bonjour-pwa="1"] .modal-backdrop .invite-modal.bonjour-popup-branded>.modal-head{gap:9px!important}
 body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-crown{flex-basis:40px!important;width:40px!important;max-width:40px!important;height:42px!important;padding:4px 5px!important;gap:4px!important}
 body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-crown>span{width:7px!important}
 body[data-bonjour-pwa="1"] #toast.toast{width:min(440px,calc(100vw - 20px))!important}
}
@media(prefers-reduced-motion:reduce){
 body[data-bonjour-pwa="1"] .bonjour-popup-crown.bonjour-voice-speaking>span{animation:none!important;transform:none!important}
}
body[data-bonjour-pwa="1"] .modal-backdrop.hidden .bonjour-popup-crown>span,
body[data-bonjour-pwa="1"] #toast.toast.hidden .bonjour-popup-crown>span,
body[data-bonjour-pwa="1"] #bonjourInboxPanel.hidden .bonjour-popup-crown>span{animation-play-state:paused!important}