/* =========================================================
   UniPayWeb SECURE ENTRY GATEWAY — CHAT + BANQUE
   Objectif: aucune section métier persistante hors session.
   Le calque PNG global unipay-page-background reste autonome.
   ========================================================= */
:root{
  --unipay-entry-cyan:#00eaff;
  --unipay-entry-blue:#186dff;
  --unipay-entry-violet:#9b5cff;
  --unipay-entry-orange:#ff9b2f;
  --unipay-entry-red:#ff2f80;
}

body.unipay-main-session-locked{
  overflow-x:hidden;
}

/* Chat : l'état verrouillé existe avant le premier rendu. Aucun tableau,
   profil, statut ou explorateur authentifié ne doit apparaître une image
   avant que le serveur confirme la session principale. */
body.unipay-page-chat.unipay-main-session-locked main.content > :not(#loginSection),
body.unipay-page-chat.unipay-main-session-locked #zoomUpProfileModal{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

body.unipay-main-session-locked .page-scope > *:not(.fut-sidebar):not(#fut-bottombar):not(.fut-bottombar):not(.bottom-bar):not(.fut-bottom-bar):not(header):not(.fut-topbar):not(.topbar):not(.navbar):not(.fut-secondary-bar):not(#loginSection):not(#proAccountModal):not(#recoverModal){
  pointer-events:none !important;
  user-select:none !important;
  -webkit-user-select:none !important;
}

body.unipay-main-session-locked #chat-form{
  pointer-events:none !important;
  user-select:none !important;
  -webkit-user-select:none !important;
}

body.unipay-main-session-locked #profileGallery,
body.unipay-main-session-locked #unipayGalleryViewer,
body.unipay-main-session-locked #statusCreateModal,
body.unipay-main-session-locked #statusImmersiveModal,
body.unipay-main-session-locked #unipayMiniGallery,
body.unipay-main-session-locked #unipayStatusHub,
body.unipay-main-session-locked #loginSection:not(.unipay-token-modal-open){
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

body.unipay-main-session-locked .fut-sidebar,
body.unipay-main-session-locked #fut-bottombar,
body.unipay-main-session-locked .fut-secondary-bar,
body.unipay-main-session-locked #fut-bottombar,
body.unipay-main-session-locked .fut-bottombar,
body.unipay-main-session-locked .bottom-bar,
body.unipay-main-session-locked .fut-bottom-bar,
body.unipay-main-session-locked header,
body.unipay-main-session-locked .fut-topbar,
body.unipay-main-session-locked .topbar,
body.unipay-main-session-locked .navbar{
  visibility:visible !important;
  pointer-events:auto !important;
}

body.unipay-main-session-locked #unipayImmersiveToggle,
body.unipay-main-session-locked #unipay-menu-up,
body.unipay-main-session-locked #unipayClientSettingsTrigger{
  pointer-events:auto !important;
}

/* Les commandes publiques du shell restent utilisables sans session. Elles
   ne donnent accès à aucune donnée métier : elles ouvrent uniquement les
   paramètres locaux ou naviguent vers une page publique. */
body.unipay-main-session-locked #fut-bottombar,
body.unipay-main-session-locked #fut-bottombar .fut-bottom-list,
body.unipay-main-session-locked #fut-bottombar .fut-bottom-item,
body.unipay-main-session-locked #unipayClientSettingsTrigger,
body.unipay-main-session-locked #unipayClientSettingsModal,
body.unipay-main-session-locked #unipayClientSettingsModal *{
  pointer-events:auto !important;
  user-select:auto !important;
  -webkit-user-select:auto !important;
}

#unipaySecureEntryGateway{
  position:fixed;
  inset:0;
  z-index:1200;
  pointer-events:none;
  display:none;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:28px;
  padding:calc(var(--fut-menu-height, 70px) + 40px) 24px 120px;
  background:transparent !important;
}
body.unipay-main-session-locked #unipaySecureEntryGateway{
  display:flex;
}

/* Pendant la vérification serveur, aucun écran transitoire n'est peint. Le
   gateway apparaît seulement après confirmation d'une session verrouillée. */
body[data-unipay-session-state="booting"] #unipaySecureEntryGateway{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

.unipay-session-lock-message{
  width:min(470px,calc(100vw - 32px));
  padding:16px 18px;
  border:1px solid rgba(0,234,255,.56);
  border-radius:8px;
  background:rgba(3,16,29,.97);
  color:#dffbff;
  text-align:center;
  box-shadow:0 0 22px rgba(0,234,255,.16),0 18px 48px rgba(0,0,0,.38);
  pointer-events:none;
}

.unipay-session-lock-message strong,
.unipay-session-lock-message span{
  display:block;
}

.unipay-session-lock-message strong{
  margin-bottom:6px;
  color:#fff;
  font-size:1rem;
}

.unipay-session-lock-message span{
  color:#b9d3df;
  font-size:.84rem;
  line-height:1.48;
}

/* V6: après connexion principale réussie, le gateway principal doit rester masqué
   indépendamment de l'état de connexion bancaire. */
body[data-unipay-session-state="authenticated"] #unipaySecureEntryGateway,
body:not(.unipay-main-session-locked) #unipaySecureEntryGateway{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
body[data-unipay-session-state="authenticated"] #unipayEntryStatus,
body:not(.unipay-main-session-locked) #unipayEntryStatus{
  display:none !important;
}

/* V4: le gateway ne disparaît plus entièrement au clic.
   On masque seulement le bouton Explorer APRÈS confirmation visuelle de la modale.
   Ainsi, si le jeton n’arrive pas ou si la modale est bloquée par CSS, l’utilisateur voit encore l’état. */
body.unipay-main-session-locked.unipay-login-modal-confirmed #unipaySecureEntryGateway .unipay-entry-orb-wrap{
  opacity:0;
  transform:scale(.94);
  visibility:hidden;
  pointer-events:none;
  transition:opacity .42s ease, transform .42s ease, visibility .42s ease;
}
body.unipay-main-session-locked.unipay-login-modal-confirmed #unipaySecureEntryGateway{
  justify-content:flex-end;
  padding-bottom:32px;
}

body.unipay-main-session-locked.unipay-account-modal-confirmed #unipaySecureEntryGateway .unipay-entry-orb-wrap{
  opacity:0;
  transform:scale(.94);
  visibility:hidden;
  pointer-events:none;
  transition:opacity .42s ease, transform .42s ease, visibility .42s ease;
}
body.unipay-main-session-locked.unipay-account-modal-confirmed #unipaySecureEntryGateway{
  justify-content:flex-end;
  padding-bottom:32px;
}


.unipay-entry-orb-wrap{
  position:relative;
  pointer-events:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  transform:translateZ(0);
  animation:unipayEntryFloat 4.2s ease-in-out infinite;
}

#unipayStartExploreBtn{
  position:relative;
  min-width:min(78vw, 560px);
  min-height:124px;
  border:1px solid rgba(0,234,255,.42);
  border-radius:34px;
  background:linear-gradient(135deg, rgba(0,234,255,.06), rgba(24,109,255,.03), rgba(255,255,255,.02));
  color:#eaffff;
  font-weight:950;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:clamp(1rem, 2.4vw, 2rem);
  box-shadow:0 0 22px rgba(0,234,255,.22), inset 0 0 36px rgba(0,234,255,.10);
  backdrop-filter:blur(8px) saturate(1.2);
  cursor:pointer;
  overflow:hidden;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
#unipayStartExploreBtn::before,
#unipayStartExploreBtn::after{
  content:"";
  position:absolute;
  inset:-44%;
  border-radius:50%;
  pointer-events:none;
  opacity:.72;
  filter:blur(22px);
  background:conic-gradient(from 0deg, rgba(0,234,255,.0), rgba(0,234,255,.55), rgba(155,92,255,.42), rgba(255,155,47,.38), rgba(255,47,128,.32), rgba(0,234,255,.0));
  animation:unipayEntryFlame 7.4s linear infinite;
}
#unipayStartExploreBtn::after{
  inset:-22%;
  opacity:.46;
  animation-duration:4.9s;
  animation-direction:reverse;
}
#unipayStartExploreBtn:hover{
  transform:scale(1.055);
  border-color:rgba(255,255,255,.68);
  box-shadow:0 0 44px rgba(0,234,255,.42), 0 0 78px rgba(155,92,255,.20), inset 0 0 48px rgba(0,234,255,.15);
}
.unipay-entry-content{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  text-shadow:0 0 10px rgba(0,234,255,.88), 0 0 26px rgba(0,94,255,.65);
}
.unipay-entry-icon{
  width:48px;
  height:48px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(0,234,255,.55);
  box-shadow:0 0 18px rgba(0,234,255,.4), inset 0 0 18px rgba(0,234,255,.25);
  background:rgba(0,16,28,.08);
  font-size:1.35em;
}
.unipay-entry-status{
  min-height:28px;
  color:#bffcff;
  font-weight:800;
  letter-spacing:.05em;
  text-align:center;
  text-shadow:0 0 14px rgba(0,234,255,.55);
  max-width:min(92vw, 900px);
}
.unipay-entry-typing{
  pointer-events:none;
  min-height:82px;
  max-width:min(92vw, 980px);
  padding:18px 26px;
  color:#ffffff;
  font-weight:950;
  border:1px solid rgba(0,234,255,.0);
  border-radius:22px;
  box-shadow:none;
  line-height:1.55;
  font-size:clamp(.95rem, 1.6vw, 1.42rem);
  text-align:center;
  background:transparent !important;
  opacity:0;
  transform:translateY(12px) scale(.985);
  text-shadow:0 0 10px rgba(255,255,255,.62), 0 0 24px rgba(0,234,255,.75), 0 0 42px rgba(255,155,47,.28);
}
.unipay-entry-typing.active{
  opacity:1;
  border-color:rgba(0,234,255,.72);
  box-shadow:0 0 18px rgba(0,234,255,.36), 0 0 42px rgba(255,155,47,.18), inset 0 0 18px rgba(0,234,255,.08);
  animation:unipayTextOscillate 1.85s ease-in-out infinite, unipayTypingBorderBurn 3.2s linear infinite;
}
.unipay-entry-typing.fadeout{
  opacity:0;
  transition:opacity .55s ease, transform .55s ease;
  transform:translateY(18px) scale(.97);
}
.unipay-entry-typing .typed-caret{
  display:inline-block;
  width:.58em;
  color:var(--unipay-entry-cyan);
  animation:unipayCaretBlink .85s steps(1) infinite;
}

body.unipay-main-session-locked #loginSection.unipay-token-modal-open{
  display:flex !important;
  visibility:visible !important;
  pointer-events:auto !important;
  position:fixed !important;
  z-index:99970 !important;
  inset:auto !important;
  top:var(--unipay-auth-active-top) !important;
  right:var(--unipay-auth-active-right) !important;
  bottom:var(--unipay-auth-active-bottom) !important;
  left:var(--unipay-auth-active-left) !important;
  align-items:center !important;
  justify-content:center !important;
  padding:8px !important;
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  opacity:1;
  transform:none;
  transition:none;
}
body.unipay-main-session-locked #loginSection.unipay-token-modal-open.unipay-token-modal-ready,
body.unipay-main-session-locked.unipay-login-modal-ready #loginSection.unipay-token-modal-open{
  opacity:1;
  transform:none;
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
body.unipay-main-session-locked #loginSection.unipay-token-modal-open #profileCard{
  display:none !important;
}

body.unipay-main-session-locked #proAccountModal.unipay-account-token-modal-open,
body.unipay-main-session-locked #recoverModal.unipay-account-token-modal-open{
  display:flex !important;
  visibility:visible !important;
  pointer-events:auto !important;
  position:fixed !important;
  z-index:99970 !important;
  inset:auto !important;
  top:var(--unipay-auth-active-top) !important;
  right:var(--unipay-auth-active-right) !important;
  bottom:var(--unipay-auth-active-bottom) !important;
  left:var(--unipay-auth-active-left) !important;
  align-items:center !important;
  justify-content:center !important;
  padding:8px !important;
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  opacity:1 !important;
}

body.unipay-main-session-locked #proAccountModal.unipay-account-token-modal-open .pro-account-modal-content,
body.unipay-main-session-locked #recoverModal.unipay-account-token-modal-open .recover-modal-content{
  visibility:visible !important;
  pointer-events:auto !important;
}

.unipay-account-token-status{
  margin:0 0 12px;
  padding:10px 12px;
  border:1px solid rgba(0,234,255,.42);
  border-radius:12px;
  background:rgba(0,16,32,.72);
  color:#eaffff;
  font-weight:800;
  text-align:center;
  text-shadow:0 0 12px rgba(0,234,255,.55);
  white-space:normal;
  overflow-wrap:anywhere;
}

body.unipay-account-modal-preparing .unipay-account-token-status{
  border-color:rgba(255,197,95,.62);
  color:#fff0c8;
  background:rgba(48,31,5,.78);
}

[data-unipay-account-security-state="error"] .unipay-account-token-status{
  border-color:rgba(255,102,136,.72);
  color:#ffdce4;
  background:rgba(58,8,24,.82);
}
body.unipay-main-session-locked #loginSection.unipay-token-modal-open #loginForm{
  display:flex !important;
  flex-direction:column;
  visibility:visible !important;
  pointer-events:auto !important;
  max-width:min(92vw, 520px);
  width:100%;
  border:1px solid rgba(0,234,255,.42);
  border-radius:24px;
  background:linear-gradient(145deg, rgba(2,14,28,.52), rgba(0,7,16,.42));
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:0 0 18px rgba(0,234,255,.32), 0 0 54px rgba(24,109,255,.25);
  transform:translateY(18px) scale(.985);
  opacity:.01;
  transition:opacity .52s ease .08s, transform .52s ease .08s;
}

body.unipay-main-session-locked #loginSection.unipay-token-modal-open #loginForm,
body.unipay-main-session-locked #proAccountModal.unipay-account-token-modal-open .pro-account-modal-content,
body.unipay-main-session-locked #recoverModal.unipay-account-token-modal-open .recover-modal-content {
  position:relative !important;
  isolation:isolate;
  overflow:visible !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  background-color:rgba(2,13,27,.46) !important;
  box-shadow:0 0 18px rgba(0,234,255,.30), 0 0 58px rgba(155,92,255,.20) !important;
}

body.unipay-main-session-locked #loginSection.unipay-token-modal-open #loginForm::before,
body.unipay-main-session-locked #proAccountModal.unipay-account-token-modal-open .pro-account-modal-content::before,
body.unipay-main-session-locked #recoverModal.unipay-account-token-modal-open .recover-modal-content::before {
  content:"";
  position:absolute;
  inset:-9px;
  z-index:-1;
  pointer-events:none;
  border:2px solid rgba(0,234,255,.62);
  border-radius:inherit;
  background:transparent;
  box-shadow:0 0 18px rgba(0,234,255,.62), 0 0 38px rgba(155,92,255,.42), 0 0 64px rgba(24,109,255,.26);
  filter:blur(3px);
}
body.unipay-main-session-locked #loginSection.unipay-token-modal-open.unipay-token-modal-ready #loginForm,
body.unipay-main-session-locked.unipay-login-modal-ready #loginSection.unipay-token-modal-open #loginForm{
  transform:translateY(0) scale(1);
  opacity:1;
}
#unipayTokenCountdown{
  margin-top:8px;
  color:#87f7ff;
  font-weight:800;
  text-align:center;
  text-shadow:0 0 10px rgba(0,234,255,.45);
}
.unipay-login-token-message{
  margin:8px 0 0;
  color:#fff;
  font-weight:800;
  text-align:center;
  text-shadow:0 0 12px rgba(0,234,255,.6);
}
.unipay-login-token-message.is-error{
  padding:10px 12px;
  border:1px solid rgba(255,110,137,.72);
  border-radius:8px;
  background:#35121d;
  color:#ffd8e1;
  text-shadow:none;
}

.unipay-login-token-message.is-success{
  padding:10px 12px;
  border:1px solid rgba(111,255,210,.68);
  border-radius:8px;
  background:#0b3028;
  color:#d9fff4;
  text-shadow:none;
}
#loginSection.unipay-login-has-error #password{
  border-color:#ff6e89 !important;
  box-shadow:0 0 0 2px rgba(255,110,137,.2) !important;
}

.unipay-bank-entry-locked #modal-login:not(.unipay-bank-token-open),
.unipay-bank-entry-locked #modal-login-advanced:not(.unipay-bank-token-open){
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
.unipay-bank-entry-locked #modal-login.unipay-bank-token-open,
.unipay-bank-entry-locked #modal-login-advanced.unipay-bank-token-open{
  display:flex !important;
  visibility:visible !important;
  pointer-events:auto !important;
}

@keyframes unipayEntryFloat{
  0%,100%{ transform:translateY(0) rotate(-.35deg); }
  50%{ transform:translateY(-13px) rotate(.35deg); }
}
@keyframes unipayEntryFlame{
  to{ transform:rotate(360deg); filter:blur(25px) hue-rotate(360deg); }
}
@keyframes unipayTextOscillate{
  0%,100%{ transform:translateY(0) scale(1); filter:brightness(1); }
  50%{ transform:translateY(-6px) scale(1.012); filter:brightness(1.28); }
}
@keyframes unipayCaretBlink{ 0%,49%{opacity:1} 50%,100%{opacity:0} }
@keyframes unipayTypingBorderBurn{
  0%{ border-color:rgba(0,234,255,.55); box-shadow:0 0 14px rgba(0,234,255,.28), inset 0 0 12px rgba(0,234,255,.06); }
  33%{ border-color:rgba(155,92,255,.76); box-shadow:0 0 20px rgba(155,92,255,.34), inset 0 0 16px rgba(155,92,255,.08); }
  66%{ border-color:rgba(255,155,47,.64); box-shadow:0 0 22px rgba(255,155,47,.26), inset 0 0 16px rgba(255,155,47,.06); }
  100%{ border-color:rgba(0,234,255,.55); box-shadow:0 0 14px rgba(0,234,255,.28), inset 0 0 12px rgba(0,234,255,.06); }
}

@media (max-width:720px){
  #unipayStartExploreBtn{ min-width:88vw; min-height:104px; border-radius:26px; }
  .unipay-entry-content{ gap:10px; letter-spacing:.08em; }
  .unipay-entry-icon{ width:40px; height:40px; }
}

/* V7 — fermeture sécurisée de la modale autorisée par jeton.
   La croix n'est injectée que dans #loginForm et n'affecte pas les autres modales. */
body.unipay-main-session-locked #loginSection.unipay-token-modal-open #loginForm{
  position:relative !important;
}
#unipayLoginSecureClose.unipay-login-secure-close{
  position:absolute;
  top:12px;
  right:12px;
  z-index:2147483001;
  width:42px;
  height:42px;
  border-radius:50%;
  border:1px solid rgba(0,234,255,.62);
  background:rgba(0,12,28,.28);
  color:#eaffff;
  font-size:30px;
  font-weight:900;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 0 18px rgba(0,234,255,.28), inset 0 0 16px rgba(0,234,255,.10);
  text-shadow:0 0 10px rgba(0,234,255,.9);
  backdrop-filter:blur(8px) saturate(1.2);
  transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}
#unipayLoginSecureClose.unipay-login-secure-close:hover{
  transform:scale(1.08) rotate(90deg);
  border-color:rgba(255,255,255,.88);
  background:rgba(0,34,62,.46);
  box-shadow:0 0 26px rgba(0,234,255,.46), 0 0 42px rgba(155,92,255,.18), inset 0 0 18px rgba(0,234,255,.18);
}

/* V7 — tant qu'un jeton d'intention a ouvert la fenêtre, les probes de session 401
   ne doivent pas provoquer une disparition visuelle de la modale. */
body.unipay-main-session-locked.unipay-login-modal-persistent #loginSection.unipay-token-modal-open{
  display:flex !important;
  visibility:visible !important;
  pointer-events:auto !important;
  opacity:1 !important;
}
body.unipay-main-session-locked.unipay-login-modal-persistent #loginSection.unipay-token-modal-open #loginForm{
  display:flex !important;
  visibility:visible !important;
  pointer-events:auto !important;
  opacity:1 !important;
  transform:translateY(0) scale(1) !important;
}

/* Authentication dialogs stay inside the active area between ecosystem bars. */
:root{
  --unipay-auth-active-top:calc(var(--unipay-menu-up-top, 10px) + var(--unipay-menu-up-height, 50px) + 10px);
  --unipay-auth-active-right:max(10px, env(safe-area-inset-right, 0px));
  --unipay-auth-active-bottom:calc(var(--fut-bottom-height, 58px) + var(--fut-bottombar-bottom-offset, 12px) + 14px);
  --unipay-auth-active-left:calc(var(--fut-sidebar-left, 18px) + var(--fut-sidebar-width, 72px) + 12px);
}

body #loginSection.unipay-token-modal-open,
body #proAccountModal:not(.hidden),
body #recoverModal:not(.hidden),
body #principalBiometricHistoryModal:not(.hidden){
  position:fixed !important;
  inset:auto !important;
  top:var(--unipay-auth-active-top) !important;
  right:var(--unipay-auth-active-right) !important;
  bottom:var(--unipay-auth-active-bottom) !important;
  left:var(--unipay-auth-active-left) !important;
  z-index:99970 !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  height:auto !important;
  max-width:none !important;
  margin:0 !important;
  padding:8px !important;
  overflow:hidden !important;
  isolation:isolate !important;
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

body #loginSection.unipay-token-modal-open #loginForm,
body #proAccountModal:not(.hidden) .pro-account-modal-content,
body #recoverModal:not(.hidden) .recover-modal-content,
body #principalBiometricHistoryModal:not(.hidden) .recover-modal-content{
  position:relative !important;
  box-sizing:border-box !important;
  max-width:min(720px, 100%) !important;
  max-height:100% !important;
  margin:auto !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior:contain !important;
  scrollbar-gutter:stable !important;
}

body #loginSection.unipay-token-modal-open #loginForm{
  max-width:min(520px, 100%) !important;
  width:min(520px, 100%) !important;
  max-height:none !important;
  overflow:visible !important;
  zoom:.9 !important;
  background:linear-gradient(145deg, rgba(0,16,32,.985), rgba(0,8,18,.975)) !important;
}

@media (min-width:881px){
  body #loginSection.unipay-token-modal-open #loginForm{
    max-width:min(650px, 100%) !important;
    width:min(650px, 100%) !important;
    zoom:.94 !important;
  }
}

body.unipay-login-modal-visible,
body.unipay-account-modal-visible,
body:has(#principalBiometricHistoryModal:not(.hidden)){
  overflow:hidden !important;
}

body.unipay-login-modal-visible #unipayEntryStatus,
body.unipay-account-modal-visible #unipayEntryStatus{
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

body:has(:is(
  #loginSection.unipay-token-modal-open,
  #proAccountModal:not(.hidden),
  #recoverModal:not(.hidden),
  #principalBiometricHistoryModal:not(.hidden)
)) :is(
  #unipay-menu-up,
  #fut-sidebar,
  #fut-bottombar,
  .fut-bottombar,
  .bottom-bar,
  .fut-secondary-bar,
  [data-unipay-fullscreen]
){
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}

body.unipay-login-modal-visible :is(
  #unipay-menu-up,
  #fut-sidebar,
  #fut-bottombar,
  .fut-bottombar,
  .bottom-bar,
  .fut-secondary-bar,
  [data-unipay-fullscreen]
),
body.unipay-account-modal-visible :is(
  #unipay-menu-up,
  #fut-sidebar,
  #fut-bottombar,
  .fut-bottombar,
  .bottom-bar,
  .fut-secondary-bar,
  [data-unipay-fullscreen]
){
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}

@media (max-width:880px){
  :root{
    --unipay-auth-active-left:max(6px, env(safe-area-inset-left, 0px));
  }
}

@media (max-width:680px){
  :root{
    --unipay-auth-active-top:calc(var(--unipay-menu-up-top, 7px) + var(--unipay-menu-up-height, 46px) + 8px);
    --unipay-auth-active-right:max(6px, env(safe-area-inset-right, 0px));
    --unipay-auth-active-bottom:calc(var(--fut-bottom-height, 72px) + var(--fut-bottombar-bottom-offset, 8px) + 10px);
    --unipay-auth-active-left:max(6px, env(safe-area-inset-left, 0px));
  }

  body #loginSection.unipay-token-modal-open,
  body #proAccountModal:not(.hidden),
  body #recoverModal:not(.hidden),
  body #principalBiometricHistoryModal:not(.hidden){
    padding:5px !important;
  }
}

@media (max-height:900px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.84 !important; }
}
@media (max-height:800px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.72 !important; }
}
@media (max-height:700px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.62 !important; }
}
@media (max-height:620px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.52 !important; }
}
@media (max-height:540px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.42 !important; }
}
@media (max-height:460px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.32 !important; }
}
@media (max-height:380px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.24 !important; }
}

/* Angular authentication panels: the gateway classes remain the only source of truth. */
:root{
  --unipay-auth-dialog-gap:clamp(14px, 1.7vw, 26px);
  --unipay-auth-smoke-cyan:rgba(0, 238, 255, .92);
  --unipay-auth-smoke-violet:rgba(171, 90, 255, .74);
  --unipay-auth-smoke-amber:rgba(255, 176, 58, .62);
}

body #loginSection.unipay-token-modal-open,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden),
body #recoverModal.unipay-account-token-modal-open:not(.hidden){
  padding:var(--unipay-auth-dialog-gap) !important;
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

body #loginSection.unipay-token-modal-open #loginForm,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content{
  position:relative !important;
  isolation:isolate !important;
  border:1px solid rgba(130, 247, 255, .86) !important;
  border-radius:0 !important;
  background:
    linear-gradient(90deg, rgba(0, 238, 255, .10), transparent 18%, transparent 82%, rgba(171, 90, 255, .10)),
    linear-gradient(145deg, rgba(1, 20, 39, .995), rgba(1, 7, 18, .995)) !important;
  box-shadow:
    0 0 8px rgba(210, 255, 255, .86),
    0 0 24px rgba(0, 238, 255, .68),
    0 0 52px rgba(0, 238, 255, .38),
    0 0 78px rgba(171, 90, 255, .25),
    0 0 104px rgba(255, 176, 58, .13),
    inset 0 0 18px rgba(0, 238, 255, .16),
    inset 0 0 54px rgba(171, 90, 255, .08) !important;
  transform-origin:center center !important;
  will-change:clip-path, transform, opacity, filter;
}

/* Animated smoke stays inside the scrollable panel and never intercepts controls. */
body #loginSection.unipay-token-modal-open #loginForm::after,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content::after,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:8;
  pointer-events:none;
  border:4px solid transparent;
  border-radius:0;
  background:conic-gradient(
    from 35deg,
    transparent 0 6%,
    var(--unipay-auth-smoke-cyan) 10% 18%,
    transparent 24% 37%,
    var(--unipay-auth-smoke-violet) 43% 54%,
    transparent 61% 73%,
    var(--unipay-auth-smoke-amber) 78% 87%,
    transparent 94% 100%
  ) border-box;
  -webkit-mask:linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:.92;
  filter:blur(4px) saturate(1.75) brightness(1.22);
  animation:unipayAuthBorderSmoke 3.4s ease-in-out infinite;
}

/* Reinforced right-angle corner brackets. */
body #loginSection.unipay-token-modal-open #loginForm::before,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content::before,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content::before{
  content:"";
  position:absolute;
  inset:7px;
  z-index:9;
  pointer-events:none;
  background:
    linear-gradient(90deg, #d9ffff, #00eaff) top left / 58px 3px no-repeat,
    linear-gradient(180deg, #d9ffff, #00eaff) top left / 3px 58px no-repeat,
    linear-gradient(270deg, #f1ddff, #a85bff) top right / 58px 3px no-repeat,
    linear-gradient(180deg, #f1ddff, #a85bff) top right / 3px 58px no-repeat,
    linear-gradient(90deg, #ffe1a3, #ff9f2f) bottom left / 58px 3px no-repeat,
    linear-gradient(0deg, #ffe1a3, #ff9f2f) bottom left / 3px 58px no-repeat,
    linear-gradient(270deg, #d9ffff, #00eaff) bottom right / 58px 3px no-repeat,
    linear-gradient(0deg, #d9ffff, #00eaff) bottom right / 3px 58px no-repeat;
  filter:
    drop-shadow(0 0 5px rgba(225, 255, 255, .96))
    drop-shadow(0 0 13px rgba(0, 238, 255, .78))
    drop-shadow(0 0 24px rgba(171, 90, 255, .42));
  opacity:.96;
}

body #loginSection.unipay-token-modal-open #loginForm{
  width:min(760px, 100%) !important;
  max-width:min(760px, 100%) !important;
  max-height:100% !important;
  padding:clamp(24px, 2.5vw, 38px) !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  zoom:1 !important;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content{
  width:min(1040px, 100%) !important;
  max-width:min(1040px, 100%) !important;
  max-height:100% !important;
  padding:clamp(22px, 2.2vw, 34px) !important;
}

body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content{
  width:min(840px, 100%) !important;
  max-width:min(840px, 100%) !important;
  max-height:100% !important;
  padding:clamp(22px, 2.2vw, 34px) !important;
}

/* The open state starts as a narrow horizontal core at the panel center. */
body #loginSection.unipay-token-modal-open:not(.unipay-token-modal-ready) #loginForm,
body.unipay-main-session-locked.unipay-login-modal-persistent:not(.unipay-login-modal-ready) #loginSection.unipay-token-modal-open:not(.unipay-token-modal-ready) #loginForm,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden):not(.unipay-account-token-modal-ready) .pro-account-modal-content,
body #recoverModal.unipay-account-token-modal-open:not(.hidden):not(.unipay-account-token-modal-ready) .recover-modal-content{
  clip-path:inset(48.5% 1.5% 48.5% 1.5%) !important;
  transform:scaleX(.94) scaleY(.08) !important;
  opacity:.12 !important;
  filter:blur(9px) brightness(1.65) !important;
}

body #loginSection.unipay-token-modal-open #loginForm,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content{
  transition:
    clip-path .72s cubic-bezier(.2, .82, .2, 1),
    transform .72s cubic-bezier(.2, .82, .2, 1),
    opacity .36s ease,
    filter .58s ease !important;
}

body #loginSection.unipay-token-modal-open.unipay-token-modal-ready #loginForm,
body.unipay-login-modal-ready #loginSection.unipay-token-modal-open #loginForm,
body #proAccountModal.unipay-account-token-modal-open.unipay-account-token-modal-ready:not(.hidden) .pro-account-modal-content,
body #recoverModal.unipay-account-token-modal-open.unipay-account-token-modal-ready:not(.hidden) .recover-modal-content{
  clip-path:inset(0 0 0 0) !important;
  transform:scale(1) !important;
  opacity:1 !important;
  filter:none !important;
}

@keyframes unipayAuthBorderSmoke{
  0%,100%{
    opacity:.78;
    filter:blur(3px) saturate(1.55) brightness(1.08) hue-rotate(0deg);
  }
  48%{
    opacity:1;
    filter:blur(6px) saturate(2.05) brightness(1.5) hue-rotate(22deg);
  }
}

@media (max-width:680px){
  :root{ --unipay-auth-dialog-gap:10px; }

  body #loginSection.unipay-token-modal-open #loginForm,
  body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content,
  body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content{
    width:100% !important;
    max-width:100% !important;
    padding:20px 16px !important;
  }

  body #loginSection.unipay-token-modal-open #loginForm{
    zoom:.88 !important;
  }
}

@media (max-height:900px) and (min-width:681px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.94 !important; }
}
@media (max-height:800px) and (min-width:681px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.84 !important; }
}
@media (max-height:700px) and (min-width:681px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.73 !important; }
}
@media (max-height:620px) and (min-width:681px){
  body #loginSection.unipay-token-modal-open #loginForm{ zoom:.64 !important; }
}

@media (prefers-reduced-motion:reduce){
  body #loginSection.unipay-token-modal-open #loginForm,
  body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content,
  body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content{
    transition-duration:.01ms !important;
  }

  body #loginSection.unipay-token-modal-open #loginForm::after,
  body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content::after,
  body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content::after{
    animation:none !important;
  }
}

/* 20260818 - Proprietaire tactile unique des formulaires d'authentification.
   Les panneaux, et non leur calque externe, portent le defilement vertical. */
@media (max-width:680px){
  body #loginSection.unipay-token-modal-open #loginForm,
  body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content,
  body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content{
    max-height:100% !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior-y:contain !important;
    touch-action:pan-y !important;
    -webkit-overflow-scrolling:touch !important;
    scrollbar-gutter:stable;
  }

  body #loginSection.unipay-token-modal-open #loginForm{
    zoom:1 !important;
  }
}

/* 20260820 - Un seul proprietaire de scroll pour chaque parcours mobile. */
@media (max-width:680px){
  body #loginSection.unipay-token-modal-open,
  body #proAccountModal.unipay-account-token-modal-open:not(.hidden),
  body #recoverModal.unipay-account-token-modal-open:not(.hidden){
    align-items:stretch !important;
    justify-content:center !important;
    min-height:0 !important;
    padding:6px !important;
    overflow:hidden !important;
  }

  body #loginSection.unipay-token-modal-open #loginForm,
  body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content,
  body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content{
    box-sizing:border-box !important;
    height:100% !important;
    min-height:0 !important;
    max-height:100% !important;
    margin:0 auto !important;
    padding:18px 16px max(88px, calc(env(safe-area-inset-bottom, 0px) + 72px)) !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior-y:contain !important;
    scroll-padding-bottom:max(88px, calc(env(safe-area-inset-bottom, 0px) + 72px)) !important;
    touch-action:pan-y !important;
    -webkit-overflow-scrolling:touch !important;
  }

  body.unipay-login-modal-visible #unipaySecureEntryGateway,
  body.unipay-account-modal-visible #unipaySecureEntryGateway{
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }
}

/* 20260820 - Le cadre lumineux reste fixe; seul le contenu interne defile.
   Le pseudo-cadre et la fumee appartiennent au panneau externe et ne sont
   donc plus entraines avec les champs par le geste tactile. */
@media (max-width:680px){
  body #loginSection.unipay-token-modal-open #loginForm,
  body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content,
  body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content{
    padding:0 !important;
    overflow:hidden !important;
    touch-action:none !important;
  }

  body #loginSection.unipay-token-modal-open #loginForm > .unipay-auth-scroll-content,
  body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content > .unipay-auth-scroll-content,
  body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content > .unipay-auth-scroll-content{
    position:relative;
    z-index:2;
    box-sizing:border-box;
    width:100%;
    height:100%;
    min-height:0;
    max-height:100%;
    padding:18px 16px max(88px, calc(env(safe-area-inset-bottom, 0px) + 72px));
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior-y:contain;
    scroll-padding-bottom:max(88px, calc(env(safe-area-inset-bottom, 0px) + 72px));
    touch-action:pan-y;
    -webkit-overflow-scrolling:touch;
    scrollbar-gutter:stable;
  }
}

/* 20260821 - Disposition stable des controles d authentification.
   Chaque panneau garde une seule colonne de lecture sur mobile, des zones
   d action pleine largeur et des champs qui ne se chevauchent jamais. */
body #loginSection.unipay-token-modal-open #loginForm > .unipay-auth-scroll-content,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content > .unipay-auth-scroll-content,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content > .unipay-auth-scroll-content{
  box-sizing:border-box;
  width:100%;
  min-width:0;
}

body #loginSection.unipay-token-modal-open #loginForm > .unipay-auth-scroll-content{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  align-content:start;
  gap:10px;
}

body #loginSection.unipay-token-modal-open #loginForm > .unipay-auth-scroll-content > br{
  display:none !important;
}

body #loginSection.unipay-token-modal-open #loginForm h2{
  margin:0;
  padding:0;
  color:#eaffff;
  font-size:clamp(1.35rem, 2.2vw, 2rem);
  line-height:1.15;
}

body #loginSection.unipay-token-modal-open #loginForm .login-intro,
body #loginSection.unipay-token-modal-open #loginForm .principal-location-disclosure,
body #loginSection.unipay-token-modal-open #loginForm .principal-location-consent,
body #loginSection.unipay-token-modal-open #loginForm .principal-biometric-inline-status,
body #loginSection.unipay-token-modal-open #loginForm .login-options{
  grid-column:1 / -1;
}

body #loginSection.unipay-token-modal-open #loginForm .login-intro,
body #loginSection.unipay-token-modal-open #loginForm .principal-location-disclosure{
  margin:0;
  max-width:72ch;
  font-size:.84rem;
  line-height:1.5;
}

body #loginSection.unipay-token-modal-open #loginForm > .unipay-auth-scroll-content > label[for="identifier"],
body #loginSection.unipay-token-modal-open #loginForm > .unipay-auth-scroll-content > label[for="password"]{
  margin:0;
  padding:0;
  font-size:.82rem;
  line-height:1.3;
}

body #loginSection.unipay-token-modal-open #loginForm > .unipay-auth-scroll-content > input{
  box-sizing:border-box;
  width:100%;
  min-height:46px;
  margin:0;
  padding:11px 13px;
}

body #loginSection.unipay-token-modal-open #loginForm > .unipay-auth-scroll-content > button[type="submit"],
body #loginSection.unipay-token-modal-open #loginForm .principal-biometric-login-btn{
  width:100%;
  min-height:46px;
  margin:0;
}

body #loginSection.unipay-token-modal-open #loginForm .principal-location-consent{
  display:flex !important;
  align-items:flex-start !important;
  gap:9px;
  margin:0 !important;
  padding:2px 0 !important;
  font-size:.78rem !important;
  line-height:1.4;
}

body #loginSection.unipay-token-modal-open #loginForm .principal-location-consent input{
  flex:0 0 auto;
  width:19px;
  height:19px;
  margin:0 !important;
}

body #loginSection.unipay-token-modal-open #loginForm .login-options{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px 14px;
  margin:0;
  line-height:1.35;
}

body #loginSection.unipay-token-modal-open #loginForm .login-options a{
  min-width:0;
  overflow-wrap:anywhere;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content form,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-modal-content form{
  min-width:0;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-row,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-row{
  align-items:stretch;
  gap:14px;
  margin-top:14px;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .field-group,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-field{
  min-width:0;
  flex:1 1 220px;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .field-group input,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .field-group select,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-field input{
  box-sizing:border-box;
  width:100%;
  min-height:44px;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .principal-geo-verification,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .principal-biometric-enrollment{
  flex:1 1 100%;
  min-width:0;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .principal-geo-verification button,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .principal-biometric-enrollment button,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-actions button,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-primary-btn,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-secondary-btn{
  min-height:44px;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-actions,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-actions button,
body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-actions button{
  flex:1 1 180px;
}

@media (max-width:680px){
  body #loginSection.unipay-token-modal-open #loginForm .login-options{
    grid-template-columns:1fr;
  }

  body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-row,
  body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-row{
    gap:10px;
    margin-top:10px;
  }

  body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-actions button,
  body #recoverModal.unipay-account-token-modal-open:not(.hidden) .recover-actions button{
    flex-basis:100%;
    width:100%;
  }
}

/* 20260823 — création de compte : contenu parfaitement net.
   Le halo "fumé" est volontairement limité à l'extérieur du cadre et reste bleu. */
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content{
  background:linear-gradient(145deg, rgba(1,20,39,.995), rgba(1,7,18,.995)) !important;
  border-color:rgba(112, 204, 255, .9) !important;
  box-shadow:
    0 0 10px rgba(146, 224, 255, .78),
    0 0 28px rgba(63, 168, 255, .58),
    0 0 58px rgba(26, 112, 255, .34) !important;
  clip-path:none !important;
  transform:none !important;
  opacity:1 !important;
  filter:none !important;
  transition:box-shadow .22s ease, border-color .22s ease !important;
}

body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content::before,
body #proAccountModal.unipay-account-token-modal-open:not(.hidden) .pro-account-modal-content::after{
  content:none !important;
}
