@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap");html,body,#root{
  margin:0;
  width:100%;
  min-width:0;
  min-height:100%;
}
*{box-sizing:border-box}
body{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button,input{font:inherit}
button{border:0;cursor:pointer}


/* DSAS NOVA FIX: keep all 6 Admin Dashboard navigation items visible on mobile */
.admin-nav{grid-template-columns:repeat(6,minmax(0,1fr))!important}
.admin-nav button{min-width:0!important;overflow:hidden}
@media(max-width:700px){.admin-nav{grid-template-columns:repeat(6,minmax(0,1fr))!important}.admin-nav button span:last-child{font-size:9px!important}}

:root{--nova:#0bb477;--nova2:#18c989;--navy:#061a2c;--navy2:#0a2c3a;--gold:#d9b45f;--ink:#10263a;--muted:#728296;--bg:#f4f8f6;--card:#fff;--line:#e1eae6;--soft:#e9f7f1;--danger:#d94e59;--shadow:0 14px 40px rgba(6,35,28,.07)}
*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;font-family:"DM Sans",system-ui,sans-serif;color:var(--ink);background:var(--bg)}body{overflow-x:hidden}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}.app{min-height:100vh;padding-bottom:82px;background:linear-gradient(#f8fbfa,#f3f7f5)}
.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:rgba(255,255,255,.94);backdrop-filter:blur(20px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}.top-brand{display:flex;align-items:center;gap:10px}.top-brand b{font-size:14px;font-weight:800;display:block}.top-brand small{font-size:9px;color:var(--muted);display:block;margin-top:2px}.logo{width:40px;height:40px}.logo.large{width:82px;height:82px}.wallet-line{display:flex;justify-content:space-between;align-items:center}.wallet-line small{font-size:9px;letter-spacing:1.3px;opacity:.65}.wallet-line strong{font-size:31px;letter-spacing:-1px;display:block;margin-top:7px}.wallet-line button{width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.1);color:#fff}.fund-btn{margin-top:18px;width:100%;padding:12px;border-radius:12px;background:#fff;color:var(--navy);font-weight:900;position:relative}.section-head{display:flex;align-items:end;justify-content:space-between;margin:25px 0 12px}.section-head h2{font-size:17px;margin:0;font-weight:800}.section-head button{background:none;color:var(--nova);font-weight:800;font-size:11px}.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.service-card{background:#fff;border:1px solid var(--line);border-radius:19px;padding:16px;text-align:left;box-shadow:var(--shadow);transition:.2s}.service-card:active{transform:scale(.98)}.service-card b,.service-card small{display:block}.service-card b{font-size:13px;margin-top:10px}.service-card small{font-size:10px;color:var(--muted);margin-top:4px;line-height:1.35}.service-icon,.provider-icon{display:grid;place-items:center;width:45px;height:45px;border-radius:14px;background:var(--soft);color:var(--nova);font-weight:900;font-size:20px}.airtime{background:#fff4dc!important;color:#b47a10!important}.tv{background:#f0ebff!important;color:#7358d4!important}.electricity{background:#fff5d5!important;color:#bd8a00!important}.exam{background:#eaf1ff!important;color:#426fc5!important}.betting{background:#f7e9ef!important;color:#a83d63!important}.ezam{background:#e7f2f5!important;color:#22738a!important}.esim{background:#e9f8ef!important;color:#158b59!important}.nova-banner,.market-hero{margin-top:14px;border:1px solid #d8ebe3;background:linear-gradient(135deg,#eaf8f2,#fff);border-radius:20px;padding:18px;display:flex;justify-content:space-between;gap:12px}.nova-banner span,.market-hero small,.public-kicker{font-size:9px;letter-spacing:1.3px;color:var(--nova);font-weight:900}.nova-banner h3,.market-hero h2{font-size:17px;margin:6px 0}.nova-banner p,.market-hero p{font-size:11px;color:var(--muted);line-height:1.5;margin:0}.nova-banner button{background:var(--navy);color:#fff;border-radius:12px;padding:10px 13px;font-weight:800}.row-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;display:flex;align-items:center;gap:11px;margin-bottom:9px}.row-card>div{flex:1}.row-card b,.row-card small{display:block}.row-card b{font-size:12px}.row-card small{font-size:10px;color:var(--muted);margin-top:4px}.tx-icon{width:38px;height:38px;border-radius:12px;background:var(--soft);color:var(--nova);display:grid;place-items:center;font-weight:900}.empty{text-align:center;background:#fff;border:1px dashed var(--line);border-radius:18px;padding:30px 18px;color:var(--muted)}.empty div{font-size:28px}.empty h3{color:var(--ink);font-size:15px;margin:8px 0 4px}.page-title{margin:4px 0 19px}.page-title small{color:var(--nova);font-size:9px;letter-spacing:1.2px;font-weight:900}.page-title h1{font-size:27px;letter-spacing:-.7px;margin:5px 0}.page-title p{font-size:11px;color:var(--muted);margin:0}.market-search{height:48px;border:1px solid var(--line);background:#fff;border-radius:15px;padding:0 14px;display:flex;align-items:center;gap:8px;color:var(--muted);margin-bottom:10px}.market-search input{border:0;outline:0;background:none;flex:1;font-size:12px}.category-pills{display:flex;gap:7px;overflow:auto;padding-bottom:3px}.category-pills button{white-space:nowrap;padding:8px 12px;border-radius:20px;background:#fff;border:1px solid var(--line);color:var(--muted);font-size:10px;font-weight:800}.category-pills button.active{background:var(--navy);border-color:var(--navy);color:#fff}.provider-card{width:100%;display:flex;align-items:center;gap:12px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;margin:9px 0;box-shadow:var(--shadow)}.provider-card>div{flex:1}.provider-card b,.provider-card small{display:block}.provider-card b{font-size:12px}.provider-card small{font-size:10px;color:var(--muted);margin-top:4px}.provider-card>strong{color:var(--nova);font-size:21px}.payment-info,.profile-card,.settings-card,.complaint,.coming-card,.secure-note{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;margin-bottom:11px}.pay-logo{width:44px;height:44px;border-radius:12px;background:#111;color:#fff;display:grid;place-items:center;font-weight:900;float:left;margin-right:11px}.amount-input{display:flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 13px}.amount-input input{width:100%;border:0;outline:0;padding:15px 7px;font-size:20px}.quick-amounts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:9px 0 15px}.quick-amounts button{background:var(--soft);color:var(--nova);border-radius:10px;padding:9px;font-weight:800}.primary{width:100%;padding:14px;border-radius:13px;background:linear-gradient(135deg,var(--nova),var(--nova2));color:#fff;font-weight:900;box-shadow:0 10px 22px rgba(11,180,119,.18)}.ghost-btn{width:100%;padding:12px;border-radius:13px;background:#eef4f2;color:var(--navy);font-weight:800}.wide{margin-top:8px}.back-btn,.text-btn{background:none;color:var(--nova);font-weight:800}.secure-note{background:#edf8f3;color:#4d685f;font-size:11px}.network-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.network-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px}.network-card b,.network-card small{display:block}.network-card small{font-size:10px;color:var(--muted);margin-top:3px}.network{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:#eef3f5;font-weight:900;margin-bottom:10px}.network.mtn{background:#ffe500}.network.airtel{background:#e60000;color:#fff}.network.glo{background:#0a9f59;color:#fff}.network.nine{background:#111;color:#fff}.bottom{position:fixed;bottom:0;left:0;right:0;height:80px;background:rgba(255,255,255,.96);backdrop-filter:blur(18px);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);z-index:40}.bottom button{background:none;color:#91a098;font-size:10px;font-weight:600}.bottom .nav-icon{display:block;font-size:20px;margin-bottom:4px}.bottom button.active{color:var(--nova);font-weight:900}.drawer-wrap,.modal-wrap{position:fixed;inset:0;background:rgba(4,20,31,.55);z-index:80}.drawer{position:absolute;left:0;top:0;bottom:0;width:min(88%,360px);background:#fff;padding:20px;box-shadow:20px 0 60px rgba(0,0,0,.2)}.drawer-head{display:flex;justify-content:space-between;align-items:center}.drawer-head button,.modal-close{width:36px;height:36px;border-radius:11px;background:#eef4f2;font-size:20px}.drawer h3{margin:22px 0 8px}.drawer>button{width:100%;background:#fff;border-bottom:1px solid var(--line);padding:15px 5px;text-align:left;display:flex;gap:10px}.drawer>button span{flex:1}.modal-wrap{display:grid;place-items:center;padding:18px}.modal{width:min(100%,430px);background:#fff;border-radius:24px;padding:22px;position:relative}.modal-close{position:absolute;right:14px;top:14px}.modal input{width:100%;padding:14px;border:1px solid var(--line);border-radius:12px;margin:12px 0}.notice{display:flex;gap:9px;align-items:center;background:#eaf8f1;border:1px solid #d1ebdf;color:#176d43;border-radius:12px;padding:11px;margin-bottom:12px;font-size:11px}.notice div{flex:1}.notice button{background:none;color:inherit;font-size:18px}.auth-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 15% 10%,#0eae76 0,#071b2d 44%,#03121f 100%);position:relative;overflow:hidden}.auth-card{width:min(100%,430px);background:rgba(255,255,255,.98);border-radius:28px;padding:28px;box-shadow:0 30px 90px rgba(0,0,0,.3);position:relative;z-index:2}.auth-card>.logo{margin:auto}.brand-title{text-align:center;font-size:23px;font-weight:900;margin-top:9px}.tagline{text-align:center;font-size:9px;letter-spacing:1.4px;color:var(--nova);font-weight:900;margin:6px 0 16px}.auth-showcase{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:17px}.auth-showcase span{padding:7px 2px;border-radius:9px;background:#eef6f2;color:#4c675f;text-align:center;font-size:7px;font-weight:900}.auth-card h2{margin:4px 0}.muted,.switch{font-size:11px;color:var(--muted)}.auth-card label{font-size:10px;font-weight:800;display:block;margin:12px 0 6px}.auth-card input{width:100%;padding:13px;border:1px solid var(--line);border-radius:12px;outline:0;margin-bottom:9px}.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}.otp{text-align:center;letter-spacing:7px;font-size:23px}.switch{text-align:center;margin-top:13px}.spinner{width:18px;height:18px;border:3px solid #dce8e4;border-top-color:var(--nova);border-radius:50%;animation:spin .8s linear infinite}.loading-message{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:11px;margin:18px 0}.fatal-error{min-height:100vh;display:grid;place-items:center;text-align:center;padding:25px;background:var(--bg)}
/* Full-screen NOVA opening animation */
.nova-splash{min-height:100svh;width:100%;display:grid;place-items:center;position:relative;overflow:hidden;color:#fff;background:radial-gradient(circle at 50% 35%,#0d755b 0,#062a35 32%,#03131f 70%,#010b12 100%)}.nova-splash:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 0 35%,rgba(255,255,255,.05) 50%,transparent 65%);animation:sweep 2.3s ease-in-out infinite}.nova-splash-center{position:relative;z-index:3;text-align:center;animation:novaEnter 1.1s cubic-bezier(.2,.8,.2,1) both}.nova-logo-stage{width:138px;height:138px;margin:auto;display:grid;place-items:center;position:relative}.nova-logo-stage .logo{width:94px;height:94px;position:relative;z-index:2;filter:drop-shadow(0 16px 28px rgba(0,0,0,.35));animation:novaLogo 1.3s cubic-bezier(.2,.8,.2,1) both}.nova-logo-ring{position:absolute;inset:4px;border:1px solid rgba(53,225,154,.6);border-radius:42px;box-shadow:0 0 45px rgba(19,201,137,.18);animation:ringPulse 1.8s ease-in-out infinite}.nova-wordmark{font-size:31px;font-weight:800;letter-spacing:4px;margin-top:14px}.nova-wordmark span{color:#e3c26f}.nova-tagline{font-size:8px;letter-spacing:2.3px;color:#b9d8ce;margin-top:7px}.nova-progress{width:145px;height:3px;background:rgba(255,255,255,.1);border-radius:20px;margin:25px auto 0;overflow:hidden}.nova-progress span{display:block;width:35%;height:100%;background:#e3c26f;border-radius:20px;animation:progress 1.65s ease-in-out infinite}.nova-particles:before,.nova-particles:after{content:"";position:absolute;width:3px;height:3px;background:#35e19a;border-radius:50%;box-shadow:12vw 8vh #d9b45f,25vw 72vh #35e19a,70vw 18vh #d9b45f,82vw 65vh #35e19a,91vw 32vh #d9b45f,6vw 54vh #35e19a;animation:float 5s linear infinite}.nova-orbit{position:absolute;border:1px solid rgba(53,225,154,.13);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.orbit-one{width:390px;height:390px;animation:orbit 12s linear infinite}.orbit-two{width:620px;height:620px;border-color:rgba(217,180,95,.08);animation:orbit 18s linear reverse infinite}.nova-splash-footer{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:9px;color:#708c86;font-size:7px;letter-spacing:1.4px;white-space:nowrap}.nova-splash-footer i{width:3px;height:3px;border-radius:50%;background:#d9b45f}@keyframes novaEnter{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}@keyframes novaLogo{from{opacity:0;transform:scale(.55) rotate(-12deg)}70%{opacity:1;transform:scale(1.07) rotate(2deg)}to{transform:scale(1) rotate(0)}}@keyframes ringPulse{0%,100%{transform:scale(.92);opacity:.5}50%{transform:scale(1.08);opacity:1}}@keyframes progress{0%{transform:translateX(-80px)}50%{transform:translateX(110px)}100%{transform:translateX(-80px)}}@keyframes sweep{0%{transform:translateX(-70%)}60%,100%{transform:translateX(70%)}}@keyframes float{0%{transform:translate3d(0,0,0)}50%{transform:translate3d(20px,-16px,0)}100%{transform:translate3d(0,0,0)}}@keyframes orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes spin{to{transform:rotate(360deg)}}
/* Public landing */
.public-home{min-height:100svh;position:relative;overflow:hidden;background:radial-gradient(circle at 90% 10%,#0e8d67 0,#061a2c 40%,#03111c 100%);color:#fff}.public-bg-orb{position:absolute;border-radius:50%;filter:blur(2px);opacity:.25}.public-bg-orb.orb-a{width:330px;height:330px;background:#1bd193;right:-120px;top:-90px}.public-bg-orb.orb-b{width:280px;height:280px;background:#d9b45f;left:-170px;bottom:80px}.public-header{height:72px;display:flex;justify-content:space-between;align-items:center;padding:0 18px;position:relative;z-index:2}.public-header .top-brand b{color:#fff}.public-header .top-brand small{color:#9fc5b8}.public-login{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.14);padding:10px 16px;border-radius:12px;font-weight:800}.public-main{max-width:1100px;margin:auto;padding:42px 20px 30px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:30px;position:relative;z-index:1}.public-copy{max-width:620px}.public-kicker{color:#46e2a7}.public-copy h1{font-size:clamp(42px,6vw,72px);line-height:.98;letter-spacing:-2.8px;margin:13px 0 18px}.public-copy h1 em{font-style:normal;color:#d9b45f}.public-copy p{max-width:530px;color:#b8d2c9;font-size:15px;line-height:1.7}.public-actions{display:flex;gap:10px;margin-top:25px;max-width:380px}.public-actions .primary,.public-actions .ghost-btn{width:auto;flex:1}.public-actions .ghost-btn{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.12)}.trust-row{display:flex;gap:18px;margin-top:18px;color:#8fb3a8;font-size:10px;font-weight:800}.public-phone{display:flex;justify-content:center}.phone-shell{width:280px;height:545px;border:7px solid #1b3140;border-radius:40px;background:#061b2b;box-shadow:0 30px 90px rgba(0,0,0,.45);padding:10px;transform:rotate(4deg);animation:phoneFloat 4s ease-in-out infinite}.phone-notch{width:88px;height:20px;border-radius:20px;background:#07131c;margin:0 auto 9px}.phone-screen{height:100%;border-radius:29px;background:linear-gradient(#f7fbf9,#eef6f3);color:var(--ink);padding:16px}.mini-top{display:flex;justify-content:space-between;font-weight:900;font-size:11px}.mini-top b{color:var(--nova)}.phone-screen>small{display:block;color:var(--muted);font-size:8px;margin-top:30px}.phone-screen>strong{display:block;font-size:25px;margin:5px 0 13px}.mini-fund{background:var(--navy);color:#fff;border-radius:11px;padding:10px;text-align:center;font-size:9px;font-weight:800}.mini-title{font-size:11px;font-weight:900;margin:20px 0 8px}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mini-grid span{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;font-size:18px;color:var(--nova)}.mini-grid b{display:block;font-size:8px;color:var(--ink);margin-top:6px}.public-services{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:center;gap:26px;flex-wrap:wrap;padding:18px;background:rgba(1,11,18,.55);border-top:1px solid rgba(255,255,255,.07);color:#78988f;font-size:8px;letter-spacing:1.4px}@keyframes phoneFloat{0%,100%{transform:rotate(4deg) translateY(0)}50%{transform:rotate(2deg) translateY(-12px)}}
/* Admin premium */
.admin-app{min-height:100vh;background:var(--bg);padding-bottom:80px}.admin-top{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 18px;position:sticky;top:0;z-index:20}.admin-content{max-width:1100px;margin:auto;padding:20px}.admin-hero{background:linear-gradient(135deg,var(--navy),#0a4b44);color:#fff;border-radius:24px;padding:22px;display:flex;justify-content:space-between;gap:15px}.admin-hero h2{margin:7px 0;font-size:24px}.admin-hero p{font-size:11px;color:#b8d2c9;max-width:620px}.admin-hero>span{font-size:9px;color:#e0c16d;font-weight:900}.admin-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:13px 0}.admin-stats>div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:15px}.admin-stats small{display:block;color:var(--muted);font-size:9px}.admin-stats strong{display:block;font-size:19px;margin-top:6px}.quick-admin{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px}.quick-admin>div{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.quick-admin button{background:#f3f8f5;border:1px solid var(--line);border-radius:14px;padding:14px;text-align:left}.quick-admin button b,.quick-admin button small{display:block}.quick-admin button b{margin-top:8px}.quick-admin button small{color:var(--muted);font-size:9px;margin-top:3px}.admin-note{background:#edf7f3;color:#526a61;border-radius:13px;padding:12px;font-size:10px;margin-top:12px}.admin-nav{position:fixed;bottom:0;left:0;right:0;height:78px;background:var(--card);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(7,minmax(0,1fr));overflow:hidden;z-index:40;padding:4px 2px 3px}.admin-nav button{background:none;color:#87959f;font-size:18px;min-width:0;width:100%;padding:2px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.admin-nav button span{display:block;font-size:8px;margin-top:1px;white-space:nowrap}.admin-nav button.active{color:var(--nova);font-weight:900}.table-list{margin-top:10px}.admin-row,.complaint-row{background:#fff;border:1px solid var(--line);border-radius:15px;padding:14px;display:flex;justify-content:space-between;gap:12px;margin-bottom:8px}.admin-row b,.admin-row small{display:block}.admin-row small{color:var(--muted);font-size:10px;margin-top:4px}.status{padding:5px 8px;border-radius:8px;background:#edf1f5;font-size:9px;font-weight:800}.status.resolved{background:#e7f8ee;color:#18733f}.settings-card{display:block}.settings-card h3{margin:0 0 7px}.settings-card p{font-size:11px;color:var(--muted)}
@media(max-width:760px){.public-main{grid-template-columns:1fr;padding-top:28px}.public-copy{text-align:center;margin:auto}.public-copy p{margin-left:auto;margin-right:auto}.public-actions{margin-left:auto;margin-right:auto}.trust-row{justify-content:center}.public-phone{margin:10px 0 90px}.public-services{position:relative}.admin-stats{grid-template-columns:1fr 1fr}.quick-admin>div{grid-template-columns:1fr 1fr}}@media(min-width:800px){.content{padding-top:30px}.bottom{left:50%;right:auto;width:700px;transform:translateX(-50%);border:1px solid var(--line);border-radius:20px 20px 0 0}.admin-nav{left:50%;right:auto;width:900px;transform:translateX(-50%);border:1px solid var(--line);border-radius:18px 18px 0 0}}

:root{--blue:#075fe8;--blue2:#19b6ff;--green:#28f27b;--ink:#10233f;--muted:#71809a;--bg:#f5f8fc;--card:#fff;--line:#e6edf6;--danger:#e5484d;--shadow:0 14px 40px rgba(20,55,100,.10)}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}a{text-decoration:none;color:inherit}.app{min-height:100vh;background:var(--bg);padding-bottom:82px}.topbar,.admin-top{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:sticky;top:0;z-index:20}.top-brand,.admin-brand{display:flex;align-items:center;gap:10px}.top-brand b,.admin-brand b{display:block;font-size:15px}.top-brand small,.admin-brand small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.icon-btn,.admin-actions button{width:40px;height:40px;border-radius:12px;background:#f3f7fc;color:var(--ink);font-size:19px}.notification-dot{position:relative}.content{max-width:620px;margin:auto;padding:20px}.logo{width:40px;height:40px}.logo.large{width:76px;height:76px}.admin-app{min-height:100vh;background:#f3f6fa;padding-bottom:76px}.admin-top{position:sticky;top:0;z-index:20}.admin-content{max-width:1000px;margin:auto;padding:24px}.admin-actions{display:flex;gap:8px}.admin-hero{background:linear-gradient(135deg,#075fe8,#0b84e9);color:#fff;border-radius:24px;padding:24px;display:flex;justify-content:space-between;align-items:flex-start}.admin-hero h2{margin:6px 0}.admin-hero p{max-width:650px;opacity:.78}.admin-hero>span{background:rgba(255,255,255,.16);padding:8px 10px;border-radius:10px;font-size:11px;font-weight:900}.admin-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.admin-stats strong{font-size:22px;margin-top:7px}.quick-admin{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px}.quick-admin h3{margin-top:0}.quick-admin>div{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.quick-admin button{background:#f7f9fc;border:1px solid var(--line);border-radius:15px;padding:15px;text-align:left}.quick-admin button>b,.quick-admin button>small{display:block}.quick-admin button>b{margin-top:9px}.quick-admin button>small{color:var(--muted);margin-top:3px}.table-list{margin-top:10px}.admin-row,.complaint-row{background:#fff;border:1px solid var(--line);border-radius:15px;padding:14px;display:flex;justify-content:space-between;gap:15px;margin-bottom:9px}.admin-row b,.admin-row small{display:block}.admin-row small{color:var(--muted);margin-top:4px}.reward-setting{justify-content:space-between}.reward-setting>div:first-child{flex:1}.reward-setting b,.reward-setting small{display:block}.reward-setting small{color:var(--muted);font-size:11px;margin-top:4px}.reward-setting input{width:120px;padding:11px;border:1px solid var(--line);border-radius:10px}.reward-setting button,.complaint-actions button,.settings-card button{padding:10px 13px;background:var(--blue);color:#fff;border-radius:10px;font-weight:800}.complaint-row>div:first-child{flex:1}.complaint-row p{margin:9px 0;color:#52627a}.complaint-actions{display:flex;flex-direction:column;gap:8px;align-items:flex-end}.status{padding:5px 8px;border-radius:8px;background:#edf1f5;font-size:10px;font-weight:800}.status.resolved{background:#e7f8ee;color:#18733f}.admin-nav{position:fixed;bottom:0;left:0;right:0;height:76px;background:#fff;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);z-index:40}.admin-nav button{background:none;color:#8b98aa}.admin-nav button span{display:block;font-size:10px;margin-top:4px}.admin-nav button.active{color:var(--blue);font-weight:900}.settings-card{display:block}.settings-card h3{margin-top:0}.settings-card p{color:var(--muted);font-size:13px}.settings-card button{margin-top:6px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes load{50%{transform:translateX(130%)}}@media(max-width:700px){.admin-content{padding:16px}.admin-stats{grid-template-columns:1fr 1fr}.quick-admin>div{grid-template-columns:1fr 1fr}.admin-nav{grid-template-columns:repeat(5,1fr)}.admin-nav button{font-size:15px}.admin-nav button span{font-size:9px}.support-cards{grid-template-columns:1fr}.content{padding:16px}.topbar{padding:0 15px}}@media(min-width:800px){.app .content{padding-top:30px}.bottom{left:50%;right:auto;width:620px;transform:translateX(-50%);border:1px solid var(--line);border-radius:18px 18px 0 0}.admin-nav{left:50%;right:auto;width:900px;transform:translateX(-50%);border-radius:18px 18px 0 0;border:1px solid var(--line)}}
/* DSAS NOVA polish: preserve the existing palette while improving hierarchy and motion. */
.top-brand b,.admin-brand b,.service-card b,.wallet-line strong,.section-head h2,.page-title h1,.referral-banner b,.payment-info b,.profile-card b,.settings-list button b,.admin-hero h2,.quick-admin button>b,.admin-row b,.complaint-row b{font-weight:800}
.service-card small,.page-title p,.payment-info small,.profile-card small,.settings-list small{font-weight:500}
.service-list-grid{display:grid;gap:11px}.provider-card{width:100%;background:#fff;border:1px solid var(--line);border-radius:18px;padding:15px;display:flex;align-items:center;gap:13px;text-align:left;box-shadow:var(--shadow)}.provider-card>div{flex:1}.provider-card b,.provider-card small{display:block}.provider-card small{color:var(--muted);font-size:12px;margin-top:3px}.provider-icon{width:46px;height:46px;border-radius:14px;background:#eaf3ff;color:var(--blue);display:grid;place-items:center;font-size:21px;font-weight:900}.provider-icon.airtime{background:#eefcf4;color:#119653}.provider-icon.tv{background:#f0edff;color:#6b4de6}.provider-icon.electricity{background:#fff5d8;color:#d59b00}.provider-icon.exam{background:#fff0e8;color:#df6b2f}.provider-icon.betting{background:#f2eaff;color:#7b42d6}.provider-icon.esim{background:#e8f8f1;color:#14895a}.retry-btn{background:#eaf3ff!important;color:var(--blue)!important}
.splash{overflow:hidden;background:linear-gradient(145deg,#061a39 0%,#073d91 45%,#075fe8 100%)}.splash-stage{position:relative;z-index:2;text-align:center;animation:splash-stage-in .8s ease-out both}.splash-logo{animation:splash-logo-in 1s cubic-bezier(.2,.8,.2,1) both}.splash h1{font-weight:850;letter-spacing:-.4px;animation:splash-title-in .8s .25s ease-out both}.splash p{font-size:15px;animation:splash-title-in .8s .38s ease-out both}.splash-glow{position:absolute;border-radius:50%;filter:blur(24px);opacity:.18;pointer-events:none}.splash-glow-a{width:260px;height:260px;background:#19b6ff;top:12%;left:-90px;animation:glow-drift 5s ease-in-out infinite}.splash-glow-b{width:300px;height:300px;background:#28f27b;right:-120px;bottom:8%;animation:glow-drift 6s 1s ease-in-out infinite reverse}.floating-icons{position:absolute;inset:-100px -130px;pointer-events:none}.floating-icons span{position:absolute;display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px);box-shadow:0 12px 35px rgba(0,0,0,.12);font-size:20px;animation:float-icon 5.5s ease-in-out infinite}.floating-icons span:nth-child(1){left:3%;top:38%;animation-delay:-1.2s}.floating-icons span:nth-child(2){right:3%;top:24%;animation-delay:-3.1s}.floating-icons span:nth-child(3){right:8%;bottom:13%;animation-delay:-4.2s}.loader{position:relative;height:4px;width:120px;margin:25px auto 0}.loader span{display:block;height:100%;width:38%;border-radius:20px;background:#28f27b;animation:load-smooth 1.8s ease-in-out infinite}.loader:after{display:none}
@keyframes splash-stage-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes splash-logo-in{0%{opacity:0;transform:scale(.72) rotate(-4deg)}70%{opacity:1;transform:scale(1.04) rotate(1deg)}100%{transform:scale(1) rotate(0)}}@keyframes splash-title-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes float-icon{0%,100%{transform:translate3d(0,0,0) rotate(0);opacity:.62}50%{transform:translate3d(0,-16px,0) rotate(5deg);opacity:1}}@keyframes glow-drift{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(22px,-18px,0) scale(1.08)}}@keyframes load-smooth{0%{transform:translateX(0);width:25%}50%{transform:translateX(120px);width:42%}100%{transform:translateX(0);width:25%}}@media(prefers-reduced-motion:reduce){.splash-stage,.splash-logo,.splash h1,.splash p,.floating-icons span,.splash-glow-a,.splash-glow-b,.loader span{animation:none}.loader span{width:70%}}

/* Final DSAS NOVA polish: clean splash, in-place reward motion, stronger hierarchy, safer back navigation. */
.splash-stage{width:min(92vw,420px);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:420px}
.splash-logo{filter:drop-shadow(0 14px 30px rgba(0,0,0,.18))}
.splash h1{font-weight:900}
.splash p{font-weight:600;letter-spacing:.1px}
.reward-strip{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.reward-mini{min-width:0;display:flex;align-items:center;gap:10px;text-align:left;padding:14px;border-radius:17px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow);color:var(--ink)}
.reward-mini>div{min-width:0;flex:1}
.reward-mini b,.reward-mini small{display:block}
.reward-mini b{font-weight:850}
.reward-mini small{color:var(--muted);font-size:10px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reward-mini-icon{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;font-size:20px;flex:none}
.cashback .reward-mini-icon{background:#eaf3ff;color:var(--blue);animation:reward-breathe 3.2s ease-in-out infinite}
.offers .reward-mini-icon{background:#eaf8ef;color:#168b51;animation:reward-float 3.6s ease-in-out infinite}
.referral-banner .gift{display:inline-grid;place-items:center;animation:reward-float 3.8s ease-in-out infinite}
.service-icon.betting{animation:reward-breathe 4s ease-in-out infinite}
.service-icon.ezam{background:#fff3e8;color:#e37a21;animation:reward-breathe 4.2s ease-in-out infinite}
.service-icon.exam{animation:reward-breathe 4.5s ease-in-out infinite}
@keyframes reward-breathe{0%,100%{transform:scale(1);opacity:.92}50%{transform:scale(1.06);opacity:1}}
@keyframes reward-float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(2deg)}}
@media(max-width:430px){.reward-strip{grid-template-columns:1fr}.reward-mini small{white-space:normal}.splash-stage{min-height:380px}}
@media(prefers-reduced-motion:reduce){.cashback .reward-mini-icon,.offers .reward-mini-icon,.referral-banner .gift,.service-icon.betting,.service-icon.ezam,.service-icon.exam{animation:none}}
.floating-icons{display:none!important}

/* DSAS logo asset + resilient loading/error states */
.logo { display:flex; align-items:center; justify-content:center; overflow:hidden; }

/* Runtime safety: never leave the user on a white screen if a UI component throws. */
.nova-runtime-error{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#061a39,#073d91 55%,#075fe8);color:#fff}
.nova-runtime-card{width:min(92vw,430px);text-align:center;padding:34px 24px;border-radius:28px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(18px);box-shadow:0 24px 70px rgba(0,0,0,.28)}
.nova-runtime-logo{width:82px;height:82px;margin:0 auto 14px}
.nova-runtime-logo img{width:100%;height:100%;display:block}
.nova-runtime-card .nova-wordmark{font-size:26px;font-weight:900}
.nova-runtime-card .nova-wordmark span{color:#d9b45a}
.nova-runtime-card h1{font-size:22px;margin:22px 0 8px}
.nova-runtime-card p{color:rgba(255,255,255,.78);line-height:1.55;margin:0 0 22px}
.nova-runtime-card .primary{width:100%}


/* =========================================================
   DSAS NOVA — Premium UI completion
   Repairs missing component styles without touching API/backend.
   ========================================================= */
:root{--nova-deep:#071b2e;--nova-green:#0bb477;--nova-green-2:#19c98b;--nova-gold:#d9b45f;--nova-bg:#f4f8fc;--nova-border:#e2e9ef}
.app{background:linear-gradient(180deg,#f8fbfd 0%,#f2f6fa 100%);padding-bottom:92px;min-height:100svh}
.content{max-width:980px;margin:0 auto;padding:24px 20px 108px;min-height:calc(100svh - 72px)}
.topbar{height:72px;padding:0 max(16px,calc((100vw - 980px)/2 + 20px));background:rgba(255,255,255,.96);border-bottom:1px solid #e5edf2;box-shadow:0 5px 22px rgba(7,27,46,.04)}
.icon-btn{width:46px;height:46px;border-radius:15px;background:#f2f6fa;color:var(--nova-deep);font-size:24px;display:grid;place-items:center;line-height:1}
.top-brand{gap:11px}.top-brand b{font-size:17px;color:var(--nova-deep)}.top-brand small{font-size:11px}.logo{flex:none}.logo img,.dsas-nova-logo{width:100%;height:100%;display:block;object-fit:contain}
.nova-customer-home{padding-top:4px}.nova-welcome{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.nova-welcome small{display:block;color:var(--nova-green);font-weight:900;letter-spacing:1.4px;font-size:10px}.nova-welcome h1{margin:4px 0 4px;font-size:31px;line-height:1.08;letter-spacing:-1px;color:var(--nova-deep)}.nova-welcome p{margin:0;color:#6f7f91;font-size:13px}.nova-avatar{width:48px;height:48px;border-radius:16px;background:var(--nova-deep);color:#fff;font-size:18px;font-weight:900;box-shadow:0 10px 25px rgba(7,27,46,.15)}
.nova-wallet{position:relative;overflow:hidden;background:linear-gradient(135deg,#071b2e,#0b3d45 68%,#0b6a55);color:#fff;border-radius:25px;padding:22px;box-shadow:0 20px 42px rgba(7,27,46,.16);margin-bottom:26px}.nova-wallet-glow{position:absolute;width:220px;height:220px;right:-90px;top:-100px;background:rgba(25,201,139,.26);filter:blur(20px);border-radius:50%}.nova-wallet-top,.nova-wallet-bottom{position:relative;z-index:1}.nova-wallet-top{display:flex;align-items:flex-start;justify-content:space-between}.nova-wallet-top small{font-size:9px;letter-spacing:1.5px;color:rgba(255,255,255,.65)}.nova-wallet-top strong{display:block;font-size:30px;margin-top:7px;letter-spacing:-1px}.nova-wallet-top button{width:40px;height:40px;border-radius:13px;background:rgba(255,255,255,.10);color:#fff}.nova-wallet-bottom{display:flex;gap:10px;margin-top:22px}.nova-wallet-bottom button{flex:1;padding:12px;border-radius:13px;background:rgba(255,255,255,.12);color:#fff;font-weight:800;border:1px solid rgba(255,255,255,.12)}.nova-wallet-bottom button:first-child{background:#fff;color:var(--nova-deep)}
.nova-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:25px 0 12px}.nova-section-head small{font-size:9px;letter-spacing:1.4px;color:var(--nova-green);font-weight:900}.nova-section-head h2{margin:3px 0 0;font-size:20px;letter-spacing:-.5px;color:var(--nova-deep)}.nova-section-head>button{background:transparent;color:var(--nova-green);font-weight:900;font-size:12px;padding:5px}
.nova-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.nova-service-grid>button,.nova-market-grid>button{min-width:0;text-align:left;background:#fff;border:1px solid var(--nova-border);border-radius:18px;padding:15px;box-shadow:0 8px 24px rgba(7,27,46,.05);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.nova-service-grid>button:active,.nova-market-grid>button:active{transform:scale(.98)}.nova-service-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#e9f8f2;color:var(--nova-green);font-size:20px;font-weight:900;margin-bottom:11px}.nova-service-grid b{display:block;color:var(--nova-deep);font-size:14px}.nova-service-grid small{display:block;color:#748398;font-size:10px;line-height:1.35;margin-top:4px}.nova-service-icon.airtime{background:#fff5df;color:#b47a10}.nova-service-icon.tv{background:#f0edff;color:#6e55d6}.nova-service-icon.electricity{background:#fff6d8;color:#b78300}.nova-service-icon.exam{background:#edf3ff;color:#426fc5}.nova-service-icon.betting{background:#f5ebff;color:#7b42d6}.nova-service-icon.ezam{background:#fff0e5;color:#d06d22}.nova-service-icon.esim{background:#e8f8f1;color:#14895a}
.nova-feature{margin:24px 0;background:linear-gradient(135deg,#eaf8f2,#fff);border:1px solid #d9ebe3;border-radius:21px;padding:19px;display:flex;align-items:center;justify-content:space-between;gap:15px}.nova-feature small{color:var(--nova-green);font-weight:900;font-size:9px;letter-spacing:1.4px}.nova-feature h3{margin:5px 0 7px;font-size:20px;color:var(--nova-deep)}.nova-feature p{margin:0;color:#708094;font-size:11px;line-height:1.5}.nova-feature button{flex:none;background:var(--nova-deep);color:#fff;padding:11px 14px;border-radius:13px;font-weight:900}
.nova-search{height:52px;background:#fff;border:1px solid var(--nova-border);border-radius:16px;padding:0 14px;display:flex;align-items:center;gap:9px;box-shadow:0 7px 20px rgba(7,27,46,.04)}.nova-search>input{min-width:0;flex:1;border:0;outline:0;color:var(--nova-deep);background:transparent;font-size:14px}.nova-search>input::placeholder{color:#8c99a8}.nova-categories{display:flex;gap:8px;overflow:auto;padding:12px 0 4px;scrollbar-width:none}.nova-categories::-webkit-scrollbar{display:none}.nova-categories button{white-space:nowrap;border:1px solid var(--nova-border);background:#fff;color:#738297;border-radius:22px;padding:9px 14px;font-size:11px;font-weight:900}.nova-categories button.active{background:var(--nova-deep);border-color:var(--nova-deep);color:#fff}.nova-market-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:12px}.nova-market-grid>button{position:relative;display:flex;align-items:center;gap:12px;min-height:92px}.nova-market-grid .nova-service-icon{margin:0;flex:none}.nova-market-grid>button>div{min-width:0;flex:1}.nova-market-grid b{display:block;font-size:13px;color:var(--nova-deep);line-height:1.2}.nova-market-grid small{display:block;margin-top:5px;color:#748398;font-size:10px;line-height:1.3}.nova-market-grid>button>strong{color:var(--nova-green);font-size:22px}
.nova-support-cards{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:14px}.nova-support-cards a{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--nova-border);border-radius:18px;padding:15px;color:var(--nova-deep);text-decoration:none;box-shadow:0 8px 22px rgba(7,27,46,.04)}.support-icon{width:44px;height:44px;flex:none;border-radius:14px;display:grid;place-items:center;font-weight:900;font-size:19px}.support-icon.whatsapp{background:#e8f8ef;color:#15935c}.support-icon.email{background:#eef3ff;color:#3f67c6}.nova-support-cards a>div{min-width:0;flex:1}.nova-support-cards b,.nova-support-cards small{display:block}.nova-support-cards b{font-size:13px}.nova-support-cards small{margin-top:4px;color:#78879a;font-size:10px;line-height:1.35}.nova-support-cards a>strong{color:var(--nova-green);font-size:20px}.nova-complaint{padding:20px;border-radius:21px;box-shadow:0 10px 28px rgba(7,27,46,.04)}.form-heading>span{font-size:9px;letter-spacing:1.4px;color:var(--nova-green);font-weight:900}.form-heading h3{margin:5px 0 5px;font-size:21px;color:var(--nova-deep)}.form-heading p{margin:0 0 18px;color:#7a899b;font-size:11px}.nova-complaint label{display:block;margin:12px 0 7px;color:var(--nova-deep);font-size:11px;font-weight:800}.nova-complaint label span{font-weight:500;color:#8794a3}.nova-complaint input,.nova-complaint select,.nova-complaint textarea{width:100%;border:1px solid #dfe7ed;border-radius:13px;background:#fbfcfd;color:var(--nova-deep);outline:0;padding:13px;font-size:13px}.nova-complaint input:focus,.nova-complaint select:focus,.nova-complaint textarea:focus{border-color:#7bd9b7;box-shadow:0 0 0 3px rgba(11,180,119,.10)}.nova-complaint textarea{resize:vertical;min-height:125px}.nova-complaint .primary{margin-top:16px}
.nova-profile-card{display:flex;align-items:center;gap:16px;padding:18px;border-radius:21px}.profile-avatar{width:86px;height:86px;border-radius:22px;background:#edf4f8;display:grid;place-items:center;flex:none}.profile-avatar .logo.large{width:70px;height:70px}.profile-identity{min-width:0}.profile-identity>b{display:block;font-size:19px;color:var(--nova-deep);line-height:1.2}.profile-identity>small{display:block;margin-top:5px;color:#778699;font-size:11px;overflow-wrap:anywhere}.verified-pill{display:inline-flex;align-items:center;gap:4px;margin-top:9px;padding:5px 9px;border-radius:20px;background:#e9f8f1;color:#128a57;font-size:9px;font-weight:900}.nova-account-stats{margin-bottom:12px}.nova-settings-list{display:grid;gap:10px}.nova-settings-list .setting-item{width:100%;display:flex;align-items:center;gap:12px;text-align:left;padding:15px;background:#fff;border:1px solid var(--nova-border);border-radius:17px;color:var(--nova-deep);box-shadow:0 7px 20px rgba(7,27,46,.04)}.nova-settings-list .setting-item>div{min-width:0;flex:1}.setting-icon{width:42px;height:42px;flex:none;border-radius:13px;background:#edf8f4;color:var(--nova-green);display:grid;place-items:center;font-size:19px;font-weight:900}.biometric-icon{background:#eef3ff;color:#4169c7}.nova-settings-list .setting-item b,.nova-settings-list .setting-item small{display:block}.nova-settings-list .setting-item b{font-size:13px}.nova-settings-list .setting-item small{margin-top:4px;color:#7c8a9b;font-size:10px;line-height:1.35}.setting-status{font-size:10px!important;color:var(--nova-green);font-weight:900}.setting-status.enabled{padding:6px 9px;border-radius:20px;background:#e8f8ef}.nova-settings-list .danger-btn .setting-icon{background:#fff0f0;color:#d94e59}.nova-settings-list .danger-btn{color:#a52f3a}
.nova-bottom{height:82px;min-height:82px;padding:8px 6px max(8px,env(safe-area-inset-bottom));background:rgba(255,255,255,.98);border-top:1px solid #dfe8ee;box-shadow:0 -10px 28px rgba(7,27,46,.07);z-index:60}.nova-bottom button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:transparent;color:#8996a5;font-size:10px;font-weight:800;min-width:0}.nova-bottom button .nav-icon{font-size:21px;line-height:1;color:#8a98a8}.nova-bottom button.active{color:var(--nova-green)}.nova-bottom button.active .nav-icon{color:var(--nova-green);transform:translateY(-1px)}.nova-bottom button:active{transform:scale(.96)}
.nova-splash{position:fixed;inset:0;z-index:9999;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 50% 43%,#0b6a55 0%,#073d43 28%,#061b2d 64%,#04121f 100%);color:#fff;min-height:100svh}.nova-splash-center{position:relative;z-index:3;width:min(88vw,390px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transform:translateY(-3vh);animation:nova-center-in .8s cubic-bezier(.2,.8,.2,1) both}.nova-logo-stage{position:relative;width:154px;height:154px;display:grid;place-items:center;margin-bottom:20px}.nova-logo-stage>.logo.large{position:relative;z-index:3;width:92px;height:92px}.nova-logo-ring{position:absolute;inset:5px;border:1px solid rgba(25,201,139,.45);border-radius:50%;box-shadow:0 0 0 12px rgba(25,201,139,.025),0 0 45px rgba(25,201,139,.18);animation:nova-ring-pulse 2.8s ease-in-out infinite}.nova-logo-halo{position:absolute;width:104px;height:104px;border-radius:50%;background:rgba(25,201,139,.14);filter:blur(15px);animation:nova-halo 2.8s ease-in-out infinite}.nova-wordmark{font-size:37px;line-height:1;font-weight:900;letter-spacing:5px;color:#fff}.nova-wordmark span{color:var(--nova-gold)}.nova-tagline{margin-top:12px;font-size:10px;letter-spacing:3px;color:rgba(255,255,255,.66);font-weight:700}.nova-progress{width:130px;height:4px;background:rgba(255,255,255,.14);border-radius:20px;margin-top:26px;overflow:hidden}.nova-progress span{display:block;height:100%;width:38%;background:linear-gradient(90deg,var(--nova-green),var(--nova-gold));border-radius:20px;animation:nova-progress 1.8s ease-in-out infinite}.nova-splash-footer{position:absolute;z-index:3;bottom:max(30px,calc(22px + env(safe-area-inset-bottom)));left:0;right:0;display:flex;align-items:center;justify-content:center;gap:12px;color:rgba(255,255,255,.45);font-size:8px;font-weight:800;letter-spacing:2px}.nova-splash-footer i{width:4px;height:4px;border-radius:50%;background:var(--nova-gold)}.nova-orbit{position:absolute;z-index:1;border:1px solid rgba(104,220,190,.10);border-radius:50%;pointer-events:none}.nova-orbit.orbit-one{width:520px;height:520px;left:50%;top:50%;transform:translate(-50%,-50%);animation:nova-orbit 18s linear infinite}.nova-orbit.orbit-two{width:720px;height:720px;left:50%;top:50%;transform:translate(-50%,-50%);animation:nova-orbit 26s linear infinite reverse}.nova-orbit.orbit-three{width:900px;height:900px;left:50%;top:50%;transform:translate(-50%,-50%);border-color:rgba(217,180,95,.06);animation:nova-orbit 34s linear infinite}.nova-particles{position:absolute;inset:0;background:radial-gradient(circle at 27% 23%,rgba(25,201,139,.9) 0 2px,transparent 3px),radial-gradient(circle at 72% 31%,rgba(217,180,95,.9) 0 2px,transparent 3px),radial-gradient(circle at 79% 76%,rgba(25,201,139,.7) 0 2px,transparent 3px),radial-gradient(circle at 40% 78%,rgba(25,201,139,.6) 0 2px,transparent 3px);opacity:.8;animation:nova-particle-drift 7s ease-in-out infinite}.nova-particles:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,rgba(25,201,139,.12),transparent 32%)}
@keyframes nova-center-in{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(-3vh) scale(1)}}@keyframes nova-ring-pulse{0%,100%{transform:scale(.98);opacity:.55}50%{transform:scale(1.035);opacity:1}}@keyframes nova-halo{0%,100%{transform:scale(.88);opacity:.35}50%{transform:scale(1.08);opacity:.72}}@keyframes nova-progress{0%{transform:translateX(-120%)}50%{transform:translateX(210%)}100%{transform:translateX(-120%)}}@keyframes nova-orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes nova-particle-drift{50%{transform:translateY(-8px) scale(1.03);opacity:.95}}
.admin-app{min-height:100svh;background:linear-gradient(180deg,#f8fbfd,#f2f6fa);padding-bottom:90px}.admin-top{height:78px;background:rgba(255,255,255,.97);border-bottom:1px solid #e1e9ef;display:flex;align-items:center;justify-content:space-between;padding:0 max(18px,calc((100vw - 980px)/2 + 20px));position:sticky;top:0;z-index:30;box-shadow:0 5px 22px rgba(7,27,46,.04)}.admin-brand{display:flex;align-items:center;gap:11px}.admin-brand b{font-size:17px}.admin-brand small{display:block;color:#7a899b;font-size:10px;margin-top:2px}.admin-actions{display:flex;gap:8px}.admin-actions button{width:42px;height:42px;border-radius:14px;background:#f1f5f8;color:var(--nova-deep);font-size:20px}.admin-content{max-width:980px;margin:0 auto;padding:24px 20px 110px}.admin-hero{background:linear-gradient(135deg,#071b2e,#0b3d43);border:1px solid rgba(25,201,139,.18);color:#fff;border-radius:25px;padding:24px;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;box-shadow:0 20px 42px rgba(7,27,46,.14);overflow:hidden;position:relative}.admin-hero:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-100px;top:-110px;background:rgba(25,201,139,.20);filter:blur(5px)}.admin-hero>div,.admin-hero>span{position:relative;z-index:1}.admin-hero small{color:#7ee3c1;font-weight:800;letter-spacing:1px}.admin-hero h2{font-size:27px;letter-spacing:-.7px;margin:7px 0}.admin-hero p{max-width:520px;color:rgba(255,255,255,.68);font-size:11px;line-height:1.55;margin:0}.admin-hero>span{padding:9px 12px;border-radius:12px;background:rgba(217,180,95,.16);color:#f0ce79;font-size:10px;font-weight:900;letter-spacing:1px}.admin-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin:14px 0}.admin-stats>div{background:#fff;border:1px solid var(--nova-border);border-radius:18px;padding:17px;box-shadow:0 7px 20px rgba(7,27,46,.04)}.admin-stats small{display:block;color:#7c8a9b;font-size:10px}.admin-stats strong{display:block;color:var(--nova-deep);font-size:25px;margin-top:6px;letter-spacing:-.6px}.quick-admin{background:#fff;border:1px solid var(--nova-border);border-radius:21px;padding:19px;box-shadow:0 7px 20px rgba(7,27,46,.04)}.quick-admin h3{font-size:20px;color:var(--nova-deep);margin:0 0 14px}.quick-admin>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.quick-admin button{background:#f7fafb;border:1px solid #e3ebef;border-radius:16px;padding:14px;text-align:left;color:var(--nova-deep);min-height:90px}.quick-admin button>b,.quick-admin button>small{display:block}.quick-admin button>b{font-size:12px;margin-top:8px}.quick-admin button>small{font-size:9px;color:#7b8a9b;margin-top:4px}.quick-admin button:first-child{border-color:#bdebd9;background:#effaf5}.admin-note{margin-top:12px;background:#eef7f4;border:1px solid #d7ece4;color:#668073;border-radius:14px;padding:12px;font-size:10px}.admin-nav{height:82px!important;min-height:82px;padding:8px 6px max(8px,env(safe-area-inset-bottom));background:rgba(255,255,255,.98);border-top:1px solid #dfe8ee;box-shadow:0 -10px 28px rgba(7,27,46,.07)}.admin-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:transparent;color:#8b98a8;font-size:20px}.admin-nav button span{font-size:10px;margin:0}.admin-nav button.active{color:var(--nova-green)}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 14px}.stats>div{background:#fff;border:1px solid var(--nova-border);border-radius:17px;padding:14px}.stats small{display:block;color:#7a899b;font-size:10px}.stats b{display:block;color:var(--nova-deep);font-size:17px;margin-top:5px}.support-cards{display:grid}.complaint{width:100%}.back-btn{background:transparent;color:var(--nova-green);font-weight:900;padding:8px 0}.primary{background:linear-gradient(135deg,var(--nova-green),var(--nova-green-2));color:#fff;border-radius:14px;padding:13px 16px;font-weight:900;box-shadow:0 10px 22px rgba(11,180,119,.18)}.primary.wide{width:100%}
@media(max-width:700px){.content{padding:20px 16px 108px}.nova-welcome h1{font-size:29px}.nova-service-grid,.nova-market-grid{grid-template-columns:1fr 1fr}.nova-support-cards{grid-template-columns:1fr}.nova-feature{align-items:flex-start}.nova-feature button{padding:10px 12px}.nova-wordmark{font-size:32px;letter-spacing:4px}.nova-logo-stage{width:140px;height:140px}.nova-logo-stage>.logo.large{width:86px;height:86px}.nova-splash-center{transform:translateY(-2vh)}.admin-content{padding:20px 16px 108px}.admin-hero{padding:20px}.admin-hero h2{font-size:24px}.admin-nav{left:0!important;right:0!important;width:auto!important;transform:none!important;border-radius:0!important}.profile-identity>b{font-size:17px}}
@media(max-width:380px){.nova-service-grid,.nova-market-grid{grid-template-columns:1fr}.nova-wallet-top strong{font-size:26px}.nova-wallet-bottom{flex-direction:column}.nova-wordmark{font-size:28px}.nova-splash-footer{font-size:7px;gap:8px}.nova-profile-card{align-items:flex-start}.profile-avatar{width:70px;height:70px}.profile-avatar .logo.large{width:58px;height:58px}}
@media(min-width:800px){.nova-bottom{left:50%;right:auto;width:min(680px,100vw);transform:translateX(-50%);border:1px solid #dfe8ee;border-radius:20px 20px 0 0}.admin-nav{left:50%;right:auto;width:min(900px,100vw);transform:translateX(-50%);border-radius:20px 20px 0 0;border:1px solid #dfe8ee}.nova-service-grid,.nova-market-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.admin-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.quick-admin>div{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.nova-splash-center,.nova-logo-ring,.nova-logo-halo,.nova-progress span,.nova-orbit,.nova-particles{animation:none!important}.nova-progress span{transform:none;width:60%}}


/* ===== DSAS NOVA FINAL MOBILE / RESPONSIVE OVERRIDES ===== */
html,body,#root{width:100%;max-width:100%;min-width:0;overflow-x:hidden}
body{overscroll-behavior-x:none;-webkit-text-size-adjust:100%}
.app,.admin-app{width:100%;max-width:100%;overflow-x:hidden}
.content,.admin-content,.page{width:100%;max-width:100%;min-width:0;overflow-x:hidden}
button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

/* Customer bottom navigation: clear, bold and easy to tap */
.nova-bottom{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important}
.nova-bottom button{min-width:0!important;padding:7px 2px 4px!important;font-weight:900!important;color:#7f8d9b!important}
.nova-bottom button span:last-child{font-size:11px!important;font-weight:900!important;letter-spacing:.1px}
.nova-bottom button .nav-icon{font-size:23px!important;font-weight:800!important}
.nova-bottom button.active,.nova-bottom button.active span:last-child{color:var(--nova-green)!important}
.nova-bottom button:active{transform:scale(.97)}

/* Admin bottom navigation: bold labels + consistent icons */
.admin-nav{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important}
.admin-nav button{min-width:0!important;padding:7px 2px 4px!important;font-weight:900!important;color:#7f8d9b!important}
.admin-nav button .nav-icon{display:block;font-size:22px!important;line-height:1!important;font-weight:900!important}
.admin-nav button span:last-child{font-size:11px!important;font-weight:900!important;line-height:1.1!important;margin-top:5px!important}
.admin-nav button.active,.admin-nav button.active span:last-child{color:var(--nova-green)!important}

/* Data / Airtime marketplace cards */
.nova-network-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:12px 0 25px}
.network-choice{min-width:0;background:transparent;border:0;padding:0;text-align:center;color:var(--nova-deep);font-weight:900}
.network-choice .network{width:100%;height:66px;border-radius:18px;margin:0 auto 7px;display:grid;place-items:center;font-size:19px;box-shadow:0 7px 16px rgba(7,27,46,.07)}
.network-choice>b{font-size:12px}
.nova-plan-type-section{margin:0 0 18px}.nova-plan-type-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.nova-plan-type-title b{color:var(--nova-deep);font-size:13px}.nova-plan-type-title span{color:#7c8998;font-size:9px;font-weight:700}.nova-plan-type-grid{display:flex;gap:7px;overflow-x:auto;padding-bottom:3px;scrollbar-width:none}.nova-plan-type-grid::-webkit-scrollbar{display:none}.nova-plan-type-grid button{white-space:nowrap;padding:9px 12px;border-radius:18px;background:#fff;border:1px solid var(--nova-border);color:#788798;font-size:9px;font-weight:900}.nova-plan-type-grid button.active{background:var(--nova-deep);border-color:var(--nova-deep);color:#fff;box-shadow:0 6px 14px rgba(7,27,46,.1)}
.nova-plan-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:0 0 10px}
.nova-plan-head h3{margin:0;color:var(--nova-deep);font-size:20px;letter-spacing:-.4px}
.nova-plan-head span{color:#7c8998;font-size:10px;font-weight:700}
.nova-plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:14px}
.nova-plan-card{min-width:0;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;align-items:center;gap:8px 10px;text-align:left;background:#fff;border:1px solid var(--nova-border);border-radius:18px;padding:15px;box-shadow:0 8px 22px rgba(7,27,46,.045);transition:transform .18s ease,border-color .18s ease}
.nova-plan-card:active{transform:scale(.98)}
.nova-plan-card .plan-main{min-width:0}
.nova-plan-card .plan-main b{display:block;color:var(--nova-deep);font-size:17px;font-weight:900;white-space:nowrap}
.nova-plan-card .plan-main small{display:block;color:#788798;font-size:10px;margin-top:5px;font-weight:700}
.nova-plan-card>strong{color:var(--nova-green);font-size:17px;white-space:nowrap}
.nova-plan-card .plan-buy{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #edf1f3;padding-top:9px;color:var(--nova-deep);font-size:11px;font-weight:900}
.nova-plan-card .plan-buy i{font-style:normal;color:var(--nova-green);font-size:17px}
.secure-note{width:100%;max-width:100%;line-height:1.5;overflow-wrap:anywhere}


.nova-step-form{margin-top:6px}
.nova-step-form>label{display:block;color:var(--nova-deep);font-size:13px;font-weight:800;margin:0 0 7px}
.nova-step-field,.nova-step-value,.nova-step-input{width:100%;min-height:54px;box-sizing:border-box;border:1px solid var(--nova-border);border-radius:15px;background:#fff;color:var(--nova-deep);padding:0 15px;font-size:15px;text-align:left;display:flex;align-items:center;justify-content:space-between;margin:0 0 10px}
.nova-step-field{cursor:pointer}
.nova-step-field:disabled{opacity:.65;cursor:default}
.nova-step-field b{font-size:20px;color:var(--nova);line-height:1}
.nova-step-field.open{border-color:var(--nova);box-shadow:0 0 0 2px rgba(11,180,119,.08)}
.nova-step-field:not(.filled) span{color:#9aa7b2}
.nova-step-value{cursor:default}
.nova-step-value span{font-size:17px;font-weight:900;color:var(--nova-green)}
.nova-step-value small{color:#7c8998;font-size:10px;font-weight:700}
.nova-step-input{outline:0;margin-bottom:10px}
.nova-step-input::placeholder{color:#9aa7b2}
.nova-step-input:focus{border-color:var(--nova);box-shadow:0 0 0 2px rgba(11,180,119,.08)}
.nova-step-options{background:#fff;border:1px solid var(--nova-border);border-radius:15px;overflow:hidden;margin:-2px 0 14px;box-shadow:0 8px 22px rgba(7,27,46,.06)}
.nova-step-options>button{width:100%;min-height:50px;padding:12px 15px;border:0;border-bottom:1px solid #edf1f3;background:#fff;color:var(--nova-deep);font-size:14px;font-weight:800;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:12px}
.nova-step-options>button:last-child{border-bottom:0}
.nova-step-options>button:active{background:#f2faf7}
.nova-step-options .nova-step-loading{padding:14px 15px;color:#7c8998;font-size:12px;font-weight:700}
.nova-plan-options>button span{display:flex;flex-direction:column;gap:3px;min-width:0}
.nova-plan-options>button b{font-size:14px;color:var(--nova-deep)}
.nova-plan-options>button small{font-size:10px;color:#7c8998;font-weight:700}
.nova-plan-options>button strong{color:var(--nova-green);font-size:14px;white-space:nowrap}

/* Biometric setup and login */
.biometric-setting{cursor:pointer}
.biometric-setting:disabled{opacity:1;cursor:pointer}
.biometric-login-btn{width:100%;margin-top:9px;padding:13px;border-radius:13px;background:#eef8f4;color:var(--nova-deep);border:1px solid #d7ece3;font-weight:900;display:flex;align-items:center;justify-content:center;gap:8px}
.biometric-login-btn span{color:var(--nova-green);font-size:18px}

/* Prevent accidental wide cards / horizontal page drift */
.nova-wallet,.nova-feature,.nova-profile-card,.nova-settings-list,.nova-account-stats,.nova-plans,.nova-network-grid,.quick-admin,.admin-hero,.admin-stats,.admin-note{max-width:100%;min-width:0}
.admin-content *,.content *{max-width:100%}
.admin-row,.complaint-row{min-width:0;overflow-wrap:anywhere}

/* Mobile spacing */
@media(max-width:600px){
  .nova-network-grid{gap:7px}
  .network-choice .network{height:62px;border-radius:17px;font-size:17px}
  .nova-plan-card{padding:13px}
  .nova-plan-card .plan-main b{font-size:15px}
  .nova-plan-card>strong{font-size:15px}
  .nova-bottom button span:last-child,.admin-nav button span:last-child{font-size:11px!important}
}
@media(max-width:380px){
  .nova-plans{grid-template-columns:1fr}
  .nova-network-grid{gap:6px}
  .network-choice .network{height:58px;font-size:15px}
}


/* ===== DSAS NOVA SECURITY + REFERRAL POLISH ===== */
.login-methods{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:4px 0 12px;padding:4px;background:#f2f6f8;border-radius:13px}
.login-methods button{padding:10px 8px;border-radius:10px;background:transparent;color:#7b8999;font-size:11px;font-weight:900}
.login-methods button.active{background:#fff;color:var(--nova-deep);box-shadow:0 4px 12px rgba(7,27,46,.08)}
.pin-input{letter-spacing:8px;text-align:center;font-weight:900}
.nova-network-grid .network-choice{position:relative;padding-bottom:2px;transition:transform .16s ease}
.nova-network-grid .network-choice.selected{transform:translateY(-2px)}
.nova-network-grid .network-choice.selected .network{box-shadow:0 0 0 3px rgba(25,201,139,.18),0 10px 22px rgba(7,27,46,.12)}
.nova-network-grid .network-choice.selected>b{color:var(--nova-green)}
.nova-network-grid .network-choice small{display:block;color:var(--nova-green);font-size:8px;font-weight:900;margin-top:3px}
.referral-hero{display:flex !important;flex-direction:row !important;align-items:flex-start !important;gap:14px !important;margin:6px 0 18px;padding:2px 1px;min-width:0}
.referral-hero>span{flex:0 0 44px;width:44px;height:44px;border-radius:14px;background:rgba(25,201,139,.12);border:1px solid rgba(25,201,139,.18);display:grid;place-items:center;color:#19c98b}
.referral-hero>div{min-width:0;flex:1;display:block}
.referral-hero b{display:block !important;color:#fff;font-size:16px;line-height:1.25;margin:0 0 5px}
.referral-hero small{display:block !important;color:rgba(255,255,255,.62);font-size:10.5px;line-height:1.55}
.referral-code-panel{background:linear-gradient(145deg,#071b2e,#0b3d43);border:1px solid rgba(25,201,139,.18);border-radius:23px;padding:19px;color:#fff;box-shadow:0 16px 34px rgba(7,27,46,.12);overflow:hidden;position:relative}
.referral-code-panel:after{content:"";position:absolute;width:170px;height:170px;border-radius:50%;right:-80px;top:-90px;background:rgba(25,201,139,.15);filter:blur(2px);pointer-events:none}
.referral-code-head,.referral-code-value,.referral-actions,.referral-retry{position:relative;z-index:1}
.referral-code-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.referral-code-head small{display:block;color:#79dcb9;font-size:8px;font-weight:900;letter-spacing:1.5px}
.referral-code-head b{display:block;margin-top:4px;font-size:16px}
.referral-code-head>span{width:38px;height:38px;border-radius:12px;background:rgba(25,201,139,.12);color:#19c98b;display:grid;place-items:center;font-size:18px;font-weight:900}
.referral-secure-icon{font-family:inherit;line-height:1}
.referral-code-value{margin:18px 0 13px;background:rgba(255,255,255,.08);border:1px dashed rgba(255,255,255,.2);border-radius:15px;padding:17px;text-align:center;height:62px;box-sizing:border-box;display:grid;place-items:center}
.referral-code-value strong{font-size:23px;letter-spacing:2px;color:#f0ce79}
.code-skeleton{color:rgba(255,255,255,.62);font-size:11px;font-weight:800}
.referral-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.referral-actions button{padding:11px;border-radius:12px;background:#fff;color:var(--nova-deep);font-size:10px;font-weight:900}
.referral-actions button:last-child{background:var(--nova-green);color:#fff}
.referral-actions button:disabled{opacity:.45}
.referral-retry{margin-top:11px;padding-top:11px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:10px;align-items:center;color:rgba(255,255,255,.68);font-size:9px}
.referral-retry button{background:transparent;color:#f0ce79;font-weight:900;font-size:10px}
.pin-setting-card{background:#fff;border:1px solid var(--nova-border);border-radius:17px;padding:15px;box-shadow:0 7px 20px rgba(7,27,46,.04)}
.pin-setting-row{display:flex;align-items:center;gap:12px}
.pin-setting-row>div{min-width:0;flex:1}.pin-setting-row b,.pin-setting-row small{display:block}.pin-setting-row b{font-size:13px}.pin-setting-row small{margin-top:4px;color:#7c8a9b;font-size:10px;line-height:1.35}
.secondary-action{margin-top:12px;width:100%;padding:10px;border-radius:11px;background:#eef8f4;color:#13885a;font-size:10px;font-weight:900}
.pin-form{display:grid;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid #edf1f3}.pin-form input{width:100%;border:1px solid #dfe7ed;border-radius:12px;background:#fbfcfd;color:var(--nova-deep);outline:0;padding:12px;font-size:13px;letter-spacing:4px;text-align:center}
.terms-card{display:grid;gap:10px}.terms-card>div{background:#fff;border:1px solid var(--nova-border);border-radius:18px;padding:16px;box-shadow:0 7px 20px rgba(7,27,46,.04)}.terms-card small{color:var(--nova-green);font-size:9px;font-weight:900;letter-spacing:1px}.terms-card h3{margin:5px 0 6px;color:var(--nova-deep);font-size:15px}.terms-card p{margin:0;color:#718094;font-size:11px;line-height:1.6}
.admin-app .admin-hero{background:linear-gradient(145deg,#071b2e,#0b3d43)}
@media(max-width:600px){.referral-code-value strong{font-size:20px}.referral-actions{grid-template-columns:1fr}.pin-setting-row{align-items:flex-start}.terms-card p{font-size:10.5px}}

/* ===== DSAS NOVA remembered-account login + stable referral ===== */
.remembered-account{
  display:flex;
  align-items:center;
  gap:10px;
  margin:4px 0 13px;
  padding:12px;
  background:#f3f8f7;
  border:1px solid #dcece6;
  border-radius:14px;
  min-height:62px;
}
.remembered-account-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border-radius:11px;
  display:grid;
  place-items:center;
  background:#dff5ec;
  color:var(--nova-green);
  font-weight:900;
}
.remembered-account-main{min-width:0;flex:1}
.remembered-account-main small,
.remembered-account-main b,
.remembered-account-main span{display:block}
.remembered-account-main small{font-size:8px;letter-spacing:1.2px;color:#7d8b98;font-weight:900}
.remembered-account-main b{font-size:12px;color:var(--nova-deep);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.remembered-account-main span{font-size:9px;color:#81909d;margin-top:2px}
.remembered-account>button{
  flex:0 0 auto;
  padding:7px 9px;
  border-radius:9px;
  background:#fff;
  border:1px solid #d9e6e2;
  color:var(--nova-deep);
  font-size:9px;
  font-weight:900;
}
.new-account-email{margin-bottom:12px}
.code-refreshing{
  display:block;
  margin-top:4px;
  color:rgba(255,255,255,.5);
  font-size:8px;
  font-weight:800;
  letter-spacing:.5px;
}

/* ===== DSAS NOVA DARK MARKETPLACE UI ===== */
.app{background:linear-gradient(180deg,#061521 0%,#061a25 45%,#04121c 100%);color:#fff;padding-bottom:86px}
.topbar{height:72px;background:rgba(4,18,28,.94);border-bottom:1px solid rgba(25,201,139,.14);box-shadow:0 8px 28px rgba(0,0,0,.18)}
.top-brand b{color:#fff;font-size:15px}.top-brand small{color:rgba(255,255,255,.58)}
.topbar .icon-btn{background:rgba(255,255,255,.055);color:#fff;border:1px solid rgba(255,255,255,.08);border-radius:14px}
.content{padding:22px 16px 112px}
.nova-customer-home{max-width:720px;margin:0 auto}
.nova-welcome{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:5px 0 20px}
.nova-welcome small,.nova-section-head small{color:#22d493;letter-spacing:1.8px;font-size:9px;font-weight:900}
.nova-welcome h1{color:#fff;font-size:30px;margin:5px 0 2px;letter-spacing:-.8px}.nova-welcome p{color:rgba(255,255,255,.62);font-size:11px;margin:0}
.nova-avatar{width:52px;height:52px;border-radius:17px;background:#102c3e;color:#fff;border:1px solid rgba(25,201,139,.22);font-size:20px;font-weight:900}
.nova-wallet{position:relative;overflow:hidden;background:linear-gradient(135deg,#092432,#064d43 75%,#08734f);border:1px solid rgba(40,221,161,.2);border-radius:24px;padding:20px;margin-bottom:27px;box-shadow:0 18px 42px rgba(0,0,0,.2)}
.nova-wallet-glow{position:absolute;width:220px;height:220px;right:-90px;top:-110px;border-radius:50%;background:rgba(30,218,150,.18);filter:blur(4px)}
.nova-wallet-top,.nova-wallet-bottom{position:relative;z-index:1}.nova-wallet-top{display:flex;justify-content:space-between;align-items:flex-start}.nova-wallet-top small{color:rgba(255,255,255,.62);font-size:9px;letter-spacing:1.4px;font-weight:800}.nova-wallet-top strong{display:block;color:#fff;font-size:30px;letter-spacing:-1px;margin-top:8px}.nova-wallet-top button{width:40px;height:40px;border-radius:13px;background:rgba(255,255,255,.09);color:#fff}
.nova-wallet-bottom{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.nova-wallet-bottom button{padding:12px;border-radius:14px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);color:#fff;font-weight:900}.nova-wallet-bottom button:first-child{background:#fff;color:#071c2c;border-color:#fff}
.nova-section-head{margin:0 0 12px;align-items:flex-end}.nova-section-head h2{color:#fff;font-size:21px;letter-spacing:-.4px;margin:4px 0 0}.nova-section-head button{color:#25d696;font-size:11px;background:none;font-weight:900}
.nova-service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:24px}
.nova-service-grid>button{min-height:112px;padding:13px 10px;border-radius:17px;background:linear-gradient(145deg,#082532,#06202b);border:1px solid rgba(82,161,151,.16);box-shadow:0 9px 22px rgba(0,0,0,.16);text-align:left;color:#fff;transition:.18s}
.nova-service-grid>button:active{transform:scale(.97)}
.nova-service-grid>button b,.nova-service-grid>button small{display:block}.nova-service-grid>button b{font-size:13px;margin-top:9px}.nova-service-grid>button small{font-size:9px;color:rgba(255,255,255,.54);margin-top:3px;line-height:1.3}
.nova-service-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:24px;font-weight:900;background:#0b3a38;color:#28db99}.nova-service-icon.airtime{background:#103a35;color:#18d693}.nova-service-icon.tv{background:#342247;color:#d24cff}.nova-service-icon.electricity{background:#453613;color:#ffd000}.nova-service-icon.exam{background:#203653;color:#58a4ff}.nova-service-icon.betting{background:#3a1d24;color:#ff493b}.nova-service-icon.internet{background:#172f4a;color:#39a4ff}.nova-service-icon.ezam{background:#173a4b;color:#4cb7df}.nova-service-icon.esim{background:#17392c;color:#26db98}.nova-service-icon.more{background:#2b3138;color:#fff;letter-spacing:3px;font-size:18px}
.nova-feature{background:linear-gradient(135deg,#092c32,#0a5d3f);border:1px solid rgba(47,220,159,.18);color:#fff;border-radius:21px;margin:0 0 27px;padding:18px;box-shadow:0 15px 35px rgba(0,0,0,.18)}.nova-feature small{color:#42e3ae}.nova-feature h3{font-size:21px;margin:5px 0 6px}.nova-feature p{color:rgba(255,255,255,.65);font-size:11px;line-height:1.5}.nova-feature button{background:#fff;color:#071c2c;border-radius:13px;font-weight:900}
.row-card{background:#08222d;border-color:rgba(255,255,255,.08);color:#fff}.row-card b{color:#fff}.row-card small{color:rgba(255,255,255,.5)}.row-card>strong{color:#24d596}.tx-icon{background:#0d3935;color:#26d998}
.empty{background:#08222d;border-color:rgba(255,255,255,.12);color:rgba(255,255,255,.58)}.empty h3{color:#fff}
.nova-bottom{height:82px;min-height:82px;background:rgba(4,18,28,.97);border-top:1px solid rgba(255,255,255,.1);box-shadow:0 -10px 28px rgba(0,0,0,.28);backdrop-filter:blur(18px)}
.nova-bottom button{color:#7e8e99!important}.nova-bottom button .nav-icon{color:#8fa0aa!important;font-size:22px!important}.nova-bottom button.active,.nova-bottom button.active span:last-child{color:#24d596!important}.nova-bottom button.active .nav-icon{color:#24d596!important}
.drawer-wrap{background:rgba(0,0,0,.65)}.drawer{background:linear-gradient(180deg,#061521,#061b25);color:#fff;border-right:1px solid rgba(36,214,150,.14);box-shadow:20px 0 60px rgba(0,0,0,.5)}.drawer h3{color:#fff}.drawer>button{background:transparent;color:#fff;border-bottom-color:rgba(255,255,255,.08);font-size:14px;padding:16px 5px}.drawer>button span{color:#fff}.drawer-head button{background:#102631;color:#fff}.drawer .danger-btn{color:#ff6c72}.drawer .danger-btn span{color:#ff6c72}
.page-title small{color:#24d596}.page-title h1{color:#fff}.page-title p{color:rgba(255,255,255,.58)}
.nova-search,.market-search{background:#0b2430;border-color:rgba(255,255,255,.09);color:#8b9ca7}.nova-search input,.market-search input{color:#fff}.nova-categories button,.category-pills button{background:#0b2430;border-color:rgba(255,255,255,.09);color:#91a0aa}.nova-categories button.active,.category-pills button.active{background:#10b87c;border-color:#10b87c;color:#fff}
.nova-market-grid>button,.provider-card,.payment-info,.profile-card,.settings-card,.complaint,.coming-card,.secure-note,.nova-profile-card,.nova-settings-list .setting-item{background:#08222d;border-color:rgba(255,255,255,.09);color:#fff}.nova-market-grid>button b,.provider-card b,.payment-info b,.nova-settings-list .setting-item b{color:#fff}.nova-market-grid>button small,.provider-card small,.payment-info small,.nova-settings-list .setting-item small{color:rgba(255,255,255,.54)}
.secure-note{background:#0b302b;color:#a8c6bb}.amount-input,.modal{background:#08222d;border-color:rgba(255,255,255,.1);color:#fff}.amount-input input,.modal input{background:transparent;color:#fff}.modal p{color:rgba(255,255,255,.6)}
.login-methods{background:#0e2934}.login-methods button.active{background:#fff;color:#071c2c}.auth-card{background:rgba(255,255,255,.98)}
@media(max-width:600px){.content{padding:19px 13px 108px}.nova-service-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.nova-service-grid>button{min-height:108px;padding:11px 8px}.nova-service-icon{width:43px;height:43px;font-size:21px}.nova-service-grid>button b{font-size:12px}.nova-service-grid>button small{font-size:8px}.nova-wallet-top strong{font-size:28px}.nova-welcome h1{font-size:28px}}
@media(max-width:370px){.nova-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nova-service-grid>button{min-height:108px}.nova-wallet-bottom{grid-template-columns:1fr}.nova-welcome h1{font-size:26px}}

/* ===== ClubKonnect provider status ===== */
.provider-status-card{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px 15px;margin:12px 0}.provider-status-icon{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;font-weight:900;font-size:18px;background:#fff4df;color:#b47b00}.provider-status-card.connected .provider-status-icon{background:#e5f8ef;color:#138a58}.provider-status-main{min-width:0;flex:1}.provider-status-main small,.provider-status-main b,.provider-status-main span{display:block}.provider-status-main small{font-size:8px;letter-spacing:1.2px;color:var(--muted);font-weight:900}.provider-status-main b{font-size:14px;margin-top:3px}.provider-status-main span{font-size:10px;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}.provider-status-pill{font-size:8px;letter-spacing:.7px;padding:7px 9px;border-radius:9px;background:#fff4df;color:#b47b00}.provider-status-card.connected .provider-status-pill{background:#e5f8ef;color:#138a58}@media(max-width:600px){.provider-status-card{padding:13px}.provider-status-main b{font-size:13px}.provider-status-pill{font-size:7px}}


/* DSAS NOVA FINAL UI — readable dark professional theme */
:root{
  --nova:#19d38b; --nova2:#27e0a0; --navy:#061b2a; --navy2:#0a2e3d;
  --ink:#f2f7f6; --muted:#8ea4ad; --bg:#04131f; --card:#082532;
  --line:#153b49; --soft:#0d3440; --danger:#f06b76; --gold:#e3c26f;
}
html,body,#root{background:#04131f;color:#f2f7f6}
.app,.admin-app{background:linear-gradient(180deg,#04131f 0%,#061b28 100%);color:#f2f7f6}
.topbar,.admin-top{background:rgba(4,19,31,.96);border-color:#153b49;color:#f2f7f6}
.top-brand b,.admin-brand b{color:#f2f7f6}
.top-brand small,.admin-brand small,.page-title p{color:#8ea4ad}
.content,.admin-content{color:#f2f7f6}
.section-head h2,.page-title h1,.admin-content h1,.admin-content h2,.admin-content h3{color:#f2f7f6}
.service-card,.row-card,.provider-card,.payment-info,.profile-card,.settings-card,.complaint,.coming-card,.secure-note,
.admin-stats>div,.quick-admin,.admin-row,.complaint-row,.modal{background:#082532;border-color:#153b49;color:#f2f7f6;box-shadow:0 14px 40px rgba(0,0,0,.16)}
.service-card b,.row-card b,.provider-card b,.admin-row b,.quick-admin button b{color:#f2f7f6}
.service-card small,.row-card small,.provider-card small,.admin-row small,.quick-admin button small,.admin-stats small{color:#8ea4ad}
.service-icon,.provider-icon,.quick-icon{background:#0d3440;color:#19d38b}
.nova-banner,.market-hero{background:linear-gradient(135deg,#0a303c,#082532);border-color:#174653;color:#f2f7f6}
.nova-banner p,.market-hero p{color:#9bb0b8}
.nova-wallet{background:linear-gradient(135deg,#0a3541,#075346)!important;border-color:#1a6353!important;color:#fff}
.nova-service-grid button{background:#082532!important;border-color:#153b49!important;color:#f2f7f6}
.nova-service-grid button b{color:#f2f7f6}
.nova-service-grid button small{color:#8ea4ad}
.nova-feature{background:linear-gradient(135deg,#092f3a,#075244)!important;border-color:#1a5e50!important}
.bottom,.admin-nav{background:rgba(4,19,31,.98);border-color:#153b49}
.bottom button,.admin-nav button{color:#8398a1}
.bottom button.active,.admin-nav button.active{color:#19d38b}
.nav-icon{display:grid!important;place-items:center;height:25px;margin-bottom:4px}
.nav-icon svg{display:block}
.drawer{background:#061b28;color:#f2f7f6;border-right:1px solid #153b49}
.drawer h3{color:#f2f7f6;font-size:27px;font-weight:800}
.drawer>button{background:#061b28;color:#dfe9e7;border-color:#153b49;align-items:center;gap:13px;font-weight:700}
.drawer>button span{color:#dfe9e7}
.drawer>button b{color:#7f969f;font-size:18px}
.drawer>button svg{color:#19d38b;flex:0 0 auto}
.drawer-head button,.modal-close{background:#0d3440;color:#dfe9e7}
.admin-hero{background:linear-gradient(135deg,#061d2d,#0a4b44);border:1px solid #174c51}
.admin-hero p{color:#a8c1bd}
.admin-stats strong{color:#f2f7f6}
.quick-admin{padding:16px}
.quick-admin h3{margin:0 0 14px}
.quick-admin>div{grid-template-columns:repeat(3,1fr);gap:9px}
.quick-admin button{background:#092b38;border-color:#153f4c;min-height:92px;padding:12px;color:#f2f7f6}
.quick-admin button .quick-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center}
.quick-admin button b{margin-top:7px;font-size:12px}
.quick-admin button small{font-size:9px;margin-top:2px}
.provider-status-card{background:#082532!important;border-color:#153f4c!important;color:#f2f7f6}
.provider-status-main b{color:#f2f7f6}
.provider-status-main span{color:#8ea4ad}
.provider-status-pill{letter-spacing:1px}
.admin-note{background:#092f37;color:#9eb9b1}
.notice{background:#0d3440;border-color:#1a4d59;color:#9be8c5}
.empty{background:#082532;border-color:#153b49;color:#8ea4ad}
.empty h3{color:#f2f7f6}
.text-btn,.back-btn,.section-head button{color:#19d38b}
.ghost-btn{background:#0d3440;color:#f2f7f6;border:1px solid #153f4c}
.amount-input,.modal input,.auth-card input{background:#071f2d;color:#f2f7f6;border-color:#1a4350}
.amount-input input,.modal input{color:#f2f7f6}
.secure-note{background:#092f37;color:#a8c1bd}
.quick-icon svg{display:block}
@media(max-width:700px){
  .quick-admin>div{grid-template-columns:1fr 1fr}
  .quick-admin button{min-height:88px}
}


/* ===== DSAS NOVA LOGIN INPUT FIX ===== */
.auth-card h2,
.auth-card label,
.auth-card .switch,
.auth-card .muted {
  color: #102a3a;
}
.auth-card input {
  background: #ffffff !important;
  color: #102a3a !important;
  border: 1px solid #c9d8d4 !important;
  -webkit-text-fill-color: #102a3a !important;
  caret-color: #0a9f70;
}
.auth-card input::placeholder {
  color: #7a8b96 !important;
  opacity: 1;
}
.auth-card input:focus {
  border-color: #0aa878 !important;
  box-shadow: 0 0 0 3px rgba(10,168,120,.12);
}
.login-email-wrap {
  position: relative;
}
.login-email-wrap input {
  margin-bottom: 6px;
}
.saved-email-note {
  display: block;
  color: #71818c;
  font-size: 9px;
  line-height: 1.4;
  margin: 0 2px 5px;
  overflow-wrap: anywhere;
}
.saved-email-btn,
.change-account-btn {
  width: 100%;
  border-radius: 10px;
  padding: 9px 10px;
  font-size: 10px;
  font-weight: 800;
  background: #eef8f4;
  color: #08784f;
  border: 1px solid #cce9dd;
  margin-bottom: 7px;
}
.change-account-btn {
  background: #f7faf9;
  color: #53656f;
  border-color: #dbe5e2;
}
.remembered-account {
  background: #f3f8f7;
  color: #102a3a;
}
.remembered-account-main b {
  color: #102a3a;
}

/* Keep admin/customer management rows readable on every display. */
.admin-row b,
.complaint-row b,
.quick-admin button b,
.settings-card h3 {
  color: #102a3a;
}
.admin-row small,
.complaint-row small,
.quick-admin button small,
.settings-card p {
  color: #667985;
}

/* ===== FINAL QUICK SERVICE / ADMIN READABILITY ===== */
.nova-service-grid .nova-service-icon {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  margin-bottom: 9px;
}
.nova-service-grid .nova-service-icon svg {
  display: block;
  width: 22px;
  height: 22px;
}
.nova-service-grid > button {
  padding: 12px;
  border-radius: 16px;
}
.nova-service-grid b {
  font-size: 13px;
}
.nova-service-grid small {
  font-size: 9px;
}
.nova-service-icon.more {
  background: #0d3440 !important;
  color: #19d38b !important;
}
.quick-admin button b {
  color: #f2f7f6 !important;
}
.quick-admin button small {
  color: #8ea4ad !important;
}
.quick-admin button .quick-icon {
  color: #19d38b !important;
}
.provider-status-card.disconnected .provider-status-pill {
  background: #fff4df;
  color: #9a6d00;
}
.provider-status-card.connected .provider-status-pill {
  background: #e5f8ef;
  color: #138a58;
}

/* ===== FINAL ADMIN READABILITY PATCH ===== */
.admin-app .quick-admin button,
.admin-app .quick-admin button b,
.admin-app .quick-admin button small {
  color: #f2f7f6 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
.admin-app .quick-admin button b {
  display: block;
  font-weight: 900 !important;
  font-size: 13px !important;
  line-height: 1.25;
}
.admin-app .quick-admin button small {
  display: block;
  font-weight: 600 !important;
  font-size: 10px !important;
  line-height: 1.35;
}
.admin-app .quick-admin button:first-child {
  background: #eef8f4;
}
.admin-app .quick-admin button:first-child b {
  color: #102a3a !important;
}
.admin-app .quick-admin button:first-child small {
  color: #667985 !important;
}

/* Admin users / support records must remain readable on dark cards. */
.admin-app .admin-row b,
.admin-app .complaint-row b,
.admin-app .settings-card h3 {
  color: #f2f7f6 !important;
  opacity: 1 !important;
  font-weight: 900 !important;
}
.admin-app .admin-row small,
.admin-app .complaint-row small,
.admin-app .settings-card p,
.admin-app .complaint-row p {
  color: #a8bac1 !important;
  opacity: 1 !important;
}
.admin-app .complaint-row {
  color: #f2f7f6 !important;
}
.admin-app .complaint-row .status {
  font-weight: 800 !important;
}

/* Customer Quick Services: compact cards + clear bold labels. */
.nova-service-grid > button b,
.nova-market-grid > button b {
  color: #f2f7f6 !important;
  font-weight: 900 !important;
  opacity: 1 !important;
}
.nova-service-grid > button small,
.nova-market-grid > button small {
  color: #9fb2ba !important;
  font-weight: 600 !important;
  opacity: 1 !important;
}
.nova-service-grid .nova-service-icon,
.nova-market-grid .nova-service-icon {
  width: 38px !important;
  height: 38px !important;
}


/* ===== DSAS NOVA — FINAL VISUAL FIXES FROM MOBILE REVIEW ===== */

/* Public landing phone: keep it visible, readable and moving naturally. */
.public-phone{perspective:1100px;position:relative;z-index:2}
.phone-shell{
  transform-origin:50% 55%;
  animation:novaPhoneMotion 5.4s cubic-bezier(.45,.05,.55,.95) infinite;
  will-change:transform;
}
.phone-screen{
  background:linear-gradient(180deg,#fbfffe 0%,#f1f8f6 100%) !important;
  color:#102a3a !important;
}
.phone-screen .mini-top,.phone-screen .mini-top span{color:#102a3a !important}
.phone-screen .mini-top b{color:#19d38b !important}
.phone-screen>small{color:#71818c !important}
.phone-screen>strong{
  color:#102a3a !important;
  opacity:1 !important;
  text-shadow:none !important;
}
.phone-screen .mini-fund{background:#071f2d !important;color:#fff !important}
.phone-screen .mini-title{color:#102a3a !important}
.phone-screen .mini-grid span{
  background:#fff !important;
  border:1px solid #dbe6e2 !important;
  color:#19b985 !important;
}
.phone-screen .mini-grid b{color:#294252 !important}

@keyframes novaPhoneMotion{
  0%,100%{transform:translate3d(0,0,0) rotate(4deg)}
  20%{transform:translate3d(-5px,-7px,0) rotate(2.5deg)}
  40%{transform:translate3d(4px,-13px,0) rotate(0deg)}
  60%{transform:translate3d(7px,-7px,0) rotate(2deg)}
  80%{transform:translate3d(-3px,-3px,0) rotate(5deg)}
}

/* Quick Services: smaller, cleaner cards. */
.nova-service-grid{gap:8px !important}
.nova-service-grid>button{
  min-height:102px !important;
  padding:10px !important;
  border-radius:15px !important;
}
.nova-service-grid .nova-service-icon{
  width:36px !important;
  height:36px !important;
  border-radius:11px !important;
  margin-bottom:7px !important;
}
.nova-service-grid .nova-service-icon svg{
  width:21px !important;
  height:21px !important;
  display:block !important;
}
.nova-service-grid>button b{font-size:12px !important;line-height:1.2 !important}
.nova-service-grid>button small{font-size:8px !important;line-height:1.25 !important;margin-top:3px !important}

/* Betting must not look like a Cancel button. */
.nova-service-icon.betting{
  background:#321f35 !important;
  color:#d98cff !important;
  animation:none !important;
}

/* 6-Digit Login PIN: readable dark text on the white card. */
.pin-setting-card{
  background:#fff !important;
  color:#102a3a !important;
  border:1px solid #dce7e3 !important;
}
.pin-setting-card .pin-setting-row b{color:#102a3a !important}
.pin-setting-card .pin-setting-row small{color:#6f7f8a !important}
.pin-setting-card .setting-icon{background:#eaf8f2 !important;color:#159a68 !important}
.pin-setting-card .setting-status{color:#159a68 !important}
.pin-setting-card .setting-status.enabled{
  background:#e8f8ef !important;
  color:#159a68 !important;
}
.pin-setting-card .secondary-action{
  background:#edf8f4 !important;
  color:#13885a !important;
}
.pin-setting-card .pin-form input{
  background:#fff !important;
  color:#102a3a !important;
  -webkit-text-fill-color:#102a3a !important;
  border-color:#cfded9 !important;
}
.auth-card .pin-input{
  background:#fff !important;
  color:#102a3a !important;
  -webkit-text-fill-color:#102a3a !important;
  caret-color:#0a9f70 !important;
  letter-spacing:7px !important;
}

/* ClubKonnect: provider setup/processing states. */
.provider-status-card.checking .provider-status-pill,
.provider-status-card.disconnected .provider-status-pill{
  background:#123842 !important;
  color:#e3c26f !important;
}
.provider-status-card.disconnected .provider-status-icon{
  background:#19343d !important;
  color:#e3c26f !important;
}

@media(max-width:760px){
  .public-phone{margin:8px 0 90px !important}
  .phone-shell{animation-duration:5.8s}
}
@media(prefers-reduced-motion:reduce){
  .phone-shell{animation:none !important;transform:rotate(4deg)}
}

/* ===== PHONE MOCKUP VISIBILITY — ONLY THIS FIX ===== */
.public-phone .phone-screen{
  background:#edf5f2 !important;
  color:#062033 !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  text-shadow:none !important;
}
.public-phone .phone-screen *{
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}
.public-phone .phone-screen .mini-top span,
.public-phone .phone-screen > small,
.public-phone .phone-screen > strong,
.public-phone .phone-screen .mini-title,
.public-phone .phone-screen .mini-grid b{
  color:#062033 !important;
  -webkit-text-fill-color:#062033 !important;
  opacity:1 !important;
  visibility:visible !important;
}
.public-phone .phone-screen .mini-top b{
  color:#16c98a !important;
  -webkit-text-fill-color:#16c98a !important;
}
.public-phone .phone-screen > small{
  color:#536b76 !important;
  -webkit-text-fill-color:#536b76 !important;
  font-weight:700 !important;
}
.public-phone .phone-screen > strong{
  color:#062033 !important;
  -webkit-text-fill-color:#062033 !important;
  font-weight:900 !important;
  font-size:25px !important;
  letter-spacing:-.8px !important;
}
.public-phone .phone-screen .mini-title{
  color:#062033 !important;
  -webkit-text-fill-color:#062033 !important;
  font-weight:900 !important;
}
.public-phone .phone-screen .mini-fund{
  background:#062033 !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}
.public-phone .phone-screen .mini-grid span{
  background:#fff !important;
  border:1px solid #93aaa5 !important;
  color:#16b985 !important;
  -webkit-text-fill-color:#16b985 !important;
}
.public-phone .phone-screen .mini-grid b{
  color:#304a58 !important;
  -webkit-text-fill-color:#304a58 !important;
  font-weight:800 !important;
}

/* Airtime customer amount entry */
.airtime-phone-input{width:100%;padding:14px;border:1px solid #1a4350;border-radius:12px;margin:12px 0;background:#071f2d;color:#f2f7f6;outline:0}
.airtime-phone-input::placeholder{color:#6f858f}

/* DSAS NOVA readability fixes — color only, existing layout/design preserved. */
.nova-step-form>label{color:#071b2e}
.nova-step-field,.nova-step-value,.nova-step-input{color:#071b2e}
.nova-step-field span,.nova-step-value small{color:#425466}
.nova-step-options>button{color:#071b2e}
.nova-plan-options>button b{color:#071b2e}
.nova-plan-options>button small{color:#425466}
.nova-step-input::placeholder{color:#6f7f90}
.nova-profile-card .profile-identity>b{color:#071b2e}
.nova-profile-card .profile-identity>small{color:#425466}
.nova-account-stats .stats>div,.nova-account-stats>div{color:#071b2e}
.nova-account-stats small{color:#425466}
.nova-account-stats b{color:#071b2e}
.nova-settings-list .setting-item b{color:#071b2e}
.nova-settings-list .setting-item small{color:#425466}


/* ===== DSAS NOVA — PROFILE + PURCHASE UX FINAL POLISH ===== */
/* Keep the existing layout, branding, icons and navigation intact.
   These rules fix contrast and make the service purchase controls feel
   like a production fintech flow instead of bright demo dropdowns. */

.nova-profile-card{
  background:linear-gradient(135deg,#082a36 0%,#08222d 100%) !important;
  border-color:#164553 !important;
  color:#f2f7f6 !important;
}
.nova-profile-card .profile-identity>b{
  color:#f2f7f6 !important;
  -webkit-text-fill-color:#f2f7f6 !important;
}
.nova-profile-card .profile-identity>small{
  color:#9db1b9 !important;
  -webkit-text-fill-color:#9db1b9 !important;
}
.nova-account-stats>div{
  background:linear-gradient(180deg,#0a2b37 0%,#082532 100%) !important;
  border-color:#153f4d !important;
  color:#f2f7f6 !important;
}
.nova-account-stats small{
  color:#8ea4ad !important;
  -webkit-text-fill-color:#8ea4ad !important;
}
.nova-account-stats b{
  color:#f2f7f6 !important;
  -webkit-text-fill-color:#f2f7f6 !important;
}
.nova-settings-list .setting-item{
  background:linear-gradient(180deg,#0a2b37 0%,#082532 100%) !important;
  border-color:#153f4d !important;
  color:#f2f7f6 !important;
}
.nova-settings-list .setting-item b{
  color:#f2f7f6 !important;
  -webkit-text-fill-color:#f2f7f6 !important;
}
.nova-settings-list .setting-item small{
  color:#91a7b0 !important;
  -webkit-text-fill-color:#91a7b0 !important;
}
.nova-settings-list .setting-status{
  color:#25d998 !important;
  -webkit-text-fill-color:#25d998 !important;
}
.pin-setting-card{
  background:linear-gradient(180deg,#f8fbfc 0%,#eef5f5 100%) !important;
  border-color:#d7e4e5 !important;
}
.pin-setting-card .pin-setting-row b{color:#0b2636 !important}
.pin-setting-card .pin-setting-row small{color:#607584 !important}

/* Purchase form */
.nova-step-form{
  padding:2px 0 4px;
}
.nova-step-form>label{
  color:#9eb2ba !important;
  -webkit-text-fill-color:#9eb2ba !important;
  font-size:11px !important;
  letter-spacing:.7px;
  text-transform:uppercase;
  margin-top:12px;
}
.nova-step-field,
.nova-step-value,
.nova-step-input{
  background:linear-gradient(180deg,#0a2b38 0%,#082532 100%) !important;
  border:1px solid #174554 !important;
  color:#f2f7f6 !important;
  box-shadow:0 8px 24px rgba(0,0,0,.10);
}
.nova-step-field{
  min-height:58px;
  border-radius:16px;
}
.nova-step-field span{
  color:#f2f7f6 !important;
  -webkit-text-fill-color:#f2f7f6 !important;
}
.nova-step-field:not(.filled) span{
  color:#7f969f !important;
  -webkit-text-fill-color:#7f969f !important;
}
.nova-step-field b{
  color:#25d998 !important;
}
.nova-step-field.open{
  border-color:#20d394 !important;
  box-shadow:0 0 0 2px rgba(32,211,148,.10),0 10px 25px rgba(0,0,0,.14);
}
.nova-step-options{
  background:#071e2a !important;
  border:1px solid #174554 !important;
  border-radius:16px;
  box-shadow:0 16px 35px rgba(0,0,0,.24);
}
.nova-step-options>button{
  min-height:54px;
  background:#082532 !important;
  color:#f2f7f6 !important;
  border-bottom-color:#153b49 !important;
}
.nova-step-options>button:hover,
.nova-step-options>button:focus-visible{
  background:#0d3440 !important;
}
.nova-plan-options>button b{
  color:#f2f7f6 !important;
  -webkit-text-fill-color:#f2f7f6 !important;
}
.nova-plan-options>button small{
  color:#8ea4ad !important;
  -webkit-text-fill-color:#8ea4ad !important;
}
.nova-plan-options>button strong{
  color:#25d998 !important;
  -webkit-text-fill-color:#25d998 !important;
}
.nova-step-loading{
  background:#082532 !important;
  color:#8ea4ad !important;
}
.nova-step-input{
  min-height:56px;
  outline:0;
}
.nova-step-input::placeholder{
  color:#6f858f !important;
  -webkit-text-fill-color:#6f858f !important;
}
.nova-step-input:focus{
  border-color:#20d394 !important;
  box-shadow:0 0 0 2px rgba(32,211,148,.10);
}
.nova-step-value{
  padding:12px 15px;
}
.nova-step-value span{
  color:#25d998 !important;
  -webkit-text-fill-color:#25d998 !important;
  font-size:18px;
}
.nova-step-value small{
  color:#8ea4ad !important;
  -webkit-text-fill-color:#8ea4ad !important;
}
.amount-input{
  background:linear-gradient(180deg,#0a2b38 0%,#082532 100%) !important;
  border:1px solid #174554 !important;
  color:#f2f7f6 !important;
}
.amount-input input{
  color:#f2f7f6 !important;
  -webkit-text-fill-color:#f2f7f6 !important;
}
.amount-input input::placeholder{
  color:#6f858f !important;
  -webkit-text-fill-color:#6f858f !important;
}
.quick-amounts button{
  background:#0b2e3a !important;
  border:1px solid #174554 !important;
  color:#d8e5e8 !important;
}
.quick-amounts button:hover,
.quick-amounts button:focus-visible{
  background:#0d3a46 !important;
  border-color:#20d394 !important;
  color:#25d998 !important;
}
.nova-step-form .primary.wide{
  min-height:54px;
  border-radius:15px;
  font-weight:900;
  box-shadow:0 10px 25px rgba(25,211,139,.14);
}
.nova-step-form + .coming-card{
  background:#082532 !important;
  color:#f2f7f6 !important;
  border-color:#153b49 !important;
}
.nova-step-form + .coming-card p{
  color:#8ea4ad !important;
}

.nova-purchase-review{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:13px 14px;
  margin:12px 0;
  background:#061c28;
  border:1px solid #153f4d;
  border-radius:14px;
}
.nova-purchase-review span{display:flex;flex-direction:column;gap:3px;min-width:0}
.nova-purchase-review span:last-child{text-align:right}
.nova-purchase-review small{font-size:8px;letter-spacing:.8px;color:#718b95}
.nova-purchase-review b{font-size:11px;color:#e6f1f0}
.nova-purchase-review span:last-child b{color:#25d998}
@media(max-width:380px){
  .nova-purchase-review{padding:12px 11px}
  .nova-purchase-review b{font-size:10px}
}


/* ===== Referral visual stability + spacing (final) ===== */
.referral-hero-fixed{
  display:grid !important;
  grid-template-columns:44px minmax(0,1fr) !important;
  align-items:start !important;
  column-gap:14px !important;
  width:100% !important;
  box-sizing:border-box !important;
  min-height:58px !important;
  margin:6px 0 18px !important;
  padding:2px 1px !important;
  overflow:visible !important;
  animation:none !important;
  transform:none !important;
}
.referral-hero-fixed .referral-hero-icon{
  display:grid !important;
  place-items:center !important;
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  flex:none !important;
  border-radius:14px !important;
  background:rgba(25,201,139,.12) !important;
  border:1px solid rgba(25,201,139,.18) !important;
  color:#19c98b !important;
}
.referral-hero-fixed .referral-hero-copy{
  display:block !important;
  min-width:0 !important;
  width:100% !important;
  box-sizing:border-box !important;
}
.referral-hero-fixed .referral-hero-copy b{
  display:block !important;
  margin:0 0 5px !important;
  padding:0 !important;
  color:#fff !important;
  font-size:16px !important;
  line-height:1.25 !important;
  white-space:normal !important;
}
.referral-hero-fixed .referral-hero-copy small{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  color:rgba(255,255,255,.62) !important;
  font-size:10.5px !important;
  line-height:1.55 !important;
  white-space:normal !important;
}
.referral-code-panel{animation:none !important;transform:none !important;}
.referral-code-panel .referral-secure-icon{
  display:grid !important;
  place-items:center !important;
  width:38px !important;
  height:38px !important;
  border-radius:12px !important;
  background:rgba(25,201,139,.12) !important;
  color:#19c98b !important;
  font-size:18px !important;
  font-weight:900 !important;
  line-height:1 !important;
}
.referral-code-value,.referral-actions,.referral-code-head{animation:none !important;transform:none !important;}
@media(max-width:600px){
  .referral-hero-fixed{grid-template-columns:42px minmax(0,1fr) !important;column-gap:12px !important;}
  .referral-hero-fixed .referral-hero-icon{width:42px !important;height:42px !important;min-width:42px !important;}
}

/* ===== DSAS NOVA FINAL ADMIN / NOTIFICATION PATCH ===== */
.admin-nav{grid-template-columns:repeat(6,minmax(0,1fr))!important}
.admin-nav button{min-width:0!important;overflow:hidden}
.admin-nav button span:last-child{font-size:10px!important;font-weight:900!important;color:#c8d5d9!important}
.admin-nav button.active,.admin-nav button.active span:last-child{color:#19d38b!important}
.admin-nav .nav-icon{color:#9fb1b8!important}
.admin-nav button.active .nav-icon{color:#19d38b!important}
.admin-content .page-title h1,.admin-content .page-title p,.admin-content .page-title small{color:#f2f7f6!important;opacity:1!important}
.admin-content .quick-admin h3,.admin-content .quick-admin button b{color:#f2f7f6!important;opacity:1!important}
.admin-content .quick-admin button small{color:#b5c5ca!important;opacity:1!important}
.admin-content .settings-card label{color:#dce7e9!important;font-weight:800!important}
.admin-content .settings-card input,.admin-content .settings-card textarea,.admin-content .settings-card select{color:#f2f7f6!important;background:#071f2d!important;border-color:#1a4350!important}
.admin-content .settings-card input::placeholder,.admin-content .settings-card textarea::placeholder{color:#80959e!important}
.custom-greeting-btn{display:block!important;margin-top:10px!important;width:100%!important;padding:12px 14px!important;border-radius:12px!important;background:#0d3440!important;border:1px solid #1a4d59!important;color:#19d38b!important;font-weight:900!important}
.notification-permission-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 16px;margin-bottom:12px;border-radius:16px;background:#082532;border:1px solid #153b49;color:#f2f7f6}
.notification-permission-card b{display:block;color:#f2f7f6!important}.notification-permission-card small{display:block;margin-top:5px;color:#a8bac1!important;line-height:1.4}
.notification-permission-card button{flex:0 0 auto;padding:10px 14px;border-radius:12px;background:#19d38b;color:#06202b;font-weight:900}
@media(max-width:700px){.admin-nav button span:last-child{font-size:9px!important}.admin-nav .nav-icon{height:24px!important}.notification-permission-card{align-items:flex-start}}

/* ===== ADMIN BUSINESS METRICS — FUNCTIONAL ADDITION, EXISTING UI PRESERVED ===== */
.admin-finance-section{background:#082532;border:1px solid #153b49;border-radius:21px;padding:17px;margin:12px 0;box-shadow:0 14px 40px rgba(0,0,0,.16)}
.admin-section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.admin-section-heading small{display:block;color:#6fe3b4;font-size:8px;letter-spacing:1.5px;font-weight:900}
.admin-section-heading h3{margin:4px 0 0;color:#f2f7f6;font-size:21px;letter-spacing:-.3px}
.admin-section-heading>span{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#103b45;color:#6fe3b4;font-weight:900;font-size:18px}
.admin-finance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.admin-finance-card{background:#092b38;border:1px solid #153f4c;border-radius:15px;padding:13px;min-width:0}
.admin-finance-card small,.admin-finance-summary small,.admin-insight-card small{display:block;color:#8ea4ad;font-size:9px;font-weight:700}
.admin-finance-card strong{display:block;color:#f2f7f6;font-size:19px;margin-top:7px;letter-spacing:-.4px;overflow-wrap:anywhere}
.admin-finance-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:9px}
.admin-finance-summary>div{background:#0b303c;border:1px solid #153f4c;border-radius:14px;padding:11px}
.admin-finance-summary b{display:block;color:#f2f7f6;font-size:14px;margin-top:5px}
.admin-insights-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.admin-insight-card{background:#092b38;border:1px solid #153f4c;border-radius:15px;padding:12px;min-width:0}
.admin-insight-card strong{display:block;color:#f2f7f6;font-size:18px;margin-top:6px;overflow-wrap:anywhere}
@media(min-width:800px){.admin-stats{grid-template-columns:repeat(6,minmax(0,1fr))}.admin-finance-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:800px){.admin-finance-grid-three{grid-template-columns:repeat(3,minmax(0,1fr))}.admin-finance-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.admin-insights-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* DSAS NOVA SECURITY LOCK — functional addition */
.dsas-lock-screen{
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  box-sizing:border-box;
  background:
    radial-gradient(circle at 82% 18%, rgba(0,198,145,.14), transparent 28%),
    radial-gradient(circle at 12% 82%, rgba(0,115,150,.12), transparent 30%),
    #04131e;
}
.dsas-lock-card{
  width:min(430px,100%);
  background:linear-gradient(145deg,rgba(5,29,40,.98),rgba(4,23,34,.98));
  border:1px solid rgba(111,227,180,.24);
  border-radius:28px;
  padding:30px 24px;
  text-align:center;
  color:#f2f7f6;
  box-shadow:0 22px 70px rgba(0,0,0,.42);
}
.dsas-lock-logo{display:flex;justify-content:center;margin-bottom:14px}
.dsas-lock-logo .logo.large{width:76px;height:76px}
.dsas-lock-card>small{
  display:block;
  color:#6fe3b4;
  font-weight:900;
  letter-spacing:2px;
  font-size:10px;
}
.dsas-lock-card h1{
  margin:9px 0 8px;
  font-size:28px;
  line-height:1.15;
  letter-spacing:-.6px;
  color:#f7fbfa;
}
.dsas-lock-card>p{
  margin:0 auto 18px;
  color:#9fb2bb;
  line-height:1.55;
  font-size:14px;
  max-width:340px;
}
.dsas-lock-user{
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:12px 14px;
  margin-bottom:18px;
  border:1px solid #173d4a;
  border-radius:15px;
  background:#082b38;
}
.dsas-lock-user b{font-size:16px;color:#f2f7f6}
.dsas-lock-user span{font-size:12px;color:#91a7b0;overflow-wrap:anywhere}
.dsas-lock-card form{text-align:left}
.dsas-lock-card label{
  display:block;
  margin:0 0 7px;
  font-size:12px;
  font-weight:800;
  color:#c7d5d9;
}
.dsas-lock-card input{
  width:100%;
  box-sizing:border-box;
  min-height:52px;
  border-radius:14px;
  border:1px solid #2a5663;
  background:#061f2b;
  color:#fff;
  padding:0 16px;
  font-size:20px;
  letter-spacing:6px;
  text-align:center;
  outline:none;
}
.dsas-lock-card input:focus{
  border-color:#35d89d;
  box-shadow:0 0 0 3px rgba(53,216,157,.12);
}
.dsas-lock-card .primary.wide{
  margin-top:12px;
  min-height:50px;
  background:linear-gradient(90deg,#0fc58b,#39d99f);
  color:#062019;
  border:none;
}
.dsas-lock-card .biometric-login-btn{
  width:100%;
  min-height:48px;
  margin-top:10px;
  border:1px solid #315b68;
  border-radius:14px;
  background:#0b3040;
  color:#f2f7f6;
  font-weight:800;
}
.lock-feedback{
  margin-top:12px;
  color:#6fe3b4;
  font-size:12px;
  line-height:1.45;
  font-weight:700;
}
.lock-security-note{
  display:block;
  margin-top:18px;
  color:#718892;
  font-size:10px;
  line-height:1.4;
}

@media(max-width:760px){.admin-content{padding:18px 14px 92px}.admin-nav button{font-size:16px}.admin-nav button span{font-size:7.5px}.lock-setup-box{display:grid;gap:10px;text-align:left}.lock-setup-box>b,.lock-setup-box>span{display:block}.lock-setup-box input{width:100%;box-sizing:border-box;min-height:50px;border-radius:14px;border:1px solid #2a5663;background:#061f2b;color:#fff;padding:0 14px;text-align:center;font-size:18px;letter-spacing:4px}.lock-setup-box .primary{margin-top:2px}}

/* DSAS NOVA ADMIN NAV FINAL MOBILE FIX — keep all 7 items on one row. */
.admin-nav{grid-template-columns:repeat(7,minmax(0,1fr))!important;overflow:hidden!important}
.admin-nav button{min-width:0!important;width:100%!important;padding:6px 1px 4px!important;overflow:hidden!important;white-space:nowrap!important;gap:3px!important}
.admin-nav button .nav-icon{height:23px!important;margin-bottom:1px!important;display:grid!important;place-items:center!important;flex:0 0 auto!important}
.admin-nav button span:last-child{display:block!important;width:100%!important;min-width:0!important;overflow:hidden!important;text-overflow:clip!important;white-space:nowrap!important;font-size:7.5px!important;line-height:1!important;margin:0!important;font-weight:900!important;letter-spacing:-.2px!important}
@media(max-width:700px){
  .admin-nav{grid-template-columns:repeat(7,minmax(0,1fr))!important;height:82px!important;min-height:82px!important;padding:7px 2px max(7px,env(safe-area-inset-bottom))!important}
  .admin-nav button{font-size:18px!important;padding:5px 0 3px!important}
  .admin-nav button .nav-icon{height:22px!important}
  .admin-nav button span:last-child{font-size:7px!important}
}


/* DSAS NOVA service receipts — additive only; existing layout remains unchanged. */
.transaction-card{align-items:flex-start}
.transaction-main{min-width:0;flex:1}
.transaction-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.receipt-btn{border:1px solid rgba(31,255,184,.35);background:rgba(31,255,184,.08);color:var(--nova);border-radius:10px;padding:7px 10px;font:inherit;font-size:12px;font-weight:800;cursor:pointer}
.receipt-btn.secondary{background:transparent}
.receipt-share-message{display:block!important;color:var(--nova)!important;margin-top:6px}
.receipt-panel{margin-top:10px;padding:14px;border:1px solid rgba(31,255,184,.18);border-radius:14px;background:rgba(0,0,0,.12)}
.receipt-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:10px}
.receipt-head strong{color:var(--nova)}
.receipt-head span{font-size:10px;letter-spacing:1px;opacity:.7}
.receipt-line{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.receipt-line span{opacity:.68;font-size:12px}
.receipt-line b{font-size:12px;text-align:right;overflow-wrap:anywhere}
.receipt-note{font-size:11px;line-height:1.5;opacity:.65;margin-top:10px}
@media (max-width:520px){
  .transaction-actions{gap:6px}
  .receipt-btn{padding:6px 8px}
  .receipt-head{flex-direction:column;gap:4px}
}

/* ================================================================
   DSAS NOVA — ClubKonnect service forms
   Professional mobile layout for TV, Electricity, Betting,
   Internet/WiFi and Exam/Education. Keeps the existing NOVA palette.
   ================================================================ */
.clubkonnect-service-page {
  padding-bottom: 24px;
}

.clubkonnect-service-page > .alert {
  margin: 0 0 14px;
  border-radius: 14px;
  padding: 12px 14px;
  line-height: 1.45;
  font-size: 13px;
}

.clubkonnect-service-page > label {
  display: block;
  margin: 18px 0 7px;
  color: #9eb2ba !important;
  -webkit-text-fill-color: #9eb2ba !important;
  font-size: 11px !important;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: .75px;
  text-transform: uppercase;
}

.clubkonnect-service-page > label:first-of-type {
  margin-top: 4px;
}

.clubkonnect-service-page > input,
.clubkonnect-service-page > select {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 56px;
  box-sizing: border-box;
  margin: 0;
  padding: 0 15px;
  border: 1px solid #174554 !important;
  border-radius: 15px;
  outline: none;
  background: linear-gradient(180deg,#0a2b38 0%,#082532 100%) !important;
  color: #f2f7f6 !important;
  -webkit-text-fill-color: #f2f7f6 !important;
  font: inherit;
  font-size: 15px;
  line-height: 1.2;
  box-shadow: 0 8px 24px rgba(0,0,0,.10);
  appearance: auto;
}

.clubkonnect-service-page > input::placeholder {
  color: #708993 !important;
  -webkit-text-fill-color: #708993 !important;
  opacity: 1;
}

.clubkonnect-service-page > input:focus,
.clubkonnect-service-page > select:focus {
  border-color: #20d394 !important;
  box-shadow: 0 0 0 2px rgba(32,211,148,.10), 0 8px 24px rgba(0,0,0,.12);
}

.clubkonnect-service-page > select {
  padding-right: 42px;
  cursor: pointer;
}

.clubkonnect-service-page > input[type="number"] {
  appearance: textfield;
  -moz-appearance: textfield;
}

.clubkonnect-service-page > input[type="number"]::-webkit-outer-spin-button,
.clubkonnect-service-page > input[type="number"]::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.clubkonnect-service-page > .secondary.wide,
.clubkonnect-service-page > .primary.wide {
  width: 100%;
  min-height: 54px;
  margin-top: 12px;
  border-radius: 15px;
  font-size: 15px;
  font-weight: 900;
}

.clubkonnect-service-page > .primary.wide {
  margin-top: 18px;
  box-shadow: 0 10px 25px rgba(25,211,139,.14);
}

.clubkonnect-service-page > .secondary.wide {
  background: #0a2d39 !important;
  border: 1px solid #1b4b59 !important;
  color: #25d998 !important;
}

.clubkonnect-service-page > .secure-note,
.clubkonnect-service-page > .notice {
  margin-top: 12px;
}

.clubkonnect-service-page .service-list-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 12px;
}

.clubkonnect-service-page .provider-card {
  position: relative;
  width: 100%;
  min-height: 72px;
  box-sizing: border-box;
  padding: 12px;
  gap: 12px;
  border-radius: 16px;
  background: linear-gradient(180deg,#0a2b38 0%,#082532 100%) !important;
  border: 1px solid #174554 !important;
  color: #f2f7f6 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.10);
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.clubkonnect-service-page .provider-card:active {
  transform: scale(.99);
}

.clubkonnect-service-page .provider-card:hover,
.clubkonnect-service-page .provider-card:focus-visible,
.clubkonnect-service-page .provider-card.active {
  border-color: #20d394 !important;
  box-shadow: 0 0 0 2px rgba(32,211,148,.08), 0 10px 26px rgba(0,0,0,.14);
}

.clubkonnect-service-page .provider-icon {
  flex: 0 0 46px;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: #0d3541 !important;
  color: #25d998 !important;
  display: grid;
  place-items: center;
  font-size: 18px;
  font-weight: 900;
}

.clubkonnect-service-page .provider-card > div {
  min-width: 0;
  flex: 1;
}

.clubkonnect-service-page .provider-card b {
  display: block;
  margin: 0;
  color: #f2f7f6 !important;
  -webkit-text-fill-color: #f2f7f6 !important;
  font-size: 14px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.clubkonnect-service-page .provider-card small {
  display: block;
  margin-top: 4px;
  color: #8ea4ad !important;
  -webkit-text-fill-color: #8ea4ad !important;
  font-size: 12px;
  line-height: 1.35;
}

.clubkonnect-service-page .provider-card > strong {
  flex: 0 0 auto;
  color: #25d998 !important;
  font-size: 21px;
  line-height: 1;
}

/* Keep the selected live package visually obvious. */
.clubkonnect-service-page .provider-card.active .provider-icon {
  background: rgba(32,211,148,.12) !important;
}

/* Prevent long package names from making the mobile card overflow. */
.clubkonnect-service-page .provider-card span,
.clubkonnect-service-page .provider-card div,
.clubkonnect-service-page .provider-card small,
.clubkonnect-service-page .provider-card b {
  min-width: 0;
}

.clubkonnect-service-page .back-btn {
  display: block;
  margin-top: 18px;
}

/* Compact but still comfortable on narrow Android screens. */
@media (max-width: 380px) {
  .clubkonnect-service-page > label {
    margin-top: 15px;
    font-size: 10px !important;
  }

  .clubkonnect-service-page > input,
  .clubkonnect-service-page > select {
    min-height: 54px;
    padding-left: 13px;
    padding-right: 13px;
    font-size: 14px;
  }

  .clubkonnect-service-page .provider-card {
    min-height: 68px;
    padding: 10px;
  }
}

.service-loading-card{display:flex;align-items:center;gap:14px;background:#082532;border:1px solid rgba(48,211,154,.16);border-radius:20px;padding:20px;color:#fff;box-shadow:0 12px 30px rgba(0,0,0,.12)}
.service-loading-card b{display:block;font-size:15px;letter-spacing:-.2px}
.service-loading-card p{margin:5px 0 0;color:#8ea4ad;font-size:11px;line-height:1.5}
.service-loading-spinner{width:26px;height:26px;min-width:26px;border:3px solid rgba(255,255,255,.14);border-top-color:#20d394;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ===== ADMIN DASHBOARD VALUE PRIVACY ===== */
.admin-hero-actions{display:flex;align-items:center;gap:8px;position:relative;z-index:2;flex-shrink:0}
.admin-hero-actions>span{padding:9px 12px;border-radius:12px;background:rgba(217,180,95,.16);color:#f0ce79;font-size:10px;font-weight:900;letter-spacing:1px}
.admin-visibility-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid #1b4b57;background:#0b303c;color:#7ee3c1;border-radius:12px;min-height:38px;padding:0 10px;font-size:10px;font-weight:800;cursor:pointer;box-shadow:none}
.admin-visibility-toggle:hover{background:#10404c}
.admin-visibility-toggle:active{transform:scale(.98)}
.admin-visibility-toggle span{font-size:9px;letter-spacing:.3px}
.admin-section-heading .admin-visibility-toggle{margin-left:auto}
@media(max-width:700px){
  .admin-hero-actions{align-items:flex-end;flex-direction:column-reverse}
  .admin-hero-actions .admin-visibility-toggle{min-height:34px;padding:0 9px}
  .admin-hero-actions>span{padding:8px 10px}
}


/* ===== DSAS NOVA PROFESSIONAL ADMIN SECURITY UI ===== */
.admin-security-list{gap:14px!important}
.admin-password-card{
  padding:20px!important;
  background:linear-gradient(145deg,#082c39 0%,#072532 100%)!important;
  border:1px solid #174756!important;
  border-radius:22px!important;
  box-shadow:0 18px 45px rgba(0,0,0,.18)!important;
}
.admin-security-card-top{display:flex;align-items:flex-start;gap:14px}
.admin-security-icon{
  flex:0 0 48px;width:48px;height:48px;border-radius:15px;
  display:grid;place-items:center;background:#103d49;border:1px solid #1b5662;
  font-size:22px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)
}
.admin-security-copy{min-width:0}
.admin-security-eyebrow{
  color:#63dfb0;font-size:9px;line-height:1;letter-spacing:1.7px;font-weight:900;margin:2px 0 7px
}
.admin-security-copy h3{margin:0!important;color:#f2f7f6!important;font-size:23px!important;line-height:1.15!important;letter-spacing:-.4px}
.admin-security-copy p{margin:7px 0 0!important;color:#9db2b9!important;font-size:12px!important;line-height:1.55!important}
.admin-security-status{
  display:flex;align-items:center;gap:10px;margin:17px 0 13px;padding:12px 13px;
  border-radius:14px;background:rgba(25,201,139,.07);border:1px solid rgba(25,201,139,.14)
}
.security-check{
  flex:0 0 27px;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;
  background:#19c98b;color:#05232c;font-weight:900;font-size:13px
}
.admin-security-status b{display:block;color:#dff8ef;font-size:12px}
.admin-security-status small{display:block;margin-top:2px;color:#7f9aa3;font-size:10px;line-height:1.4}
.admin-password-open,.admin-password-cancel{
  min-height:46px!important;border-radius:13px!important;font-size:13px!important;font-weight:900!important
}
.admin-password-form{
  margin-top:16px;padding-top:16px;border-top:1px solid #174552;
  display:flex;flex-direction:column;gap:12px
}
.admin-form-divider{display:flex;align-items:center;gap:10px;margin:0 0 1px}
.admin-form-divider:after{content:"";height:1px;background:#153f4c;flex:1}
.admin-form-divider span{color:#61ddb0;font-size:8px;letter-spacing:1.5px;font-weight:900}
.admin-password-field{display:flex;flex-direction:column;gap:7px}
.admin-password-label-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.admin-password-label-row label{margin:0!important;color:#dbe8ea!important;font-size:11px!important;font-weight:800!important}
.admin-password-label-row span{color:#64ddb1;font-size:9px;font-weight:800}
.admin-password-input{
  display:flex;align-items:center;min-height:47px;border:1px solid #1a4856;border-radius:13px;
  background:#061e2a;overflow:hidden;transition:border-color .18s,box-shadow .18s
}
.admin-password-input:focus-within{border-color:#19c98b;box-shadow:0 0 0 3px rgba(25,201,139,.09)}
.admin-password-lock{width:35px;text-align:center;color:#57727c;font-size:8px}
.admin-password-input input{
  flex:1;min-width:0!important;width:auto!important;margin:0!important;padding:13px 5px!important;
  border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;
  color:#f2f7f6!important;font-size:13px!important
}
.admin-password-input input::placeholder{color:#617b84!important}
.password-reveal-btn{
  flex:0 0 auto;margin-right:7px;padding:7px 9px;border-radius:9px;border:1px solid #1b4653;
  background:#0b303c;color:#71e0b7;font-size:9px;font-weight:900;cursor:pointer
}
.password-reveal-btn:active{transform:scale(.97)}
.admin-password-requirement{
  display:flex;align-items:center;gap:7px;color:#80969e;font-size:10px;font-weight:700;margin-top:-2px
}
.admin-password-requirement span{font-size:12px}
.admin-password-requirement.valid{color:#63dcae}
.admin-password-error{
  margin-top:-3px;padding:9px 11px;border-radius:10px;background:rgba(244,72,72,.08);
  border:1px solid rgba(244,72,72,.18);color:#ff8e8e;font-size:10px;font-weight:800
}
.admin-password-save{min-height:47px!important;margin-top:3px;border-radius:13px!important;font-size:13px!important}
.admin-password-save:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:420px){
  .admin-password-card{padding:17px!important;border-radius:19px!important}
  .admin-security-icon{flex-basis:44px;width:44px;height:44px;border-radius:13px}
  .admin-security-copy h3{font-size:21px!important}
}


/* DSAS NOVA: contact picker action for Data/Airtime beneficiary numbers. */
.contact-picker-btn{margin-top:8px;margin-bottom:10px}


/* ===== DSAS NOVA AUTH / SECURITY POLISH ===== */
.auth-page{
  min-height:100vh;
  padding:24px 16px;
  background:radial-gradient(circle at 12% 8%,#0bb77f 0,#062534 36%,#03131f 100%);
}
.auth-card{
  width:min(100%,430px);
  background:linear-gradient(180deg,#f6fbf9 0%,#edf7f3 100%);
  border:1px solid rgba(255,255,255,.3);
  border-radius:30px;
  padding:28px 24px 24px;
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.auth-card h2{color:#082b3b;font-size:29px;letter-spacing:-.5px}
.auth-card .muted{color:#607581;line-height:1.5}
.auth-card label{color:#173543;font-size:11px}
.auth-card input{
  min-height:54px;
  box-sizing:border-box;
  background:#ffffff;
  color:#092a39;
  border:1px solid #d6e3e0;
  border-radius:16px;
  font-size:15px;
  padding:0 15px;
  margin-bottom:0;
  box-shadow:inset 0 1px 1px rgba(8,39,54,.03);
}
.auth-card input:focus{
  border-color:#1cc98b;
  box-shadow:0 0 0 3px rgba(28,201,139,.12);
}
.auth-card .primary{
  min-height:54px;
  margin-top:16px;
  border-radius:16px;
  background:linear-gradient(135deg,#12c88a,#2bdca3);
  color:#052a21;
  font-size:16px;
  font-weight:900;
}
.auth-card .forgot-password-link{
  width:100%;
  border:0;
  background:none;
  color:#0c8f65;
  text-align:right;
  font-size:11px;
  font-weight:900;
  margin-top:9px;
  padding:2px 2px 0;
}
.auth-card .forgot-password-link:hover{text-decoration:underline}
.dsas-password-field{margin-top:12px}
.dsas-password-wrap{position:relative}
.dsas-password-wrap input{padding-right:54px}
.dsas-eye-btn{
  position:absolute;
  right:8px;
  top:7px;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:12px;
  border:0;
  background:#edf7f3;
  color:#0a8f65;
}
.dsas-eye-btn:active{transform:scale(.97)}
.dsas-eye-btn svg{display:block}
.auth-card .biometric-login-btn{
  min-height:52px;
  background:#eaf8f2;
  border:1px solid #cceadf;
  color:#0b684d;
  border-radius:15px;
  font-size:12px;
  margin-top:10px;
}
.auth-card .biometric-login-btn span{
  width:28px;height:28px;border-radius:9px;background:#0fc98b;color:#052a21;display:grid;place-items:center;font-size:12px
}
.auth-card .switch button{color:#0b8f65;font-weight:900}
.auth-card .change-account-btn,.auth-card .saved-email-btn{
  border:1px solid #d6e5e0;background:#fff;color:#0a7657;border-radius:11px;padding:9px 10px;font-weight:800;font-size:11px
}
.auth-card .saved-email-note{display:block;color:#79909a;font-size:10px;margin:6px 2px 0}
.auth-card .text-btn{color:#0a805d;font-weight:900;margin-top:10px}
.auth-card .ghost-btn{
  color:#0a805d;border:1px solid #cfe7de;background:#f7fcfa;border-radius:13px;padding:11px;margin-top:9px;font-weight:900
}
.auth-card .otp{letter-spacing:8px;text-align:center;font-size:22px}
.auth-card .auth-showcase span{background:#e8f4f0;color:#527066}

.admin-password-action{
  min-height:48px!important;
  width:100%;
  border-radius:14px!important;
  border:1px solid rgba(25,201,139,.25)!important;
  background:linear-gradient(135deg,#10be84,#2ddca3)!important;
  color:#052b23!important;
}
.admin-password-cancel{
  background:#0b3040!important;
  color:#d7eee7!important;
  border-color:#1b5260!important;
}
.password-reveal-btn{
  width:42px!important;
  height:42px!important;
  margin:0 2px 0 0!important;
  padding:0!important;
  border:0!important;
  border-radius:11px!important;
  background:#0d3543!important;
  color:#69dfb5!important;
  display:grid!important;
  place-items:center!important;
}
.password-reveal-btn svg{display:block}

/* Professional contact action for beneficiary numbers */
.contact-picker-btn{
  min-height:46px!important;
  margin-top:9px!important;
  margin-bottom:4px!important;
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:14px!important;
  background:#0b3040!important;
  border:1px solid #1b5260!important;
  color:#dff8ef!important;
  font-weight:900!important;
}
.contact-picker-btn span{
  width:27px;height:27px;border-radius:9px;display:grid;place-items:center;
  background:#19c98b;color:#06251f;font-size:14px
}


/* ===== DSAS NOVA FINAL AUTH / SECURITY POLISH ===== */
.auth-page{
  background:radial-gradient(circle at 12% 8%,#0aa875 0,#062536 38%,#03131f 100%);
}
.auth-card{
  background:linear-gradient(180deg,#f0f6f4 0%,#e7f1ee 100%);
  color:#082b3b;
  border:1px solid rgba(7,48,59,.12);
}
.auth-card h2{color:#062a3a!important;font-weight:900!important}
.auth-card .muted,.auth-card .switch{color:#4f6671!important}
.auth-card label{color:#102f3c!important;font-weight:900!important}
.auth-card input{
  background:#f8fbfa!important;
  color:#082b3b!important;
  border-color:#c9d9d5!important;
  font-weight:600;
}
.auth-card input::placeholder{color:#6b7f88!important}
.auth-card .forgot-password-link{color:#087d5a!important}
.auth-card .primary{
  background:linear-gradient(135deg,#10b77d,#20d69c)!important;
  color:#052b22!important;
}
.dsas-eye-btn{
  background:#e0efe9!important;
  color:#087d5a!important;
}
.contact-picker-btn{
  min-height:48px!important;
  border-radius:14px!important;
  background:#0a3040!important;
  border:1px solid #1a5260!important;
  color:#e7f6f1!important;
  box-shadow:none!important;
}
.contact-picker-icon{
  width:28px!important;height:28px!important;
  border-radius:9px!important;
  display:grid!important;place-items:center!important;
  background:#16c98c!important;color:#062a22!important;
}
.contact-picker-btn:disabled{opacity:.55}

/* Admin password card: clean, no lock icon, no blue action button. */
.admin-security-card-top{display:block!important}
.admin-security-card-top .admin-security-icon{display:none!important}
.admin-security-copy .admin-security-eyebrow{color:#62ddb0!important}
.admin-security-copy h3{color:#f2f7f6!important}
.admin-password-action{
  background:linear-gradient(135deg,#10b77d,#20d69c)!important;
  color:#052b22!important;
  border-color:rgba(25,201,139,.3)!important;
}
.admin-password-cancel{
  background:#0b3040!important;
  color:#dff8ef!important;
  border-color:#1b5260!important;
}
.admin-password-lock{display:none!important}
.admin-password-input input{padding-left:13px!important}
.admin-biometric-setting{
  width:100%;margin-top:12px;padding:14px 15px;
  display:flex;align-items:center;gap:12px;
  text-align:left;border:1px solid #174b59;border-radius:16px;
  background:#082b38;color:#e4f4ef;cursor:pointer;
}
.admin-biometric-setting:disabled{opacity:.55;cursor:not-allowed}
.admin-biometric-icon{
  flex:0 0 42px;width:42px;height:42px;border-radius:12px;
  display:grid;place-items:center;background:#103f4c;color:#5ee0b0;
}
.admin-biometric-copy{flex:1;min-width:0}
.admin-biometric-copy b{display:block;font-size:13px}
.admin-biometric-copy small{display:block;margin-top:3px;color:#8da8af;font-size:10px;line-height:1.35}
.admin-biometric-setting>strong{font-size:11px;color:#61ddb0;white-space:nowrap}

/* Keep removed explanatory payment notes from taking any layout space. */
.secure-note{font-size:11px}


/* ===== DSAS NOVA FINAL PROFESSIONAL MEDIUM UI ===== */
.auth-page{
  min-height:100svh;
  box-sizing:border-box;
  padding:20px 14px;
  background:radial-gradient(circle at 18% 10%,#0b8d68 0,#073844 34%,#031a28 72%,#02121c 100%);
}
.auth-card{
  width:min(100%,420px);
  box-sizing:border-box;
  background:#f4f8f6;
  border:1px solid rgba(255,255,255,.48);
  border-radius:28px;
  padding:22px 20px 20px;
  box-shadow:0 18px 48px rgba(0,0,0,.30);
}
.auth-card .logo.large{width:78px!important;height:78px!important;margin:0 auto 4px!important}
.auth-card .brand-title{
  color:#0a2636!important;
  font-size:18px!important;
  font-weight:950!important;
  letter-spacing:1.8px!important;
  margin-top:4px!important;
}
.auth-card .tagline{
  color:#12ae7c!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:1.6px!important;
  margin:5px 0 13px!important;
}
.auth-showcase{gap:6px!important;margin-bottom:15px!important}
.auth-showcase span{
  padding:6px 2px!important;
  border-radius:9px!important;
  background:#e5f0ec!important;
  color:#38564f!important;
  font-size:8px!important;
  font-weight:950!important;
}
.auth-card h2{
  color:#08283a!important;
  font-size:25px!important;
  line-height:1.15!important;
  font-weight:950!important;
  letter-spacing:-.35px!important;
  margin:6px 0 6px!important;
}
.auth-card .muted{
  color:#526b77!important;
  font-size:12px!important;
  font-weight:600!important;
  line-height:1.45!important;
}
.auth-card label{
  color:#153442!important;
  font-size:11px!important;
  font-weight:900!important;
  margin:11px 0 6px!important;
}
.auth-card input{
  min-height:50px!important;
  background:#fff!important;
  color:#0a2636!important;
  border:1.5px solid #cbdad6!important;
  border-radius:14px!important;
  font-size:15px!important;
  font-weight:650!important;
  padding:0 14px!important;
}
.auth-card input::placeholder{color:#7a8c94!important;font-weight:500!important}
.auth-card input:focus{
  border-color:#17bd87!important;
  box-shadow:0 0 0 3px rgba(23,189,135,.11)!important;
}
.auth-card .dsas-password-field{margin-top:10px!important}
.dsas-password-wrap{
  position:relative!important;
  display:block!important;
  width:100%!important;
}
.dsas-password-wrap input{
  width:100%!important;
  padding-right:52px!important;
}
.auth-card .dsas-eye-btn{
  position:absolute!important;
  right:7px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:11px!important;
  background:#edf8f4!important;
  color:#07966b!important;
  display:grid!important;
  place-items:center!important;
  z-index:2!important;
}
.auth-card .dsas-eye-btn:active{transform:translateY(-50%) scale(.97)!important}
.auth-card .forgot-password-link{
  display:block!important;
  width:auto!important;
  margin:7px 2px 0 auto!important;
  padding:0!important;
  color:#0a956a!important;
  font-size:11px!important;
  font-weight:950!important;
}
.auth-card .primary{
  min-height:50px!important;
  margin-top:14px!important;
  border-radius:14px!important;
  font-size:15px!important;
  font-weight:950!important;
}
.auth-card .biometric-login-btn{
  min-height:48px!important;
  margin-top:9px!important;
  border-radius:14px!important;
  font-size:11px!important;
  font-weight:900!important;
}
.auth-card .switch{
  color:#61747d!important;
  font-size:11px!important;
  font-weight:600!important;
  margin-top:11px!important;
}
.auth-card .switch button{
  color:#07966b!important;
  font-weight:950!important;
}

/* Medium customer profile */
.nova-profile-card{
  gap:13px!important;
  padding:15px!important;
  border-radius:19px!important;
}
.nova-profile-card .profile-avatar{
  width:72px!important;height:72px!important;border-radius:19px!important;
}
.nova-profile-card .profile-avatar .logo.large{
  width:58px!important;height:58px!important;
}
.nova-profile-card .profile-identity>b{font-size:17px!important;font-weight:900!important}
.nova-profile-card .profile-identity>small{font-size:10px!important;margin-top:4px!important}
.nova-profile-card .verified-pill{font-size:8px!important;padding:4px 8px!important;margin-top:7px!important}
.nova-account-stats{gap:9px!important}
.nova-account-stats>div{padding:13px!important;border-radius:17px!important}
.nova-account-stats>div>b{font-size:19px!important}

/* Remove the old login-password informational panel if any old markup survives. */
.nova-settings-list .admin-security-card-top .admin-security-eyebrow{display:none!important}

/* Medium, professional admin password panel */
.admin-password-card{
  padding:17px!important;
  border-radius:19px!important;
}
.admin-password-card .admin-security-card-top{gap:0!important}
.admin-password-card .admin-security-copy h3{
  font-size:19px!important;
  font-weight:900!important;
}
.admin-password-card .admin-security-copy p{
  margin:5px 0 0!important;
  font-size:11px!important;
  line-height:1.45!important;
}
.admin-password-action{
  min-height:46px!important;
  border-radius:13px!important;
  font-size:12px!important;
  font-weight:900!important;
  background:linear-gradient(135deg,#0fbd83,#24d29b)!important;
}
.admin-password-form{gap:10px!important;margin-top:13px!important;padding-top:13px!important}

/* Professional medium Contacts action */
.contact-picker-btn{
  min-height:44px!important;
  width:auto!important;
  padding:0 14px!important;
  margin-top:8px!important;
  border-radius:13px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  font-size:11px!important;
  font-weight:900!important;
  background:#0b3040!important;
  border:1px solid #1c5663!important;
  color:#e5f8f1!important;
}
.contact-picker-icon{
  width:28px!important;height:28px!important;border-radius:9px!important;
  display:grid!important;place-items:center!important;
  background:#19c98b!important;color:#052b25!important;
}

/* Keep service purchase screens compact */
.nova-step-input,.nova-step-value{min-height:54px!important;border-radius:17px!important}
.nova-step-form label{font-size:11px!important;font-weight:900!important}
.pin-form input{min-height:48px!important;border-radius:14px!important}

/* Admin navigation remains usable with Settings */
.admin-nav{overflow-x:auto!important;grid-template-columns:repeat(8,minmax(70px,1fr))!important}
.admin-nav button{min-width:70px!important}


/* ===== DSAS NOVA FINAL: ADMIN MORE + CONTACT BUTTON ===== */
.admin-header-left{display:flex;align-items:center;gap:10px;min-width:0}
.admin-menu-btn{
  width:42px!important;height:42px!important;min-width:42px!important;
  border-radius:14px!important;display:grid!important;place-items:center!important;
  background:#0d2d39!important;border:1px solid rgba(25,201,139,.14)!important;
  color:#eef8f5!important;font-size:24px!important;line-height:1!important;
  padding:0!important;flex:none!important;
}
.admin-more-nav{display:flex!important}
.admin-more-nav .nav-icon{color:inherit!important}

.admin-drawer-wrap{z-index:100!important}
.admin-more-drawer{width:min(88vw,380px)!important;max-width:380px!important}
.admin-more-drawer>button{min-height:58px!important}
.admin-more-drawer>button.drawer-active{background:rgba(25,201,139,.08)!important}
.admin-more-drawer>button.drawer-active span{color:#19d38b!important}
.admin-more-drawer>button.drawer-active svg{color:#19d38b!important}

/* Contacts: keep the original app Contacts icon and label on one clean line. */
.contact-picker-btn{
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  min-height:46px!important;
  height:46px!important;
  padding:0 14px!important;
  margin:9px 0 10px!important;
  display:inline-flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  white-space:nowrap!important;
  overflow:visible!important;
  font-size:12px!important;
  font-weight:800!important;
}
.contact-picker-btn > .contact-picker-icon{
  width:30px!important;height:30px!important;min-width:30px!important;
  flex:0 0 30px!important;
  display:grid!important;place-items:center!important;
  border-radius:9px!important;
  background:#19c98b!important;color:#062a22!important;
}
.contact-picker-btn > .contact-picker-icon svg{
  width:18px!important;height:18px!important;display:block!important;
}
.contact-picker-btn > span:not(.contact-picker-icon){
  width:auto!important;
  min-width:max-content!important;
  max-width:none!important;
  display:inline-block!important;
  white-space:nowrap!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
}

/* ===== FINAL MOBILE POLISH: CONTACT + ADMIN BOTTOM NAV ===== */
.contact-picker-btn,
.contact-picker-btn.secondary,
.contact-picker-btn.wide{
  width:auto!important;
  min-width:205px!important;
  max-width:100%!important;
  height:48px!important;
  min-height:48px!important;
  padding:0 14px!important;
  margin:9px 0 10px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  border-radius:14px!important;
  background:#0b3040!important;
  border:1px solid #1b5260!important;
  color:#e7f6f1!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1!important;
  letter-spacing:0!important;
}
.contact-picker-btn > .contact-picker-icon{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  flex:0 0 32px!important;
  border-radius:9px!important;
  display:grid!important;
  place-items:center!important;
  background:#19c98b!important;
  color:#062a22!important;
}
.contact-picker-btn > .contact-picker-icon svg{
  width:18px!important;
  height:18px!important;
}
.contact-picker-btn > span:not(.contact-picker-icon){
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  flex:0 0 auto!important;
  display:inline-block!important;
  color:#e7f6f1!important;
  white-space:nowrap!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1!important;
  margin:0!important;
  padding:0!important;
}

/* Admin: exactly five equal navigation slots filling the available width. */
.admin-nav{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  width:100%!important;
  max-width:none!important;
  left:0!important;
  right:0!important;
  transform:none!important;
  overflow:hidden!important;
  padding-left:0!important;
  padding-right:0!important;
}
.admin-nav button{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  padding:6px 2px 4px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-direction:column!important;
  gap:4px!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-align:center!important;
}
.admin-nav button .nav-icon{
  width:24px!important;
  height:24px!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 24px!important;
  margin:0!important;
}
.admin-nav button .nav-icon svg{
  width:21px!important;
  height:21px!important;
}
.admin-nav button span:last-child{
  width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
  font-size:10px!important;
  line-height:1.1!important;
  font-weight:700!important;
  letter-spacing:0!important;
  margin:0!important;
}
.admin-nav button.active span:last-child{font-weight:800!important}

@media(max-width:700px){
  .admin-nav{height:82px!important;min-height:82px!important}
  .admin-nav button span:last-child{font-size:9.5px!important}
  .contact-picker-btn,
  .contact-picker-btn.secondary,
  .contact-picker-btn.wide{min-width:205px!important}
}

/* Final professional receipt + contact polish */
.contact-picker-btn,
button.contact-picker-btn,
.contact-button {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;
  min-height:48px !important;
  width:auto !important;
  max-width:100% !important;
  padding:0 18px !important;
  border-radius:14px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  font-size:14px !important;
  line-height:1 !important;
  font-weight:700 !important;
  letter-spacing:0 !important;
}
.contact-picker-btn svg,
.contact-button svg { flex:0 0 auto !important; }
.receipt-panel{padding:10px!important;background:rgba(255,255,255,.04)!important;border:1px solid rgba(31,255,184,.16)!important;border-radius:18px!important;overflow:hidden!important}
.receipt-image{display:block;width:100%;height:auto;border-radius:14px;background:#f7fbfa;box-shadow:0 12px 28px rgba(0,0,0,.18)}
.receipt-image-loading{padding:30px 12px;text-align:center;color:#91a6af;font-size:13px}
.receipt-btn.secondary{white-space:nowrap}
.receipt-share-message{display:block;margin-top:7px;color:#68d9ad!important;font-size:11px!important}
@media (max-width:520px){
  .contact-picker-btn,button.contact-picker-btn,.contact-button{font-size:13px!important;padding:0 15px!important;min-height:46px!important}
  .transaction-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
  .receipt-btn{font-size:11px!important}
}


/* GafiaPay Deposit — professional column/card layout */
.gafia-provider-card{position:relative;display:flex;align-items:center;gap:14px;padding:18px 18px!important}
.gafia-provider-card>div:nth-child(2){min-width:0;display:flex;flex-direction:column;gap:3px}
.gafia-provider-card b{font-size:18px}
.gafia-provider-card small{font-size:12px;color:var(--muted)}
.gafia-live-badge{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;background:rgba(16,201,138,.12);border:1px solid rgba(16,201,138,.28);color:#19d79a;font-size:10px;font-weight:800;letter-spacing:.08em}
.gafia-account-card,.gafia-create-card,.gafiapay-admin-card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(8,42,54,.96),rgba(5,30,42,.96));border-radius:20px;padding:18px;margin-bottom:12px;box-shadow:0 12px 30px rgba(0,0,0,.12)}
.gafia-account-head,.gafiapay-admin-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px}
.gafia-account-head small,.gafia-create-head small,.gafiapay-admin-head small{font-size:9px;letter-spacing:.14em;color:#36d9a2;font-weight:800}
.gafia-account-head h3,.gafia-create-head h3,.gafiapay-admin-head h3{margin:5px 0 0;font-size:18px}
.gafia-kyc-badge{padding:6px 9px;border-radius:9px;background:rgba(240,203,92,.12);border:1px solid rgba(240,203,92,.24);color:#f2d36b;font-size:10px;font-weight:800}
.gafia-account-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.gafia-detail{padding:12px;border:1px solid rgba(130,180,190,.12);background:rgba(255,255,255,.025);border-radius:13px;min-width:0}
.gafia-detail-wide{grid-column:1/-1}
.gafia-detail small{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}
.gafia-detail strong{display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis}
.gafia-account-number{letter-spacing:.08em;font-size:16px!important}
.gafia-copy-btn,.gafia-refresh-btn{width:100%;border:1px solid rgba(16,201,138,.35);background:rgba(16,201,138,.08);color:#25d99e;border-radius:13px;padding:13px;font-weight:800;margin-top:10px}
.gafia-refresh-btn{background:linear-gradient(135deg,#10c98a,#16b97f);color:#041b22;border:0}
.gafia-transfer-note{display:flex;gap:10px;align-items:flex-start;margin-top:12px;padding:11px;border-radius:12px;background:rgba(16,201,138,.06)}
.gafia-transfer-note span{color:#1ed89b;font-weight:900}
.gafia-transfer-note p{margin:0;color:var(--muted);font-size:10px;line-height:1.5}
.gafia-create-head p{margin:6px 0 14px;color:var(--muted);font-size:11px}
.gafia-kyc-columns{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:14px}
.gafia-kyc-option{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:13px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.025);color:var(--text)}
.gafia-kyc-option.active{border-color:#15ce91;background:rgba(16,201,138,.08);box-shadow:0 0 0 1px rgba(16,201,138,.1)}
.gafia-kyc-option strong{font-size:14px}
.gafia-kyc-option span{font-size:9px;color:var(--muted);margin-top:4px;line-height:1.35}
.gafia-input-label{display:block;font-size:10px;font-weight:800;margin-bottom:6px;color:var(--muted)}
.gafia-kyc-input{margin-bottom:10px}
.gafiapay-admin-card{margin-top:12px}
.gafiapay-admin-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.gafiapay-admin-grid>div{padding:12px;border:1px solid rgba(130,180,190,.12);border-radius:13px;background:rgba(255,255,255,.025)}
.gafiapay-admin-grid small{display:block;color:var(--muted);font-size:9px;margin-bottom:5px}
.gafiapay-admin-grid strong{font-size:14px}
.gafiapay-admin-card p{margin:12px 0 0;color:var(--muted);font-size:9px;line-height:1.45}
@media(max-width:430px){
  .gafiapay-admin-grid{grid-template-columns:1fr}
}
\n\n/* ===== DSAS NOVA MASTER UI — compact premium data + admin ===== */\n.service-balance-strip{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(135deg,#082c39,#0b3541);border:1px solid rgba(25,211,139,.22);border-radius:18px;padding:14px 16px;margin:0 0 18px}.service-balance-strip span{color:#b2c5c9;font-weight:700}.service-balance-strip strong{color:#22e09a;font-size:20px}.recent-beneficiaries{margin:0 0 18px}.recent-beneficiaries .section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.recent-beneficiaries .section-head b{font-size:17px}.recent-beneficiaries .section-head button{background:transparent;border:0;color:#27e0a0;font-weight:800}.recent-beneficiaries p{margin:0;color:#81979f;font-size:13px}.recent-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.recent-row button{border:0;background:transparent;color:#dfeceb;display:flex;flex-direction:column;align-items:center;gap:5px}.recent-row button b{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#f4c400;color:#111;font-size:12px}.recent-row button:nth-child(2) b{background:#ef3340;color:#fff}.recent-row button:nth-child(3) b{background:#32c75a;color:#fff}.recent-row button:nth-child(4) b{background:#111;color:#8cffc7}.recent-row button span{font-size:10px;white-space:nowrap}.nova-network-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:7px 0 18px}.nova-network-grid button{min-width:0;border:1px solid #174c5b;background:#082a36;color:#dfeceb;border-radius:16px;padding:10px 6px;display:flex;flex-direction:column;align-items:center;gap:7px}.nova-network-grid button.active{border-color:#20dfa0;box-shadow:0 0 0 1px rgba(32,223,160,.25);background:#0d3a42}.nova-network-grid button b{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#f5c400;color:#111}.nova-network-grid button:nth-child(2) b{background:#ef3340;color:#fff}.nova-network-grid button:nth-child(3) b{background:#35c85a;color:#fff}.nova-network-grid button:nth-child(4) b{background:#101214;color:#8cffc7}.nova-network-grid button span{font-weight:700;font-size:12px}.nova-step-field-select{width:100%;height:54px;border-radius:15px;border:1px solid #174c5b;background:#082a36;color:#eef8f6;padding:0 14px;margin:7px 0 17px;font-size:14px}.plans-heading{display:flex;align-items:center;justify-content:space-between;margin:8px 0 10px}.plans-heading b{font-size:17px}.plans-heading span{color:#c2d0d3;font-size:13px}.data-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.data-plan-card{min-width:0;text-align:left;border:1px solid #174c5b;background:#082a36;color:#edf7f5;border-radius:15px;padding:12px 10px;min-height:112px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;overflow:hidden}.data-plan-card.selected{border-color:#20dfa0;background:#0b3d43;box-shadow:0 0 0 1px rgba(32,223,160,.2)}.data-plan-card b{font-size:16px;line-height:1.15;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.data-plan-card span{font-size:11px;color:#b4c6ca;margin-top:5px;min-height:15px}.data-plan-card strong{font-size:16px;color:#20dfa0;margin-top:5px}.data-plan-card small{font-size:9px;color:#91a7ad;margin-top:auto}.selected-plan-card{margin-top:18px;background:#082f3a;border:1px solid #20cfa0;border-radius:19px;padding:16px}.selected-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(255,255,255,.14);padding-bottom:13px;margin-bottom:13px}.selected-head small{color:#9ab1b5;font-size:9px;letter-spacing:1.2px}.selected-head h3{margin:5px 0 2px;font-size:22px}.selected-head span{color:#c0ced0;font-size:12px}.selected-head>strong{color:#20dfa0;font-size:21px;white-space:nowrap}.purchase-actions{display:grid;grid-template-columns:.7fr 1.8fr;gap:10px;margin-top:12px}.purchase-actions button{min-height:48px;border-radius:13px}.admin-provider-stack{display:grid;gap:10px}.provider-status-card{margin:10px 0;padding:12px 13px;border-radius:17px}.admin-finance-grid{gap:9px}.admin-finance-card{border-radius:16px;padding:12px}.admin-finance-card strong{font-size:20px}.gafiapay-admin-card{border-radius:19px;padding:14px}.gafiapay-admin-grid{gap:9px}.gafiapay-admin-grid>div{padding:12px;border-radius:15px}.gafiapay-admin-grid strong{font-size:19px}\n@media(max-width:600px){.data-plan-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.data-plan-card{min-height:100px;padding:10px 8px;border-radius:13px}.data-plan-card b{font-size:14px}.data-plan-card strong{font-size:14px}.data-plan-card span{font-size:10px}.data-plan-card small{font-size:8px}.nova-network-grid{gap:7px}.nova-network-grid button{padding:8px 4px}.nova-network-grid button b{width:36px;height:36px}.recent-row{gap:4px}.recent-row button span{font-size:9px}.selected-head h3{font-size:20px}.selected-head>strong{font-size:19px}}\n@media(max-width:360px){.data-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nova-network-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.recent-row{grid-template-columns:repeat(2,minmax(0,1fr))}}\n
/* FINAL DATA PLAN COMPACTNESS — smaller cards, all 3 values visible */
.data-plan-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;align-items:stretch}
.data-plan-card{min-width:0;width:100%;min-height:74px;height:74px;padding:6px 6px;border-radius:11px;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:0}
.data-plan-card b{display:block;width:100%;font-size:11px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.data-plan-card span{display:block;width:100%;font-size:7.5px;line-height:1.15;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#b4c6ca}
.data-plan-card strong{display:block;width:100%;font-size:11px;line-height:1.1;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:600px){.data-plan-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.data-plan-card{min-height:72px;height:72px;padding:5px 5px;border-radius:10px}.data-plan-card b{font-size:10px}.data-plan-card span{font-size:7px;margin-top:3px}.data-plan-card strong{font-size:10px;margin-top:3px}}
@media(max-width:360px){.data-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.data-plan-card{min-height:74px;height:74px}}

/* ===== ADMIN DASHBOARD RESTORE — readable spacing without redesign ===== */
.admin-dashboard-section,
.admin-finance-section,
.quick-admin{min-width:0;overflow:hidden}

.admin-section-title,
.admin-section-heading{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:12px}
.admin-section-title>div,
.admin-section-heading>div{min-width:0}
.admin-section-title h3,
.admin-section-heading h3{overflow-wrap:anywhere;line-height:1.25}
.admin-section-title button,
.admin-section-title>button{flex:0 0 auto;white-space:nowrap}

.provider-balance-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.provider-balance-card{min-width:0;display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:11px;padding:13px 14px;border-radius:17px;overflow:hidden}
.provider-balance-copy{min-width:0;display:flex;flex-direction:column;gap:4px}
.provider-balance-copy b,
.provider-balance-copy small,
.provider-balance-copy strong{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
.provider-balance-copy b{white-space:nowrap}
.provider-balance-copy small{line-height:1.25;white-space:normal}
.provider-balance-copy strong{font-size:18px;line-height:1.2;overflow-wrap:anywhere}
.provider-online-dot{flex:0 0 auto;white-space:nowrap;font-size:10px;font-weight:800}

.admin-four-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;min-width:0}
.admin-metric-card{min-width:0;overflow:hidden}
.admin-metric-card small{display:block;line-height:1.25;white-space:normal}
.admin-metric-card strong{display:block;line-height:1.2;overflow-wrap:anywhere}
.admin-metric-card span{display:block;line-height:1.3;white-space:normal;overflow-wrap:anywhere}
.sales-card{min-width:0}
.sales-card .sales-icon{flex:0 0 auto}

.recent-admin-list{display:grid;gap:8px;min-width:0}
.recent-admin-row{width:100%;min-width:0;display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:10px;text-align:left}
.recent-type{width:32px;height:32px;min-width:32px;border-radius:10px;display:grid;place-items:center}
.recent-main{min-width:0;display:flex;flex-direction:column;gap:4px}
.recent-main b,.recent-main small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
.recent-main b{white-space:nowrap;line-height:1.25}
.recent-main small{white-space:nowrap;line-height:1.25}
.recent-admin-row>strong{min-width:0;white-space:nowrap;text-align:right;line-height:1.2}

.system-status-list{display:grid;gap:8px;min-width:0}
.system-status-list>div{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 12px;border-radius:13px}
.system-status-list>div>span{min-width:0;display:flex;align-items:center;gap:8px}
.system-status-list b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.system-status-list strong{white-space:nowrap;flex:0 0 auto}

.admin-period-badge{flex:0 0 auto;white-space:nowrap}
.admin-link-btn,.admin-refresh-mini{white-space:nowrap;flex:0 0 auto}

@media(max-width:700px){
  .admin-content{padding-left:14px;padding-right:14px}
  .admin-section-title,.admin-section-heading{gap:8px}
  .admin-four-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .provider-balance-card{grid-template-columns:34px minmax(0,1fr) auto;gap:9px;padding:11px 12px}
  .provider-balance-copy strong{font-size:16px}
  .provider-online-dot{font-size:9px}
  .recent-admin-row{grid-template-columns:30px minmax(0,1fr) auto;gap:8px}
  .recent-type{width:30px;height:30px;min-width:30px}
  .recent-main b{font-size:11px}
  .recent-main small{font-size:9px}
  .recent-admin-row>strong{font-size:12px}
}
@media(max-width:420px){
  .admin-four-grid{grid-template-columns:1fr 1fr}
  .provider-balance-card{grid-template-columns:32px minmax(0,1fr)}
  .provider-online-dot{grid-column:2;justify-self:start;margin-top:-2px}
  .recent-admin-row{grid-template-columns:28px minmax(0,1fr)}
  .recent-admin-row>strong{grid-column:2;text-align:left;font-size:12px;margin-top:-2px}
}

/* ===== ADMIN DASHBOARD LAYOUT RESTORE ===== */
.admin-dashboard-section{
  margin:12px 0;
  padding:16px;
  background:#082532;
  border:1px solid #153b49;
  border-radius:21px;
  box-shadow:0 14px 40px rgba(0,0,0,.16);
  min-width:0;
}
.admin-section-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:13px;
  min-width:0;
}
.admin-section-title>div{min-width:0}
.admin-section-title small{
  display:block;
  color:#6fe3b4;
  font-size:8px;
  line-height:1.2;
  letter-spacing:1.5px;
  font-weight:900;
}
.admin-section-title h3{
  margin:4px 0 0;
  color:#f2f7f6;
  font-size:19px;
  line-height:1.25;
  letter-spacing:-.25px;
}
.admin-section-title button,
.admin-link-btn,
.admin-refresh-mini{
  flex:0 0 auto;
  white-space:nowrap;
}
.admin-period-badge{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:6px 10px;
  border-radius:10px;
  background:#103b45;
  color:#6fe3b4;
  font-size:9px;
  font-weight:900;
}

.provider-balance-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:10px;
}
.provider-balance-card{
  min-width:0;
  display:grid;
  grid-template-columns:40px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  padding:13px;
  background:#092b38;
  border:1px solid #153f4c;
  border-radius:16px;
}
.provider-brand-mark{
  width:40px;
  height:40px;
  border-radius:12px;
  display:grid;
  place-items:center;
  flex:0 0 40px;
  background:#103b45;
  color:#19d38b;
  font-weight:900;
}
.provider-balance-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.provider-balance-copy b{
  color:#f2f7f6;
  font-size:13px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.provider-balance-copy small{
  color:#8ea4ad;
  font-size:9px;
  line-height:1.3;
  overflow-wrap:anywhere;
}
.provider-balance-copy strong{
  color:#f2f7f6;
  font-size:17px;
  line-height:1.2;
  overflow-wrap:anywhere;
}
.provider-online-dot{
  white-space:nowrap;
  color:#19d38b;
  font-size:9px;
  font-weight:900;
}

.admin-four-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
  min-width:0;
}
.admin-metric-card{
  min-width:0;
  padding:13px;
  background:#092b38;
  border:1px solid #153f4c;
  border-radius:15px;
  overflow:hidden;
}
.admin-metric-card small{
  display:block;
  color:#8ea4ad;
  font-size:9px;
  line-height:1.3;
}
.admin-metric-card strong{
  display:block;
  margin-top:6px;
  color:#f2f7f6;
  font-size:20px;
  line-height:1.2;
  letter-spacing:-.3px;
  overflow-wrap:anywhere;
}
.admin-metric-card span{
  display:block;
  margin-top:5px;
  color:#718a94;
  font-size:8px;
  line-height:1.3;
  overflow-wrap:anywhere;
}
.sales-card .sales-icon{
  width:34px;
  height:34px;
  margin-bottom:9px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:#103b45;
  color:#19d38b;
}
.sales-card.airtime .sales-icon{background:rgba(25,211,139,.1)}
.sales-card.data .sales-icon{background:rgba(76,183,223,.1)}
.sales-card.bills .sales-icon{background:rgba(255,208,0,.1)}
.sales-card.others .sales-icon{background:rgba(227,194,111,.1)}

.recent-admin-list{
  display:grid;
  gap:8px;
  min-width:0;
}
.recent-admin-row{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  background:#092b38;
  border:1px solid #153f4c;
  border-radius:14px;
  color:#f2f7f6;
  text-align:left;
}
.recent-type{
  width:34px;
  height:34px;
  min-width:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:#103b45;
  color:#19d38b;
}
.recent-main{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.recent-main b{
  display:block;
  color:#f2f7f6;
  font-size:10px;
  line-height:1.3;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.recent-main small{
  display:block;
  color:#8ea4ad;
  font-size:8px;
  line-height:1.3;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.recent-admin-row>strong{
  color:#19d38b;
  font-size:12px;
  line-height:1.2;
  white-space:nowrap;
  text-align:right;
}

.system-status-list{
  display:grid;
  gap:8px;
}
.system-status-list>div{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:11px 12px;
  background:#092b38;
  border:1px solid #153f4c;
  border-radius:13px;
}
.system-status-list>div>span{
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
  color:#f2f7f6;
}
.system-status-list>div>span svg{color:#19d38b;flex:0 0 auto}
.system-status-list b{
  min-width:0;
  font-size:10px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.system-status-list strong{
  white-space:nowrap;
  font-size:9px;
}
.status-online{color:#19d38b}
.status-offline{color:#f06b76}

.admin-payment-activity{margin-top:12px}

@media(max-width:700px){
  .admin-dashboard-section{padding:13px;margin:10px 0;border-radius:18px}
  .admin-section-title{gap:8px;margin-bottom:11px}
  .admin-section-title h3{font-size:16px}
  .admin-four-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .admin-metric-card{padding:11px}
  .admin-metric-card strong{font-size:17px}
  .provider-balance-card{grid-template-columns:34px minmax(0,1fr);gap:9px;padding:11px}
  .provider-brand-mark{width:34px;height:34px;min-width:34px;border-radius:10px}
  .provider-online-dot{grid-column:2;justify-self:start;margin-top:-3px}
  .recent-admin-row{grid-template-columns:30px minmax(0,1fr) auto;gap:8px;padding:10px}
  .recent-type{width:30px;height:30px;min-width:30px}
  .recent-main b{font-size:9px}
  .recent-main small{font-size:7.5px}
  .recent-admin-row>strong{font-size:11px}
}
@media(max-width:380px){
  .admin-four-grid{grid-template-columns:1fr 1fr}
  .admin-section-title h3{font-size:15px}
  .admin-section-title small{font-size:7px}
  .recent-admin-row{grid-template-columns:28px minmax(0,1fr);gap:7px}
  .recent-admin-row>strong{grid-column:2;text-align:left;margin-top:-2px}
}


/* ===== ADMIN HEADER ACTIONS — PROFESSIONAL DARK STYLE ===== */
.admin-dashboard-section .admin-refresh-mini,
.admin-dashboard-section .admin-link-btn{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:30px;
  padding:7px 10px;
  border:1px solid rgba(25,211,139,.20);
  border-radius:9px;
  background:#0b303c;
  color:#7fe8bd;
  font:inherit;
  font-size:9px;
  font-weight:800;
  line-height:1;
  text-decoration:none;
  box-shadow:0 2px 8px rgba(0,0,0,.12);
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.admin-dashboard-section .admin-refresh-mini:hover,
.admin-dashboard-section .admin-link-btn:hover{
  background:#103b45;
  border-color:rgba(25,211,139,.34);
  color:#a7f3d0;
}
.admin-dashboard-section .admin-refresh-mini:active,
.admin-dashboard-section .admin-link-btn:active{
  transform:translateY(1px);
}
.admin-dashboard-section .admin-refresh-mini:focus-visible,
.admin-dashboard-section .admin-link-btn:focus-visible{
  outline:2px solid rgba(25,211,139,.35);
  outline-offset:2px;
}

@media(max-width:700px){
  .admin-dashboard-section .admin-refresh-mini,
  .admin-dashboard-section .admin-link-btn{
    min-height:28px;
    padding:6px 9px;
    font-size:8.5px;
    border-radius:8px;
  }
}


/* Customer theme toggle — scoped to customer app only; admin/public screens remain unchanged. */
.customer-theme-dark{--customer-bg:#07131c;--customer-card:#0d202b;--customer-card-2:#102936;--customer-line:#1d3a46;--customer-text:#edf7f5;--customer-muted:#9aafb5;display:block;min-height:100vh;background:var(--customer-bg);color:var(--customer-text)}
.customer-theme-dark .app{background:linear-gradient(180deg,#07131c 0%,#081923 100%);color:var(--customer-text)}
.customer-theme-dark .topbar{background:rgba(7,19,28,.96);border-color:var(--customer-line);box-shadow:0 5px 22px rgba(0,0,0,.22)}
.customer-theme-dark .top-brand b,.customer-theme-dark .nova-welcome h1,.customer-theme-dark .nova-section-head h2,.customer-theme-dark .nova-service-grid b,.customer-theme-dark .nova-market-grid b,.customer-theme-dark .profile-identity>b,.customer-theme-dark .nova-settings-list .setting-item,.customer-theme-dark .page-title h1{color:var(--customer-text)}
.customer-theme-dark .top-brand small,.customer-theme-dark .nova-welcome p,.customer-theme-dark .nova-service-grid small,.customer-theme-dark .nova-market-grid small,.customer-theme-dark .profile-identity>small,.customer-theme-dark .nova-settings-list .setting-item small,.customer-theme-dark .page-title p{color:var(--customer-muted)}
.customer-theme-dark .icon-btn{background:#102733;color:var(--customer-text)}
.customer-theme-dark .nova-service-grid>button,.customer-theme-dark .nova-market-grid>button,.customer-theme-dark .nova-search,.customer-theme-dark .nova-categories button,.customer-theme-dark .nova-support-cards a,.customer-theme-dark .nova-complaint,.customer-theme-dark .nova-profile-card,.customer-theme-dark .nova-settings-list .setting-item,.customer-theme-dark .payment-info,.customer-theme-dark .profile-card,.customer-theme-dark .settings-card,.customer-theme-dark .complaint,.customer-theme-dark .coming-card,.customer-theme-dark .secure-note,.customer-theme-dark .row-card,.customer-theme-dark .provider-card,.customer-theme-dark .empty,.customer-theme-dark .network-card{background:var(--customer-card);border-color:var(--customer-line);color:var(--customer-text);box-shadow:0 8px 24px rgba(0,0,0,.16)}
.customer-theme-dark .nova-feature{background:linear-gradient(135deg,#0b2b30,#10242d);border-color:var(--customer-line)}
.customer-theme-dark .nova-feature h3,.customer-theme-dark .form-heading h3,.customer-theme-dark .nova-complaint label,.customer-theme-dark .profile-identity>b,.customer-theme-dark .nova-settings-list .setting-item b{color:var(--customer-text)}
.customer-theme-dark .nova-feature p,.customer-theme-dark .form-heading p,.customer-theme-dark .nova-complaint label span{color:var(--customer-muted)}
.customer-theme-dark .nova-search>input,.customer-theme-dark .nova-complaint input,.customer-theme-dark .nova-complaint select,.customer-theme-dark .nova-complaint textarea{background:#0a1b25;color:var(--customer-text);border-color:var(--customer-line)}
.customer-theme-dark .nova-categories button{color:var(--customer-muted)}
.customer-theme-dark .nova-categories button.active{background:#0bb477;border-color:#0bb477;color:#041a14}
.customer-theme-dark .nova-bottom{background:rgba(7,19,28,.98);border-color:var(--customer-line);box-shadow:0 -10px 28px rgba(0,0,0,.25)}
.customer-theme-dark .nova-bottom button{color:#789098}
.customer-theme-dark .drawer{background:#0a1b25;color:var(--customer-text)}
.customer-theme-dark .drawer>button{background:#0a1b25;border-color:var(--customer-line);color:var(--customer-text)}
.customer-theme-dark .drawer-head button,.customer-theme-dark .modal-close{background:#132b36;color:var(--customer-text)}
.customer-theme-dark .modal{background:#0d202b;color:var(--customer-text)}
.customer-theme-dark .modal input{background:#091923;color:var(--customer-text);border-color:var(--customer-line)}
.customer-theme-dark .notice{background:#0b3028;border-color:#195542;color:#8ce8c3}
.customer-theme-dark .profile-avatar{background:#102936}
.customer-theme-dark .setting-icon{background:#12322e}
.customer-theme-dark .setting-status.enabled{background:#12352c}
.customer-theme-dark .theme-setting .setting-icon{background:#253223;color:#f3cf63}
.customer-theme-dark .page-title small{color:#36d9a2}

/* Safe customer profile photo — isolated from the existing profile layout. */
.profile-photo-wrap{width:82px;min-width:82px;display:flex;flex-direction:column;align-items:center;gap:6px}
.profile-photo-button{width:82px;height:82px;position:relative;display:block;cursor:pointer}
.profile-photo-button>input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.profile-photo-button .profile-avatar{width:82px;height:82px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:var(--soft);border:1px solid var(--line)}
.profile-photo-image{width:100%;height:100%;display:block;object-fit:cover}
.profile-photo-camera{position:absolute;right:-2px;bottom:-2px;width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;border:3px solid #fff;font-size:15px;font-weight:900;line-height:1}
.profile-photo-remove{background:none;color:var(--danger);font-size:9px;font-weight:800;padding:0}
.profile-photo-error{max-width:170px;text-align:center;color:var(--danger);font-size:8px;line-height:1.25}
.profile-photo-button:has(input:disabled){opacity:.65;cursor:wait}
.customer-theme-dark .profile-photo-button .profile-avatar{background:#102936;border-color:var(--customer-line)}
.customer-theme-dark .profile-photo-camera{border-color:#0d202b}

.login-pin-divider{display:flex;align-items:center;gap:10px;margin:14px 0 10px;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.08em}.login-pin-divider:before,.login-pin-divider:after{content:"";height:1px;flex:1;background:var(--line)}


/* Login method selector for the optional 5-digit Login PIN. */
.login-method-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 14px;padding:4px;border:1px solid var(--line);border-radius:12px;background:var(--surface,#f7faf9)}
.login-method-switch button{border:0;background:transparent;border-radius:9px;padding:9px 8px;font:inherit;font-weight:700;color:var(--muted,#64727a);cursor:pointer}
.login-method-switch button.active{background:var(--card,#fff);color:var(--primary,#08a968);box-shadow:0 1px 5px rgba(0,0,0,.08)}