@font-face{font-family:Darashmana;src:url("/fonts/NotoSansArabic.ttf") format("truetype");font-style:normal;font-weight:100 900;font-display:swap}
/* Darashmana Exchange — shared web identity. UI copy stays real RTL text. */
:root{--brand-blue:#0785f9;--brand-navy:#09265e;--blue:#0785f9;--navy:#09265e;--ink:#172e4a;--line:#e2e9f3;--bg:#f4f7fc;color-scheme:light}
.identity-brand{display:flex;align-items:center;gap:15px;direction:rtl;text-align:right;min-width:0;color:var(--brand-navy);line-height:1.4}
.identity-symbol{display:block;width:54px;height:54px;flex:0 0 auto;object-fit:contain}
.identity-wordmark{display:flex;flex-direction:column;min-width:0;gap:4px}
.identity-wordmark>strong{font-family:Darashmana,Arial,sans-serif;font-size:30px;font-weight:800;line-height:1.35;white-space:nowrap}
.identity-wordmark>span{font-size:12px;font-weight:500;line-height:1.6;white-space:nowrap;color:#536b8f}
.identity-brand.hero{gap:21px}.identity-brand.hero .identity-symbol{width:85px;height:85px}.identity-brand.hero .identity-wordmark>strong{font-size:clamp(38px,4vw,57px)}.identity-brand.hero .identity-wordmark>span{font-size:clamp(14px,1.3vw,18px)}
.portal-label{display:inline-flex;align-items:center;gap:9px;font-size:12px;line-height:1.5;padding:8px 13px;border:1px solid #d9e7f8;border-radius:30px;background:#edf5ff;color:#2869ab;font-weight:650}.portal-label:before{content:"";width:6px;height:6px;border-radius:50%;background:#0785f9}
.brand-signoff{color:#8191a7;font-size:11px;line-height:1.8;text-align:center;margin-top:24px}.brand-signoff strong{font-weight:650;color:#577092}
input:focus{border-color:#72b6fb;background:#fff}button.primary,.primary{background:var(--brand-blue);box-shadow:0 5px 14px #0785f91a}.primary:hover{background:#006fe3}.primary:active{transform:translateY(1px)}
@media(max-width:420px){.identity-brand{gap:10px}.identity-symbol{width:43px;height:43px}.identity-wordmark>strong{font-size:27px}.identity-wordmark>span{font-size:10px}.identity-brand.hero{gap:14px}.identity-brand.hero .identity-symbol{width:62px;height:62px}.identity-brand.hero .identity-wordmark>strong{font-size:39px}.identity-brand.hero .identity-wordmark>span{font-size:13px}}
@media(prefers-reduced-motion:reduce){.primary:active{transform:none}}

/* Customer portal */
body{background:#f4f7fc}#app{max-width:1040px;border:0}.customer-login{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;min-height:100dvh;padding:48px 34px}.login-banner{background:none;color:var(--brand-navy);padding:0;text-align:right;border-radius:0}.login-banner .portal-label{margin:0 0 26px}.login-banner .identity-brand{margin-bottom:36px}.login-banner .login-promise{font-size:31px;font-weight:750;line-height:1.7;color:#1e385b;max-width:400px}.login-banner .login-description{font-size:15px;line-height:2;color:#71839d;max-width:370px;margin-top:16px}.login-feature-list{display:grid;gap:15px;margin:30px 0 0;padding:0;list-style:none;color:#486281;font-size:14px}.login-feature-list li{display:flex;gap:12px;align-items:center}.login-feature-list li:before{content:"";display:block;width:7px;height:7px;border-radius:3px;background:#0785f9;box-shadow:0 0 0 6px #e8f2ff;margin:0 6px}
.login-wrap{padding:32px;max-width:none;width:100%;border:1px solid #e2e9f3;background:#fff;border-radius:25px;box-shadow:0 20px 70px #193f7410}.login-intro{margin-top:18px}.login-intro h2{font-size:25px}.login-form input{background:#f8faff}.login-form{gap:23px}.login-form .primary{margin-top:4px}.trial{background:#edf5ff;color:#466d96;border:1px solid #e0ecfa;font-size:11px}.header{background:#fff;border-radius:0;border-bottom:1px solid #e2e9f3;color:#172e4a;padding:26px 30px;gap:12px}.header .icon-button{background:#f2f6fc;border:1px solid #e2e9f3;color:#456487}.header-brand-area{display:flex;align-items:center;gap:25px}.header .portal-label{font-size:11px}.content{margin:0;padding:26px 30px}.welcome{border:1px solid #e2e9f3;padding:22px 24px;box-shadow:none}.welcome h2{color:#183d6b}.avatar{color:#126bca;background:#edf5ff}.balance{box-shadow:0 3px 12px #193f7403;border-radius:20px}.balance:first-child{border-top:3px solid #0785f9}.balance strong{color:#09265e}.currency-icon{background:#edf5ff;padding:5px 8px;border-radius:7px}.tag.negative{background:#fff0f1;color:#b44b5b}.tag.positive{background:#eaf8f1;color:#167866}.section-head{margin-top:26px}.nav{max-width:1040px;border-radius:20px 20px 0 0;box-shadow:0 -5px 25px #193f7406}.deposit-total{background:#09265e}.header .identity-wordmark>strong{font-size:32px}.header .identity-symbol{width:52px;height:52px}
@media(min-width:1100px){#app:has(.customer-login){max-width:1140px}.customer-login{gap:90px}.login-wrap{padding:38px}.header{margin-top:25px;border-radius:23px 23px 0 0;border:1px solid #e2e9f3}.content{padding-top:24px}.nav{bottom:20px;border:1px solid #e2e9f3;border-radius:18px;max-width:700px;padding:10px}.content{padding-bottom:20px}.balances{gap:18px}.balance{padding:23px}}
@media(max-width:700px){.customer-login{display:block;padding:32px 20px 20px;min-height:auto}.login-banner{text-align:center}.login-banner .portal-label{margin-bottom:23px}.login-banner .identity-brand{justify-content:center;margin-bottom:22px}.login-banner .login-promise{font-size:21px;max-width:none;margin-bottom:23px}.login-banner .login-description,.login-feature-list{display:none}.login-wrap{padding:24px;border-radius:23px}.login-intro{margin-bottom:22px}.header{padding:20px 18px}.header-brand-area{display:block}.header .portal-label{margin-top:10px;padding:4px 9px;font-size:10px}.header .identity-symbol{width:46px;height:46px}.header .identity-wordmark>strong{font-size:29px}.header .identity-wordmark>span{font-size:10px}.content{padding:20px 16px}.welcome{padding:19px}.header>.icon-button{align-self:flex-start}.nav{border-radius:17px 17px 0 0}.brand-signoff{margin-top:18px}}
@media(max-width:360px){.customer-login{padding:26px 14px 18px}.login-wrap{padding:21px}.identity-brand.hero .identity-symbol{width:51px;height:51px}.identity-brand.hero .identity-wordmark>strong{font-size:33px}.identity-brand.hero .identity-wordmark>span{font-size:11px}.header .identity-wordmark>strong{font-size:26px}.header .identity-symbol{width:40px;height:40px}.header .identity-wordmark>span{font-size:9px}}

:root{font-family:Darashmana,Arial,sans-serif}input,button,select{font-family:inherit}

.whatsapp-contact{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;min-height:48px;margin-top:24px;padding:12px;border:1px solid #b8e3cb;border-radius:14px;background:#edf9f1;color:#116b3b;text-decoration:none;font-size:15px;font-weight:700}.whatsapp-contact svg{width:22px;height:22px;flex-shrink:0}.whatsapp-contact:hover{background:#def3e5}.whatsapp-contact:focus-visible{outline:3px solid #168448;outline-offset:3px}

.login-foot + .whatsapp-contact{margin-top:12px}

.notification-row.unread{border-inline-start:4px solid #0785f9}.notification-amount{font-size:18px;font-weight:700;line-height:1.8;margin:12px 0}.notification-row .row-head{flex-wrap:wrap}#unread-count:not(:empty){display:inline-block;border-radius:20px;padding:1px 6px;background:#b12736;color:white;font-size:11px}