/* =========================================================================
 * MicroSaaS branded login / web pages — tenant copy (Violet).
 * Loaded via web_include_css, so it styles the Desk-hostname login, signup
 * and forgot pages (the app-hostname SPA has its own shell and is unaffected).
 * The control copy (platform_control) is identical except the palette + label.
 * ========================================================================= */
:root { --msl:#6d28d9; --msl2:#8b5cf6; --msl-strong:#5b21b6; }

/* branded misty canvas on the auth pages */
#page-login, .for-login, .for-signup, .for-forgot, .for-email-login {
  min-height:100vh;
  background-color:#f3f1fb;
  background-image:
    radial-gradient(1100px circle at -6% -12%, color-mix(in srgb,var(--msl) 18%,transparent), transparent 46%),
    radial-gradient(1000px circle at 106% -4%, color-mix(in srgb,var(--msl2) 20%,transparent), transparent 50%),
    radial-gradient(900px circle at 104% 106%, color-mix(in srgb,#5b8def 14%,transparent), transparent 50%),
    radial-gradient(820px circle at -4% 104%, color-mix(in srgb,#f0abfc 12%,transparent), transparent 50%);
  background-attachment:fixed; background-repeat:no-repeat;
}
/* top brand strip */
body::before {
  content:""; position:fixed; top:0; left:0; right:0; height:3px; z-index:1000;
  background:linear-gradient(90deg,var(--msl),var(--msl2)); pointer-events:none;
}
/* the auth card floats with an accent glow */
.page-card {
  border-radius:16px!important; border:1px solid #e7e0fb!important;
  box-shadow:0 24px 70px -24px color-mix(in srgb,var(--msl) 45%,transparent),0 2px 8px rgba(24,16,48,.06)!important;
}
.page-card-head { border-bottom:none; }
/* plane pill above the card title */
.page-card-head::before {
  content:"Workspace"; display:inline-block; margin-bottom:12px; padding:.14rem .55rem;
  font-size:10px; font-weight:800; letter-spacing:.09em; text-transform:uppercase;
  color:#fff; background:linear-gradient(90deg,var(--msl),var(--msl2)); border-radius:999px; line-height:1.6;
}
/* primary sign-in button gradient (Frappe's .btn-login is the black submit;
   .btn-login-option is the secondary "email link" — keep that one subtle). */
.btn-primary, .btn-login:not(.btn-login-option) {
  background:linear-gradient(135deg,var(--msl),var(--msl2))!important; border:none!important; color:#fff!important;
  box-shadow:0 2px 10px -2px color-mix(in srgb,var(--msl) 55%,transparent)!important;
}
.btn-primary:hover, .btn-login:not(.btn-login-option):hover { filter:brightness(1.05); }
.btn-login-option:hover { border-color:var(--msl)!important; color:var(--msl-strong)!important; }
/* inputs */
.form-control { border-radius:8px!important; }
.form-control:focus { border-color:var(--msl)!important; box-shadow:0 0 0 3px color-mix(in srgb,var(--msl) 20%,transparent)!important; }
/* links + native controls */
a { color:var(--msl-strong); }
a:hover { color:var(--msl); }
:root { accent-color:var(--msl); }
