/* VIP 24.8 — shared authentication presentation; no authentication logic. */
@font-face{font-family:'VIP Arabic';src:url('fonts/NotoSansArabic-Regular.ttf') format('truetype');font-weight:400 500;font-display:swap}
@font-face{font-family:'VIP Arabic';src:url('fonts/NotoSansArabic-Bold.ttf') format('truetype');font-weight:600 900;font-display:swap}
.auth-page,.auth-workspace{--auth-bg:#f2f8f5;--auth-surface:#fff;--auth-text:#183a31;--auth-muted:#677c74;--auth-line:#dce8e1;--auth-soft:#f5f9f6;--auth-green:#18734f;--auth-green-hover:#105c3e;--auth-focus:#4b997b;--auth-input:#fff;--auth-error-bg:#fff0ef;--auth-error-text:#9a302d;--auth-success-bg:#edf7ef;--auth-success-text:#236844;color:var(--auth-text);font-family:var(--ui-font,'VIP Arabic',Tahoma,Arial,sans-serif);font-size:calc(14px * var(--ui-font-scale,1));line-height:1.8}
.auth-page,.auth-page *,.auth-workspace,.auth-workspace *{box-sizing:border-box}
.auth-page{margin:0;min-height:100vh;min-height:100dvh;display:grid;grid-template-rows:auto 1fr auto;background:var(--auth-bg)}
.auth-header{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:88px;padding:18px clamp(24px,6vw,88px);background:var(--auth-surface);border-bottom:1px solid var(--auth-line)}
.auth-brand-link{display:flex;align-items:center;gap:13px;min-width:0;max-width:75%;text-decoration:none;color:var(--auth-text);font-weight:700;font-size:calc(21px * var(--ui-font-scale,1));line-height:1.65}
.auth-brand-link>span{min-width:0;overflow-wrap:anywhere}
.auth-brand-link small{display:block;color:var(--auth-muted);font-size:calc(10px * var(--ui-font-scale,1));font-weight:400}
.auth-brand-link>img.company-logo{display:block;width:48px;height:48px;max-width:48px;object-fit:contain;flex:0 0 48px;background:#fff;border-radius:8px;padding:3px}
.auth-header-label{font-size:calc(12px * var(--ui-font-scale,1));color:var(--auth-muted);white-space:nowrap}
.auth-main{position:relative;isolation:isolate;display:grid;place-items:center;overflow:hidden;padding:64px 24px;outline:none}
.auth-main::before,.auth-main::after{content:'';position:absolute;z-index:-1;pointer-events:none;width:580px;height:580px;border:1px solid #cfe3d780;border-radius:50%;box-shadow:0 0 0 64px #e4f0e54d,0 0 0 128px #e4f0e533}
.auth-main::before{inset-inline-start:-425px;top:5%}
.auth-main::after{inset-inline-end:-435px;bottom:-200px;transform:scale(1.1)}
.auth-card{position:relative;width:min(460px,100%);padding:38px 38px 30px;border:1px solid var(--auth-line);border-radius:18px;background:var(--auth-surface);box-shadow:0 10px 38px #143a2610}
.auth-heading{margin-bottom:28px}
.auth-heading .auth-eyebrow{display:block;margin-bottom:5px;color:var(--auth-green);font-size:calc(12px * var(--ui-font-scale,1));font-weight:700}
.auth-card .auth-heading :is(h1,h2){margin:0;color:var(--auth-text);font-size:calc(26px * var(--ui-font-scale,1));line-height:1.6;font-weight:700;letter-spacing:-.4px}
.auth-card .auth-heading p{margin:9px 0 0;color:var(--auth-muted);font-size:calc(12px * var(--ui-font-scale,1));line-height:1.9}
.auth-card .auth-form{display:grid;gap:19px;margin:0;padding:0}
.auth-card .auth-field{min-width:0}
.auth-card .auth-field label{display:block;margin:0 0 8px;color:var(--auth-text);font-weight:700;font-size:calc(13px * var(--ui-font-scale,1))}
.auth-card .auth-field input{display:block;width:100%;min-height:52px;margin:0;padding:12px 15px;border:1px solid var(--auth-line);border-radius:8px;background:var(--auth-input);color:var(--auth-text);font-family:inherit;font-size:calc(14px * var(--ui-font-scale,1));font-weight:400;line-height:1.6;box-shadow:none;outline:none}
.auth-card .auth-field input::placeholder{color:var(--auth-muted);opacity:.75;font-size:calc(12px * var(--ui-font-scale,1))}
.auth-card .auth-field input:focus{border-color:var(--auth-focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--auth-focus) 14%,transparent)}
.auth-password-field{position:relative}
.auth-card .auth-password-field input{padding-inline-end:70px}
.auth-card .auth-password-field button{position:absolute;inset-inline-end:8px;top:5px;min-width:50px;min-height:42px;padding:5px 6px;border:0;border-radius:5px;background:transparent;color:var(--auth-green);cursor:pointer;font:inherit;font-size:calc(11px * var(--ui-font-scale,1));font-weight:700}
.auth-card .auth-forgot{justify-self:end;margin-top:-6px;font-size:calc(12px * var(--ui-font-scale,1));color:var(--auth-green);font-weight:700;text-decoration:none}
.auth-card .auth-submit{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;min-height:52px;margin:0;padding:12px 18px;border:1px solid transparent;border-radius:8px;background:var(--auth-green);color:#fff;font-family:inherit;font-size:calc(14px * var(--ui-font-scale,1));font-weight:700;line-height:1.7;text-align:center;text-decoration:none;cursor:pointer;box-shadow:none}
.auth-card .auth-submit:hover{background:var(--auth-green-hover);color:#fff}
.auth-card .auth-submit span{font-family:Arial,sans-serif;font-size:23px;line-height:1}
.auth-card .auth-security-note{display:flex;align-items:flex-start;justify-content:center;gap:8px;margin:25px 0 0;padding-top:22px;border-top:1px solid var(--auth-line);color:var(--auth-muted);font-size:calc(10px * var(--ui-font-scale,1));line-height:1.9;text-align:center}
.auth-security-note svg{width:15px;height:18px;flex:0 0 15px;margin-top:1px;color:var(--auth-green)}
.auth-footer{padding:14px 24px 24px;color:var(--auth-muted);font-size:calc(10px * var(--ui-font-scale,1));text-align:center}
.auth-footer span{padding-inline:8px}
.auth-card .auth-info,.auth-card .auth-account{margin:0 0 20px;padding:14px 16px;border:1px solid var(--auth-line);border-radius:8px;background:var(--auth-soft);color:var(--auth-text);font-size:calc(12px * var(--ui-font-scale,1));line-height:1.9}
.auth-card .auth-info p{margin:0}
.auth-card .auth-help{margin:0 0 24px;color:var(--auth-muted);font-size:calc(12px * var(--ui-font-scale,1));line-height:1.9}
.auth-card .auth-field-hint{display:block;margin:8px 0 0;color:var(--auth-muted);font-size:calc(11px * var(--ui-font-scale,1))}
.auth-card .auth-otp-input{font-size:calc(23px * var(--ui-font-scale,1));letter-spacing:.4em;text-align:center;padding-inline-start:calc(15px + .4em)}
.auth-card .auth-resend{display:grid;justify-items:center;gap:2px;margin:24px 0 0}
.auth-card .auth-text-button{min-height:40px;padding:4px 9px;border:0;border-radius:5px;background:transparent;color:var(--auth-green);cursor:pointer;font:inherit;font-size:calc(12px * var(--ui-font-scale,1));font-weight:700}
.auth-card .auth-resend .auth-field-hint{margin:0}
.auth-card .auth-back-link{display:block;margin:22px 0 0;color:var(--auth-muted);text-align:center;font-size:calc(12px * var(--ui-font-scale,1));text-decoration:none}
.auth-card :is(.auth-forgot,.auth-back-link,.auth-text-button):hover{text-decoration:underline;text-underline-offset:4px}
.auth-messages{display:grid;gap:10px;margin-bottom:22px}
.auth-page .message{margin:0;padding:12px 14px;border:1px solid var(--auth-line);border-radius:8px;background:var(--auth-success-bg);color:var(--auth-success-text);font-size:calc(12px * var(--ui-font-scale,1));line-height:1.8}
.auth-page .message.error{background:var(--auth-error-bg);color:var(--auth-error-text);border-color:color-mix(in srgb,var(--auth-error-text) 18%,transparent)}
.auth-page .message.warning{background:var(--auth-soft);color:var(--auth-text)}
.auth-page :is(a,button):focus-visible,.auth-workspace :is(a,button):focus-visible{outline:3px solid var(--auth-focus);outline-offset:4px}
.auth-skip{position:absolute;z-index:10;inset-inline-start:20px;top:-100px;padding:10px 16px;border-radius:6px;background:var(--auth-green);color:white;font-weight:700}
.auth-skip:focus{top:12px}
.auth-workspace{display:grid;place-items:start center;padding:16px 0 32px}
.auth-workspace .auth-card{width:min(520px,100%)}
.vip-workspace .auth-workspace .auth-card .auth-heading h2{font-size:calc(26px * var(--ui-font-scale,1));line-height:1.6}
.vip-workspace .auth-workspace .auth-card .auth-field input{min-height:52px!important;padding:12px 15px;background:var(--auth-input);color:var(--auth-text);border-color:var(--auth-line)}
.vip-workspace .auth-workspace .auth-card .auth-submit{min-height:52px;padding:12px 18px;font-size:calc(14px * var(--ui-font-scale,1));font-weight:700}
.auth-card .auth-account{display:grid;gap:6px}
.auth-account>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.auth-account dt{color:var(--auth-muted);flex-shrink:0}
.auth-account dd{margin:0;font-weight:700;text-align:end;overflow-wrap:anywhere;min-width:0}
.auth-card .auth-form>.auth-info{margin:0}
html[data-theme=dark] :is(.auth-page,.auth-workspace){--auth-bg:#12241e;--auth-surface:#1b3028;--auth-text:#edf5ef;--auth-muted:#acc3b6;--auth-line:#3a5145;--auth-soft:#243b30;--auth-green:#246d50;--auth-green-hover:#1b5c42;--auth-focus:#8fc9a8;--auth-input:#182b22;--auth-error-bg:#482d30;--auth-error-text:#ffc8c8;--auth-success-bg:#243e30;--auth-success-text:#c4ead1;color-scheme:dark}
html[data-theme=dark] .auth-card :is(.auth-eyebrow,.auth-forgot,.auth-text-button,.auth-password-field button,.auth-security-note svg){color:#a3d9b8}
html[data-theme=dark] .auth-main::before,html[data-theme=dark] .auth-main::after{border-color:#37564566;box-shadow:0 0 0 64px #27443133,0 0 0 128px #27443122}
@media(prefers-color-scheme:dark){html:not([data-theme]) .auth-page{--auth-bg:#12241e;--auth-surface:#1b3028;--auth-text:#edf5ef;--auth-muted:#acc3b6;--auth-line:#3a5145;--auth-soft:#243b30;--auth-green:#246d50;--auth-green-hover:#1b5c42;--auth-focus:#8fc9a8;--auth-input:#182b22;--auth-error-bg:#482d30;--auth-error-text:#ffc8c8;--auth-success-bg:#243e30;--auth-success-text:#c4ead1;color-scheme:dark}html:not([data-theme]) .auth-page .auth-card :is(.auth-eyebrow,.auth-forgot,.auth-text-button,.auth-password-field button,.auth-security-note svg){color:#a3d9b8}html:not([data-theme]) .auth-main::before,html:not([data-theme]) .auth-main::after{border-color:#37564566;box-shadow:0 0 0 64px #27443133,0 0 0 128px #27443122}}
@media(max-width:600px){.auth-header{min-height:78px;padding:15px 22px;gap:12px}.auth-brand-link{max-width:100%;font-size:calc(18px * var(--ui-font-scale,1))}.auth-header-label{display:none}.auth-main{padding:34px 18px}.auth-card{padding:29px 24px 25px;border-radius:14px}.auth-heading{margin-bottom:24px}.auth-card .auth-heading :is(h1,h2){font-size:calc(24px * var(--ui-font-scale,1))}.auth-card .auth-field input{font-size:max(16px,calc(14px * var(--ui-font-scale,1)))}.auth-card .auth-otp-input{font-size:calc(23px * var(--ui-font-scale,1))}.auth-footer{padding-bottom:18px}.auth-workspace{padding-top:0}.auth-workspace .auth-card{padding:25px 20px}.auth-account>div{flex-wrap:wrap;gap:0 12px}.auth-main::before{inset-inline-start:-510px}}
@media(max-width:360px){.auth-main{padding-inline:12px}.auth-card{padding-inline:20px}.auth-card .auth-heading :is(h1,h2){font-size:calc(22px * var(--ui-font-scale,1))}}
@media(max-width:600px){.vip-workspace .auth-workspace .auth-card .auth-heading h2{font-size:calc(24px * var(--ui-font-scale,1))}.vip-workspace .auth-workspace .auth-card .auth-field input{font-size:max(16px,calc(14px * var(--ui-font-scale,1)))!important}}
@media(prefers-reduced-motion:reduce){.auth-page *,.auth-workspace *{scroll-behavior:auto}}