/* The sign-in page, dressed as Flow.
   Frappe's login.html is left alone; `webtheme.website_context` puts
   `sleet-flow` on <body> and everything below reads from that. Same tokens
   as the workspace's design.css, so the page you sign in on and the page you
   land on are visibly the same thing.

   There used to be a palette here — a colour per product, six of them. One
   app, one colour; what a tenant bought shows in the modules they have. */
@import url("/files/sleetech/fonts/fonts.css?v=3");

:root {
  --brand: #0F6E64;
  --sl-bg: #EEF1F4; --sl-panel: #FFFFFF; --sl-line: #DCE1E6; --sl-strong: #C3CAD2;
  --sl-text: #141A22; --sl-muted: #5B6672; --sl-faint: #8B95A0;
  --sl-danger: #B42318; --sl-danger-soft: #FCEBE9;
}

body.sleet-flow {
  font-family: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif !important;
  background: var(--sl-bg) !important;
  color: var(--sl-text);
  -webkit-font-smoothing: antialiased;
}
body.sleet-flow .navbar, body.sleet-flow .web-footer { display: none !important; }
body.sleet-flow .page-content-wrapper { padding: 0; }

/* the rail's colour, as a band across the top of the page */
body.sleet-flow::before {
  content: ""; position: fixed; left: 0; right: 0; top: 0; height: 6px;
  background: var(--brand); z-index: 1;
}

body.sleet-flow .for-login, body.sleet-flow .for-forgot,
body.sleet-flow .for-signup, body.sleet-flow .for-email-login,
body.sleet-flow .for-login-with-email-link {
  min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px 16px;
}
body.sleet-flow .page-card {
  width: 100%; max-width: 400px; margin: 0;
  background: var(--sl-panel); border: 1px solid var(--sl-line); border-radius: 12px;
  box-shadow: 0 1px 2px rgba(20, 26, 34, 0.06), 0 16px 40px -16px rgba(20, 26, 34, 0.22);
  padding: 28px 28px 24px;
}
body.sleet-flow .page-card-head { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; margin-bottom: 22px; padding: 0; }
body.sleet-flow .page-card-head img.app-logo { display: none; }
/* the tile: the product's initial in its colour */
body.sleet-flow .page-card-head::before {
  content: "F"; width: 44px; height: 44px; border-radius: 11px;
  background: var(--brand); color: #fff;
  display: grid; place-items: center;
  font-size: 22px; font-weight: 800; letter-spacing: -0.03em; line-height: 1;
}
body.sleet-flow .page-card-head-text { text-align: left; }
body.sleet-flow .page-card-head h4 { font-size: 20px; font-weight: 700; letter-spacing: -0.02em; margin: 0 0 4px; color: var(--sl-text); }
body.sleet-flow .page-card-subtitle { color: var(--sl-muted); font-size: 13.5px; margin: 0; }

body.sleet-flow .form-label { font-size: 12.5px; font-weight: 500; color: var(--sl-muted); margin-bottom: 5px; text-transform: none; letter-spacing: 0; }
body.sleet-flow .form-control {
  font-family: inherit; font-size: 14px; color: var(--sl-text);
  background: var(--sl-panel); border: 1px solid var(--sl-strong); border-radius: 7px;
  height: 40px; padding: 8px 36px 8px 12px; box-shadow: none;
}
body.sleet-flow .form-control:focus { border-color: var(--brand); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 22%, transparent); outline: none; }
body.sleet-flow .field-icon, body.sleet-flow .toggle-password { color: var(--sl-faint); }
body.sleet-flow .forgot-password-message { text-align: right; margin: 6px 0 0; font-size: 12.5px; }
body.sleet-flow a { color: var(--brand); }

body.sleet-flow .page-card-actions { margin-top: 18px; }
body.sleet-flow .btn-login, body.sleet-flow .btn-primary, body.sleet-flow .btn-signup {
  font-family: inherit; font-size: 14px; font-weight: 600;
  background: var(--brand) !important; border: 1px solid var(--brand) !important; color: #fff !important;
  border-radius: 7px; height: 40px; padding: 0 16px; box-shadow: none;
}
body.sleet-flow .btn-login:hover { filter: brightness(1.08); }
body.sleet-flow .btn-login-option, body.sleet-flow .btn-default.btn-login-option {
  font-family: inherit; font-size: 13.5px; font-weight: 500; margin-top: 8px;
  background: var(--sl-panel); border: 1px solid var(--sl-strong); color: var(--sl-text); border-radius: 7px; height: 40px;
}
body.sleet-flow .sign-up-message { margin-top: 18px; font-size: 13px; color: var(--sl-muted); }
body.sleet-flow .login-error-banner, body.sleet-flow .login-success-banner {
  border-radius: 7px; font-size: 13px; padding: 10px 12px;
}
body.sleet-flow .login-error-banner { background: var(--sl-danger-soft); color: var(--sl-danger); border-left: 3px solid var(--sl-danger); }

/* "Powered by" line — the product name lives there; keep it quiet */
body.sleet-flow .web-footer, body.sleet-flow footer { color: var(--sl-faint); }
