/** * Branded sign-in skin for Live Long CRM. * Enhances Gin's login card (which already provides the logo, site name and * centred card) with a softer background, a welcome heading and themed fields. * Scoped to . */ body.lm-auth { background: radial-gradient(900px 600px at -5% -10%, rgba(102, 88, 221, 0.20), transparent 60%), radial-gradient(900px 600px at 105% 110%, rgba(139, 127, 240, 0.18), transparent 60%), #f4f5fb !important; } /* Centre the login card on the screen. */ body.lm-auth .dialog-off-canvas-main-canvas, body.lm-auth .page-wrapper, body.lm-auth .layout-container, body.lm-auth main { display: flex !important; align-items: center; justify-content: center; min-height: 100vh; width: 100%; max-width: none; box-sizing: border-box; } /* Tidy: drop the field help text + register link clutter, keep it minimal. */ body.lm-auth .form-item__description, body.lm-auth .description, body.lm-auth h1.page-title, body.lm-auth .block-page-title-block { display: none !important; } /* Welcome heading (injected before the fields). */ .lm-login__head { margin: 0 0 1.4rem; } .lm-login__title { margin: 0; font-size: 1.45rem; font-weight: 700; color: #323a46; letter-spacing: -0.01em; } .lm-login__sub { margin: 0.3rem 0 0; color: #98a6ad; font-size: 0.88rem; } /* Fields. */ body.lm-auth .form-item, body.lm-auth .js-form-item { margin: 0 0 1rem; } body.lm-auth .form-item__label, body.lm-auth label { display: block; margin-bottom: 0.35rem; font-weight: 600; font-size: 0.82rem; color: #323a46; } body.lm-auth input[type="text"], body.lm-auth input[type="email"], body.lm-auth input[type="password"] { width: 100%; box-sizing: border-box; padding: 0.7rem 0.9rem; border: 1px solid #e3e6ef; border-radius: 0.55rem; font-size: 0.95rem; color: #323a46; background: #fff; transition: border-color 0.15s, box-shadow 0.15s; } body.lm-auth input::placeholder { color: #b3bac5; } body.lm-auth input[type="text"]:focus, body.lm-auth input[type="email"]:focus, body.lm-auth input[type="password"]:focus { border-color: #6658dd; box-shadow: 0 0 0 3px rgba(102, 88, 221, 0.16); outline: none; } /* Primary button — full width, indigo. */ body.lm-auth .form-actions { margin: 0.4rem 0 0; } body.lm-auth input[type="submit"], body.lm-auth .button--primary, body.lm-auth .form-actions .button { width: 100%; background: #6658dd !important; color: #fff !important; border: 0 !important; border-radius: 0.55rem !important; padding: 0.8rem 1rem !important; font-weight: 700; font-size: 0.95rem; cursor: pointer; box-shadow: 0 8px 18px rgba(102, 88, 221, 0.28); transition: background 0.15s, transform 0.05s; } body.lm-auth input[type="submit"]:hover, body.lm-auth .button--primary:hover { background: #5546c9 !important; } body.lm-auth input[type="submit"]:active { transform: translateY(1px); } /* Forgot-password / register links. */ body.lm-auth a { color: #6658dd; font-weight: 600; }