:root {
  --auth-ink: #102a43;
  --auth-muted: #61788d;
  --auth-line: #d6e2ea;
  --auth-teal: #137b75;
  --auth-teal-dark: #0d625e;
  --auth-soft: #f4f8fa;
  --auth-danger: #a62f43;
}

/* V6: layout autonomo. Azzera le stratificazioni delle precedenti schermate auth. */
.auth-screen {
  position: fixed !important;
  inset: 0 !important;
  z-index: 200 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 100dvh !important;
  padding: clamp(18px, 3vw, 44px) !important;
  overflow: auto !important;
  background:
    radial-gradient(circle at 83% 13%, rgba(71, 211, 196, .22), transparent 27%),
    linear-gradient(135deg, #071c2e 0%, #0b3c4b 56%, #10766f 100%) !important;
}

.auth-screen.hidden { display: none !important; }

.auth-card,
.auth-card:has(#loginPane:not([hidden])),
.auth-card:has(#registerPane:not([hidden])) {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(300px, 38%) minmax(0, 1fr) !important;
  grid-template-rows: auto auto 1fr auto !important;
  width: min(1080px, 100%) !important;
  min-height: 680px !important;
  max-width: 1080px !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .7) !important;
  border-radius: 30px !important;
  background: #fff !important;
  box-shadow: 0 34px 100px rgba(1, 20, 34, .42) !important;
}

.auth-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  z-index: 0 !important;
  display: block !important;
  width: 38% !important;
  padding: 0 !important;
  background:
    radial-gradient(circle at 30% 18%, rgba(68, 207, 194, .24), transparent 28%),
    linear-gradient(155deg, #0b2238 0%, #113d58 55%, #146a6d 100%) !important;
}

.auth-card::after {
  content: "Fascicoli protetti  •  Contabilità  •  Rendiconti  •  Backup" !important;
  position: absolute !important;
  left: clamp(28px, 4vw, 50px) !important;
  bottom: 42px !important;
  z-index: 1 !important;
  display: block !important;
  width: calc(38% - clamp(56px, 8vw, 100px)) !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(255, 255, 255, .18) !important;
  color: rgba(234, 250, 248, .76) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1.55 !important;
  letter-spacing: .07em !important;
}

.auth-logo {
  grid-column: 1 !important;
  grid-row: 1 !important;
  z-index: 2 !important;
  display: grid !important;
  place-items: center !important;
  width: 64px !important;
  height: 64px !important;
  margin: 54px 48px 18px !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 12px 32px rgba(0, 20, 35, .2) !important;
}

.auth-logo img { width: 100% !important; height: 100% !important; object-fit: contain !important; }

.auth-copy {
  grid-column: 1 !important;
  grid-row: 2 / 4 !important;
  z-index: 2 !important;
  align-self: start !important;
  margin: 0 !important;
  padding: 0 48px !important;
  color: #fff !important;
}

.auth-copy::before,
.auth-copy::after { display: none !important; content: none !important; }
.auth-copy small { color: #7fe0d4 !important; font-size: 11px !important; font-weight: 900 !important; letter-spacing: .15em !important; }
.auth-copy h1 { margin: 10px 0 12px !important; color: #fff !important; font-size: clamp(31px, 3.3vw, 43px) !important; line-height: 1 !important; letter-spacing: -.045em !important; }
.auth-copy p { max-width: 270px !important; margin: 0 !important; color: #c3d9e2 !important; font-size: 15px !important; line-height: 1.55 !important; }

.auth-tabs {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: start !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 6px !important;
  width: auto !important;
  margin: 48px 52px 24px !important;
  padding: 5px !important;
  border-radius: 14px !important;
  background: #edf3f6 !important;
}

.auth-tab {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  padding: 8px 14px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #617589 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  white-space: normal !important;
  cursor: pointer !important;
}

.auth-tab.active {
  background: #fff !important;
  color: var(--auth-ink) !important;
  box-shadow: 0 4px 14px rgba(16, 42, 67, .10) !important;
}

.auth-pane,
.auth-card:has(#registerPane:not([hidden])) #registerPane {
  grid-column: 2 !important;
  grid-row: 2 / 4 !important;
  align-self: start !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 52px 34px !important;
  overflow: visible !important;
}

.auth-pane[hidden] { display: none !important; }
.upgrade4-login { padding-top: 0 !important; }
.login-welcome { margin: 0 0 22px !important; }
.login-kicker,.register-kicker { color: var(--auth-teal) !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .14em !important; }
.login-welcome h2,.register-hero-copy h2 { margin: 7px 0 7px !important; color: var(--auth-ink) !important; font-size: 30px !important; line-height: 1.08 !important; letter-spacing: -.035em !important; }
.login-welcome p,.register-hero-copy p { max-width: 520px !important; margin: 0 !important; color: var(--auth-muted) !important; font-size: 13px !important; line-height: 1.5 !important; }
.login-form-modern { display: grid !important; gap: 16px !important; margin: 0 !important; }
.login-field { display: grid !important; gap: 7px !important; }
.login-label-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; }
.login-label-row label,.login-field > label { color: #3f566a !important; font-size: 11px !important; font-weight: 850 !important; letter-spacing: .035em !important; text-transform: uppercase !important; }
.login-forgot-inline { border: 0 !important; background: transparent !important; color: var(--auth-teal) !important; font-size: 11px !important; font-weight: 800 !important; cursor: pointer !important; }
.login-input-wrap { position: relative !important; display: block !important; width: 100% !important; }
.login-input-wrap input { width: 100% !important; min-height: 52px !important; padding: 10px 84px 10px 43px !important; border: 1px solid var(--auth-line) !important; border-radius: 12px !important; background: #fbfdfe !important; color: var(--auth-ink) !important; font-size: 15px !important; }
.login-input-wrap input:focus,.register-wizard-v5 input:focus,.register-wizard-v5 select:focus { outline: 0 !important; border-color: #248d88 !important; box-shadow: 0 0 0 4px rgba(36, 141, 136, .12) !important; }
.login-input-icon { position: absolute !important; left: 15px !important; top: 50% !important; z-index: 1 !important; transform: translateY(-50%) !important; color: #7b8fa1 !important; pointer-events: none !important; }
.login-password-toggle { position: absolute !important; right: 8px !important; top: 50% !important; transform: translateY(-50%) !important; border: 0 !important; border-radius: 8px !important; padding: 8px 10px !important; background: #e9f4f4 !important; color: var(--auth-teal-dark) !important; font-size: 10px !important; font-weight: 850 !important; cursor: pointer !important; }
.login-remember { display: flex !important; align-items: flex-start !important; gap: 10px !important; color: #344c60 !important; font-size: 12px !important; font-weight: 750 !important; }
.login-remember input { flex: 0 0 auto !important; width: 16px !important; height: 16px !important; margin-top: 2px !important; }
.login-remember > span { display: grid !important; gap: 2px !important; }
.login-remember small { display: block !important; color: #778b9c !important; font-size: 10px !important; font-weight: 500 !important; line-height: 1.35 !important; }
.login-submit { display: flex !important; align-items: center !important; justify-content: center !important; gap: 12px !important; width: 100% !important; min-height: 52px !important; border-radius: 12px !important; background: linear-gradient(120deg, #11766f, #16948a) !important; box-shadow: 0 12px 28px rgba(17, 118, 111, .22) !important; }
.login-security-note { display: flex !important; gap: 10px !important; margin-top: 18px !important; padding: 12px 14px !important; border-radius: 12px !important; background: var(--auth-soft) !important; color: #617588 !important; }
.login-security-note p { display: grid !important; gap: 2px !important; margin: 0 !important; }
.login-security-note b { color: #385166 !important; font-size: 11px !important; }
.login-security-note small { font-size: 10px !important; line-height: 1.4 !important; }
.auth-error,.auth-success { width: 100% !important; padding: 11px 13px !important; border-radius: 10px !important; font-size: 12px !important; line-height: 1.4 !important; }

/* Registrazione V6 */
.auth-card:has(#registerPane:not([hidden])) { width: min(1180px, 100%) !important; max-width: 1180px !important; min-height: min(820px, calc(100dvh - 44px)) !important; grid-template-columns: minmax(260px, 31%) minmax(0, 1fr) !important; }
.auth-card:has(#registerPane:not([hidden]))::before { width: 31% !important; }
.auth-card:has(#registerPane:not([hidden]))::after { width: calc(31% - clamp(56px, 8vw, 100px)) !important; }
.register-upgrade5 { padding-bottom: 36px !important; }
.register-hero { display: grid !important; gap: 11px !important; margin: 0 0 18px !important; }
.register-back-login { justify-self: start !important; min-height: 30px !important; padding: 0 !important; color: #456077 !important; font-size: 12px !important; }
.register-trust { display: flex !important; flex-wrap: wrap !important; gap: 7px !important; }
.register-trust span { padding: 6px 9px !important; border: 1px solid #dae7eb !important; border-radius: 999px !important; background: #f5fafb !important; color: #476477 !important; font-size: 10px !important; font-weight: 700 !important; }
.register-wizard-v5 { display: grid !important; gap: 0 !important; width: 100% !important; margin: 0 !important; }
.register-progress { display: flex !important; align-items: center !important; gap: 12px !important; width: 100% !important; margin: 0 0 16px !important; }
.reg-progress-step { display: flex !important; flex: 0 1 auto !important; align-items: center !important; gap: 9px !important; min-width: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: #647a8d !important; text-align: left !important; cursor: pointer !important; }
.reg-progress-step > span { display: grid !important; flex: 0 0 36px !important; place-items: center !important; width: 36px !important; height: 36px !important; border-radius: 50% !important; background: #e9f0f5 !important; color: var(--auth-ink) !important; font-weight: 850 !important; }
.reg-progress-step.active > span { background: var(--auth-ink) !important; color: #fff !important; }
.reg-progress-step div { display: flex !important; flex-direction: column !important; min-width: 0 !important; line-height: 1.2 !important; }
.reg-progress-step b { font-size: 12px !important; white-space: nowrap !important; }
.reg-progress-step small { margin-top: 2px !important; color: #7a8e9f !important; font-size: 10px !important; white-space: nowrap !important; }
.reg-progress-line { flex: 1 1 40px !important; min-width: 28px !important; max-width: 110px !important; height: 2px !important; background: #dae4eb !important; }
.reg-panel { width: 100% !important; min-width: 0 !important; padding: 22px 24px !important; border: 1px solid #dbe6ed !important; border-radius: 19px !important; background: #fff !important; box-shadow: 0 12px 34px rgba(16, 42, 67, .07) !important; }
.reg-panel[hidden] { display: none !important; }
.register-step-title { display: flex !important; align-items: center !important; gap: 10px !important; margin: 0 0 17px !important; }
.register-step-title > span { display: grid !important; flex: 0 0 34px !important; place-items: center !important; width: 34px !important; height: 34px !important; border-radius: 50% !important; background: var(--auth-ink) !important; color: #fff !important; font-weight: 850 !important; }
.register-step-title div { display: flex !important; flex-direction: column !important; min-width: 0 !important; }
.register-step-title b { color: var(--auth-ink) !important; font-size: 15px !important; }
.register-step-title small { margin-top: 2px !important; color: #718698 !important; font-size: 11px !important; line-height: 1.35 !important; }
.register-section-label { margin: 4px 0 9px !important; color: #70889c !important; font-size: 9px !important; font-weight: 850 !important; letter-spacing: .13em !important; }
.register-plan-label { margin-top: 18px !important; }
.register-grid-two { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 13px 15px !important; }
.register-grid-two .full { grid-column: 1 / -1 !important; }
.register-plan-box { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 15px !important; padding: 14px !important; border: 1px solid #dce7ed !important; border-radius: 14px !important; background: #f7fafc !important; }
.register-wizard-v5 .field { display: grid !important; gap: 6px !important; min-width: 0 !important; margin: 0 !important; }
.register-wizard-v5 .field label { color: #3f566a !important; font-size: 11px !important; font-weight: 800 !important; }
.register-wizard-v5 input,.register-wizard-v5 select { width: 100% !important; min-width: 0 !important; min-height: 46px !important; padding: 9px 11px !important; border: 1px solid #cfdde7 !important; border-radius: 10px !important; background: #fff !important; color: var(--auth-ink) !important; font-size: 14px !important; }
.register-wizard-v5 .field small { color: #75899a !important; font-size: 10px !important; line-height: 1.35 !important; }
.register-subdomain { display: flex !important; align-items: stretch !important; min-width: 0 !important; }
.register-subdomain input { flex: 1 1 auto !important; min-width: 100px !important; border-radius: 10px 0 0 10px !important; }
.register-subdomain span { display: flex !important; flex: 0 1 auto !important; align-items: center !important; max-width: 48% !important; padding: 0 10px !important; overflow: hidden !important; border: 1px solid #cfdde7 !important; border-left: 0 !important; border-radius: 0 10px 10px 0 !important; background: #edf3f6 !important; color: #526a7e !important; font-size: 11px !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.register-fiscal-intro { display: flex !important; gap: 10px !important; margin: 0 0 16px !important; padding: 12px 13px !important; border: 1px solid #d9e7eb !important; border-radius: 13px !important; background: #f2f8f9 !important; }
.register-fiscal-intro p { display: grid !important; gap: 2px !important; margin: 0 !important; }
.register-fiscal-intro b { color: #355367 !important; font-size: 12px !important; }
.register-fiscal-intro small { color: #6b8192 !important; font-size: 10px !important; }
.register-address-grid { display: grid !important; grid-template-columns: minmax(0, 1.6fr) minmax(80px, .55fr) minmax(130px, 1fr) minmax(70px, .45fr) !important; gap: 13px !important; }
.register-address-grid .address-main { grid-column: span 2 !important; }
.register-address-grid .billing-email { grid-column: span 2 !important; }
.register-consent { display: flex !important; align-items: flex-start !important; gap: 9px !important; margin: 16px 0 0 !important; padding: 11px 12px !important; border-radius: 11px !important; background: #f5f8fa !important; color: #496174 !important; font-size: 11px !important; line-height: 1.4 !important; }
.register-consent input { flex: 0 0 auto !important; width: 16px !important; height: 16px !important; margin-top: 1px !important; }
.register-actions { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin-top: 18px !important; padding: 0 !important; background: none !important; }
.register-actions button { min-height: 45px !important; padding: 9px 18px !important; }
.register-create { min-width: 250px !important; }
.register-safe-note { color: #62788a !important; font-size: 11px !important; }
.register-after { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin-top: 14px !important; padding-top: 13px !important; border-top: 1px solid #e2eaf0 !important; color: #6c8192 !important; font-size: 11px !important; }
.register-resend { margin: 0 !important; font-size: 11px !important; }
.auth-hint { grid-column: 2 !important; grid-row: 4 !important; align-self: end !important; margin: 0 52px 18px !important; color: #8494a2 !important; font-size: 10px !important; line-height: 1.4 !important; }
.auth-version { position: absolute !important; left: 48px !important; bottom: 86px !important; z-index: 2 !important; margin: 0 !important; color: #89d4cd !important; font-size: 10px !important; font-weight: 850 !important; letter-spacing: .08em !important; }
.auth-copyright { position: absolute !important; left: 48px !important; bottom: 22px !important; z-index: 2 !important; margin: 0 !important; color: rgba(225, 242, 244, .66) !important; font-size: 10px !important; }

@media (max-width: 900px) {
  .auth-screen { display: block !important; padding: 0 !important; background: #fff !important; }
  .auth-card,.auth-card:has(#loginPane:not([hidden])),.auth-card:has(#registerPane:not([hidden])) {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: calc(22px + env(safe-area-inset-top)) clamp(20px, 5vw, 44px) calc(28px + env(safe-area-inset-bottom)) !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  .auth-card::before,.auth-card::after { display: none !important; }
  .auth-logo { width: 56px !important; height: 56px !important; margin: 0 0 12px !important; box-shadow: 0 8px 24px rgba(16,42,67,.14) !important; }
  .auth-copy { margin: 0 !important; padding: 0 !important; color: var(--auth-ink) !important; }
  .auth-copy small { color: var(--auth-teal) !important; }
  .auth-copy h1 { margin: 7px 0 7px !important; color: var(--auth-ink) !important; font-size: 30px !important; }
  .auth-copy p { color: var(--auth-muted) !important; font-size: 13px !important; }
  .auth-tabs { margin: 20px 0 22px !important; }
  .auth-pane,.auth-card:has(#registerPane:not([hidden])) #registerPane { padding: 0 !important; }
  .auth-hint { margin: 18px 0 0 !important; padding: 14px 0 0 !important; border-top: 1px solid #e4ebf0 !important; }
  .auth-version { position: static !important; display: block !important; margin: 16px 0 0 !important; color: #668293 !important; }
  .auth-copyright { position: static !important; margin: 7px 0 0 !important; color: #8796a3 !important; }
  .register-address-grid { grid-template-columns: minmax(0, 1.4fr) minmax(80px, .6fr) minmax(110px, 1fr) !important; }
  .register-address-grid .address-main,.register-address-grid .billing-email { grid-column: span 2 !important; }
}

@media (max-width: 620px) {
  .auth-card,.auth-card:has(#loginPane:not([hidden])),.auth-card:has(#registerPane:not([hidden])) { padding-left: 18px !important; padding-right: 18px !important; }
  .auth-copy h1 { font-size: 27px !important; }
  .auth-tabs { position: static !important; margin-top: 18px !important; }
  .login-welcome h2,.register-hero-copy h2 { font-size: 25px !important; }
  .register-trust span { font-size: 9px !important; }
  .reg-progress-step small { display: none !important; }
  .reg-panel { padding: 17px !important; border-radius: 16px !important; box-shadow: none !important; background: #fbfdfe !important; }
  .register-grid-two,.register-plan-box,.register-address-grid { grid-template-columns: 1fr !important; }
  .register-grid-two .full,.register-address-grid .address-main,.register-address-grid .billing-email,.register-address-grid .city { grid-column: auto !important; }
  .register-actions { flex-direction: column-reverse !important; align-items: stretch !important; }
  .register-actions button,.register-create { width: 100% !important; min-width: 0 !important; }
  .register-safe-note { display: none !important; }
  .register-after { align-items: flex-start !important; flex-direction: column !important; }
}

@media (max-width: 390px) {
  .auth-card,.auth-card:has(#loginPane:not([hidden])),.auth-card:has(#registerPane:not([hidden])) { padding-left: 15px !important; padding-right: 15px !important; }
  .auth-tab { padding-left: 7px !important; padding-right: 7px !important; font-size: 12px !important; }
  .reg-progress-step div { display: none !important; }
  .login-label-row { align-items: flex-start !important; }
}

/* V16.0.3 - Mobile app distribution on login */
.mobile-app-downloads{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.mobile-app-link{display:flex;align-items:center;gap:10px;min-height:58px;padding:10px 12px;border:1px solid #d7e3e9;border-radius:12px;background:#fff;color:#29465a;text-decoration:none;box-shadow:0 4px 14px rgba(31,63,82,.05)}
.mobile-app-link:hover{border-color:#8ab9b7;transform:translateY(-1px)}
.mobile-app-link.pending{opacity:.68;cursor:default}
.mobile-app-icon{display:grid;place-items:center;min-width:45px;height:34px;padding:0 8px;border-radius:9px;background:#edf6f5;color:#176f78;font-size:10px;font-weight:900;letter-spacing:.03em}
.mobile-app-link>span:last-child{display:grid;gap:2px}.mobile-app-link b{font-size:11px}.mobile-app-link small{color:#788c9d;font-size:9px;line-height:1.25}
@media(max-width:560px){.mobile-app-downloads{grid-template-columns:1fr}}

/* V19 - download app sempre visibile nella home/login */
.mobile-app-link.android{border-color:#9fc9bf;background:linear-gradient(180deg,#f8fffc,#f1faf6)}
.mobile-app-link.android .mobile-app-icon{font-weight:800}
.mobile-app-link.android.unavailable{opacity:.72;filter:saturate(.65);cursor:not-allowed}
.mobile-app-link.android.unavailable:hover{transform:none;border-color:#d7e3e9}
.top-android-download{text-decoration:none}
@media(max-width:720px){.mobile-app-link.android{min-height:68px}.mobile-app-link.android b{font-size:13px}.mobile-app-link.android small{font-size:10px}.top-android-download b{display:none}}

/* V19.0.1 — Safe area mobile native */
:root{--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}
@media(max-width:760px){body{padding-left:var(--safe-left);padding-right:var(--safe-right);padding-bottom:var(--safe-bottom)}}
