/* =========================================================================================
   Okta SSO — login screen styles (self-contained)
   -----------------------------------------------------------------------------------------
   Scoped ENTIRELY to #okta / .okta-* / #lgn .okta-ssobtn. Does NOT reuse the theme classes
   (.email_log/.sub_log/.login_txt/.row/.microsoft-login), which bleed text-align/padding/
   font-size into children. A scoped reset neutralizes inherited theme rules INSIDE #okta only,
   so nothing outside the section is affected. Text uses <span> (not <p>) so `.login_form p`
   cannot match at all.
   Loaded by login.php via <link ... css/okta-sso.css>. Keep all Okta login CSS here.
   ========================================================================================= */

/* ---- Section container + scoped reset ---- */
#okta{margin:0;padding:0 32px 30px;text-align:center;box-sizing:border-box;}
#okta *{box-sizing:border-box;}
#okta .okta-title,#okta .okta-lead,#okta .okta-label,#okta .okta-alert-title,
#okta .okta-alert-body,#okta .okta-note span,#okta .okta-back{margin:0;padding:0;width:auto;font-weight:400;line-height:1.45;}

/* ---- Back to login ---- */
#okta .okta-backrow{text-align:left;margin:14px 0 2px;}
#okta .okta-back{display:inline-flex;align-items:center;gap:6px;margin-top:20px;color:#4a4a4a;font-weight:600;font-size:15px;cursor:pointer;text-decoration:none;}
#okta .okta-back:hover{color:#2b2f88;}
#okta .okta-back svg{width:16px;height:16px;}

/* ---- Badge + headings ---- */
#okta .okta-badge{width:64px;height:64px;border-radius:50%;background:#e8f1fc;display:flex;align-items:center;justify-content:center;margin:16px auto 18px;}
#okta .okta-title{display:block;text-align:center;font-size:32px;font-weight:600;color:#2b2f33;margin:0 0 12px;}
#okta .okta-lead{display:block;text-align:center;font-size:15px;color:#5a6270;max-width:380px;margin:0 auto 24px;}

/* ---- Field ---- */
#okta .okta-field{max-width:390px;margin:0 auto;text-align:left;}
#okta .okta-label{display:block;text-align:left;font-size:14px;font-weight:700;color:#2b2f33;margin:0 0 8px;}
#okta .okta-input{display:block;width:100%;height:48px;margin:0;padding:0 16px;font-size:15px;color:#2b2f33;background:#f7f8fa;border:1px solid #d9dee5;border-radius:8px;box-shadow:none;outline:none;transition:border-color .15s,background .15s;}
#okta .okta-input::placeholder{color:#9aa2ad;}
#okta .okta-input:focus{border-color:#0F6FDE;background:#fff;}
#okta .okta-input.okta-input-error{border-color:#e0736c;background:#fdf6f6;}

/* ---- Alert (invalid email + server error) ---- */
#okta .okta-alert{display:flex;gap:12px;text-align:left;border-radius:10px;padding:16px;margin:14px 0 0;}
#okta .okta-alert svg{flex:0 0 auto;width:20px;height:20px;margin-top:2px;}
#okta .okta-alert-title{display:block;text-align:left;font-size:15px;font-weight:700;margin:0 0 6px;}
#okta .okta-alert-body{display:block;text-align:left;font-size:13px;line-height:1.5;margin:0;}
#okta .okta-alert-danger{background:#fdecec;border:1px solid #f5c2c2;}
#okta .okta-alert-danger .okta-alert-title{color:#b3241f;}
#okta .okta-alert-danger .okta-alert-body{color:#8a4b48;}

/* ---- Continue button ---- */
#okta .okta-continue{display:block;width:100%;max-width:390px;height:52px;margin:22px auto 0;padding:0;border:0;border-radius:8px;background:#2f3b7c;color:#fff;font-size:17px;font-weight:600;box-shadow:none;outline:none;cursor:pointer;transition:background .2s;}
#okta .okta-continue:hover{background:#28336b;}

/* ---- Info note ---- */
#okta .okta-note{display:flex;gap:10px;text-align:left;max-width:390px;margin:22px auto 0;background:#f2f4f7;border-radius:10px;padding:14px 16px;}
#okta .okta-note svg{flex:0 0 auto;width:18px;height:18px;margin-top:1px;}
#okta .okta-note span{display:block;text-align:left;font-size:13px;line-height:1.45;color:#5a6270;}

/* ---- "Login with Okta" button on the login screen (does NOT reuse .microsoft-login);
        own shade so the currentColor "O" stays visible on hover ---- */
#lgn .okta-ssobtn{display:flex;align-items:center;justify-content:center;width:100%;height:50px;margin:10px 0 6px;padding:10px;border:1px solid #0F6FDE;border-radius:4px;background:#fff;color:#0F6FDE;font-size:16px;cursor:pointer;transition:background-color .3s,color .3s;}
#lgn .okta-ssobtn svg{width:22px;height:22px;margin-right:15px;}
#lgn .okta-ssobtn:hover{background:#0F6FDE;color:#fff;}
