/* NairaFlow App UI */
:root{
  --nf-primary:#0b8f68;
  --nf-primary-dark:#087454;
  --nf-bg:#f5f7f9;
  --nf-card:#fff;
  --nf-text:#111827;
  --nf-muted:#6b7280;
  --nf-border:#e7ebef;
  --nf-radius:20px;
}
*{box-sizing:border-box}
html{background:#111827}
body{
  margin:0;
  background:var(--nf-bg);
  color:var(--nf-text);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:15px;
  min-height:100vh;
  padding-bottom:78px;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}

/* App shell */
.nf-app-header{
  position:sticky;top:0;z-index:50;
  background:#111827;color:#fff;
  padding:14px 18px 13px;
  box-shadow:0 2px 12px rgba(0,0,0,.14);
}
.nf-header-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.nf-brand{font-size:21px;font-weight:800;letter-spacing:-.5px}
.nf-brand span{color:#22b883}
.nf-avatar{
  width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  background:#fff;color:#111827;font-weight:800;border:2px solid rgba(255,255,255,.35)
}
.nf-app-main{max-width:560px;margin:0 auto;padding:18px 15px 20px}

/* Bottom mobile navigation */
.nf-bottom-nav{
  position:fixed;left:0;right:0;bottom:0;z-index:100;
  height:70px;background:#fff;border-top:1px solid var(--nf-border);
  display:flex;justify-content:space-around;align-items:center;
  box-shadow:0 -6px 20px rgba(17,24,39,.08);
  padding-bottom:env(safe-area-inset-bottom);
}
.nf-bottom-nav a{
  flex:1;text-align:center;color:#7a8491;font-size:11px;font-weight:600;
  padding:8px 4px;position:relative
}
.nf-bottom-nav a .nf-icon{display:block;font-size:20px;line-height:22px;margin-bottom:2px}
.nf-bottom-nav a.active{color:var(--nf-primary)}
.nf-bottom-nav a.active:before{
  content:"";position:absolute;top:-1px;left:28%;right:28%;height:3px;
  background:var(--nf-primary);border-radius:0 0 5px 5px
}

/* Cards / plugin output */
.nf-card,.nf-panel,.nf-box,.nf-dashboard-card{
  background:var(--nf-card);border:1px solid var(--nf-border);
  border-radius:var(--nf-radius);box-shadow:0 5px 18px rgba(17,24,39,.05);
}
.nf-card{padding:20px;margin-bottom:14px}
.nf-app-main h1{font-size:25px;line-height:1.15;margin:4px 0 18px;letter-spacing:-.6px}
.nf-app-main h2{font-size:18px;margin:0 0 12px}
.nf-app-main h3{font-size:16px}
button,.button,input[type=submit],.wp-element-button{
  border:0;border-radius:13px;padding:13px 16px;font-weight:700;
  background:var(--nf-primary);color:#fff;cursor:pointer
}
button:hover,input[type=submit]:hover{background:var(--nf-primary-dark)}
input,select,textarea{
  width:100%;border:1px solid #dfe5ea;border-radius:12px;
  padding:13px 14px;background:#fff;font:inherit;outline:none
}
input:focus,select:focus,textarea:focus{border-color:#75cdb2;box-shadow:0 0 0 3px rgba(11,143,104,.10)}
label{font-weight:600;font-size:13px;margin:0 0 6px;display:block}

/* Home/dashboard app shortcuts */
.nf-app-hero{
  background:linear-gradient(135deg,#0b8f68,#087454);color:#fff;
  border-radius:22px;padding:22px;margin-bottom:16px;
  box-shadow:0 10px 24px rgba(11,143,104,.20)
}
.nf-app-hero .balance{font-size:30px;font-weight:800;margin:6px 0 2px}
.nf-app-hero .muted{opacity:.8;font-size:12px}
.nf-app-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:14px 0}
.nf-app-tile{
  background:#fff;border:1px solid var(--nf-border);border-radius:18px;
  padding:16px;min-height:105px;box-shadow:0 4px 14px rgba(17,24,39,.04)
}
.nf-app-tile .tile-icon{font-size:25px;margin-bottom:10px}
.nf-app-tile strong{display:block;font-size:14px}
.nf-app-tile small{display:block;color:var(--nf-muted);margin-top:4px}

/* Hide conventional desktop navigation if theme markup has it */
.site-header nav,.main-navigation,.desktop-menu{display:none!important}
.site-footer{display:none!important}

@media(min-width:700px){
  .nf-app-main{padding-top:28px}
  .nf-bottom-nav{max-width:560px;left:50%;right:auto;transform:translateX(-50%);border-radius:18px 18px 0 0}
}

/* Plugin electricity form */
#nf-electricity{display:grid;gap:14px}
#nf-electricity label{font-weight:600;font-size:13px}
#nf-electricity input,#nf-electricity select{width:100%;margin-top:6px}
#nf-electricity button{width:100%;margin-top:4px}
#nf-electricity .nf-msg{min-height:24px;font-size:13px}

.nf-amount-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0 15px}.nf-amount{background:#fff!important;color:#111827!important;border:1px solid #dfe5ea!important;padding:12px 8px!important}.nf-amount.selected{border-color:#0b8f68!important;box-shadow:0 0 0 2px rgba(11,143,104,.15)}.nf-network-status{font-size:13px;color:#6b7280;margin:-5px 0 12px}.nf-network-status.verified{color:#087454;font-weight:700}.nf-service-form label{margin-top:12px}.nf-msg{margin-top:12px;line-height:1.5}