@font-face{font-family:Cairo;src:url('../fonts/cairo/Cairo-Regular.woff2') format('woff2');font-weight:400;font-display:swap}@font-face{font-family:Cairo;src:url('../fonts/cairo/Cairo-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
:root{--green:#075e54;--green2:#0a776b;--lime:#36c989;--ink:#182a2a;--muted:#6b7978;--line:#dfe8e6;--bg:#f5f8f7;--danger:#b42318;--warning:#9a6700;--success:#067647;--radius:22px;--shadow:0 24px 70px rgba(12,60,54,.14)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Cairo,Arial,sans-serif;color:var(--ink);background:var(--bg)}body{min-height:100vh}.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(420px,46%) 1fr;direction:ltr}.auth-brand-panel{direction:rtl;position:relative;overflow:hidden;background:linear-gradient(145deg,#064d46 0%,#087166 48%,#06463f 100%);color:#fff;padding:58px clamp(42px,6vw,92px);display:flex;flex-direction:column;justify-content:space-between}.auth-brand-panel:before,.auth-brand-panel:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%;width:520px;height:520px;left:-180px;top:130px}.auth-brand-panel:after{width:760px;height:760px;left:-390px;top:20px}.auth-brand{position:relative;z-index:2;display:flex;align-items:center;gap:18px;text-decoration:none;color:white}.auth-brand img{width:105px;max-height:62px;object-fit:contain}.auth-brand strong{display:block;font-size:20px}.auth-brand span{font-size:12px;opacity:.8}.auth-brand-copy{position:relative;z-index:2;max-width:580px;margin:auto 0}.auth-kicker{display:inline-block;font-size:12px;letter-spacing:2px;padding:7px 12px;border:1px solid rgba(255,255,255,.28);border-radius:999px;margin-bottom:18px}.auth-brand-copy h2{font-size:clamp(34px,4vw,58px);line-height:1.35;margin:0 0 18px}.auth-brand-copy p{font-size:16px;line-height:2;opacity:.86;max-width:550px}.auth-trust-row{position:relative;z-index:2;display:flex;gap:10px;flex-wrap:wrap}.auth-trust-row span{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);padding:8px 12px;border-radius:12px;font-size:12px}.auth-main{direction:rtl;padding:40px clamp(24px,5vw,82px);display:flex;flex-direction:column;justify-content:center}.auth-card{width:min(100%,560px);margin:auto;background:#fff;border:1px solid rgba(7,94,84,.08);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(28px,4vw,48px)}.auth-mobile-brand{display:none}.auth-heading .eyebrow{font-size:12px;color:var(--green2);font-weight:700}.auth-heading h1{font-size:32px;margin:6px 0 8px}.auth-heading p{margin:0 0 28px;color:var(--muted);line-height:1.85}.auth-form{display:grid;gap:18px}.field{display:grid;gap:8px;font-size:13px;font-weight:700}.field input{width:100%;height:52px;border:1px solid var(--line);border-radius:13px;padding:0 15px;font-family:inherit;font-size:14px;outline:none;background:#fbfdfc}.field input:focus{border-color:#0b8f7d;box-shadow:0 0 0 4px rgba(11,143,125,.11);background:#fff}.password-wrap{position:relative}.password-wrap input{padding-left:72px}.password-wrap button{position:absolute;left:10px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--green);font-family:inherit;font-weight:700;cursor:pointer;padding:8px}.auth-form-row{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:12px;color:#7a8887}.auth-form-row a{color:var(--green);font-weight:700;text-decoration:none}.auth-primary,.auth-secondary,.auth-danger{width:100%;min-height:52px;border-radius:13px;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;text-decoration:none;display:flex;align-items:center;justify-content:center}.auth-primary{border:0;background:linear-gradient(90deg,var(--green),var(--green2));color:#fff;box-shadow:0 10px 26px rgba(7,94,84,.18)}.auth-primary:hover{filter:brightness(1.04);transform:translateY(-1px)}.auth-secondary{border:1px solid var(--line);color:var(--ink);background:#fff}.auth-danger{border:1px solid #f0c8c4;background:#fff5f4;color:var(--danger);margin-top:20px}.auth-separator{display:flex;align-items:center;gap:12px;color:#9aa6a5;font-size:12px;margin:22px 0}.auth-separator:before,.auth-separator:after{content:"";height:1px;background:var(--line);flex:1}.auth-alert{padding:13px 15px;border-radius:12px;font-size:13px;line-height:1.7;margin-bottom:18px;border:1px solid}.auth-alert--danger{background:#fff5f4;color:var(--danger);border-color:#f4cbc7}.auth-alert--warning{background:#fff9e8;color:var(--warning);border-color:#f2df9b}.auth-alert--success{background:#ecfdf3;color:var(--success);border-color:#abefc6}.auth-security-note{margin-top:22px;padding:16px 18px;border-radius:14px;background:#f5faf8;border:1px solid #dcece8}.auth-security-note strong{font-size:13px;color:var(--green)}.auth-security-note p{margin:5px 0 0;color:#657472;font-size:12px;line-height:1.8}.password-policy{display:grid;grid-template-columns:1fr 1fr;gap:8px}.password-policy span{font-size:11px;background:#f5f8f7;border:1px solid var(--line);padding:7px 9px;border-radius:9px;color:#61706e}.auth-footer{text-align:center;color:#8a9796;font-size:11px;margin:24px auto 0}.auth-link-button{margin-top:12px}.auth-profile-card{display:flex;align-items:center;gap:14px;background:#f5faf8;border:1px solid #dcece8;border-radius:16px;padding:16px}.auth-profile-card .avatar{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-size:20px;font-weight:700}.auth-profile-card div:nth-child(2){flex:1}.auth-profile-card strong,.auth-profile-card span{display:block}.auth-profile-card span{font-size:12px;color:var(--muted)}.auth-profile-card em{font-style:normal;font-size:11px;padding:7px 10px;border-radius:999px;background:#e6f7f2;color:var(--green);font-weight:700}.session-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.session-grid>div{padding:13px;border:1px solid var(--line);border-radius:12px}.session-grid span,.session-grid strong{display:block}.session-grid span{font-size:11px;color:var(--muted)}.session-grid strong{font-size:12px;margin-top:4px}.wave1-status{display:grid;grid-template-columns:1fr 1fr;gap:8px}.wave1-status>div{display:flex;align-items:center;gap:8px;padding:9px 10px;background:#fbfdfc;border:1px solid var(--line);border-radius:10px}.wave1-status span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#dff7ed;color:var(--success);font-size:12px}.wave1-status p{margin:0;font-size:11px}.wave1-status strong{color:var(--green)}
@media(max-width:980px){.auth-shell{grid-template-columns:1fr}.auth-brand-panel{display:none}.auth-main{min-height:100vh;padding:24px}.auth-card{margin:auto}.auth-mobile-brand{display:flex;align-items:center;gap:12px;margin-bottom:26px}.auth-mobile-brand img{width:72px;height:42px;object-fit:contain}.auth-mobile-brand span{font-size:13px;font-weight:700;color:var(--green)}}@media(max-width:560px){.auth-card{padding:24px;border-radius:18px;box-shadow:0 14px 36px rgba(12,60,54,.10)}.auth-heading h1{font-size:27px}.auth-form-row{align-items:flex-start;flex-direction:column}.password-policy,.session-grid,.wave1-status{grid-template-columns:1fr}.auth-main{padding:14px}.auth-footer{padding-bottom:10px}}


/* Wave 1 — Approved Login UI — 2026-08-09 (presentation layer only) */
@media (min-width:981px){
  .auth-brand-panel{padding:44px 54px 48px;justify-content:flex-start;background:linear-gradient(145deg,#003f3b 0%,#00665f 52%,#004b46 100%)}
  .auth-brand{align-self:flex-end;gap:16px;margin:0 0 0 auto;transform:none;border-right:2px solid rgba(255,255,255,.82);padding-right:20px;min-width:310px}
  .auth-brand img{width:122px;height:82px;max-height:none;object-fit:contain;filter:none}
  .auth-brand strong{font-size:17px;line-height:1.5;margin-bottom:4px}
  .auth-brand span{font-size:11px;line-height:1.65;opacity:.95;white-space:nowrap}
  .auth-brand-copy{width:100%;max-width:610px;margin:auto auto;text-align:center;transform:translateY(-8px)}
  .auth-brand-copy h2{font-size:clamp(40px,3.25vw,56px);line-height:1.45;margin:0;font-weight:400;letter-spacing:-.5px}
  .auth-copy-rule{display:block;width:34px;height:3px;border-radius:10px;background:#00a79d;margin:22px auto 24px}
  .auth-brand-copy p{font-size:15px;line-height:2.05;max-width:590px;margin:0 auto;opacity:.96;font-weight:700}
  .auth-main{padding:42px clamp(38px,5vw,82px)}
  .auth-card{width:min(100%,550px);padding:46px 42px 40px}
  .auth-heading{text-align:right}
  .auth-heading h1{font-size:31px;color:#075e54;margin:0 0 8px}
  .auth-heading p{text-align:right;margin:0 0 30px}
}
