@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
:root{--ink:#172033;--muted:#758096;--line:#e8ebf1;--bg:#f6f7fb;--orange:#f28a28;--nav:#111827;--green:#16845b}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif}.auth-wrap{min-height:100vh;display:grid;grid-template-columns:minmax(300px,1fr) minmax(380px,520px);padding:22px;gap:22px}.auth-brand-panel{position:relative;overflow:hidden;border-radius:24px;background:radial-gradient(circle at 80% 10%,rgba(242,138,40,.23),transparent 30%),linear-gradient(145deg,#171d2a,#0d111a 75%);color:#fff;padding:clamp(28px,5vw,66px);display:flex;flex-direction:column;justify-content:space-between;min-height:650px}.brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none;letter-spacing:.16em;font-weight:800}.brand img{width:43px;height:43px;object-fit:contain}.brand small{display:block;font-size:9px;letter-spacing:.18em;color:#b9bfca;font-weight:500;margin-top:4px}.brand-copy{max-width:480px;margin:50px 0}.eyebrow{color:#ffab55;font-size:11px;font-weight:800;letter-spacing:.17em}.brand-copy h1{font:800 clamp(35px,4vw,58px)/1.05 Manrope,sans-serif;letter-spacing:-.055em;margin:14px 0 20px}.brand-copy p{max-width:410px;color:#c7cbd4;line-height:1.8;font-size:15px}.feature-list{display:grid;gap:14px;color:#dce0e7;font-size:13px}.feature-list span{display:flex;align-items:center;gap:10px}.feature-list i{font-style:normal;color:#ffab55}.brand-foot{font-size:11px;color:#aab1be}.auth-card-wrap{display:grid;place-items:center;padding:clamp(12px,3vw,40px)}.auth-card{width:min(420px,100%);animation:fade-up .45s both}.symbol{width:48px;height:48px;object-fit:contain;margin-bottom:28px}.auth-card h2{font:800 30px/1.15 Manrope,sans-serif;letter-spacing:-.045em;margin:0 0 10px}.intro{font-size:13px;color:var(--muted);line-height:1.7;margin:0 0 27px}.field{display:block;margin:0 0 17px}.field span{display:block;font-size:12px;font-weight:700;margin-bottom:8px}.field input{height:47px;width:100%;border:1px solid #dcdfe6;border-radius:10px;background:white;padding:0 13px;font:inherit;font-size:13px;color:var(--ink);outline:none}.field input:focus{border-color:var(--orange);box-shadow:0 0 0 3px #f28a2826}.field small{display:block;font-size:10px;color:var(--muted);line-height:1.6;margin-top:7px}.row-between{display:flex;align-items:center;justify-content:space-between;gap:10px}.row-between .field{flex:1}.link{font-size:12px;font-weight:700;color:#b95c0a;text-decoration:none}.link:hover{text-decoration:underline}.btn{width:100%;height:47px;border:1px solid var(--orange);border-radius:10px;background:var(--orange);color:#181818;font:700 13px 'DM Sans',sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:0 15px;margin-top:7px}.btn:hover{filter:brightness(1.04);box-shadow:0 8px 20px #f28a2826}.message{font-size:12px;line-height:1.6;margin:12px 0 0;color:#b54708}.message.success{color:var(--green)}.switch{text-align:center;margin:23px 0 0;color:var(--muted);font-size:12px}.demo-note{margin-top:25px;border:1px solid #f3d9bc;background:#fff8ef;border-radius:11px;padding:12px;color:#775334;font-size:11px;line-height:1.65}.secure{display:flex;gap:8px;align-items:center;border-top:1px solid var(--line);padding-top:17px;margin-top:26px;font-size:10px;color:#858c99}.secure i{width:7px;height:7px;border-radius:50%;background:#26a269}.password-row{position:relative}.password-row input{padding-right:62px}.show-password{position:absolute;right:8px;top:7px;height:33px;border:0;background:transparent;color:var(--muted);font-size:11px;font-weight:700;cursor:pointer}@keyframes fade-up{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(max-width:850px){.auth-wrap{grid-template-columns:1fr;padding:12px}.auth-brand-panel{min-height:270px;padding:25px}.brand-copy{margin:35px 0 18px}.brand-copy h1{font-size:34px}.brand-copy p{font-size:13px}.feature-list{display:none}.brand-foot{margin-top:18px}.auth-card-wrap{padding:30px 12px}.symbol{margin-bottom:20px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}


/* Client login page: align with the Zyma CRM internal sign-in design. Registration and recovery retain their existing styles. */
.client-login-page{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#111827;background:#f5f4f1;font-size:14px;min-height:100vh;display:grid;place-items:center;padding:32px}
.client-login-page *{box-sizing:border-box}
.client-login-page .auth-shell{width:min(1120px,100%);min-height:680px;display:grid;grid-template-columns:1.03fr .97fr;background:#fff;border:1px solid #e5e1dc;border-radius:24px;overflow:hidden;box-shadow:0 24px 70px rgba(25,22,18,.09);animation:client-shell-in .65s cubic-bezier(.2,.75,.25,1) both}
.client-login-page .auth-story{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:48px;background:#111318;color:#fff;isolation:isolate;overflow:hidden;border-radius:0;min-height:680px}
.client-login-page .auth-story:before,.client-login-page .auth-story:after{content:"";position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
.client-login-page .auth-story:before{width:500px;height:500px;right:-220px;top:-160px;border:1px solid rgba(255,134,23,.25);box-shadow:0 0 0 42px rgba(255,134,23,.035),0 0 0 95px rgba(255,134,23,.025)}
.client-login-page .auth-story:after{width:300px;height:300px;right:-90px;bottom:-160px;background:radial-gradient(circle,rgba(255,134,23,.22),transparent 70%)}
.client-login-page .auth-full-logo{width:min(290px,90%);height:auto;object-fit:contain;object-position:left center}
.client-login-page .story-copy{max-width:420px;margin:72px 0}
.client-login-page .eyebrow{display:block;font-size:10px;font-weight:800;letter-spacing:.18em;color:#d95d00;text-transform:uppercase;margin-bottom:13px}
.client-login-page .auth-story .eyebrow{color:#ff9b36}
.client-login-page .story-copy h1{font-size:clamp(32px,4vw,48px);line-height:1.08;letter-spacing:-.045em;margin:0 0 18px;font-weight:650;font-family:inherit}
.client-login-page .story-copy p{max-width:370px;color:#c6c7cb;font-size:16px;line-height:1.75;margin:0}
.client-login-page .story-foot{display:flex;flex-wrap:wrap;gap:10px;color:#c9c9ce;font-size:11px}
.client-login-page .auth-panel{display:grid;place-items:center;padding:50px 54px;background:#fff}
.client-login-page .auth-panel-inner{width:min(360px,100%);animation:client-content-in .7s .1s both}
.client-login-page .auth-symbol{width:54px;height:54px;object-fit:contain;margin:0 0 35px;display:block}
.client-login-page .auth-panel h2{font-size:29px;letter-spacing:-.04em;line-height:1.15;margin:0 0 10px;font-weight:700;font-family:inherit}
.client-login-page .muted{color:#667085;line-height:1.65;margin:0 0 24px;font-size:13px}
.client-login-page form label{display:block;font-size:12px;font-weight:650;margin:0 0 8px;color:#111827}
.client-login-page .auth-panel input{width:100%;height:47px;border:1px solid #dcd6cf;border-radius:10px;background:#fff;padding:0 13px;color:#111827;outline:none;font:inherit;transition:border-color .2s,box-shadow .2s;margin:0 0 21px}
.client-login-page .auth-panel input:focus{border-color:#ff8617;box-shadow:0 0 0 3px rgba(255,134,23,.13)}
.client-login-page .label-row{display:flex;align-items:center;justify-content:space-between}
.client-login-page .label-row a,.client-login-page .auth-help a{font-size:11px;color:#d95d00;text-decoration:none;font-weight:700;margin-bottom:8px}
.client-login-page .label-row a:hover,.client-login-page .auth-help a:hover{text-decoration:underline}
.client-login-page .password-wrap{position:relative}
.client-login-page .password-wrap input{padding-right:60px}
.client-login-page .show-password{position:absolute;right:8px;top:7px;height:33px;border:0;background:transparent;color:#667085;font-size:11px;font-weight:700;cursor:pointer}
.client-login-page .primary-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:12px;min-height:45px;padding:0 16px;border-radius:10px;border:1px solid #ff8617;background:#ff8617;color:#171717;font:700 13px inherit;cursor:pointer;transition:transform .18s,box-shadow .18s,background .18s;width:100%;margin-top:20px}
.client-login-page .primary-btn:hover{background:#ff982f;box-shadow:0 8px 20px rgba(255,134,23,.2);transform:translateY(-1px)}
.client-login-page .primary-btn:disabled{opacity:.6;cursor:wait;transform:none}
.client-login-page .auth-message{font-size:12px;line-height:1.5;margin-top:10px;color:#d95d00;min-height:0}
.client-login-page .auth-message:empty{display:none}
.client-login-page .auth-message.success{color:#147d55}
.client-login-page .client-demo-banner{padding:10px 12px;background:#f0f8f3;border:1px solid #d8eddf;border-radius:9px;margin:0 0 22px;font-size:11px}
.client-login-page .auth-help{margin:25px 0 0;color:#667085;font-size:12px;line-height:1.7}
.client-login-page .auth-help a{font-size:12px;margin:0}
.client-login-page .auth-secure{display:flex;align-items:center;gap:8px;margin-top:30px;padding-top:18px;border-top:1px solid #efede9;color:#7b7b80;font-size:11px}
.client-login-page .secure-dot{width:7px;height:7px;border-radius:50%;background:#2ca477;box-shadow:0 0 0 4px #e7f5ee;flex:none}
@keyframes client-shell-in{from{opacity:0;transform:translateY(12px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes client-content-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:780px){.client-login-page{padding:14px}.client-login-page .auth-shell{grid-template-columns:1fr;min-height:0}.client-login-page .auth-story{padding:25px;min-height:240px}.client-login-page .auth-full-logo{width:190px}.client-login-page .story-copy{margin:35px 0 20px}.client-login-page .story-copy h1{font-size:32px}.client-login-page .story-copy p{font-size:13px}.client-login-page .story-foot{font-size:10px}.client-login-page .auth-panel{padding:36px 25px}.client-login-page .auth-symbol{margin-bottom:22px}}
@media(prefers-reduced-motion:reduce){.client-login-page *, .client-login-page *:before,.client-login-page *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Client account activation mirrors the main client login screen. */
.client-register-page .auth-panel{align-items:start;padding-top:42px;padding-bottom:42px}
.client-register-page .register-panel-inner{width:min(390px,100%)}
.client-register-page .auth-symbol{margin-bottom:24px}
.client-register-page .muted{margin-bottom:19px}
.client-register-page .auth-panel form label{display:block;font-size:12px;font-weight:650;margin:0 0 7px;color:#111827}
.client-register-page .auth-panel input{width:100%;height:43px;border:1px solid #dcd6cf;border-radius:10px;background:#fff;padding:0 12px;color:#111827;outline:none;font:inherit;font-size:13px;transition:border-color .2s,box-shadow .2s;margin:0 0 13px}
.client-register-page .auth-panel input:focus{border-color:#ff8617;box-shadow:0 0 0 3px rgba(255,134,23,.13)}
.client-register-page .password-wrap input{padding-right:60px}
.client-register-page .password-wrap .show-password{top:5px}
.client-register-page .field-hint{font-size:10px;color:#7b7b80;line-height:1.5;margin:-7px 0 13px}
.client-register-page .primary-btn{margin-top:12px}
.client-register-page .auth-help{margin-top:19px}
.client-register-page .auth-secure{margin-top:22px}
.secure-note{margin-top:25px;padding:12px 14px;border:1px solid #e8e4dd;border-radius:10px;background:#faf9f7;color:#667085;font-size:11px;line-height:1.65}
@media(max-width:780px){.client-register-page .auth-panel{padding-top:30px;padding-bottom:30px}.client-register-page .auth-symbol{margin-bottom:18px}}
