/* UnlockerTool corrective theme v22
   Focus: login/register compact responsive auth layout, Google icon visibility,
   mobile one-screen comfort, without touching backend logic. */

/* =========================
   AUTH DESKTOP REFINEMENT
   ========================= */
html[data-page="login"] .page,
html[data-page="register"] .page{
  width:min(1040px,calc(100% - 28px))!important;
  max-width:1040px!important;
  padding:22px 0 34px!important;
}

html[data-page="login"] .ur-auth-screen,
html[data-page="register"] .ur-auth-screen{
  max-width:900px!important;
  min-height:0!important;
  grid-template-columns:44% 56%!important;
  border-radius:20px!important;
  overflow:hidden!important;
  border:1px solid #34597f!important;
  background:linear-gradient(180deg,#162840 0%,#15263d 100%)!important;
  box-shadow:0 22px 55px rgba(0,0,0,.22)!important;
}

html[data-page="login"] .ur-auth-visual,
html[data-page="register"] .ur-auth-visual{
  padding:34px 24px!important;
  min-height:0!important;
  background:linear-gradient(160deg,#142642 0%,#21497b 76%,#2d73cf 116%)!important;
}

html[data-page="login"] .ur-product-intro,
html[data-page="register"] .ur-product-intro{
  margin-bottom:16px!important;
}

html[data-page="login"] .ur-product-intro h2,
html[data-page="register"] .ur-product-intro h2{
  font-size:18px!important;
  line-height:1.18!important;
  margin:0 0 6px!important;
}

html[data-page="login"] .ur-product-intro p,
html[data-page="register"] .ur-product-intro p{
  font-size:12px!important;
  color:#d5e3f7!important;
}

html[data-page="login"] .ur-tool-grid,
html[data-page="register"] .ur-tool-grid{
  gap:10px!important;
}

html[data-page="login"] .ur-tool,
html[data-page="register"] .ur-tool{
  min-height:142px!important;
  border-radius:14px!important;
  background:#ffffff!important;
  box-shadow:0 10px 24px rgba(0,0,0,.10)!important;
}

html[data-page="login"] .ur-tool-symbol,
html[data-page="register"] .ur-tool-symbol{
  min-height:106px!important;
}

html[data-page="login"] .ur-tool > strong,
html[data-page="register"] .ur-tool > strong{
  font-size:12px!important;
  color:#2f3b4c!important;
  padding:10px 8px!important;
}

html[data-page="login"] .ur-auth-form-panel,
html[data-page="register"] .ur-auth-form-panel{
  background:#17283f!important;
  padding:30px 28px 24px!important;
}

html[data-page="login"] .ur-auth-header h1,
html[data-page="register"] .ur-auth-header h1{
  font-size:28px!important;
  line-height:1.08!important;
  margin:0 0 10px!important;
  color:#f4f8ff!important;
}

html[data-page="login"] .ur-auth-header>p,
html[data-page="register"] .ur-auth-header>p{
  font-size:12.5px!important;
  line-height:1.5!important;
  color:#a9bdd6!important;
  margin:0 0 14px!important;
}

html[data-page="login"] .ur-method-label{
  display:block!important;
  color:#c1d0e4!important;
  font-size:11px!important;
  margin:0 0 8px!important;
}

html[data-page="login"] .auth-login-tabs{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:4px!important;
  background:#112340!important;
  border:1px solid #3d5d84!important;
  border-radius:14px!important;
  padding:4px!important;
  margin:0 0 16px!important;
}

html[data-page="login"] .auth-login-tab{
  min-height:34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 12px!important;
  border-radius:10px!important;
  font-size:12px!important;
  font-weight:700!important;
  color:#c3d4e8!important;
  background:transparent!important;
  border:0!important;
  text-decoration:none!important;
}

html[data-page="login"] .auth-login-tab.active{
  background:linear-gradient(180deg,#2f7be3 0%,#286dd2 100%)!important;
  color:#fff!important;
  text-decoration:none!important;
  box-shadow:0 6px 16px rgba(34,111,217,.28)!important;
}

html[data-page="login"] .form-group,
html[data-page="register"] .form-group{
  margin-bottom:12px!important;
}

html[data-page="login"] .form-group>label,
html[data-page="register"] .form-group>label{
  font-size:12px!important;
  font-weight:700!important;
  color:#edf4ff!important;
  margin-bottom:6px!important;
}

html[data-page="login"] .ur-auth-form-panel input:not([type="hidden"]):not([type="radio"]),
html[data-page="register"] .ur-auth-form-panel input:not([type="hidden"]):not([type="radio"]){
  min-height:46px!important;
  padding:11px 14px!important;
  border-radius:12px!important;
  background:#2b3f5f!important;
  border:1px solid #375172!important;
  color:#f2f7ff!important;
  font-size:13px!important;
}

html[data-page="login"] .password-toggle,
html[data-page="register"] .password-toggle{
  right:8px!important;
  width:34px!important;
  height:34px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:9px!important;
}

html[data-page="login"] .ur-auth-form-panel button.auth-submit,
html[data-page="register"] .ur-auth-form-panel button.auth-submit{
  min-height:45px!important;
  border-radius:12px!important;
  font-size:13px!important;
  font-weight:800!important;
  margin-top:4px!important;
}

html[data-page="login"] .ur-or,
html[data-page="register"] .ur-or{
  margin:14px 0!important;
}

html[data-page="login"] .oauth-buttons,
html[data-page="register"] .oauth-buttons{
  grid-template-columns:1fr!important;
  gap:10px!important;
}

html[data-page="login"] .oauth-btn,
html[data-page="register"] .oauth-btn{
  min-height:44px!important;
  border-radius:12px!important;
  justify-content:center!important;
  gap:10px!important;
  padding:0 14px!important;
  font-size:13px!important;
  font-weight:700!important;
}

html[data-page="login"] .oauth-logo-wrap,
html[data-page="register"] .oauth-logo-wrap{
  width:18px!important;
  height:18px!important;
  display:inline-grid!important;
  place-items:center!important;
  flex:0 0 18px!important;
}

html[data-page="login"] .oauth-logo,
html[data-page="register"] .oauth-logo{
  width:18px!important;
  height:18px!important;
  display:block!important;
}

html[data-page="login"] .oauth-google,
html[data-page="register"] .oauth-google{
  background:#f4f5f7!important;
  color:#2b313c!important;
  border:1px solid #d9e1ec!important;
}

html[data-page="login"] .oauth-facebook,
html[data-page="register"] .oauth-facebook{
  color:#fff!important;
}

html[data-page="login"] .ur-auth-links,
html[data-page="register"] .ur-auth-links{
  margin-top:14px!important;
  font-size:12px!important;
}

html[data-page="login"] .ur-auth-forgot{
  margin-top:10px!important;
  text-align:right!important;
}

/* =========================
   MOBILE COMPACT VERSION
   ========================= */
@media (max-width: 960px){
  html[data-page="login"] .page,
  html[data-page="register"] .page{
    width:calc(100% - 18px)!important;
    max-width:100%!important;
    padding:10px 0 18px!important;
  }

  html[data-page="login"] .ur-auth-screen,
  html[data-page="register"] .ur-auth-screen{
    max-width:364px!important;
    width:100%!important;
    margin:0 auto!important;
    grid-template-columns:1fr!important;
    border-radius:16px!important;
    min-height:0!important;
  }

  html[data-page="login"] .ur-auth-visual,
  html[data-page="register"] .ur-auth-visual{
    display:none!important;
  }

  html[data-page="login"] .ur-auth-form-panel,
  html[data-page="register"] .ur-auth-form-panel{
    padding:16px 14px 14px!important;
  }

  html[data-page="login"] .ur-auth-header h1,
  html[data-page="register"] .ur-auth-header h1{
    font-size:18px!important;
    margin-bottom:6px!important;
  }

  html[data-page="login"] .ur-auth-header>p,
  html[data-page="register"] .ur-auth-header>p{
    font-size:10.5px!important;
    line-height:1.45!important;
    margin-bottom:10px!important;
  }

  html[data-page="login"] .ur-method-label{
    font-size:10px!important;
    margin-bottom:6px!important;
  }

  html[data-page="login"] .auth-login-tabs{
    margin-bottom:10px!important;
    border-radius:10px!important;
    padding:3px!important;
  }

  html[data-page="login"] .auth-login-tab{
    min-height:31px!important;
    font-size:11px!important;
    padding:0 8px!important;
  }

  html[data-page="login"] .form-group,
  html[data-page="register"] .form-group{
    margin-bottom:9px!important;
  }

  html[data-page="login"] .form-group>label,
  html[data-page="register"] .form-group>label{
    font-size:11px!important;
    margin-bottom:5px!important;
  }

  html[data-page="login"] .ur-auth-form-panel input:not([type="hidden"]):not([type="radio"]),
  html[data-page="register"] .ur-auth-form-panel input:not([type="hidden"]):not([type="radio"]){
    min-height:40px!important;
    padding:9px 12px!important;
    border-radius:10px!important;
    font-size:12px!important;
  }

  html[data-page="login"] .password-toggle,
  html[data-page="register"] .password-toggle{
    width:30px!important;
    height:30px!important;
    right:6px!important;
  }

  html[data-page="login"] .ur-auth-form-panel button.auth-submit,
  html[data-page="register"] .ur-auth-form-panel button.auth-submit,
  html[data-page="login"] .oauth-btn,
  html[data-page="register"] .oauth-btn{
    min-height:40px!important;
    font-size:11.5px!important;
    border-radius:10px!important;
  }

  html[data-page="login"] .ur-or,
  html[data-page="register"] .ur-or{
    margin:10px 0!important;
    font-size:11px!important;
  }

  html[data-page="login"] .ur-auth-links,
  html[data-page="register"] .ur-auth-links,
  html[data-page="login"] .ur-auth-forgot{
    font-size:11px!important;
  }

  html[data-page="login"] .ur-auth-links{
    margin-top:10px!important;
  }

  html[data-page="login"] .ur-auth-forgot{
    margin-top:7px!important;
  }
}

@media (max-width: 430px){
  html[data-page="login"] .topbar .nav-wrap,
  html[data-page="register"] .topbar .nav-wrap{
    min-height:56px!important;
    height:56px!important;
  }

  html[data-page="login"] .brand-logo-image,
  html[data-page="register"] .brand-logo-image{
    width:112px!important;
  }

  html[data-page="login"] .gsm-mobile-toggle,
  html[data-page="register"] .gsm-mobile-toggle,
  html[data-page="login"] .ur-universal-toggle,
  html[data-page="register"] .ur-universal-toggle{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    flex-basis:34px!important;
    border-radius:10px!important;
  }

  html[data-page="login"] .page,
  html[data-page="register"] .page{
    padding-top:8px!important;
    padding-bottom:14px!important;
  }

  html[data-page="login"] .ur-auth-screen,
  html[data-page="register"] .ur-auth-screen{
    max-width:352px!important;
    border-radius:14px!important;
  }

  html[data-page="login"] .ur-auth-form-panel,
  html[data-page="register"] .ur-auth-form-panel{
    padding:14px 12px 12px!important;
  }
}

@media (max-width: 380px){
  html[data-page="login"] .ur-auth-screen,
  html[data-page="register"] .ur-auth-screen{
    max-width:100%!important;
  }
}

/* Nice alignment if only one OAuth provider is available. */
html[data-page="login"] .oauth-buttons:has(.oauth-btn:only-child),
html[data-page="register"] .oauth-buttons:has(.oauth-btn:only-child){
  grid-template-columns:1fr!important;
}

/* V3 — Centrage vertical du formulaire uniquement sur les pages d'authentification.
   On garde tous les champs, boutons et actions de la V2 inchangés.
   La hauteur reste minimale (pas fixe) : sur un petit écran, le formulaire
   peut s'étendre naturellement et défiler au lieu d'être coupé. */
html[data-page="login"] main.page,
html[data-page="register"] main.page {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: calc(100vh - 142px) !important;
  min-height: calc(100svh - 142px) !important;
}
/*
 * UnlockerTool — correctif ciblé pour la page "Connexion réussie".
 * Le layout charge déjà ce nom de fichier. La livraison ajoute donc
 * uniquement le fichier manquant, sans toucher à PHP, JS, API ni paiement.
 * Toutes les règles sont limitées à data-page="login-success".
 */
html[data-page="login-success"] main.page {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 12px;
  min-width: 0;
  min-height: calc(100vh - 210px);
  min-height: calc(100svh - 210px);
  padding-top: 24px;
  padding-bottom: 36px;
}

/* Le flash de succès ne doit pas partager une rangée avec la carte. */
html[data-page="login-success"] main.page > .alert {
  flex: 0 0 auto;
  display: block;
  width: min(440px, 100%);
  max-width: 100%;
  margin: 0 auto;
  padding: 12px 16px;
  border-radius: 12px;
  text-align: center;
  overflow-wrap: anywhere;
}

html[data-page="login-success"] main.page > .ur-auth-success {
  flex: 0 1 auto;
  min-width: 0;
  width: min(440px, 100%);
  max-width: 100%;
  margin: 0 auto;
  padding: 36px clamp(22px, 5vw, 38px);
  border-radius: 22px;
  box-sizing: border-box;
}

html[data-page="login-success"] .ur-auth-success h1 {
  line-height: 1.18;
  overflow-wrap: normal;
}

html[data-page="login-success"] .ur-success-continue {
  max-width: 100%;
}

@media (max-width: 560px) {
  html[data-page="login-success"] main.page {
    width: calc(100% - 24px);
    gap: 10px;
    min-height: calc(100vh - 168px);
    min-height: calc(100svh - 168px);
    padding-top: 14px;
    padding-bottom: 24px;
  }
  html[data-page="login-success"] main.page > .ur-auth-success {
    padding: 30px 20px !important;
    border-radius: 19px;
  }
  html[data-page="login-success"] .ur-success-check {
    width: 70px;
    height: 70px;
    margin-bottom: 14px;
  }
  html[data-page="login-success"] .ur-auth-success h1 {
    font-size: clamp(25px, 7.4vw, 33px) !important;
    margin-top: 11px;
  }
  html[data-page="login-success"] .ur-success-eyebrow {
    font-size: 9px;
    letter-spacing: 0.08em;
  }
  html[data-page="login-success"] .ur-auth-success p {
    margin-bottom: 17px;
    line-height: 1.5;
  }
  html[data-page="login-success"] .ur-success-track {
    margin-bottom: 21px;
  }
  html[data-page="login-success"] .ur-success-continue {
    width: 100%;
    min-width: 0;
    min-height: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-page="login-success"] .ur-success-glow,
  html[data-page="login-success"] .ur-success-check,
  html[data-page="login-success"] .ur-success-track > span {
    animation: none !important;
  }
}