:root{--ink:#252321;--navy:#26231f;--blue:#9b6b32;--sky:#f5eee5;--green:#1b7d5b;--red:#b9484e;--muted:#706b64;--line:#e6ded4;--bg:#f7f5f1;--white:#fff;--gold:#b1844a;--sidebar:270px;--shadow:0 14px 38px rgba(61,47,30,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;line-height:1.45}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.demo-banner{height:30px;display:grid;place-items:center;background:#06283b;color:#cce6f2;font-size:10px;letter-spacing:.02em}.app-shell{display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);min-height:calc(100vh - 30px)}.sidebar{position:sticky;top:0;height:calc(100vh - 30px);padding:26px 18px 18px;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:90}.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.06em;color:var(--navy);font-size:15px}.logo{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:900}.side-caption{margin:30px 10px 8px;color:#93a2aa;font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:700}.side-nav{display:grid;gap:4px}.side-nav a{min-height:44px;padding:0 12px;border-radius:9px;display:flex;align-items:center;gap:11px;color:#536b78;font-weight:600}.side-nav a:hover{background:#f5f9fb;color:var(--navy)}.side-nav a.active{background:#f3eadf;color:#805b2c}.nav-icon{width:19px;height:19px;display:grid;place-items:center}.nav-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.sidebar-foot{margin-top:auto;padding-top:18px;border-top:1px solid var(--line)}.sidebar-user{display:flex;align-items:center;gap:10px;padding:8px}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#e7f4f9;color:#086898;font-size:11px;font-weight:800}.sidebar-user strong,.sidebar-user small{display:block}.sidebar-user strong{font-size:11px}.sidebar-user small{margin-top:2px;color:#8b9aa2;font-size:9px}.main-area{min-width:0}.topbar{height:72px;padding:0 34px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:18px;position:sticky;top:0;z-index:70}.page-title{display:grid}.page-title strong{font-size:14px}.page-title span{margin-top:2px;color:#91a0a8;font-size:9px}.top-actions{margin-left:auto;display:flex;gap:8px;align-items:center}.icon-btn,.lang-pill,.menu-btn{height:38px;min-width:38px;border:1px solid var(--line);background:#fff;border-radius:9px;display:grid;place-items:center;color:#536b78}.lang-pill{padding:0 11px;font-size:10px;font-weight:800}.menu-btn,.mobile-brand{display:none}.container{width:min(100%,1420px);margin:auto;padding:30px 34px 64px}.welcome{display:flex;align-items:end;justify-content:space-between;margin-bottom:22px}.welcome-copy small,.welcome-copy strong{display:block}.welcome-copy small{color:var(--muted);font-size:11px}.welcome-copy strong{margin-top:2px;font-size:23px;letter-spacing:-.03em}.status{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:999px;font-size:9px;font-weight:750;text-transform:capitalize}.status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.status.active,.status.completed,.status.effectue{background:#e9f6f0;color:var(--green)}.status.blocked,.status.rejected,.status.rejete{background:#faeded;color:var(--red)}.status.pending,.status.en_cours{background:#fff4dd;color:#9b6816}.grid{display:grid;gap:16px}.stats{grid-template-columns:minmax(0,1.55fr) repeat(2,minmax(210px,.72fr))}.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:0 1px 2px rgba(12,40,55,.02)}.balance{min-height:196px;padding:26px;background:#fff;position:relative;overflow:hidden}.balance:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#a6793e}.balance small{color:#718793;font-size:10px}.balance h1{margin:10px 0 32px;font-size:38px;line-height:1;letter-spacing:-.045em;color:#0a3148}.balance-foot{display:flex;align-items:end;justify-content:space-between;gap:16px}.iban{margin-top:4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:#49616e}.account-tag,.period{padding:6px 9px;border-radius:7px;background:#f2f6f8;color:#5f7581;font-size:9px;font-weight:700}.metric-card{min-height:196px;display:flex;flex-direction:column;justify-content:space-between}.metric-head{display:flex;align-items:flex-start;justify-content:space-between}.metric-value{margin-top:10px;font-size:25px;font-weight:780;letter-spacing:-.035em}.metric-icon{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:#edf6f1;color:var(--green);font-size:16px}.expense .metric-icon{background:#f9eeee;color:var(--red)}.trend{font-size:9px;font-weight:700}.trend.up{color:var(--green)}.trend.down{color:var(--red)}.two{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.65fr);gap:16px;margin:16px 0}.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.section-head h2,.quick h2{margin:0;font-size:14px;letter-spacing:-.01em}.section-head small{display:block;margin-top:3px;color:#8a9aa3;font-size:9px}.section-head>a{color:#95672f;font-size:10px;font-weight:700}canvas{width:100%!important;height:250px!important}.quick{display:grid;align-content:start;gap:4px}.quick h2{margin-bottom:10px}.quick>a{min-height:48px;display:flex;align-items:center;gap:10px;padding:0 10px;border-radius:9px;color:#3d5968;font-size:11px;font-weight:650}.quick>a:hover{background:#f3f8fa;color:#95672f}.table-wrap{overflow:auto;border:1px solid #e6edf0;border-radius:10px}table{width:100%;border-collapse:collapse;min-width:690px}th,td{padding:13px 15px;text-align:left;border-bottom:1px solid #edf1f3;white-space:nowrap}th{background:#f8fafb;color:#81919a;font-size:9px;text-transform:uppercase;letter-spacing:.05em}td{font-size:10.5px}tbody tr:last-child td{border-bottom:0}.pos{color:var(--green);font-weight:700}.neg{color:#b33f46;font-weight:700}.muted{color:var(--muted)}label{display:grid;gap:6px;color:#526a77;font-size:10px;font-weight:650}input,select,textarea{width:100%;min-height:44px;border:1px solid #cfdae0;border-radius:9px;background:#fff;padding:10px 12px;color:var(--ink);outline:none}input:focus,select:focus,textarea:focus{border-color:#b1844a;box-shadow:0 0 0 3px rgba(177,132,74,.12)}textarea{min-height:110px;resize:vertical}button,.primary,.success,.danger{min-height:42px;padding:0 15px;border:0;border-radius:9px;font-size:10px;font-weight:750}.primary{background:#9b6b32;color:#fff}.success{background:#177c58;color:#fff}.danger{background:#b9444b;color:#fff}.alert{padding:11px 13px;border-radius:9px;margin-bottom:14px;font-size:10px}.alert.danger{background:#fceded;color:#9d353c}.alert.success{background:#eaf6f0;color:#176d50}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid .wide{grid-column:1/-1}.form-card{max-width:920px}.beneficiary{display:flex;align-items:center;justify-content:space-between;gap:18px}.cards-grid{grid-template-columns:minmax(320px,.88fr) minmax(300px,1.12fr);align-items:start}.bankcard{width:min(100%,470px);aspect-ratio:1.586/1;padding:25px;border-radius:18px;color:#f4fbff;background:linear-gradient(145deg,#082d43 0%,#0b3d58 55%,#0a5368 100%);box-shadow:0 18px 36px rgba(4,32,48,.18);position:relative;overflow:hidden}.bankcard:after{content:"";position:absolute;right:-20%;top:-35%;width:70%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,255,255,.08)}.card-topline,.cardmeta{display:flex;align-items:flex-start;justify-content:space-between;position:relative;z-index:2}.card-brand{font-size:15px;font-weight:850;letter-spacing:.08em}.card-tier{margin-top:3px;color:#a9c9d8;font-size:8px;text-transform:uppercase;letter-spacing:.12em}.bankcard .status{background:rgba(255,255,255,.1);color:#eaf7fb}.card-tech{display:flex;align-items:center;gap:13px;margin-top:24px}.chip{width:43px;height:32px;border-radius:7px;background:linear-gradient(135deg,#e7d29a,#b99a55);position:relative}.chip:before,.chip:after{content:"";position:absolute;border:1px solid rgba(87,64,24,.35)}.chip:before{inset:0 13px}.chip:after{left:0;right:0;top:14px}.contactless{width:23px;height:23px;border-right:2px solid #c9e3ec;border-radius:50%;transform:rotate(-8deg);opacity:.9}.cardnum{margin-top:24px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:18px;letter-spacing:.09em}.cardmeta{align-items:end;margin-top:20px}.card-meta-block small,.card-meta-block span{display:block}.card-meta-block small{color:#9fc1cf;font-size:7px;text-transform:uppercase;letter-spacing:.1em}.card-meta-block span{margin-top:3px;font-size:9px;font-weight:700}.card-network{font-size:16px;font-weight:900;letter-spacing:.04em}.card-network i{color:#64c49a}.card-control{max-width:600px}.card-state-row{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid #edf1f3;font-size:10px}.card-actions{margin-top:18px}.modal-layer{position:fixed;z-index:250;inset:0;padding:20px;background:rgba(5,27,40,.58);backdrop-filter:blur(7px);display:grid;place-items:center}.otp-modal{position:relative;width:min(100%,470px);max-height:calc(100dvh - 40px);overflow:auto;padding:28px;background:#fff;border-radius:16px;box-shadow:0 30px 80px rgba(2,24,37,.28)}.modal-close-form{position:absolute;right:16px;top:16px}.modal-close{width:36px;min-width:36px;padding:0;background:#f1f5f7;color:#627984}.otp-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#e9f5fa;color:#95672f;font-weight:850}.otp-modal h2{margin:16px 45px 6px 0;font-size:20px}.otp-modal>p{margin:0 0 16px;color:var(--muted);font-size:10.5px}.otp-summary{padding:5px 13px;background:#f7f9fa;border:1px solid var(--line);border-radius:10px}.otp-summary-row{display:flex;justify-content:space-between;gap:18px;padding:10px 0;border-bottom:1px solid #e8eef1;font-size:10px}.otp-summary-row:last-child{border:0}.otp-input{height:58px;text-align:center;font-family:ui-monospace,monospace;font-size:23px;letter-spacing:.35em;font-weight:800}.otp-actions{margin-top:10px}.otp-actions button{width:100%}.otp-note,.demo-code{margin-top:11px;color:#7c8d96;font-size:9px}.login-body{min-height:100vh;background:#f1f5f7}.login-shell{min-height:calc(100vh - 30px);display:grid;grid-template-columns:minmax(460px,1.05fr) minmax(420px,.95fr)}.login-hero{padding:clamp(44px,7vw,96px);display:flex;flex-direction:column;justify-content:center;background:#07324b;color:#fff;position:relative;overflow:hidden}.login-hero:after{content:"";position:absolute;right:-180px;bottom:-240px;width:520px;height:520px;border:1px solid rgba(255,255,255,.09);border-radius:50%;box-shadow:0 0 0 90px rgba(255,255,255,.025),0 0 0 180px rgba(255,255,255,.018)}.login-hero .brand{color:#fff;margin-bottom:70px}.login-hero .logo{background:#fff;color:#07324b}.login-kicker{color:#8fc7e1;font-size:9px;text-transform:uppercase;letter-spacing:.14em;font-weight:800}.login-hero h1{max-width:620px;margin:14px 0 0;font-size:clamp(38px,4.8vw,64px);line-height:1.02;letter-spacing:-.055em}.login-hero p{max-width:600px;margin:20px 0 0;color:#c0d6e0;font-size:13px;line-height:1.65}.hero-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.hero-pills span{padding:6px 9px;border:1px solid rgba(255,255,255,.15);border-radius:7px;color:#d5e7ee;font-size:9px}.login-panel{display:grid;place-items:center;padding:42px;background:#f4f7f8}.login-card{width:min(100%,420px);padding:32px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.login-card h2{margin:0 0 6px;font-size:24px}.login-card>p{margin:0 0 22px;font-size:10.5px}.login-card form{display:grid;gap:14px}.login-card button{width:100%;margin-top:2px}.demo-creds{margin-top:16px;padding:11px;background:#f6f8f9;border-radius:8px;color:#71848f;font-size:9.5px}.text-link{display:inline-block;margin-top:15px;color:#95672f;font-size:10px;font-weight:700}.chat{height:420px;overflow:auto}.bubble{max-width:75%}footer{padding:20px;text-align:center;color:#8a9aa3;font-size:9px}#toTop{display:none;position:fixed;right:20px;bottom:20px;width:42px;height:42px;padding:0;border-radius:50%;background:#07324b;color:#fff;z-index:140}.mobile-overlay{display:none}
@media(max-width:1100px){.stats{grid-template-columns:1fr 1fr}.balance{grid-column:1/-1}.two{grid-template-columns:1fr}.cards-grid{grid-template-columns:1fr}.bankcard{width:min(100%,520px)}}
@media(max-width:820px){.demo-banner{height:auto;min-height:26px;padding:6px 10px}.app-shell{display:block}.sidebar{position:fixed;left:0;top:26px;width:min(84vw,290px);height:calc(100dvh - 26px);transform:translateX(-105%);transition:.2s;box-shadow:25px 0 60px rgba(4,30,44,.18)}.sidebar.open{transform:none}.mobile-overlay{display:block;position:fixed;z-index:85;inset:26px 0 0;background:rgba(3,22,34,.42);opacity:0;visibility:hidden;transition:.2s}.mobile-overlay.open{opacity:1;visibility:visible}.topbar{height:64px;padding:0 16px}.menu-btn{display:grid}.mobile-brand{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:850;color:var(--navy)}.mobile-brand .logo{width:30px;height:30px}.page-title{display:none}.container{padding:22px 16px 56px}.stats{grid-template-columns:1fr 1fr}.balance{grid-column:1/-1}.login-shell{grid-template-columns:1fr}.login-hero{min-height:330px;padding:38px 24px}.login-hero .brand{margin-bottom:42px}.login-panel{padding:24px}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.card{padding:18px}.welcome-copy strong{font-size:20px}}
@media(max-width:560px){.topbar{padding:0 12px}.top-actions .icon-btn{display:none}.container{padding-left:12px;padding-right:12px}.stats{grid-template-columns:1fr}.balance{min-height:180px;padding:20px}.balance h1{font-size:31px}.balance-foot{align-items:flex-start;flex-direction:column}.metric-card{min-height:135px}.card{border-radius:12px;padding:16px}.bankcard{padding:20px;border-radius:15px}.cardnum{font-size:clamp(13px,4.3vw,18px);letter-spacing:.06em}.cardmeta{gap:8px}.card-meta-block span{font-size:8px}.otp-modal{padding:22px 16px;border-radius:14px}.modal-layer{padding:8px;align-items:end}.otp-input{font-size:20px;letter-spacing:.28em}.login-hero{min-height:290px;padding:28px 18px}.login-hero h1{font-size:34px}.login-panel{padding:12px}.login-card{padding:22px;border-radius:12px}.section-head small{display:none}}
/* BIID Private Digital — institutional banking layer */
:root{--ink:#17212b;--navy:#102a43;--blue:#1769e0;--sky:#e9f2ff;--green:#178a55;--red:#d64545;--muted:#687586;--line:#e2e8ef;--bg:#f5f7fa;--shadow:0 12px 36px rgba(16,42,67,.06)}
body{background:var(--bg);color:var(--ink)}.demo-banner{background:#0b2239;color:#dbe8f4}.sidebar{border-right:1px solid #e6ebf0}.logo{background:#123b61}.side-nav a{border-radius:8px}.side-nav a.active{background:#edf4ff;color:#155fc9}.topbar{border-bottom-color:#e7ecf1}.container{width:min(100%,1360px);padding-top:26px}.welcome{margin-bottom:18px}.welcome-copy small{font-size:12px}.welcome-copy strong{font-size:24px}.account-hero{background:#fff;border:1px solid #e2e8ef;border-radius:16px;padding:30px 32px;display:flex;align-items:center;justify-content:space-between;gap:32px;box-shadow:0 1px 2px rgba(16,42,67,.02);margin-bottom:18px}.account-hero-main{min-width:0}.eyebrow{font-size:11px;font-weight:700;color:#657789;letter-spacing:.01em}.hero-balance-label{margin-top:24px;font-size:12px;color:#687586}.hero-balance{margin-top:3px;font-size:42px;line-height:1.1;font-weight:720;letter-spacing:-.045em;color:#102a43}.hero-meta{margin-top:20px;display:flex;align-items:center;gap:12px;color:#6d7d8c;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.action-lg{min-height:46px;padding:0 17px;display:inline-flex;align-items:center;gap:9px;border-radius:9px;font-size:11px;font-weight:750}.action-lg svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}.secondary{border:1px solid #d5dee7;background:#fff;color:#253d52}.primary{background:#1769e0}.banking-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:18px;margin-bottom:18px}.surface{background:#fff;border:1px solid #e2e8ef;border-radius:14px;padding:24px;box-shadow:0 1px 2px rgba(16,42,67,.015)}.surface .section-head{margin-bottom:16px}.surface .section-head h2{font-size:15px}.surface .section-head small{display:block;font-size:10px}.transaction-list{display:grid}.transaction-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid #edf1f5}.transaction-row:last-child{border-bottom:0}.transaction-mark{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:#f4f6f8;color:#506274}.transaction-mark.in{background:#edf8f3;color:#178a55}.transaction-copy{min-width:0}.transaction-copy strong,.transaction-copy span{display:block}.transaction-copy strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.transaction-copy span{margin-top:3px;color:#84909d;font-size:9px}.transaction-amount{font-size:11px;font-weight:750;white-space:nowrap}.insight-panel canvas{height:215px!important}.insight-foot{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #edf1f5;margin-top:8px;padding-top:16px}.insight-foot div+div{border-left:1px solid #edf1f5;padding-left:20px}.insight-foot span,.insight-foot strong{display:block}.insight-foot span{font-size:9px;color:#7b8997}.insight-foot strong{margin-top:4px;font-size:13px}.lower-grid{grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr)}.mini-bankcard{width:min(100%,440px);aspect-ratio:1.586/1;border-radius:15px;padding:23px 24px;background:linear-gradient(145deg,#0c2740,#123b5c 62%,#174b6b);color:#fff;box-shadow:0 16px 30px rgba(12,39,64,.16);position:relative;overflow:hidden}.mini-bankcard:after{content:"";position:absolute;width:250px;height:250px;border:1px solid rgba(255,255,255,.06);border-radius:50%;right:-130px;top:-100px}.mini-card-top,.mini-card-bottom{display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:1}.contactless-symbol{font-size:13px;letter-spacing:-4px;transform:rotate(90deg);opacity:.8}.mini-chip{margin-top:30px;width:40px;height:29px;border-radius:6px;background:linear-gradient(135deg,#ead89e,#b99b57);position:relative}.mini-chip:before{content:"";position:absolute;left:13px;top:0;bottom:0;border-left:1px solid rgba(76,58,24,.3)}.mini-number{margin-top:25px;font:500 16px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.mini-card-bottom{margin-top:22px;align-items:end}.mini-card-bottom div small,.mini-card-bottom div strong{display:block}.mini-card-bottom small{font-size:6px;letter-spacing:.12em;color:#a9c3d5}.mini-card-bottom strong{font-size:8px;margin-top:3px;letter-spacing:.05em}.mini-card-bottom b{font-size:17px;letter-spacing:.08em}.security-panel{align-content:start}.security-item{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid #edf1f5}.security-icon{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#edf8f3;color:#178a55;font-weight:800}.security-item strong,.security-item small{display:block}.security-item strong{font-size:11px}.security-item small{margin-top:3px;color:#7d8b98;font-size:9px}.text-action{display:inline-block;margin-top:18px;color:#1769e0;font-size:10px;font-weight:750}.card{border-color:#e2e8ef;box-shadow:0 1px 2px rgba(16,42,67,.015)}input,select,textarea{border-color:#d8e0e8;border-radius:8px}.otp-modal{border-radius:14px}.bankcard{background:linear-gradient(145deg,#0c2740,#123b5c 62%,#174b6b);border-radius:15px}
@media(max-width:1000px){.account-hero{align-items:flex-start;flex-direction:column}.hero-actions{justify-content:flex-start}.banking-grid,.lower-grid{grid-template-columns:1fr}.mini-bankcard{width:min(100%,480px)}}
@media(max-width:620px){.account-hero{padding:22px 18px;border-radius:12px}.hero-balance{font-size:34px}.hero-meta{align-items:flex-start;flex-direction:column}.hero-actions{width:100%}.action-lg{flex:1;justify-content:center}.surface{padding:18px;border-radius:12px}.transaction-row{grid-template-columns:34px minmax(0,1fr) auto;gap:9px}.transaction-mark{width:32px;height:32px}.transaction-copy span{max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-bankcard{padding:19px}.mini-number{font-size:clamp(12px,4vw,16px)}.insight-foot{grid-template-columns:1fr 1fr}}
@media(max-width:390px){.hero-actions{display:grid;grid-template-columns:1fr}.hero-balance{font-size:30px}.transaction-amount{font-size:10px}.surface{padding:15px}.mini-bankcard{padding:16px}.mini-chip{margin-top:20px}.mini-number{margin-top:18px}.mini-card-bottom{margin-top:16px}}
/* BIID Trust Edition — restrained, institutional, high-confidence UI */
:root{--navy:#092b45;--ink:#142433;--blue:#1268c4;--bg:#f3f6f8;--line:#dfe6eb;--muted:#687b89;--green:#167b55;--red:#c84248;--sidebar:258px}
body{background:linear-gradient(180deg,#f7f9fa 0,#f3f6f8 360px);font-size:14px}.sidebar{padding:28px 20px 20px;background:#fff}.brand{font-size:16px;letter-spacing:.045em}.logo{border-radius:7px;background:#092b45;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}.side-nav{gap:2px}.side-nav a{min-height:46px;border-radius:7px;font-size:12px}.side-nav a.active{background:#eef4f8;color:#0b4f7a;box-shadow:inset 3px 0 #0d6ca8}.topbar{height:70px;padding:0 38px}.container{width:min(100%,1400px);padding:26px 38px 72px}.welcome{align-items:center;margin-bottom:18px}.welcome-copy small{font-size:11px}.welcome-copy strong{font-size:22px;font-weight:680}.trust-strip{min-height:42px;margin-bottom:14px;padding:0 16px;border:1px solid #dfe7eb;border-radius:9px;background:#fff;display:flex;align-items:center;gap:22px;color:#607583;font-size:10px}.trust-strip b{display:inline-grid;place-items:center;width:17px;height:17px;margin-right:6px;border-radius:50%;background:#eaf6f0;color:#167b55;font-size:10px}.trust-last{margin-left:auto;color:#8797a2}.premium-account{padding:30px 32px;border-radius:12px;border-color:#dce5ea;box-shadow:0 8px 26px rgba(12,44,64,.035)}.account-title-line{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.account-title-line>div{display:grid;gap:4px}.account-type{font-size:9px;font-weight:800;letter-spacing:.12em;color:#78909d}.account-title-line strong{font-size:14px;color:#1c3444}.hero-balance-label{margin-top:28px}.hero-balance{font-size:44px;font-weight:690}.account-details{display:flex;flex-wrap:wrap;gap:34px;margin-top:24px;padding-top:18px;border-top:1px solid #edf1f3}.account-details div{display:grid;gap:4px}.account-details span{font-size:8px;text-transform:uppercase;letter-spacing:.08em;color:#8a99a3}.account-details strong{font-size:10px;font-weight:650;color:#506775}.hero-actions{align-self:flex-end}.action-lg{border-radius:7px;min-height:44px}.primary{background:#0c65a1;box-shadow:0 3px 8px rgba(12,101,161,.12)}.secondary{border-color:#d6e0e6}.quick-command{display:grid;grid-template-columns:repeat(4,1fr);margin:0 0 16px;border:1px solid #dfe6eb;border-radius:11px;background:#fff;overflow:hidden}.quick-command>a{min-height:74px;padding:14px 18px;display:flex;align-items:center;gap:12px;border-right:1px solid #e7ecef}.quick-command>a:last-child{border-right:0}.quick-command>a:hover{background:#f8fafb}.command-icon{width:34px;height:34px;border:1px solid #dce6eb;border-radius:8px;display:grid;place-items:center;color:#0c65a1;background:#f8fbfc}.command-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7}.quick-command strong,.quick-command small{display:block}.quick-command strong{font-size:10.5px}.quick-command small{margin-top:3px;color:#8797a2;font-size:8.5px}.surface{border-radius:11px;border-color:#dfe6eb;padding:23px;box-shadow:0 5px 18px rgba(12,44,64,.025)}.surface .section-head h2{font-size:14px;font-weight:700}.transaction-row{padding:15px 0}.transaction-mark{border-radius:9px}.mini-bankcard{width:min(100%,430px);border-radius:13px;background:linear-gradient(135deg,#071e30,#0b304b 58%,#104463);box-shadow:0 20px 38px rgba(7,30,48,.20);border:1px solid rgba(255,255,255,.1)}.mini-bankcard:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,rgba(255,255,255,.055),transparent 28%,transparent 70%,rgba(255,255,255,.025));pointer-events:none}.card-brand{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:760;letter-spacing:.08em}.brand-gem{width:9px;height:12px;border:1px solid rgba(255,255,255,.85);display:inline-block;transform:skew(-10deg)}.mini-chip{background:linear-gradient(135deg,#e3d29b,#aa8a49);box-shadow:inset 0 0 0 1px rgba(68,49,16,.2)}.mini-chip:after{content:"";position:absolute;left:0;right:0;top:13px;border-top:1px solid rgba(76,58,24,.25)}.mini-number{letter-spacing:.12em}.card-status-line{width:min(100%,430px);display:flex;justify-content:space-between;margin-top:13px;color:#728490;font-size:9px}.card-status-line span:first-child{color:#167b55;font-weight:700}.card-status-line i{display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:#167b55}.security-score{padding:5px 8px;border-radius:5px;background:#eaf6f0;color:#167b55;font-size:8px;font-weight:800;letter-spacing:.08em}.security-item{padding:14px 0}.security-icon{border-radius:8px}.legal-confidence{display:flex;justify-content:center;gap:24px;padding:12px;color:#8b99a2;font-size:8.5px}.otp-modal{border-radius:12px;box-shadow:0 28px 70px rgba(4,27,42,.22)}
@media(max-width:1000px){.quick-command{grid-template-columns:1fr 1fr}.quick-command>a:nth-child(2){border-right:0}.quick-command>a:nth-child(-n+2){border-bottom:1px solid #e7ecef}.premium-account{align-items:stretch}.hero-actions{align-self:auto}}
@media(max-width:620px){body{background:#f4f7f8}.container{padding:18px 12px 64px}.welcome{margin-bottom:14px}.trust-strip{padding:10px 12px;gap:8px;flex-wrap:wrap}.trust-strip span{font-size:8.5px}.trust-last{width:100%;margin-left:0;padding-top:7px;border-top:1px solid #edf1f3}.premium-account{padding:20px 17px}.account-title-line{gap:8px}.hero-balance{font-size:32px}.account-details{display:grid;grid-template-columns:1fr 1fr;gap:15px 20px}.account-details div:first-child{grid-column:1/-1}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.quick-command>a{padding:12px;min-height:68px}.quick-command small{display:none}.surface{padding:17px}.legal-confidence{gap:12px;flex-wrap:wrap}.mini-bankcard{margin:auto}.card-status-line{margin-left:auto;margin-right:auto}}
@media(max-width:390px){.hero-actions{grid-template-columns:1fr}.quick-command{grid-template-columns:1fr 1fr}.quick-command strong{font-size:9.5px}.command-icon{width:31px;height:31px}.account-details{grid-template-columns:1fr}.account-details div:first-child{grid-column:auto}.hero-balance{font-size:29px}}

/* BIID Signature Edition — executive banking refinement */
:root{--signature:#0b3553;--signature-2:#0f5f91;--paper:#fbfcfd;--hair:#e5ebef;--soft:#f6f8fa;--gold:#b99a5a}
body{background:#f5f7f9;color:#182a37;letter-spacing:-.005em}.demo-banner{background:#082c43;height:28px;color:#d7e8f0;font-size:9px}.sidebar{box-shadow:none}.brand{letter-spacing:.025em}.logo{width:36px;height:36px;background:linear-gradient(145deg,#0a304a,#0c4f75);border-radius:8px}.topbar{box-shadow:0 1px 0 rgba(18,45,61,.025)}.container{max-width:1370px}.welcome-copy strong{font-size:24px;font-weight:650}.trust-strip{border:0;border-bottom:1px solid var(--hair);border-radius:0;background:transparent;padding:0 2px 12px;min-height:auto}.trust-strip b{background:#edf7f2}.premium-account{position:relative;overflow:hidden;background:linear-gradient(112deg,#fff 0,#fff 68%,#f7fafc 100%);border:1px solid #dfe7ec;padding:34px 36px}.premium-account:before{content:"";position:absolute;right:-60px;top:-130px;width:310px;height:310px;border-radius:50%;border:1px solid #eaf0f3}.premium-account:after{content:"";position:absolute;right:75px;bottom:-125px;width:230px;height:230px;border-radius:50%;border:1px solid #edf2f5}.account-hero-main,.hero-actions{position:relative;z-index:1}.hero-balance-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em}.hero-balance{font-variant-numeric:tabular-nums;color:#102f43;font-size:46px}.account-details strong{font-size:11px}.quick-command{border-radius:10px;box-shadow:0 4px 18px rgba(15,43,60,.025)}.quick-command>a{transition:background .18s ease,color .18s ease}.quick-command>a:hover{background:#f4f8fa}.command-icon{border:0;background:#edf5f9;color:#0c628f}.surface{background:#fff;border:1px solid #e1e8ec;box-shadow:0 6px 24px rgba(16,44,60,.035)}.section-head{min-height:42px}.transaction-row{min-height:62px}.transaction-mark{border:1px solid #e4ebef;background:#f8fafb!important}.transaction-mark.in{color:#147751}.transaction-mark.out{color:#b9464d}.transaction-amount{font-variant-numeric:tabular-nums}.mini-bankcard{background:radial-gradient(circle at 80% 10%,rgba(255,255,255,.10),transparent 26%),linear-gradient(135deg,#061b2b,#0a2f49 56%,#0c4160);box-shadow:0 22px 44px rgba(5,27,43,.22);border-radius:14px}.mini-bankcard:after{border-color:rgba(255,255,255,.045)}.mini-chip{width:43px;height:31px}.mini-number{font-size:15px;letter-spacing:.14em}.security-icon{background:#eef7f3;border:1px solid #dcefe6}.security-score{border:1px solid #d8ece2}.legal-confidence{border-top:1px solid #e4eaee;margin-top:18px}.primary{background:#0c5f91;border-color:#0c5f91}.primary:hover{background:#094f79}.secondary:hover{background:#f7f9fa}.otp-backdrop{backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}.otp-modal{border:1px solid #e0e7eb;background:#fff}.otp-modal input{font-variant-numeric:tabular-nums;letter-spacing:.35em;text-align:center;font-size:22px}.login-body{background:#f4f7f9}.login-shell{max-width:1220px;margin:auto;min-height:calc(100vh - 28px);padding:42px;gap:0}.login-hero{border-radius:18px 0 0 18px;background:radial-gradient(circle at 80% 20%,rgba(89,164,201,.22),transparent 27%),linear-gradient(145deg,#082b43,#0a4668);padding:64px}.login-hero h1{max-width:560px;font-size:46px;line-height:1.06;letter-spacing:-.045em}.login-hero p{max-width:550px;line-height:1.7}.login-panel{border-radius:0 18px 18px 0;background:#fff;border:1px solid #e0e7eb;border-left:0;padding:54px}.login-card{max-width:390px}.login-card h2{font-size:25px;letter-spacing:-.025em}.login-card label{font-size:10px;font-weight:700;color:#536875}.login-card input{height:48px;background:#fbfcfd}.login-card button{min-height:48px}.demo-creds{border:1px solid #e5eaed;background:#f8fafb;border-radius:8px}
@media(max-width:820px){.login-shell{padding:0;display:block}.login-hero{border-radius:0;padding:42px 28px}.login-hero h1{font-size:36px}.login-panel{border:0;border-radius:0;padding:36px 24px}.login-card{margin:auto}.premium-account:before,.premium-account:after{display:none}}
@media(max-width:620px){.demo-banner{font-size:8px;padding:0 8px;text-align:center}.premium-account{padding:22px 18px}.hero-balance{font-size:34px}.quick-command{border-radius:9px}.surface{box-shadow:0 3px 14px rgba(16,44,60,.03)}.login-hero{padding:34px 22px}.login-hero h1{font-size:31px}.login-panel{padding:30px 20px}}

/* ===== BIID premium admin/chat/responsive refinements ===== */
*{box-sizing:border-box} html,body{max-width:100%;overflow-x:hidden}.container,.main-area,.surface,.card,.form-grid>*{min-width:0}
.lang-menu{position:relative}.lang-menu .lang-pop{position:absolute;right:0;top:calc(100% + 8px);display:none;min-width:170px;padding:8px;background:#fff;border:1px solid rgba(15,42,67,.10);border-radius:14px;box-shadow:0 18px 45px rgba(15,42,67,.14);z-index:100}.lang-menu .lang-pop.open{display:grid}.lang-menu .lang-pop a{padding:10px 12px;border-radius:9px;color:#1d2d3d;text-decoration:none;font-weight:650}.lang-menu .lang-pop a:hover{background:#f1f6fb}
html[dir="rtl"] body{text-align:right}html[dir="rtl"] .sidebar{left:auto;right:0}html[dir="rtl"] .main-area{margin-left:0;margin-right:var(--sidebar-w,260px)}html[dir="rtl"] .lang-menu .lang-pop{right:auto;left:0}
.security-note{margin-top:18px;padding:14px 16px;border-radius:12px;background:#f4f8fb;border:1px solid #dce7ef;color:#435465;font-size:.9rem;line-height:1.45}
.admin-editor,.client-editor,.tx-editor{overflow:hidden}.admin-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.admin-form-grid .wide{grid-column:1/-1}.form-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px}.client-editor>summary,.tx-editor>summary{display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer;list-style:none;padding:18px 20px}.client-editor>summary::-webkit-details-marker,.tx-editor>summary::-webkit-details-marker{display:none}.client-editor>summary>div,.tx-editor>summary>div{display:grid;gap:4px;min-width:0}.client-editor>summary span,.tx-editor>summary span{color:#708090;font-size:.87rem}.client-editor-body,.tx-edit-form{padding:0 20px 22px}.admin-transaction-stack{display:grid;gap:10px}.tx-editor{border:1px solid #e3ebf1;border-radius:14px;background:#fff}.status-chip{display:inline-flex;align-items:center;justify-content:center;padding:7px 10px;border-radius:999px;background:#edf3f7;color:#405365;font-weight:800;font-size:.76rem;white-space:nowrap}.status-effectue,.status-recu,.status-approuve,.status-actif{background:#eaf8f1;color:#16724a}.status-rejete,.status-annule,.status-bloque{background:#fff0f0;color:#b63232}.status-en_attente,.status-en_suspend,.status-en_cours{background:#fff7e8;color:#8f6510}
.chat-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px}.chat-panel{padding:0;overflow:hidden}.chat-head{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid #e8eef3}.chat-head h2{margin:0;font-size:1rem}.chat-head small{display:block;margin-top:3px;color:#71808f}.agent-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#123f67,#1d77b7);color:white;font-weight:800}.agent-avatar.large{width:62px;height:62px;font-size:1rem}.online-dot{margin-left:auto;width:10px;height:10px;border-radius:50%;background:#22a66a;box-shadow:0 0 0 4px #e8f7f0}.premium-chat{height:min(58vh,560px);overflow:auto;padding:22px;background:#f6f9fb;display:flex;flex-direction:column;gap:10px}.premium-chat .bubble{max-width:min(74%,600px);padding:12px 14px;border-radius:16px;box-shadow:none;line-height:1.45}.premium-chat .bubble small{display:block;margin-bottom:5px;font-size:.72rem;opacity:.65}.premium-chat .bubble.client{margin-left:auto;background:#1267a8;color:white;border-bottom-right-radius:5px}.premium-chat .bubble.admin{margin-right:auto;background:white;color:#1f2d39;border:1px solid #e0e9ef;border-bottom-left-radius:5px}.premium-chat-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:14px 16px;border-top:1px solid #e8eef3;background:#fff}.premium-chat-form textarea{min-height:46px;max-height:130px;resize:vertical;margin:0}.chat-safety{align-self:start}.chat-safety p{color:#667787;line-height:1.55}.agent-card{display:grid;justify-items:center;text-align:center;gap:6px;padding:20px;border-radius:14px;background:#f5f8fb}.agent-card span{font-size:.83rem;color:#768696}.admin-chat-shell{display:grid;grid-template-columns:290px minmax(0,1fr);gap:18px}.thread-list{padding:12px}.thread-item{display:flex;align-items:center;gap:10px;padding:12px;border-radius:12px;text-decoration:none;color:inherit}.thread-item:hover,.thread-item.active{background:#eef5fa}.thread-item>div:last-child{display:grid;min-width:0}.thread-item strong,.thread-item small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.thread-item small{color:#7a8996}.live-admin-chat{padding:0;overflow:hidden}.takeover-controls{margin-left:auto}.admin-live-thread{height:min(62vh,640px)}
@media (max-width:1020px){.chat-layout{grid-template-columns:1fr}.chat-safety{display:none}.admin-chat-shell{grid-template-columns:240px minmax(0,1fr)}.admin-form-grid{grid-template-columns:1fr 1fr}}
@media (max-width:820px){html[dir="rtl"] .main-area{margin-right:0}.admin-chat-shell{grid-template-columns:1fr}.thread-list{display:flex;overflow-x:auto;gap:8px}.thread-item{min-width:220px}.takeover-controls{margin-left:0}.chat-head{flex-wrap:wrap}.premium-chat{height:52vh}.admin-form-grid{grid-template-columns:1fr}.admin-form-grid .wide{grid-column:auto}.client-editor>summary,.tx-editor>summary{align-items:flex-start}.status-chip{flex:0 0 auto}}
@media (max-width:520px){.premium-chat-form{grid-template-columns:1fr}.premium-chat-form button{width:100%}.premium-chat .bubble{max-width:88%}.chat-head{padding:14px}.premium-chat{padding:14px}.client-editor>summary,.tx-editor>summary{padding:14px}.client-editor-body,.tx-edit-form{padding:0 14px 16px}.form-actions>*{width:100%}.form-actions form,.form-actions button{width:100%}.lang-menu .lang-pop{position:fixed;left:12px!important;right:12px!important;top:64px;min-width:0}}
.inline-delete{padding:0 20px 20px}.inline-delete .danger{width:auto}
@media(max-width:520px){.inline-delete{padding:0 14px 16px}.inline-delete .danger{width:100%}}

/* 2026-08 responsive beneficiary / transfer refinements */
.button{display:inline-flex;align-items:center;justify-content:center;max-width:100%;min-height:42px;padding:0 15px;border-radius:9px;font-size:10px;font-weight:750;white-space:normal;text-align:center;line-height:1.25}
.stack-form{display:grid;gap:14px}.form-button-row{display:flex;align-items:center;justify-content:flex-start;min-width:0}.form-button-row>*{max-width:100%}
.beneficiary-layout{grid-template-columns:minmax(0,1.55fr) minmax(320px,.75fr)}.beneficiary-list{display:grid;gap:0;min-width:0}.beneficiary{min-width:0;padding:14px 0;border-bottom:1px solid #edf1f3}.beneficiary:last-child{border-bottom:0}.beneficiary-copy{min-width:0;display:grid;gap:4px}.beneficiary-copy strong,.beneficiary-copy small{display:block;min-width:0;max-width:100%;overflow-wrap:anywhere;word-break:break-word}.beneficiary-copy small{color:#718793;font-size:9.5px}.beneficiary form{flex:0 0 auto}
.empty-action{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.empty-action p{margin:0;flex:1 1 220px}.empty-action .button{flex:0 1 auto}
.transfer-layout select{min-width:0}.status-legend{display:grid;gap:11px;margin-top:20px;padding-top:16px;border-top:1px solid #edf1f3}.status-legend span{display:flex;align-items:center;gap:8px;font-size:10px;color:#637985}.status-legend i{width:8px;height:8px;border-radius:50%}.pending-dot{background:#d89a2b}.success-dot{background:#178a55}.danger-dot{background:#c54b52}
.processing-layer{z-index:280}.processing-modal{text-align:center}.processing-ring{width:126px;height:126px;margin:4px auto 20px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#0c65a1 var(--progress,0deg),#e8eef2 0);position:relative}.processing-ring:after{content:"";position:absolute;inset:9px;background:#fff;border-radius:50%}.processing-ring span{position:relative;z-index:1;font-size:23px;font-weight:800;color:#12384f;font-variant-numeric:tabular-nums}.processing-modal .otp-summary{text-align:left}.processing-result{margin-top:20px;padding-top:18px;border-top:1px solid #e5ebef}.processing-result .result-icon{width:54px;height:54px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;background:#eaf6f0;color:#178a55;font-size:22px;font-weight:900}.processing-result.rejected .result-icon{background:#faeded;color:#b9444b}.processing-result h3{margin:0 0 7px;font-size:17px}.processing-result p{margin:0 0 16px;color:#6f818c;font-size:10.5px}.processing-result button{width:100%}
@media(max-width:1100px){.beneficiary-layout{grid-template-columns:1fr}.beneficiary-list-card{min-width:0}}
@media(max-width:620px){.beneficiary{align-items:flex-start;flex-direction:column}.beneficiary form,.beneficiary form button{width:100%}.form-button-row,.form-button-row .primary,.empty-action,.empty-action .button{width:100%}.otp-summary-row{align-items:flex-start;flex-direction:column;gap:3px}.otp-summary-row strong{overflow-wrap:anywhere;word-break:break-word;max-width:100%}.processing-ring{width:112px;height:112px}.processing-ring span{font-size:20px}}

/* ===== 2026-08-19 universal responsive containment pass ===== */
:root{--content-pad:34px}
html,body{width:100%;max-width:100%;overflow-x:hidden}
img,svg,canvas,video{max-width:100%}
input,select,textarea,button{max-width:100%}
.app-shell,.main-area,.container,.grid,.two,.stats,.banking-grid,.lower-grid,.cards-grid,.beneficiary-layout,.transfer-layout,.chat-layout,.admin-chat-shell,.admin-form-grid,.form-grid{min-width:0;max-width:100%}
.card,.surface,.form-card,.beneficiary-form-card,.beneficiary-list-card,.card-control,.activity-panel,.insight-panel,.security-panel,.chat-panel,.live-admin-chat,.admin-editor,.client-editor,.tx-editor{min-width:0;max-width:100%}
.card *,.surface *,.form-card *,.beneficiary *,.transaction-row *,.chat-head *{min-width:0}
.iban,.beneficiary-copy strong,.beneficiary-copy small,.transaction-copy strong,.transaction-copy small,.card-state-row>*{overflow-wrap:anywhere;word-break:break-word}
.section-head,.welcome,.balance-foot,.account-title-line,.card-state-row,.chat-head{min-width:0}
.table-wrap{width:100%;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
.table-wrap table{width:max-content;min-width:100%;max-width:none}
.premium-chat,.admin-live-thread{max-width:100%;overflow-x:hidden}
.premium-chat .bubble{overflow-wrap:anywhere;word-break:break-word}
.bankcard,.mini-bankcard{max-width:100%}
.otp-modal,.processing-modal{width:min(100%,470px);max-width:calc(100vw - 24px)}
.modal-layer{padding:12px}

@media(max-width:1180px){
  :root{--content-pad:26px;--sidebar:228px}
  .container{padding-left:var(--content-pad);padding-right:var(--content-pad)}
  .topbar{padding-left:var(--content-pad);padding-right:var(--content-pad)}
  .stats{grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(180px,.8fr))}
  .two,.banking-grid,.lower-grid{grid-template-columns:minmax(0,1fr) minmax(260px,.72fr)}
  .cards-grid{grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr)}
}

@media(max-width:980px){
  .stats{grid-template-columns:1fr 1fr}.stats>*:first-child{grid-column:1/-1}
  .two,.banking-grid,.lower-grid,.cards-grid,.beneficiary-layout,.transfer-layout,.chat-layout{grid-template-columns:1fr!important}
  .form-card,.card-control{max-width:none}
  .bankcard{margin-inline:auto}
  .chat-safety{display:block}
}

@media(max-width:820px){
  :root{--content-pad:18px}
  .app-shell{display:block;min-height:100vh}
  .sidebar{position:fixed;left:0;top:0;bottom:0;width:min(86vw,290px);height:100dvh;transform:translateX(-105%);transition:transform .22s ease;box-shadow:0 20px 60px rgba(3,26,39,.22);z-index:210;overflow-y:auto}
  .sidebar.open{transform:translateX(0)}
  html[dir="rtl"] .sidebar{left:auto;right:0;transform:translateX(105%)}
  html[dir="rtl"] .sidebar.open{transform:translateX(0)}
  .main-area{width:100%;margin:0!important}
  .mobile-overlay{position:fixed;inset:0;background:rgba(4,28,43,.38);z-index:200;opacity:0;pointer-events:none;transition:opacity .2s ease}
  .mobile-overlay.open{opacity:1;pointer-events:auto}
  .menu-btn,.mobile-brand{display:grid}
  .mobile-brand{font-weight:850;color:var(--navy);letter-spacing:.04em}
  .topbar{height:64px;gap:10px;padding-inline:var(--content-pad)}
  .topbar .page-title{display:none}
  .container{padding:22px var(--content-pad) 48px}
  .welcome{align-items:flex-start;gap:12px}
  .form-grid,.admin-form-grid{grid-template-columns:1fr!important}
  .form-grid .wide,.admin-form-grid .wide{grid-column:auto}
  .admin-chat-shell{grid-template-columns:1fr!important}
  .thread-list{display:flex;gap:8px;overflow-x:auto;padding:10px;scroll-snap-type:x proximity}
  .thread-item{flex:0 0 min(78vw,260px);scroll-snap-align:start}
  .premium-chat{height:50dvh}
  .card{padding:18px}
  .balance{padding:22px}
  .balance h1{font-size:34px}
  .client-editor>summary,.tx-editor>summary{flex-wrap:wrap}
}

@media(max-width:620px){
  :root{--content-pad:14px}
  body{font-size:13px}
  .container{padding-top:18px}
  .welcome{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;margin-bottom:16px}
  .welcome-copy strong{font-size:21px}
  .stats{grid-template-columns:1fr}.stats>*:first-child{grid-column:auto}
  .metric-card{min-height:150px}
  .balance{min-height:auto}.balance h1{font-size:31px;margin-bottom:24px}
  .balance-foot{align-items:flex-start;flex-direction:column}
  .card,.surface{border-radius:12px}
  .section-head{align-items:flex-start;flex-wrap:wrap}.section-head>a{margin-left:auto}
  .form-button-row,.form-button-row .primary,.form-button-row .button,.empty-action,.empty-action .button{width:100%}
  .beneficiary{align-items:flex-start;flex-direction:column}.beneficiary form,.beneficiary form button{width:100%}
  .bankcard{padding:20px;border-radius:15px}.cardnum{font-size:15px;letter-spacing:.07em}.card-tech{margin-top:18px}.cardmeta{margin-top:15px}
  .card-state-row{display:grid;grid-template-columns:1fr;gap:5px}
  .hero-actions,.quick-command{grid-template-columns:1fr 1fr!important}
  .premium-chat{padding:14px;height:48dvh}.premium-chat .bubble{max-width:90%}
  .premium-chat-form{grid-template-columns:1fr;padding:12px}.premium-chat-form button{width:100%}
  .chat-head{padding:14px;flex-wrap:wrap}.takeover-controls{width:100%;margin:0}.takeover-controls>*{width:100%}
  .otp-modal,.processing-modal{padding:22px 16px;border-radius:14px;max-height:calc(100dvh - 16px)}
  .modal-layer{align-items:end;padding:8px}.otp-modal,.processing-modal{width:100%;max-width:100%;border-radius:16px 16px 10px 10px}
  .otp-modal input{font-size:19px;letter-spacing:.25em}
  .processing-ring{width:104px;height:104px}
  .form-actions{display:grid;grid-template-columns:1fr}.form-actions>*,.form-actions form,.form-actions button{width:100%}
  .client-editor>summary,.tx-editor>summary{padding:14px}.client-editor-body,.tx-edit-form{padding:0 14px 16px}
  .login-shell{min-height:100dvh}.login-hero{padding:30px 20px}.login-panel{padding:26px 18px}.login-card{max-width:none}
}

@media(max-width:430px){
  :root{--content-pad:12px}
  .topbar{padding-inline:12px}.top-actions{gap:5px}.icon-btn,.lang-pill,.menu-btn{height:36px;min-width:36px}.lang-pill{padding-inline:9px}
  .welcome{grid-template-columns:1fr}.welcome .status,.welcome-actions{justify-self:start}
  .hero-actions,.quick-command{grid-template-columns:1fr!important}
  .card,.surface{padding:15px}.balance{padding:18px}.balance h1,.hero-balance{font-size:28px!important}
  .bankcard{padding:17px}.card-brand{font-size:13px}.chip{width:38px;height:28px}.cardnum{font-size:13px;letter-spacing:.05em}.card-network{font-size:14px}
  .beneficiary-layout,.transfer-layout,.cards-grid,.two,.banking-grid,.lower-grid{gap:12px}
  .premium-chat .bubble{max-width:94%}
  .thread-item{flex-basis:82vw}
  .section-head{gap:8px}.section-head>a{margin-left:0;width:100%}
  .table-wrap{border-radius:8px}
  input,select,textarea{font-size:16px}
}

@media(max-width:360px){
  .brand{font-size:13px}.sidebar{width:92vw}.container{padding-inline:10px}.topbar{padding-inline:10px}
  .bankcard{padding:15px}.cardnum{font-size:12px}.card-meta-block span{font-size:8px}
}


/* ===== BIID responsive trust refinement ===== */
/* Fixed navigation on desktop; mobile drawer remains fixed. */
@media(min-width:821px){
  .app-shell{display:block;min-height:100vh}
  .sidebar{position:fixed;left:0;top:0;bottom:0;height:100vh;width:var(--sidebar);overflow-y:auto;overscroll-behavior:contain}
  .main-area{margin-left:var(--sidebar);min-height:100vh}
  html[dir="rtl"] .sidebar{left:auto;right:0}
  html[dir="rtl"] .main-area{margin-left:0;margin-right:var(--sidebar)}
}
/* Statuses: every state is visually distinct and accessible. */
.status{font-size:10px;padding:6px 10px;border:1px solid transparent;font-weight:800;letter-spacing:.01em}
.welcome .status{font-size:11px;padding:8px 12px}
.status.actif,.status.active,.status.recu,.status.completed,.status.effectue,.status.approuve{background:#e9f7ef;color:#157347;border-color:#cdebd9}
.status.en_cours{background:#e9f4ff;color:#1769aa;border-color:#cfe4f7}
.status.en_attente,.status.pending{background:#fff5dd;color:#9b6816;border-color:#f2dfad}
.status.en_suspend{background:#f1ecff;color:#6948a5;border-color:#dfd4f8}
.status.rejete,.status.rejected{background:#fff0f0;color:#b83e45;border-color:#f2d0d2}
.status.annule{background:#f2f4f6;color:#64717a;border-color:#dfe4e7}
.status.bloque,.status.blocked{background:#ffe9ea;color:#ad2831;border-color:#f2c9cc}
.status-chip.status-en_cours{background:#e9f4ff;color:#1769aa}.status-chip.status-en_attente{background:#fff5dd;color:#9b6816}.status-chip.status-en_suspend{background:#f1ecff;color:#6948a5}.status-chip.status-rejete{background:#fff0f0;color:#b83e45}.status-chip.status-annule{background:#f2f4f6;color:#64717a}.status-chip.status-approuve,.status-chip.status-recu,.status-chip.status-effectue{background:#e9f7ef;color:#157347}
/* Canadian maple leaf watermark, deliberately subtle. */
.maple-watermark{position:relative;isolation:isolate;overflow:hidden}
.maple-watermark:after{content:"";position:absolute;z-index:-1;right:3%;top:50%;width:min(30vw,260px);aspect-ratio:1;transform:translateY(-50%) rotate(-7deg);background:url('images/branding/maple-leaf-blue.svg') center/contain no-repeat;opacity:.10;pointer-events:none}
/* Dashboard: six actions without cramped cards. */
.quick-command{grid-template-columns:repeat(6,minmax(0,1fr))}
.quick-command>a{padding:13px 12px;min-width:0}
/* Back to top: arrow only. */
#toTop{position:fixed;right:22px;bottom:22px;z-index:160;width:auto!important;height:auto!important;min-width:0!important;min-height:0!important;padding:5px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#0b628f!important;font-size:30px!important;line-height:1!important;font-weight:400!important}
#toTop:hover{transform:translateY(-2px);color:#063d5c!important}
/* Transfer history is card-based, never horizontally scrollable. */
.transfer-history-list{display:grid;gap:0;border-top:1px solid #edf1f3}
.transfer-history-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid #edf1f3;min-width:0}
.transfer-history-main{display:grid;gap:4px;min-width:0}.transfer-history-main strong{font-size:11px;overflow-wrap:anywhere}.transfer-history-main span{font-size:9px;color:#7a8c96}
.transfer-history-meta{display:flex;align-items:center;justify-content:flex-end;gap:15px;min-width:0}.source-account{font-size:9px;color:#657b87;max-width:180px;overflow-wrap:anywhere}.transfer-value{font-size:11px;white-space:nowrap;font-variant-numeric:tabular-nums}
/* Loan / insurance */
.service-hero{display:flex;align-items:center;justify-content:space-between;min-height:190px;margin-bottom:16px;padding:30px 34px;border:1px solid #dfe7ec;border-radius:14px;background:#fff}.service-hero h1{margin:7px 0 8px;font-size:30px;letter-spacing:-.035em}.service-hero p{max-width:620px;margin:0;color:#6f818c}.eyebrow{font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#0c65a1}.service-icon{width:58px;height:58px;border-radius:14px;display:grid;place-items:center;background:#edf7fc;color:#0c65a1}.service-icon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.loan-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:16px;margin-bottom:16px}.loan-result{display:flex;flex-direction:column;justify-content:center}.loan-result>span{font-size:10px;color:#6f818c}.loan-result>strong{font-size:32px;margin:8px 0 18px;color:#0b3e5c}.loan-result>div{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid #edf1f3;font-size:10px}.loan-result p{font-size:9px;color:#7d8e98;margin:14px 0 0}.product-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.product-cards article{padding:20px;border:1px solid #e1e8ec;border-radius:12px;background:#fff;min-width:0}.product-cards article>span{font-size:9px;font-weight:800;color:#0c65a1}.product-cards h3{margin:10px 0 7px;font-size:14px}.product-cards p{margin:0;color:#71838d;font-size:10px;line-height:1.6}.insurance-products{margin-bottom:16px}.insurance-products .text-action{display:inline-block;margin-top:16px}.protection-summary{display:flex;justify-content:space-between;align-items:center;gap:20px}.protection-summary>div{display:flex;align-items:center;gap:14px}.protection-summary h2{margin:0 0 5px;font-size:14px}.protection-summary p{margin:0;color:#71838d;font-size:10px}
.diagnostic-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.diagnostic-grid>div{padding:13px;border:1px solid #e4eaee;border-radius:9px}.diagnostic-grid span,.diagnostic-grid strong{display:block}.diagnostic-grid span{font-size:8.5px;color:#7d8d96}.diagnostic-grid strong{margin-top:4px;font-size:10px;overflow-wrap:anywhere}
@media(max-width:1180px){.quick-command{grid-template-columns:repeat(3,1fr)}.quick-command>a:nth-child(3){border-right:0}.diagnostic-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.loan-grid,.product-cards{grid-template-columns:1fr}.service-hero{padding:24px}.service-hero h1{font-size:25px}.diagnostic-grid{grid-template-columns:1fr 1fr}.maple-watermark:after{width:210px;right:-40px}.transfer-history-item{grid-template-columns:1fr;gap:10px}.transfer-history-meta{justify-content:space-between;align-items:center;gap:8px}.source-account{max-width:42%}}
@media(max-width:620px){.quick-command{grid-template-columns:1fr 1fr!important}.quick-command>a{border-right:0;border-bottom:1px solid #e7ecef}.quick-command>a:nth-last-child(-n+2){border-bottom:0}.transfer-history-item{padding:14px 0}.transfer-history-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'source amount' 'status status';align-items:center}.source-account{grid-area:source;max-width:none}.transfer-value{grid-area:amount}.transfer-history-meta .status{grid-area:status;justify-self:start;margin-top:2px}.service-hero{min-height:160px;padding:20px}.service-icon{width:48px;height:48px}.service-hero h1{font-size:22px}.diagnostic-grid{grid-template-columns:1fr}.protection-summary{align-items:flex-start;flex-direction:column}.protection-summary .primary{width:100%;text-align:center}.welcome .status{font-size:10px;padding:7px 10px}}
@media(max-width:430px){.quick-command{grid-template-columns:1fr!important}.quick-command>a{min-height:58px;border-bottom:1px solid #e7ecef!important}.quick-command>a:last-child{border-bottom:0!important}.transfer-history-meta{grid-template-columns:1fr;grid-template-areas:'source' 'amount' 'status';justify-items:start}.service-hero .service-icon{display:none}.service-hero h1{font-size:21px}#toTop{right:12px;bottom:14px;font-size:27px!important}}

@media(max-width:820px){body.menu-open{overflow:hidden}}


/* ===== Canadian trust background + service workflows ===== */
.main-area{position:relative;isolation:isolate}
.main-area:before{content:"";position:fixed;z-index:-2;inset:0;background-image:url('images/branding/maple-leaf-blue.svg');background-repeat:repeat;background-size:150px 150px;background-position:30px 40px;opacity:.032;pointer-events:none}
.container:before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(rgba(244,247,248,.92),rgba(244,247,248,.92));pointer-events:none}
.surface,.card,.service-hero,.product-cards article{background:rgba(255,255,255,.965)}
.service-contact-btn{display:inline-flex!important;align-items:center;justify-content:center;min-height:44px!important;height:auto!important;max-width:280px;padding:11px 18px!important;line-height:1.2!important;white-space:normal;text-align:center;align-self:center;border-radius:10px!important}
.request-history{margin-top:16px}.request-list{display:grid}.request-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid #edf1f3}.request-row:first-child{border-top:0}.request-row>div{min-width:0}.request-row strong,.request-row span{display:block}.request-row>div span{margin-top:3px;color:#71838d;font-size:10px;overflow-wrap:anywhere}.insurance-subscribe{margin-bottom:16px}
@media(max-width:820px){
  .main-area:before{background-size:118px 118px;background-position:12px 20px;opacity:.035}
  .sidebar{position:fixed!important;left:0!important;top:0!important;bottom:0!important;height:100dvh!important;width:min(86vw,300px)!important;transform:translateX(-105%)!important;transition:transform .22s ease!important;z-index:220!important;overflow-y:auto!important}
  .sidebar.open{transform:translateX(0)!important}.main-area{margin-left:0!important;margin-right:0!important}.menu-btn,.mobile-brand{display:grid!important}
  html[dir="rtl"] .sidebar{left:auto!important;right:0!important;transform:translateX(105%)!important}html[dir="rtl"] .sidebar.open{transform:translateX(0)!important}
}
@media(max-width:620px){.protection-summary{display:grid;grid-template-columns:1fr;gap:16px}.protection-summary>div{align-items:flex-start}.service-contact-btn{width:100%!important;max-width:none!important;align-self:stretch}.request-row{align-items:flex-start;flex-direction:column}.request-row .status{align-self:flex-start}}

/* Account status aligned to the far right of the account header */
.account-title-line{width:100%;align-items:flex-start}
.account-hero-status{margin-left:auto;flex:0 0 auto;align-self:flex-start;padding:7px 12px;font-size:9px;letter-spacing:.02em}
@media(max-width:420px){.account-title-line{align-items:center}.account-title-line>div{min-width:0}.account-title-line strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:58vw}.account-hero-status{padding:6px 9px;font-size:8px}}

/* ===== Universal collapsible navigation drawer =====
   The side navigation is intentionally hidden at every viewport width and
   opens only from the hamburger button, on desktop, tablet and mobile. */
.app-shell{display:block!important;min-height:100vh!important}
.main-area{margin-left:0!important;margin-right:0!important;min-width:0!important;width:100%!important}
.sidebar{
  position:fixed!important;
  left:0!important;
  right:auto!important;
  top:0!important;
  bottom:0!important;
  width:min(86vw,300px)!important;
  height:100dvh!important;
  transform:translateX(-106%)!important;
  transition:transform .24s cubic-bezier(.2,.8,.2,1)!important;
  box-shadow:24px 0 64px rgba(4,28,43,.20)!important;
  z-index:260!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  padding-top:24px!important;
}
.sidebar.open{transform:translateX(0)!important}
html[dir="rtl"] .sidebar{left:auto!important;right:0!important;transform:translateX(106%)!important}
html[dir="rtl"] .sidebar.open{transform:translateX(0)!important}
.mobile-overlay{
  display:block!important;
  position:fixed!important;
  inset:0!important;
  z-index:250!important;
  background:rgba(4,24,36,.42)!important;
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transition:opacity .2s ease,visibility .2s ease!important;
}
.mobile-overlay.open{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
.menu-btn{display:grid!important;flex:0 0 auto!important;width:40px!important;min-width:40px!important;height:40px!important;border-radius:10px!important;font-size:18px!important;line-height:1!important}
.mobile-brand{display:flex!important;align-items:center!important;gap:8px!important;flex:0 0 auto!important;font-size:12px!important;font-weight:850!important;color:var(--navy)!important}
.mobile-brand .logo{width:30px!important;height:30px!important;border-radius:8px!important}
.topbar{padding-left:clamp(12px,2.4vw,34px)!important;padding-right:clamp(12px,2.4vw,34px)!important}
@media(min-width:821px){
  .page-title{margin-left:8px!important}
  .container{width:min(100%,1420px)!important;margin-inline:auto!important}
}
@media(max-width:820px){
  .sidebar{top:0!important;height:100dvh!important}
  .mobile-overlay{inset:0!important}
}
@media(max-width:430px){
  .topbar{gap:10px!important}
  .mobile-brand{font-size:11px!important}
  .mobile-brand .logo{width:28px!important;height:28px!important}
  .menu-btn{width:38px!important;min-width:38px!important;height:38px!important}
}

/* ===== BIID maple pattern across every page and surface ===== */
html,body{min-height:100%;background-color:#f4f7f8!important}
body{
  background-image:url('images/branding/maple-leaf-pattern.svg')!important;
  background-repeat:repeat!important;
  background-size:180px 180px!important;
  background-attachment:fixed!important;
  background-position:0 0!important;
}
/* Preserve the pattern through the application canvas instead of hiding it. */
.main-area,.container,.page,.content,.auth-shell,.login-shell,.admin-shell{background:transparent!important}
.main-area:before,.container:before{content:none!important;display:none!important}
/* Small, low-contrast leaves continue through cards/panels without reducing legibility. */
.surface,.card,.service-hero,.product-cards article,.panel,.auth-card,.login-card,.modal-card,.table-card{
  background-color:rgba(255,255,255,.965)!important;
  background-image:url('images/branding/maple-leaf-pattern.svg')!important;
  background-repeat:repeat!important;
  background-size:210px 210px!important;
  background-position:18px 12px!important;
}
/* Dense controls stay plain for readability. */
input,select,textarea,button,.primary,.secondary,.text-action,.status,.badge,table,thead,tbody,tr,td,th{
  background-image:none;
}
@media(max-width:820px){
  body{background-size:145px 145px!important}
  .surface,.card,.service-hero,.product-cards article,.panel,.auth-card,.login-card,.modal-card,.table-card{background-size:175px 175px!important}
}
@media(max-width:430px){
  body{background-size:125px 125px!important}
  .surface,.card,.service-hero,.product-cards article,.panel,.auth-card,.login-card,.modal-card,.table-card{background-size:155px 155px!important}
}

/* BIID brand replacement */
.brand .brand-logo,.mobile-brand .brand-logo{display:block;width:auto;max-width:100%;height:56px;max-height:56px;object-fit:contain;object-position:left center}
.sidebar .brand{min-height:78px;padding:4px 8px 10px}
.mobile-brand .brand-logo{width:168px;max-height:58px}
.account-hero{background:linear-gradient(135deg,#2b2722 0%,#4b3a27 52%,#8d683d 100%)!important}
.demo-banner{background:#2c2823!important;color:#efe3d1!important}
@media(max-width:900px){.brand .brand-logo{height:54px;max-width:150px}.sidebar{--sidebar:235px}}
@media(max-width:600px){.brand .brand-logo{height:48px;max-width:132px}.mobile-brand .brand-logo{height:46px;max-width:126px}}

/* BIID — Refonte lisibilité du bloc compte principal */
.premium-account{
  background:#ffffff!important;
  border:1px solid #d7e1e7!important;
  border-radius:16px!important;
  padding:28px 30px!important;
  box-shadow:0 10px 30px rgba(20,45,60,.07)!important;
  align-items:stretch!important;
  min-height:245px;
}
.premium-account:before,.premium-account:after{display:none!important}
.account-hero-main{width:100%;}
.account-title-line{align-items:center!important;margin-bottom:24px!important;}
.account-title-line>div{gap:6px!important;}
.account-type{font-size:10px!important;color:#617783!important;letter-spacing:.12em!important;}
.account-title-line strong{font-size:16px!important;color:#132f40!important;font-weight:750!important;}
.account-hero-status{font-size:11px!important;padding:7px 12px!important;border-radius:999px!important;}
.hero-balance-label{margin-top:0!important;color:#6b7f8b!important;font-size:10px!important;font-weight:700!important;letter-spacing:.08em!important;text-transform:uppercase!important;}
.hero-balance{font-size:48px!important;line-height:1.05!important;color:#092f48!important;font-weight:780!important;letter-spacing:-.035em!important;margin-top:7px!important;}
.account-details{display:grid!important;grid-template-columns:1.25fr .7fr 1fr!important;gap:0!important;margin-top:24px!important;padding-top:17px!important;border-top:1px solid #e8eef1!important;}
.account-details div{padding-right:22px!important;}
.account-details div+div{border-left:1px solid #e8eef1!important;padding-left:22px!important;}
.account-details span{font-size:9px!important;color:#7b8d97!important;font-weight:700!important;letter-spacing:.06em!important;}
.account-details strong{font-size:12px!important;color:#274554!important;font-weight:700!important;margin-top:2px!important;}
.hero-actions{min-width:245px!important;align-self:flex-end!important;display:grid!important;grid-template-columns:1fr!important;gap:10px!important;}
.action-lg{min-height:48px!important;padding:0 18px!important;border-radius:9px!important;font-size:12px!important;font-weight:750!important;justify-content:center!important;}
.primary{background:#0b648f!important;color:#fff!important;box-shadow:0 5px 12px rgba(11,100,143,.16)!important;}
.secondary{background:#fff!important;color:#173b4e!important;border:1px solid #cfdce3!important;}
.action-lg svg{width:18px!important;height:18px!important;}

@media(max-width:1000px){
 .premium-account{display:flex!important;flex-direction:column!important;min-height:0!important;}
 .hero-actions{min-width:0!important;width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important;}
}
@media(max-width:620px){
 .premium-account{padding:21px 18px!important;border-radius:13px!important;}
 .account-title-line{margin-bottom:20px!important;}
 .account-title-line strong{font-size:14px!important;}
 .hero-balance{font-size:37px!important;}
 .account-details{grid-template-columns:1fr 1fr!important;margin-top:20px!important;gap:15px 0!important;}
 .account-details div{padding-right:12px!important;}
 .account-details div+div{padding-left:12px!important;}
 .account-details div:first-child{grid-column:1/-1!important;border-left:0!important;padding-left:0!important;border-bottom:1px solid #e8eef1!important;padding-bottom:12px!important;}
 .hero-actions{grid-template-columns:1fr 1fr!important;}
}
@media(max-width:420px){
 .account-title-line{align-items:flex-start!important;}
 .account-title-line strong{max-width:62vw!important;white-space:normal!important;}
 .account-hero-status{font-size:9px!important;padding:6px 9px!important;}
 .hero-balance{font-size:32px!important;}
 .account-details{grid-template-columns:1fr!important;}
 .account-details div:first-child{grid-column:auto!important;}
 .account-details div+div{border-left:0!important;padding-left:0!important;border-top:1px solid #edf1f3!important;padding-top:12px!important;}
 .hero-actions{grid-template-columns:1fr!important;}
}

/* BIID BANK LIMITED branding */
.brand .brand-logo,.mobile-brand .brand-logo{width:auto!important;max-width:100%;height:56px!important;max-height:56px!important;object-fit:contain}.mobile-brand .brand-logo{height:46px!important;max-width:126px!important}.page-title span{font-weight:600}.card-brand{font-size:10px!important;letter-spacing:.06em!important;white-space:nowrap}.card-network{font-size:9px!important;letter-spacing:.04em!important;white-space:nowrap}.mini-card-bottom>b{font-size:8px!important;letter-spacing:.03em}.mini-bankcard .card-brand{font-size:10px!important;letter-spacing:.05em!important}@media(max-width:600px){.brand .brand-logo{height:48px!important;max-width:132px!important}.mobile-brand .brand-logo{height:44px!important;max-width:122px!important}}

.admin-shell .brand-logo{width:auto!important;max-width:150px!important;height:54px!important}.admin-shell .mobile-brand .brand-logo{width:auto!important;max-width:126px!important;height:46px!important}

.otp-modal{user-select:none}.otp-modal input,.otp-modal textarea{user-select:text}

.processing-close-form{margin:0}.processing-close-form .primary{width:100%}


/* BIID PWA installation */
.biid-install-card{
  position:fixed;left:18px;right:18px;bottom:18px;z-index:99999;
  max-width:520px;margin:auto;padding:15px 16px;
  display:flex;align-items:center;gap:13px;
  background:rgba(255,255,255,.97);color:#082e46;
  border:1px solid rgba(8,46,70,.14);border-radius:18px;
  box-shadow:0 18px 55px rgba(8,46,70,.22);
  backdrop-filter:blur(18px);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  animation:biidInstallIn .35s ease-out;
}
.biid-install-card[hidden]{display:none!important}
.biid-install-icon{
  width:48px;height:48px;flex:0 0 48px;border-radius:13px;object-fit:cover;
  box-shadow:0 5px 16px rgba(8,46,70,.16)
}
.biid-install-copy{min-width:0;flex:1}
.biid-install-copy strong{display:block;font-size:14px;line-height:1.25}
.biid-install-copy span{display:block;margin-top:3px;font-size:12px;line-height:1.35;color:#60717c}
.biid-install-actions{display:flex;gap:7px;align-items:center}
.biid-install-btn{
  border:0;border-radius:11px;padding:10px 13px;background:#082e46;color:#fff;
  font-weight:800;font-size:12px;cursor:pointer;white-space:nowrap
}
.biid-install-close{
  width:34px;height:34px;border:1px solid #d9e1e5;border-radius:10px;background:#fff;
  color:#536873;font-size:18px;cursor:pointer
}
.biid-install-card.is-installed{border-color:rgba(199,168,107,.4)}
.biid-install-card.is-installed .biid-install-btn{background:#c7a86b;color:#082e46}
@keyframes biidInstallIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:600px){
  .biid-install-card{left:10px;right:10px;bottom:10px;padding:13px;border-radius:16px}
  .biid-install-icon{width:44px;height:44px;flex-basis:44px}
  .biid-install-copy span{font-size:11px}
  .biid-install-btn{padding:9px 10px}
}


/* BIID branding — responsive, stable, non-invasive */
.brand-logo,
.brand img,
.mobile-brand .brand-logo,
.public-brand img,
.footer-brand img {
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  object-fit:contain;
  object-position:center;
}
.sidebar .brand-logo,
.mobile-brand .brand-logo {
  max-height:58px;
}
.login-hero .brand img {
  max-height:64px;
}
.bankcard,
.mini-bankcard {
  isolation:isolate;
}
.bankcard::before,
.mini-bankcard::before {
  content:"";
  position:absolute;
  z-index:0;
  right:22px;
  bottom:20px;
  width:clamp(72px,18%,104px);
  aspect-ratio:376 / 105;
  background:url("images/branding/biid-bank-limited-wordmark.png") center/contain no-repeat;
  opacity:.72;
  pointer-events:none;
}
.bankcard .card-topline,
.bankcard .card-tech,
.bankcard .cardnum,
.bankcard .cardmeta,
.mini-bankcard .mini-card-top,
.mini-bankcard .mini-chip,
.mini-bankcard .mini-number,
.mini-bankcard .mini-card-bottom,
.mini-card-logo {
  position:relative;
  z-index:1;
}
.mini-card-logo{
  position:absolute;
  z-index:1;
  right:18px;
  bottom:18px;
  width:clamp(62px,19%,92px);
  aspect-ratio:376 / 105;
  background:url("images/branding/biid-bank-limited-wordmark.png") center/contain no-repeat;
  opacity:.58;
  pointer-events:none;
}
.product-large::before,
.phone-wrap::before {
  content:"";
  position:absolute;
  z-index:3;
  right:24px;
  bottom:22px;
  width:clamp(90px,18%,150px);
  aspect-ratio:376 / 105;
  background:url("images/branding/biid-bank-limited-wordmark.png") center/contain no-repeat;
  opacity:.82;
  pointer-events:none;
}
.phone-wrap::before {
  right:8%;
  bottom:4%;
  width:clamp(78px,22%,128px);
  opacity:.72;
}
@media (max-width:600px) {
  .sidebar .brand-logo {max-height:48px}
  .mobile-brand .brand-logo {max-height:46px}
  .login-hero .brand img {max-height:54px}
  .bankcard::before {right:14px;bottom:14px;width:78px}
  .mini-card-logo {right:14px;bottom:14px;width:78px}
  .product-large::before,
  .phone-wrap::before {right:16px;bottom:16px;width:94px}
}