/* QUARZEO V10 — shared premium authentication scene.
   Deliberately scoped to #loginView so dashboard rendering stays native V10. */
#loginView.qz-auth {
  justify-content: flex-end !important;
  overflow: auto;
  padding: 54px max(6vw, 28px) !important;
  background:
    linear-gradient(90deg, rgba(2, 20, 33, .10), rgba(2, 21, 34, .30) 50%, rgba(2, 20, 33, .92) 78%),
    url('/assets/qz-partner-hero-r3.webp') 52% 50% / cover no-repeat,
    #031d2e !important;
}

#loginView.qz-auth::before {
  position: absolute;
  left: max(5vw, 28px);
  bottom: max(7vh, 50px);
  width: min(650px, 47vw);
  color: #eefcff;
  font-size: clamp(42px, 5.3vw, 78px);
  font-weight: 950;
  line-height: .98;
  letter-spacing: -.055em;
  text-shadow: 0 20px 60px rgba(0, 12, 22, .42);
  white-space: pre-line;
  content: "Votre centre avance.\A ZEO reste avec vous.";
}

#loginView.qz-auth.qz-auth--pilot::before {
  content: "Le réseau avance.\A ZEO reste avec vous.";
}

#loginView.qz-auth.qz-auth--admin::before {
  content: "Pilotez tout le réseau.\A ZEO reste avec vous.";
}

#loginView.qz-auth .qz-auth-box {
  position: relative;
  z-index: 2;
  width: min(450px, 100%);
  margin: auto 0;
}

#loginView.qz-auth .qz-auth-brand {
  justify-content: flex-start;
  margin: 0 0 18px;
}

#loginView.qz-auth .qz-auth-brand::before {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  background: rgba(239, 253, 255, .95) url('/assets/qz-zeo-r3-mark.svg') center / 49px 49px no-repeat;
  box-shadow: 0 14px 36px rgba(18, 181, 202, .25);
  content: "";
}

#loginView.qz-auth .qz-auth-brand span {
  color: #f2fdff;
  background: none;
  -webkit-text-fill-color: currentColor;
  font-size: 31px;
  letter-spacing: -.04em;
}

#loginView.qz-auth .qz-auth-brand b {
  color: #60e5ed;
}

#loginView.qz-auth .loginCard {
  padding: 34px !important;
  border: 1px solid rgba(175, 235, 241, .19) !important;
  border-radius: 30px !important;
  color: #edfaff !important;
  background: rgba(3, 31, 48, .79) !important;
  box-shadow: 0 32px 90px rgba(0, 10, 18, .40) !important;
  backdrop-filter: blur(24px) saturate(1.14) !important;
}

#loginView.qz-auth .eyebrow {
  color: #68e5ed;
}

#loginView.qz-auth .loginCard h2 {
  color: #f1fdff;
  font-size: 36px;
}

#loginView.qz-auth .loginCard label,
#loginView.qz-auth .loginCard .demo,
#loginView.qz-auth .loginCard .demo small {
  color: #c6dde4;
}

#loginView.qz-auth .loginCard input {
  border-color: rgba(170, 229, 235, .17) !important;
  color: #effcff !important;
  background: rgba(255, 255, 255, .07) !important;
}

#loginView.qz-auth .loginCard input::placeholder {
  color: #7f9faa;
}

#loginView.qz-auth .loginCard input:focus {
  border-color: #54dbe6;
  box-shadow: 0 0 0 4px rgba(53, 211, 226, .10);
}

#loginView.qz-auth .loginCard > button.primary {
  min-height: 50px !important;
  border: 1px solid rgba(226, 252, 254, .45) !important;
  color: #04243a !important;
  background: linear-gradient(135deg, #e6fdff, #55e1ea) !important;
  box-shadow: 0 17px 37px rgba(30, 200, 218, .22) !important;
}

#loginView.qz-auth .loginCard > button.primary:hover {
  box-shadow: 0 20px 44px rgba(30, 200, 218, .31);
  transform: translateY(-1px);
}

/* Admin V10 ships with a deliberately strong login reset. These visible-state
   selectors keep the shared scene authoritative without leaking into the app. */
#loginView.qz-auth:not(.hidden) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  place-items: initial !important;
  padding: 54px max(6vw, 28px) !important;
  background:
    linear-gradient(90deg, rgba(2, 20, 33, .10), rgba(2, 21, 34, .30) 50%, rgba(2, 20, 33, .92) 78%),
    url('/assets/qz-partner-hero-r3.webp') 52% 50% / cover no-repeat,
    #031d2e !important;
}

#loginView.qz-auth:not(.hidden) .loginCard {
  padding: 34px !important;
  border: 1px solid rgba(175, 235, 241, .19) !important;
  color: #edfaff !important;
  background: rgba(3, 31, 48, .79) !important;
  box-shadow: 0 32px 90px rgba(0, 10, 18, .40) !important;
}

#loginView.qz-auth:not(.hidden) .loginCard label,
#loginView.qz-auth:not(.hidden) .loginCard .demo,
#loginView.qz-auth:not(.hidden) .loginCard .demo small {
  color: #c6dde4 !important;
  text-align: left !important;
}

#loginView.qz-auth:not(.hidden) .loginCard label input {
  border-color: rgba(170, 229, 235, .17) !important;
  color: #effcff !important;
  background: rgba(255, 255, 255, .07) !important;
}

#loginView.qz-auth:not(.hidden) .loginCard label input:focus {
  border-color: #54dbe6 !important;
  background: rgba(255, 255, 255, .10) !important;
  box-shadow: 0 0 0 4px rgba(53, 211, 226, .10) !important;
}

@media (max-width: 860px) {
  #loginView.qz-auth {
    justify-content: center !important;
    padding: 22px !important;
    background-position: 64% 50% !important;
  }

  #loginView.qz-auth:not(.hidden) {
    justify-content: center !important;
    padding: 22px !important;
    background-position: 64% 50% !important;
  }

  #loginView.qz-auth::before {
    display: none;
  }

  #loginView.qz-auth .qz-auth-box {
    margin: auto;
  }
}

@media (max-width: 620px) {
  #loginView.qz-auth {
    align-items: flex-start;
    background:
      linear-gradient(180deg, rgba(2, 21, 34, .48), rgba(2, 21, 34, .96)),
      url('/assets/qz-partner-hero-r3.webp') 68% 0 / auto 48% no-repeat,
      #031d2e !important;
  }


  #loginView.qz-auth:not(.hidden) {
    align-items: flex-start !important;
    background:
      linear-gradient(180deg, rgba(2, 21, 34, .48), rgba(2, 21, 34, .96)),
      url('/assets/qz-partner-hero-r3.webp') 68% 0 / auto 48% no-repeat,
      #031d2e !important;
  }

  #loginView.qz-auth .qz-auth-box {
    margin: auto 0;
  }

  #loginView.qz-auth .loginCard {
    padding: 27px 22px !important;
  }

  #loginView.qz-auth .qz-auth-brand {
    justify-content: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  #loginView.qz-auth *,
  #loginView.qz-auth *::before,
  #loginView.qz-auth *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}
