:root {
    --auth-ink:#0c1b18;
    --auth-muted:#697870;
    --auth-line:#dfe7e3;
    --auth-paper:#f4f7f4;
    --auth-white:#fff;
    --auth-brand:#087f5b;
    --auth-brand-dark:#056247;
    --auth-lime:#c8f36a;
    --auth-navy:#11251f;
}
* { box-sizing:border-box; }
body.auth-new { min-height:100vh; margin:0; color:var(--auth-ink); background:var(--auth-paper); font-family:Tajawal,system-ui,sans-serif; }
.auth-page { min-height:100vh; padding:22px; }
.auth-frame { width:min(1220px,100%); min-height:calc(100vh - 44px); margin:auto; overflow:hidden; background:var(--auth-white); border:1px solid var(--auth-line); border-radius:26px; box-shadow:0 24px 70px rgba(17,37,31,.08); }
.auth-nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:0 30px; border-bottom:1px solid var(--auth-line); }
.auth-brand-new { display:flex; align-items:center; gap:11px; color:var(--auth-ink); text-decoration:none; }
.auth-brand-new:hover { color:var(--auth-ink); }
.auth-brand-mark-new { width:42px; height:42px; display:grid; place-items:center; color:#fff; background:var(--auth-brand); border-radius:13px 13px 13px 4px; box-shadow:0 8px 20px rgba(8,127,91,.2); }
[dir="ltr"] .auth-brand-mark-new { border-radius:13px 13px 4px 13px; }
.auth-brand-copy strong,.auth-brand-copy small { display:block; }
.auth-brand-copy strong { font-size:1.02rem; font-weight:900; }
.auth-brand-copy small { margin-top:3px; color:var(--auth-muted); font-size:.67rem; font-weight:700; }
.auth-nav-actions { display:flex; align-items:center; gap:8px; }
.auth-nav-button { min-width:39px; height:39px; display:grid; place-items:center; padding:0 11px; color:var(--auth-ink); background:var(--auth-white); border:1px solid var(--auth-line); border-radius:11px; font-size:.76rem; font-weight:900; text-decoration:none; }
.auth-nav-button:hover { color:var(--auth-brand); border-color:var(--auth-brand); }
.auth-home-link { display:flex; align-items:center; gap:7px; width:auto; }
.auth-grid-new { display:grid; grid-template-columns:minmax(0,1fr) minmax(420px,.82fr); min-height:calc(100vh - 121px); }
.auth-main { display:flex; align-items:center; justify-content:center; padding:54px 70px; }
.auth-form-box { width:min(465px,100%); }
.auth-form-box.wide { width:min(720px,100%); }
.auth-kicker { display:inline-flex; align-items:center; gap:7px; padding:7px 11px; color:var(--auth-brand); background:#eaf8f3; border-radius:999px; font-size:.72rem; font-weight:900; }
.auth-kicker i { font-size:.65rem; }
.auth-heading { margin:17px 0 9px; font-size:clamp(2rem,3.2vw,3.15rem); line-height:1.18; font-weight:900; letter-spacing:-.025em; }
.auth-copy { margin:0 0 28px; color:var(--auth-muted); line-height:1.75; font-size:.92rem; }
.auth-fields { display:grid; gap:14px; }
.auth-fields.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.auth-field { display:grid; gap:7px; }
.auth-field.full { grid-column:1/-1; }
.auth-field label { color:#384a43; font-size:.76rem; font-weight:900; }
.auth-control { position:relative; }
.auth-control > i { position:absolute; inset-inline-start:15px; top:50%; transform:translateY(-50%); color:#8a9892; }
.auth-control input,.auth-control select,.auth-control textarea { width:100%; min-height:52px; padding:0 44px 0 14px; color:var(--auth-ink); background:var(--auth-white); border:1px solid var(--auth-line); border-radius:13px; outline:0; font-family:inherit; font-size:.87rem; transition:.2s; }
[dir="ltr"] .auth-control input,[dir="ltr"] .auth-control select,[dir="ltr"] .auth-control textarea { padding:0 14px 0 44px; }
.auth-control textarea { min-height:88px; padding-top:14px; resize:vertical; }
.auth-control input:focus,.auth-control select:focus,.auth-control textarea:focus { border-color:var(--auth-brand); box-shadow:0 0 0 4px rgba(8,127,91,.09); }
.password-toggle { position:absolute; inset-inline-end:8px; top:50%; transform:translateY(-50%); width:38px; height:38px; display:grid; place-items:center; color:#7c8b84; background:transparent; border:0; }
.auth-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:3px 0 2px; font-size:.76rem; }
.auth-check-new { display:flex; align-items:flex-start; gap:8px; color:var(--auth-muted); line-height:1.55; }
.auth-check-new input { accent-color:var(--auth-brand); margin-top:3px; }
.auth-link { color:var(--auth-brand); font-weight:900; text-decoration:none; }
.auth-link:hover { color:var(--auth-brand-dark); }
.auth-submit { width:100%; min-height:54px; display:flex; align-items:center; justify-content:center; gap:8px; margin-top:5px; color:#fff; background:var(--auth-brand); border:0; border-radius:13px; font-family:inherit; font-weight:900; box-shadow:0 12px 25px rgba(8,127,91,.18); transition:.2s; }
.auth-submit:hover { color:#fff; background:var(--auth-brand-dark); transform:translateY(-1px); }
.auth-secondary { width:100%; min-height:49px; display:flex; align-items:center; justify-content:center; gap:7px; margin-top:10px; color:var(--auth-ink); background:var(--auth-white); border:1px solid var(--auth-line); border-radius:13px; font-size:.82rem; font-weight:900; text-decoration:none; }
.auth-secondary:hover { color:var(--auth-brand); border-color:var(--auth-brand); }
.auth-switch-line { margin-top:20px; color:var(--auth-muted); font-size:.8rem; text-align:center; }
.auth-alert-new { display:flex; align-items:flex-start; gap:9px; margin-bottom:17px; padding:13px 14px; border-radius:12px; font-size:.8rem; line-height:1.6; }
.auth-alert-new ul { margin:0; padding-inline-start:17px; }
.auth-alert-new.error { color:#972f42; background:#fff0f2; border:1px solid #ffd3db; }
.auth-alert-new.success { color:#087052; background:#e9f9f3; border:1px solid #c5ecde; }
.auth-aside { position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; padding:52px; color:#fff; background:var(--auth-navy); }
.auth-aside::before { content:""; position:absolute; width:400px; height:400px; inset-inline-end:-180px; top:-170px; border:75px solid rgba(200,243,106,.09); border-radius:50%; }
.auth-aside::after { content:""; position:absolute; width:180px; height:180px; inset-inline-start:-75px; bottom:-80px; background:var(--auth-lime); border-radius:50%; opacity:.85; }
.auth-aside-content { position:relative; z-index:1; }
.auth-aside-badge { display:inline-flex; align-items:center; gap:8px; color:var(--auth-lime); font-size:.76rem; font-weight:900; }
.auth-aside h2 { max-width:490px; margin:18px 0 13px; font-size:clamp(2.2rem,3.5vw,3.8rem); line-height:1.15; font-weight:900; }
.auth-aside > .auth-aside-content > p { max-width:480px; color:#b8c7c1; line-height:1.8; }
.auth-service-list { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:32px; }
.auth-service { display:flex; align-items:center; gap:10px; padding:13px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.09); border-radius:13px; font-size:.76rem; font-weight:800; }
.auth-service i { color:var(--auth-lime); }
.auth-contact-new { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:8px; margin-top:32px; }
.auth-contact-new a { display:flex; align-items:center; gap:7px; padding:9px 11px; color:#dce7e3; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:10px; font-size:.7rem; font-weight:800; text-decoration:none; }
.auth-contact-new a:hover { color:var(--auth-lime); }
.auth-selector { padding:58px 70px 70px; }
.auth-selector-head { max-width:680px; margin:0 auto 36px; text-align:center; }
.auth-selector-head .auth-kicker { margin-bottom:14px; }
.auth-selector-head h1 { margin:0 0 10px; font-size:clamp(2.1rem,4vw,3.5rem); font-weight:900; }
.auth-selector-head p { margin:0; color:var(--auth-muted); }
.portal-grid-new { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:950px; margin:auto; }
.portal-card-new { position:relative; min-height:245px; padding:26px; color:var(--auth-ink); background:var(--auth-white); border:1px solid var(--auth-line); border-radius:19px; text-decoration:none; transition:.22s; }
.portal-card-new:hover { color:var(--auth-ink); border-color:#b5d7ca; box-shadow:0 18px 40px rgba(17,37,31,.08); transform:translateY(-4px); }
.portal-icon-new { width:50px; height:50px; display:grid; place-items:center; margin-bottom:28px; color:var(--auth-brand); background:#e6f6f0; border-radius:14px; font-size:1.2rem; }
.portal-card-new h2 { margin:0 0 9px; font-size:1.06rem; font-weight:900; }
.portal-card-new p { margin:0; color:var(--auth-muted); font-size:.78rem; line-height:1.75; }
.portal-card-new > i { position:absolute; inset-inline-end:24px; top:27px; color:#a7b3ae; }
.register-callout { display:flex; align-items:center; justify-content:space-between; gap:24px; max-width:950px; margin:18px auto 0; padding:23px 26px; color:#fff; background:var(--auth-brand); border-radius:18px; }
.register-callout strong,.register-callout span { display:block; }
.register-callout strong { font-size:1rem; }
.register-callout span { margin-top:4px; color:#cae9de; font-size:.72rem; }
.register-callout a { flex:0 0 auto; padding:11px 16px; color:var(--auth-ink); background:var(--auth-lime); border-radius:11px; font-size:.77rem; font-weight:900; text-decoration:none; }
.register-callout a:hover { color:var(--auth-ink); background:#d9ff85; }
.plan-cycle { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.cycle-option input { position:absolute; opacity:0; pointer-events:none; }
.cycle-option span { display:flex; align-items:center; justify-content:center; min-height:46px; color:var(--auth-muted); background:var(--auth-white); border:1px solid var(--auth-line); border-radius:12px; font-size:.78rem; font-weight:900; cursor:pointer; }
.cycle-option input:checked + span { color:var(--auth-brand); background:#eaf8f3; border-color:var(--auth-brand); }
.terms-row { grid-column:1/-1; padding-top:3px; }
.success-panel { padding:24px; margin-bottom:20px; text-align:center; color:#087052; background:#e9f9f3; border:1px solid #c5ecde; border-radius:16px; }
.success-panel i { display:block; margin-bottom:8px; font-size:2rem; }
.success-panel strong { display:block; font-size:1rem; }
.success-panel p { margin:7px 0 0; font-size:.78rem; }
.dark-theme.auth-new { --auth-ink:#edf5f1; --auth-muted:#a6b4ae; --auth-line:#2c413a; --auth-paper:#0d1815; --auth-white:#14231e; --auth-navy:#07110e; }
.dark-theme .auth-field label { color:#c5d0cb; }
.dark-theme .auth-kicker { background:#17382d; }
.dark-theme .auth-alert-new.error { color:#ffb4c1; background:#361b21; border-color:#5c2933; }
.dark-theme .auth-alert-new.success,.dark-theme .success-panel { color:#92e5c6; background:#123329; border-color:#265846; }
@media (max-width:960px) {
    .auth-page { padding:0; }
    .auth-frame { min-height:100vh; border:0; border-radius:0; }
    .auth-grid-new { grid-template-columns:1fr; }
    .auth-aside { min-height:430px; order:-1; }
    .auth-main { padding:50px 32px; }
    .portal-grid-new { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:620px) {
    .auth-nav { padding:0 16px; }
    .auth-brand-copy small,.auth-home-link span { display:none; }
    .auth-main,.auth-selector { padding:38px 18px; }
    .auth-aside { min-height:390px; padding:38px 24px; }
    .auth-aside h2 { font-size:2.35rem; }
    .auth-fields.two,.portal-grid-new { grid-template-columns:1fr; }
    .auth-service-list { grid-template-columns:1fr 1fr; }
    .register-callout { align-items:flex-start; flex-direction:column; }
    .register-callout a { width:100%; text-align:center; }
}
