:root{--green:#287a35;--green2:#145c2a;--gold:#c7a33d;--bg:#f4f7f3;--dark:#16202b;--muted:#667085;--danger:#b42318;--ok:#087443;--card:#fff;--line:#e5e7da;--blue:#1849a9;--purple:#6941c6}*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--dark)}a{color:inherit;text-decoration:none}button,.btn{border:0;border-radius:12px;background:linear-gradient(135deg,var(--gold),var(--green));color:#fff;font-weight:800;padding:10px 13px;cursor:pointer;display:inline-block}button.secondary,.btn.secondary{background:#edf7ee;color:var(--green2);border:1px solid #cae6ce}button.danger,.btn.danger{background:#fee4e2;color:#b42318}aside{position:fixed;inset:0 auto 0 0;width:250px;background:linear-gradient(160deg,#102416,var(--green2));color:#fff;padding:22px 14px;overflow:auto}aside .brand{font-size:27px;font-weight:900;line-height:1.05;margin-bottom:20px}aside .brand span{color:var(--gold)}aside a{display:block;padding:11px 12px;border-radius:12px;margin:3px 0;color:#eaf4ea;font-weight:750;font-size:14px}aside a:hover{background:rgba(255,255,255,.1)}main{margin-left:250px;padding:24px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}header h1{margin:0;font-size:32px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.card,.panel{background:rgba(255,255,255,.95);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 10px 25px rgba(10,30,18,.06)}.card b{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.7px}.card strong{font-size:34px;display:block;margin-top:7px}.danger strong{color:var(--danger)}.ok strong{color:var(--ok)}.panel{margin:14px 0}.panel h2{margin:0 0 10px}.muted{color:var(--muted)}.alert{background:#ffe6e6;color:#9a1a1a;border-radius:14px;padding:13px;margin:12px 0;font-weight:800}.notice{background:#fff8dc;border-left:5px solid var(--gold);padding:13px;border-radius:12px;margin:12px 0}.form{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.form.two{grid-template-columns:repeat(2,1fr)}input,select,textarea{width:100%;padding:11px;border:1px solid var(--line);border-radius:12px;background:#fff;font:inherit}textarea{min-height:86px}.full{grid-column:1/-1}label{font-weight:800;color:#263241}label small{display:block;color:var(--muted);font-weight:500;margin-bottom:5px}table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;margin:14px 0;box-shadow:0 10px 25px rgba(10,30,18,.04)}th,td{text-align:left;padding:11px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:top}th{background:#f0f5ef;color:var(--green2);text-transform:uppercase;font-size:12px;letter-spacing:.6px}.pill{border-radius:999px;padding:5px 9px;background:#eef1ee;color:var(--green2);font-weight:800;display:inline-block}.online,.active,.sent,.open{background:#e6f7ed;color:#087443}.offline,.suspended,.disabled,.failed,.critical{background:#ffe6e6;color:#b42318}.unknown,.draft,.pending{background:#f2f4f7;color:#475467}.standby,.assigned{background:#eef4ff;color:#1849a9}.maintenance,.overdue,.high{background:#fff4e5;color:#b54708}.email{background:#f4ebff;color:#6941c6}.whatsapp{background:#e6f7ed;color:#087443}.both{background:#eef4ff;color:#1849a9}pre{white-space:pre-wrap;background:#0b1220;color:#e5efff;padding:16px;border-radius:14px;overflow:auto;font-size:12px}.login{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,var(--green2),#287a35)}.login-card{width:min(520px,90vw);background:#fff;border-radius:28px;padding:40px;box-shadow:0 35px 80px rgba(0,0,0,.25)}.login-card h1{font-size:36px;margin:0 0 18px}.login-card label{display:block;margin:13px 0}.login-card button{width:100%;margin-top:8px}.small{font-size:12px}.row-actions form{display:inline-block;margin:2px}.split{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:1000px){aside{position:relative;width:auto}main{margin-left:0}.grid,.form,.form.two,.split{grid-template-columns:1fr}header{display:block}}

input[type=file]{background:#fff}.row-actions{display:flex;gap:6px;flex-wrap:wrap}.row-actions form{margin:0}

.row-actions a{margin:2px}.doc-preview-note{background:#fff8dc;border-left:5px solid #c9a43a;padding:12px;border-radius:10px}

.brand-owned{padding:10px 8px 18px;margin-bottom:14px;text-align:center;border-bottom:1px solid rgba(255,255,255,.18)}
.brand-owned img{width:150px;max-width:90%;display:block;margin:0 auto 10px;background:#fff;border-radius:14px;padding:8px;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.brand-owned strong{display:block;font-size:20px;letter-spacing:.4px;color:#fff}
.brand-owned small{display:block;font-size:12px;color:#f1d982;margin-top:4px}
.login-logo{display:block;width:210px;max-width:85%;margin:0 auto 18px;background:#fff;border-radius:18px;padding:10px;box-shadow:0 10px 28px rgba(0,0,0,.14)}

/* PPPoE standard visibility */
#radius_username,#radius_password{font-weight:700}

/* Professional clean-up */
body{background:linear-gradient(180deg,#f5f7f1 0%,#eef3ec 100%);}
aside{box-shadow:18px 0 50px rgba(16,36,22,.12)}
header{background:rgba(255,255,255,.72);backdrop-filter:blur(8px);border:1px solid #e4e8da;border-radius:18px;padding:16px 18px}
.hero-panel{background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(248,242,220,.9));border-left:6px solid var(--gold)}
.brand-owned{padding:8px 8px 18px;margin-bottom:12px;text-align:center;border-bottom:1px solid rgba(255,255,255,.18)}
.brand-owned img{width:168px;max-width:92%;display:block;margin:0 auto 10px;background:white;border-radius:16px;padding:8px;box-shadow:0 12px 28px rgba(0,0,0,.2)}
.brand-owned strong{display:block;color:#fff;font-size:20px;letter-spacing:.4px}
.brand-owned small{display:block;color:#f1d982;font-size:12px;margin-top:4px}
.logo-fallback{display:none;color:#fff;font-weight:900;font-size:22px;margin:8px 0}
.login-logo{display:block;width:220px;max-width:86%;margin:0 auto 18px;background:#fff;border-radius:18px;padding:10px;box-shadow:0 14px 34px rgba(0,0,0,.16)}
.panel h2{letter-spacing:-.3px}
input,select,textarea{border-color:#dfe5d6}
table{border-radius:18px;overflow:hidden}
td .muted{font-size:12px}

.billing-lines-table{overflow-x:auto;margin:12px 0}
#billing_lines input,#billing_lines select{min-width:140px}
#billing_lines .item-desc{min-width:260px}
.invoice-total-box{font-size:22px;font-weight:900;text-align:right;margin:14px 0;color:#145c2a}
.invoice-total-box strong{font-size:30px}

/* Codex-ready cosmetics and LTE package editor */
.mini-stats{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.mini-stats span{background:#fff;border:1px solid #e4e8da;border-radius:999px;padding:8px 12px;font-size:13px;box-shadow:0 6px 18px rgba(10,30,18,.05)}
.package-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:16px;margin-top:14px}
.package-card{background:#fff;border:1px solid #e4e8da;border-radius:18px;padding:16px;box-shadow:0 10px 24px rgba(10,30,18,.06)}
.package-card input,.package-card select,.package-card textarea{margin:6px 0}
.package-card textarea{min-height:76px}
.package-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.switchline{font-size:13px;color:#667085;font-weight:800;display:flex;align-items:center;gap:6px}
.compact{grid-template-columns:1fr 1fr !important;gap:8px}
.pill.lte{background:#e6f7ed;color:#087443}
.pill.voip{background:#eef4ff;color:#1849a9}
.pill.web-hosting,.pill.web-development{background:#f4ebff;color:#6941c6}
.pill.internet,.pill.fibre{background:#fff4e5;color:#b54708}
aside:after{content:"Zenasha ICT Platform";display:block;margin:18px 8px 0;padding:10px;border:1px solid rgba(255,255,255,.18);border-radius:14px;color:#f1d982;font-size:12px;text-align:center}
.logo-fallback{display:none;color:#fff;font-weight:900;font-size:22px;margin:8px 0}
.brand-owned img{background:#fff}
@media(max-width:900px){.package-grid{grid-template-columns:1fr}.compact{grid-template-columns:1fr !important}}

#quote_lines input,#quote_lines select{min-width:140px}#quote_lines select[name='item_description[]']{min-width:260px}.payment-box{background:#f8f2dc;border-left:6px solid #c9a43a;padding:14px;border-radius:12px;margin:16px 0}

/* Full recommendations: portal, SLA, onboarding, payment proof and LTE polish */
.portal-wrap{max-width:1180px;margin:0 auto;padding:28px}
.pill.done,.pill.confirmed,.pill.paid{background:#e6f7ed;color:#087443}
.pill.pending,.pill.partial{background:#fff4e5;color:#b54708}
.pill.critical{background:#ffe6e6;color:#b42318}
.pill.high{background:#fff1f3;color:#c01048}
.pill.medium{background:#fff8dc;color:#8a6a00}
.pill.low{background:#eef4ff;color:#1849a9}
.panel.hero-panel h1,.panel.hero-panel h2{margin-bottom:6px}
.kpi-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.kpi-strip .card strong{font-size:28px}
input[type=file]{padding:10px;background:#fff}

/* Account code clarity */
.account-code{font-weight:900;letter-spacing:.6px;color:#145c2a}

/* Grouped accordion navigation */
aside{overflow-y:auto}
aside a.nav-home,aside a.nav-logout{font-weight:900;border:1px solid rgba(255,255,255,.12)}
.nav-group{margin:8px 0;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:rgba(255,255,255,.055);overflow:hidden}
.nav-group summary{cursor:pointer;list-style:none;padding:12px 12px;color:#fff;font-weight:900;letter-spacing:.2px;display:flex;align-items:center;justify-content:space-between}
.nav-group summary::-webkit-details-marker{display:none}
.nav-group summary:after{content:"+";font-size:18px;color:#f1d982}
.nav-group[open] summary:after{content:"–"}
.nav-group a{margin:0 8px 7px 18px;padding:9px 10px;border-radius:10px;background:rgba(255,255,255,.06);font-size:13px}
.nav-group a:hover,aside a.nav-home:hover,aside a.nav-logout:hover{background:rgba(241,217,130,.18)}
.nav-logout{margin-top:12px;color:#ffd2d2!important}
main header{position:sticky;top:0;z-index:4}
.panel{transition:box-shadow .2s ease, transform .2s ease}
.panel:hover{box-shadow:0 14px 34px rgba(10,30,18,.08)}
@media(max-width:900px){
  aside{position:relative;width:auto;min-height:auto}
  main{margin-left:0}
  .nav-group summary{padding:11px}
}

/* Production security screens */
.account-code{font-family:Consolas,monospace;background:#f8f2dc;border:1px solid #eadb9b;border-radius:12px;padding:12px;display:inline-block;color:#145c2a;font-weight:900;letter-spacing:1px}
.alert{border-left:6px solid #b42318}


/* Premium rounded accordion tabs */
aside{
  background:
    radial-gradient(circle at top left, rgba(241,217,130,.18), transparent 34%),
    linear-gradient(180deg,#07160d 0%,#0d2a16 48%,#061109 100%);
  padding:18px 14px;
}
.brand-owned{
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.05));
  border:1px solid rgba(241,217,130,.22);
  border-radius:24px;
  box-shadow:0 18px 38px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.16);
  padding:14px;
  margin-bottom:16px;
}
.brand-owned img{
  border-radius:18px;
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
aside a.nav-home,
aside a.nav-logout{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:42px;
  padding:11px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
aside a.nav-home:after{content:"›";font-size:20px;color:#f1d982}
.nav-group{
  margin:11px 0;
  padding:7px;
  border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.115),rgba(255,255,255,.045));
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 12px 30px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.09);
}
.nav-group[open]{
  background:linear-gradient(180deg,rgba(241,217,130,.16),rgba(255,255,255,.055));
  border-color:rgba(241,217,130,.32);
}
.nav-group summary{
  min-height:44px;
  padding:11px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.075);
  color:#ffffff;
  font-size:14px;
  font-weight:900;
  letter-spacing:.25px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  transition:background .18s ease, transform .18s ease;
}
.nav-group summary:hover{
  background:rgba(255,255,255,.13);
}
.nav-group summary:after{
  content:"";
  width:9px;
  height:9px;
  border-right:2px solid #f1d982;
  border-bottom:2px solid #f1d982;
  transform:rotate(45deg);
  transition:transform .2s ease;
  margin-left:12px;
}
.nav-group[open] summary:after{
  transform:rotate(-135deg);
}
.nav-group a{
  display:flex;
  align-items:center;
  min-height:38px;
  margin:7px 2px 0 2px;
  padding:10px 12px 10px 16px;
  border-radius:16px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.075);
  color:#dfeee3;
  font-size:13px;
  font-weight:750;
  transition:background .18s ease, color .18s ease, transform .18s ease;
}
.nav-group a:before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#f1d982;
  opacity:.72;
  margin-right:10px;
}
.nav-group a:hover{
  color:#ffffff;
  background:rgba(241,217,130,.18);
  transform:translateX(2px);
}
.nav-logout{
  margin-top:16px!important;
  background:rgba(180,35,24,.16)!important;
  border-color:rgba(255,180,180,.22)!important;
}
.nav-logout:after{content:"↗";font-size:15px;color:#ffd2d2}
.panel{
  border-radius:24px;
  border:1px solid #e3e8db;
  box-shadow:0 16px 40px rgba(10,30,18,.07);
}
.hero-panel{
  border-radius:28px;
  background:
    radial-gradient(circle at top right,rgba(241,217,130,.28),transparent 34%),
    linear-gradient(135deg,#ffffff,#f7faf2);
}
.card{
  border-radius:22px;
  box-shadow:0 12px 30px rgba(10,30,18,.06);
}
button,.btn,input,select,textarea{
  border-radius:14px;
}
table{
  border-radius:18px;
  overflow:hidden;
}
@media(max-width:900px){
  aside{border-radius:0 0 26px 26px}
  .nav-group{border-radius:18px}
  .nav-group summary{border-radius:14px}
}


/* Zenasha Deep Brand UI — applied from approved concept */
:root{
  --zen-deep:#062111;
  --zen-forest:#0b3a1f;
  --zen-emerald:#126a32;
  --zen-leaf:#2f8f3f;
  --zen-gold:#d8b13f;
  --zen-gold-soft:#f2d978;
  --zen-cream:#fff8e1;
  --zen-white:#ffffff;
  --zen-muted:#b9cfbf;
}
body{
  background:
    radial-gradient(circle at 15% 10%, rgba(216,177,63,.10), transparent 28%),
    linear-gradient(135deg,#f6f8f2 0%,#eef3ea 100%);
}
aside{
  width:282px;
  background:
    radial-gradient(circle at 50% 0%, rgba(216,177,63,.23), transparent 28%),
    radial-gradient(circle at 100% 25%, rgba(47,143,63,.22), transparent 35%),
    linear-gradient(180deg,#06170c 0%,#0a2a16 42%,#0f5a2a 100%) !important;
  border-right:1px solid rgba(216,177,63,.24);
  box-shadow:22px 0 60px rgba(3,20,10,.25), inset -1px 0 0 rgba(255,255,255,.05);
  padding:24px 18px;
}
main{
  margin-left:282px;
}
.brand-owned{
  position:relative;
  text-align:center;
  padding:18px 16px 20px !important;
  margin:0 0 22px !important;
  border-radius:28px !important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.055)),
    radial-gradient(circle at top,rgba(216,177,63,.17),transparent 50%);
  border:1px solid rgba(216,177,63,.32) !important;
  box-shadow:0 24px 50px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.16) !important;
}
.brand-owned:after{
  content:"";
  display:block;
  width:92px;
  height:3px;
  border-radius:999px;
  margin:16px auto 0;
  background:linear-gradient(90deg,transparent,var(--zen-gold),transparent);
  box-shadow:0 0 18px rgba(216,177,63,.55);
}
.brand-owned img{
  width:168px;
  max-width:168px;
  height:168px;
  object-fit:contain;
  background:linear-gradient(180deg,#fff,#f8f8f2);
  border:1px solid rgba(216,177,63,.48);
  border-radius:24px !important;
  padding:8px;
  box-shadow:0 18px 42px rgba(0,0,0,.22),0 0 0 6px rgba(216,177,63,.08) !important;
}
.brand-owned h1,
.brand h1{
  margin:16px 0 0;
  font-size:27px;
  line-height:1.05;
  letter-spacing:-.4px;
  font-weight:950;
  background:linear-gradient(180deg,#ffe88a 0%,#d8b13f 48%,#a77b1f 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:0 10px 22px rgba(0,0,0,.22);
}
.brand-owned p,
.brand p{
  margin:5px 0 0;
  color:#ffffff;
  font-size:18px;
  font-weight:900;
}
.brand-owned small,
.brand small{
  display:inline-block;
  margin-top:6px;
  color:var(--zen-gold-soft);
  font-weight:900;
  font-size:12px;
  letter-spacing:.2px;
}
.zen-nav-chip,
.zen-nav-group{
  position:relative;
  isolation:isolate;
}
aside a.nav-home,
aside a.nav-logout,
.nav-group{
  border-radius:20px !important;
}
aside a.nav-home,
aside a.nav-logout{
  min-height:56px;
  margin:10px 0;
  padding:13px 16px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.035)) !important;
  border:1px solid rgba(255,255,255,.13) !important;
  color:#f5fff7 !important;
  box-shadow:0 14px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08);
  font-size:15px;
  font-weight:900;
}
.nav-group{
  margin:11px 0 !important;
  padding:6px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.035)) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  box-shadow:0 15px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.075) !important;
  overflow:hidden;
}
.nav-group[open]{
  background:
    linear-gradient(90deg,rgba(216,177,63,.92) 0 6px,transparent 6px),
    linear-gradient(135deg,rgba(18,106,50,.72),rgba(255,255,255,.075)) !important;
  border-color:rgba(216,177,63,.52) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.24),0 0 0 1px rgba(216,177,63,.08) inset !important;
}
.nav-group summary{
  min-height:54px !important;
  padding:12px 14px !important;
  border-radius:17px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.095),rgba(255,255,255,.035)) !important;
  display:grid !important;
  grid-template-columns:34px 1fr 18px;
  gap:10px;
  align-items:center;
  color:#f8fff9 !important;
  text-shadow:0 2px 10px rgba(0,0,0,.18);
}
.nav-group summary span:nth-child(2){
  font-weight:950;
  font-size:15px;
}
.nav-group summary:after{
  content:"" !important;
  width:10px !important;
  height:10px !important;
  border-right:3px solid #ffffff !important;
  border-bottom:3px solid #ffffff !important;
  transform:rotate(45deg) !important;
  margin-top:-4px;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.25));
}
.nav-group[open] summary:after{
  transform:rotate(-135deg) !important;
  border-color:var(--zen-gold-soft) !important;
  margin-top:5px;
}
.nav-ico{
  width:34px;
  height:34px;
  display:inline-grid;
  place-items:center;
  border-radius:12px;
  color:var(--zen-gold-soft);
  background:rgba(216,177,63,.10);
  border:1px solid rgba(216,177,63,.26);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
  font-size:20px;
  line-height:1;
}
aside a.nav-home,
aside a.nav-logout{
  display:grid !important;
  grid-template-columns:34px 1fr 16px;
  gap:10px;
  align-items:center;
}
aside a.nav-home:after,
aside a.nav-logout:after{
  content:"" !important;
  width:9px;
  height:9px;
  border-right:2px solid var(--zen-gold-soft);
  border-bottom:2px solid var(--zen-gold-soft);
  transform:rotate(-45deg);
}
.nav-rail{
  position:relative;
  padding:8px 0 10px 44px;
}
.nav-rail:before{
  content:"";
  position:absolute;
  left:22px;
  top:15px;
  bottom:22px;
  width:2px;
  border-radius:99px;
  background:linear-gradient(180deg,var(--zen-gold),rgba(216,177,63,.28));
}
.nav-group .nav-rail a{
  position:relative;
  display:flex;
  align-items:center;
  min-height:43px;
  margin:6px 0 !important;
  padding:11px 13px 11px 18px !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.075) !important;
  border:1px solid rgba(255,255,255,.07) !important;
  color:#eefaf0 !important;
  font-size:14px !important;
  font-weight:850 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.nav-group .nav-rail a:before{
  content:"" !important;
  position:absolute;
  left:-30px;
  width:12px;
  height:12px;
  border-radius:50%;
  background:#0b2c16;
  border:3px solid var(--zen-gold);
  box-shadow:0 0 0 4px rgba(216,177,63,.09);
  opacity:1 !important;
  margin:0 !important;
}
.nav-group .nav-rail a:hover{
  background:linear-gradient(90deg,rgba(216,177,63,.22),rgba(255,255,255,.08)) !important;
  color:#ffffff !important;
  transform:translateX(3px);
}
.nav-logout{
  margin-top:20px !important;
  color:var(--zen-gold-soft) !important;
  background:linear-gradient(90deg,rgba(216,177,63,.12),rgba(18,106,50,.35)) !important;
  border-color:rgba(216,177,63,.65) !important;
}
.nav-logout .nav-ico{
  color:var(--zen-gold-soft);
  border-color:rgba(216,177,63,.55);
}
main header{
  backdrop-filter:blur(14px);
  background:rgba(255,255,255,.78);
  border-bottom:1px solid rgba(11,58,31,.08);
}
.panel{
  border-radius:26px !important;
  border:1px solid rgba(11,58,31,.12) !important;
  box-shadow:0 20px 48px rgba(10,30,18,.08) !important;
}
.hero-panel{
  background:
    radial-gradient(circle at 85% 20%,rgba(216,177,63,.32),transparent 30%),
    linear-gradient(135deg,#ffffff 0%,#f8fbf4 46%,#eef8ee 100%) !important;
  border-top:4px solid var(--zen-gold) !important;
}
button,.btn{
  border-radius:16px !important;
  box-shadow:0 10px 24px rgba(10,30,18,.10);
}
button:not(.secondary),.btn:not(.secondary){
  background:linear-gradient(135deg,var(--zen-forest),var(--zen-emerald)) !important;
}
input,select,textarea{
  border-radius:15px !important;
  border-color:rgba(11,58,31,.16) !important;
}
table{
  border-radius:22px !important;
}
th{
  background:linear-gradient(135deg,var(--zen-deep),var(--zen-forest)) !important;
}
@media(max-width:900px){
  aside{width:auto}
  main{margin-left:0}
  .brand-owned img{width:128px;height:128px}
}


/* Exact match pass: sidebar now follows the approved control-panel illustration */
.zen-illustration-sidebar{
  position:fixed;
  left:0;
  top:0;
  bottom:0;
  width:318px !important;
  overflow-y:auto;
  padding:26px 20px 24px !important;
  background:
    radial-gradient(circle at 50% 4%, rgba(216,177,63,.20), transparent 25%),
    radial-gradient(circle at 100% 46%, rgba(40,134,58,.22), transparent 34%),
    linear-gradient(180deg,#05190d 0%,#082813 42%,#0d5b2a 100%) !important;
  border-right:1px solid rgba(216,177,63,.28);
  box-shadow:26px 0 60px rgba(2,18,8,.30), inset -1px 0 0 rgba(255,255,255,.06);
}
.zen-illustration-sidebar *{box-sizing:border-box}
main{margin-left:318px !important}
.zen-brand-card{
  text-align:center;
  margin-bottom:22px;
  padding:0 2px 18px;
  border-bottom:1px solid rgba(255,255,255,.18);
}
.zen-logo-frame{
  width:204px;
  height:204px;
  margin:0 auto 18px;
  padding:11px;
  border-radius:26px;
  background:linear-gradient(180deg,#fff,#fafaf3);
  border:1px solid rgba(216,177,63,.55);
  box-shadow:
    0 18px 42px rgba(0,0,0,.28),
    0 0 0 7px rgba(216,177,63,.10),
    inset 0 1px 0 rgba(255,255,255,.95);
  display:grid;
  place-items:center;
}
.zen-logo-frame img{
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain;
  border:0 !important;
  border-radius:18px !important;
  padding:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
.zen-brand-card h1{
  margin:0;
  font-size:30px;
  line-height:.98;
  letter-spacing:-.6px;
  font-weight:1000;
  font-family:Segoe UI,Arial,sans-serif;
  color:#d8b13f;
  background:linear-gradient(180deg,#ffe78b 0%,#d8b13f 52%,#a57820 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:0 16px 30px rgba(0,0,0,.22);
}
.zen-brand-card p{
  margin:5px 0 0;
  font-size:21px;
  line-height:1.04;
  color:#fff;
  font-weight:950;
  letter-spacing:-.2px;
}
.zen-gold-rule{
  width:165px;
  height:1px;
  margin:16px auto 10px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);
  position:relative;
}
.zen-gold-rule:after{
  content:"";
  position:absolute;
  left:50%;
  top:-1px;
  transform:translateX(-50%);
  width:45px;
  height:4px;
  border-radius:999px;
  background:#d8b13f;
  box-shadow:0 0 18px rgba(216,177,63,.55);
}
.zen-brand-card small{
  display:block;
  margin-top:0;
  color:#f2d978;
  font-size:13px;
  font-weight:950;
}
.zen-control-nav{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.zen-menu-row,
.zen-menu-group{
  width:100%;
  border-radius:18px;
}
.zen-menu-row,
.zen-menu-group summary{
  min-height:58px;
  padding:13px 14px;
  display:grid;
  grid-template-columns:38px 1fr 18px;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:#f7fff8;
  font-size:16px;
  font-weight:900;
  letter-spacing:-.15px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.13);
  border-radius:18px;
  box-shadow:0 14px 32px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08);
}
.zen-menu-row.command{
  margin-bottom:0;
}
.zen-menu-row.command:after,
.zen-menu-row.logout:after{
  content:"";
  width:10px;
  height:10px;
  border-right:2px solid #f2d978;
  border-bottom:2px solid #f2d978;
  transform:rotate(-45deg);
  justify-self:end;
}
.zen-menu-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  color:#f2d978;
  background:rgba(216,177,63,.11);
  border:1px solid rgba(216,177,63,.30);
  border-radius:13px;
  font-size:23px;
  font-weight:900;
}
.zen-menu-group{
  padding:6px;
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 15px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.07);
}
.zen-menu-group summary{
  cursor:pointer;
  list-style:none;
}
.zen-menu-group summary::-webkit-details-marker{display:none}
.zen-menu-group summary:after{
  content:"";
  width:11px;
  height:11px;
  border-right:3px solid #ffffff;
  border-bottom:3px solid #ffffff;
  transform:rotate(45deg);
  justify-self:end;
  margin-top:-5px;
  transition:transform .2s ease,border-color .2s ease;
}
.zen-menu-group[open]{
  background:
    linear-gradient(90deg,#d8b13f 0 7px,transparent 7px),
    linear-gradient(135deg,rgba(28,120,55,.78),rgba(255,255,255,.06));
  border-color:rgba(216,177,63,.52);
  box-shadow:0 20px 46px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.10);
}
.zen-menu-group[open] summary{
  background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.05));
}
.zen-menu-group[open] summary:after{
  transform:rotate(-135deg);
  border-color:#f2d978;
  margin-top:5px;
}
.zen-submenu{
  position:relative;
  margin:8px 0 3px;
  padding:5px 0 7px 52px;
}
.zen-submenu:before{
  content:"";
  position:absolute;
  left:28px;
  top:15px;
  bottom:22px;
  width:2px;
  border-radius:99px;
  background:linear-gradient(180deg,#d8b13f,rgba(216,177,63,.20));
}
.zen-submenu a{
  position:relative;
  display:flex;
  align-items:center;
  min-height:47px;
  margin:7px 0;
  padding:12px 14px 12px 18px;
  border-radius:14px;
  text-decoration:none;
  color:#f3fff4;
  font-size:15px;
  font-weight:850;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.07);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.zen-submenu a:before{
  content:"";
  position:absolute;
  left:-31px;
  width:13px;
  height:13px;
  border-radius:50%;
  background:#092b15;
  border:3px solid #d8b13f;
  box-shadow:0 0 0 5px rgba(216,177,63,.09);
}
.zen-submenu a:hover{
  transform:translateX(3px);
  background:linear-gradient(90deg,rgba(216,177,63,.22),rgba(255,255,255,.08));
}
.zen-menu-row.logout{
  margin-top:10px;
  color:#f2d978;
  border-color:rgba(216,177,63,.62);
  background:linear-gradient(90deg,rgba(216,177,63,.12),rgba(23,108,50,.42));
}
.zen-menu-row:hover,
.zen-menu-group summary:hover{
  background:linear-gradient(90deg,rgba(216,177,63,.18),rgba(255,255,255,.07));
}
@media(max-width:900px){
  .zen-illustration-sidebar{
    position:relative;
    width:auto !important;
    min-height:auto;
    border-radius:0 0 28px 28px;
  }
  main{margin-left:0 !important}
  .zen-logo-frame{width:160px;height:160px}
}


/* FINAL SIDEBAR FIX: no broken glyph icons, no missing spacing, forced polished layout */
.zen-illustration-sidebar{
  position:fixed !important;
  left:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:318px !important;
  overflow-y:auto !important;
  padding:26px 20px 24px !important;
  background:
    radial-gradient(circle at 50% 4%, rgba(216,177,63,.20), transparent 25%),
    radial-gradient(circle at 100% 46%, rgba(40,134,58,.22), transparent 34%),
    linear-gradient(180deg,#05190d 0%,#082813 42%,#0d5b2a 100%) !important;
  border-right:1px solid rgba(216,177,63,.28) !important;
  box-shadow:26px 0 60px rgba(2,18,8,.30), inset -1px 0 0 rgba(255,255,255,.06) !important;
  color:#ffffff !important;
  font-family:"Segoe UI", Arial, sans-serif !important;
}
.zen-illustration-sidebar *{
  box-sizing:border-box !important;
  font-family:"Segoe UI", Arial, sans-serif !important;
}
main{margin-left:318px !important}
.zen-brand-card{
  text-align:center !important;
  margin-bottom:22px !important;
  padding:0 2px 18px !important;
  border-bottom:1px solid rgba(255,255,255,.18) !important;
}
.zen-logo-frame{
  width:204px !important;
  height:204px !important;
  margin:0 auto 18px !important;
  padding:11px !important;
  border-radius:26px !important;
  background:linear-gradient(180deg,#fff,#fafaf3) !important;
  border:1px solid rgba(216,177,63,.55) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.28),0 0 0 7px rgba(216,177,63,.10),inset 0 1px 0 rgba(255,255,255,.95) !important;
  display:grid !important;
  place-items:center !important;
}
.zen-logo-frame img{
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  border:0 !important;
  border-radius:18px !important;
  padding:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
.zen-brand-card h1{
  margin:0 !important;
  font-size:30px !important;
  line-height:.98 !important;
  letter-spacing:-.6px !important;
  font-weight:1000 !important;
  background:linear-gradient(180deg,#ffe78b 0%,#d8b13f 52%,#a57820 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
  text-shadow:0 16px 30px rgba(0,0,0,.22) !important;
}
.zen-brand-card p{
  margin:5px 0 0 !important;
  font-size:21px !important;
  line-height:1.04 !important;
  color:#fff !important;
  font-weight:950 !important;
  letter-spacing:-.2px !important;
}
.zen-gold-rule{
  width:165px !important;
  height:1px !important;
  margin:16px auto 10px !important;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent) !important;
  position:relative !important;
}
.zen-gold-rule:after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:-1px !important;
  transform:translateX(-50%) !important;
  width:45px !important;
  height:4px !important;
  border-radius:999px !important;
  background:#d8b13f !important;
  box-shadow:0 0 18px rgba(216,177,63,.55) !important;
}
.zen-brand-card small{
  display:block !important;
  margin-top:0 !important;
  color:#f2d978 !important;
  font-size:13px !important;
  font-weight:950 !important;
}
.zen-control-nav{
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
}
.zen-menu-row,
.zen-menu-group{
  width:100% !important;
  border-radius:18px !important;
}
.zen-menu-row,
.zen-menu-group summary{
  min-height:58px !important;
  padding:13px 14px !important;
  display:grid !important;
  grid-template-columns:38px 1fr 18px !important;
  align-items:center !important;
  gap:12px !important;
  text-decoration:none !important;
  color:#f7fff8 !important;
  font-size:16px !important;
  font-weight:900 !important;
  letter-spacing:-.15px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.035)) !important;
  border:1px solid rgba(255,255,255,.13) !important;
  border-radius:18px !important;
  box-shadow:0 14px 32px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.zen-menu-row.command:after,
.zen-menu-row.logout:after{
  content:"" !important;
  width:10px !important;
  height:10px !important;
  border-right:2px solid #f2d978 !important;
  border-bottom:2px solid #f2d978 !important;
  transform:rotate(-45deg) !important;
  justify-self:end !important;
}
.zen-menu-icon{
  width:38px !important;
  height:38px !important;
  display:grid !important;
  place-items:center !important;
  color:#f2d978 !important;
  background:rgba(216,177,63,.11) !important;
  border:1px solid rgba(216,177,63,.30) !important;
  border-radius:13px !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  letter-spacing:.3px !important;
}
.zen-menu-icon::before{display:block !important;color:#f2d978 !important}
.i-command::before{content:"CMD" !important}
.i-clients::before{content:"CL" !important}
.i-services::before{content:"SV" !important}
.i-billing::before{content:"BL" !important}
.i-network::before{content:"NW" !important}
.i-support::before{content:"SL" !important}
.i-admin::before{content:"AD" !important}
.i-logout::before{content:"OUT" !important}
.zen-menu-group{
  padding:6px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.03)) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:0 15px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
.zen-menu-group summary{
  cursor:pointer !important;
  list-style:none !important;
}
.zen-menu-group summary::-webkit-details-marker{display:none !important}
.zen-menu-group summary:after{
  content:"" !important;
  width:11px !important;
  height:11px !important;
  border-right:3px solid #ffffff !important;
  border-bottom:3px solid #ffffff !important;
  transform:rotate(45deg) !important;
  justify-self:end !important;
  margin-top:-5px !important;
  transition:transform .2s ease,border-color .2s ease !important;
}
.zen-menu-group[open]{
  background:
    linear-gradient(90deg,#d8b13f 0 7px,transparent 7px),
    linear-gradient(135deg,rgba(28,120,55,.78),rgba(255,255,255,.06)) !important;
  border-color:rgba(216,177,63,.52) !important;
  box-shadow:0 20px 46px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
.zen-menu-group[open] summary{
  background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.05)) !important;
}
.zen-menu-group[open] summary:after{
  transform:rotate(-135deg) !important;
  border-color:#f2d978 !important;
  margin-top:5px !important;
}
.zen-submenu{
  position:relative !important;
  margin:8px 0 3px !important;
  padding:5px 0 7px 52px !important;
}
.zen-submenu:before{
  content:"" !important;
  position:absolute !important;
  left:28px !important;
  top:15px !important;
  bottom:22px !important;
  width:2px !important;
  border-radius:99px !important;
  background:linear-gradient(180deg,#d8b13f,rgba(216,177,63,.20)) !important;
}
.zen-submenu a{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  min-height:47px !important;
  margin:7px 0 !important;
  padding:12px 14px 12px 18px !important;
  border-radius:14px !important;
  text-decoration:none !important;
  color:#f3fff4 !important;
  font-size:15px !important;
  font-weight:850 !important;
  background:rgba(255,255,255,.07) !important;
  border:1px solid rgba(255,255,255,.07) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05) !important;
}
.zen-submenu a:before{
  content:"" !important;
  position:absolute !important;
  left:-31px !important;
  width:13px !important;
  height:13px !important;
  border-radius:50% !important;
  background:#092b15 !important;
  border:3px solid #d8b13f !important;
  box-shadow:0 0 0 5px rgba(216,177,63,.09) !important;
}
.zen-submenu a:hover{
  transform:translateX(3px) !important;
  background:linear-gradient(90deg,rgba(216,177,63,.22),rgba(255,255,255,.08)) !important;
}
.zen-menu-row.logout{
  margin-top:10px !important;
  color:#f2d978 !important;
  border-color:rgba(216,177,63,.62) !important;
  background:linear-gradient(90deg,rgba(216,177,63,.12),rgba(23,108,50,.42)) !important;
}
@media(max-width:900px){
  .zen-illustration-sidebar{
    position:relative !important;
    width:auto !important;
    min-height:auto !important;
    border-radius:0 0 28px 28px !important;
  }
  main{margin-left:0 !important}
  .zen-logo-frame{width:160px !important;height:160px !important}
}

/* Statements and suppliers */
.statement-actions{display:flex;gap:8px;flex-wrap:wrap}
.pill.part-paid{background:#fff4e5;color:#b54708}
.pill.paid,.pill.confirmed,.pill.active{background:#e6f7ed;color:#087443}
.pill.pending,.pill.partial{background:#fff8dc;color:#8a6a00}
.pill.reversed,.pill.failed,.pill.cancelled{background:#ffe6e6;color:#b42318}

/* UmojaCore product branding */
.zen-brand-card h1{font-size:32px !important;letter-spacing:-.9px !important}
.zen-brand-card p{font-size:15px !important;line-height:1.25 !important;max-width:220px !important;margin:8px auto 0 !important}
.zen-brand-card small{text-transform:uppercase !important;letter-spacing:2px !important;font-size:10px !important}
.login-card:before{content:"UmojaCore by Zenasha ICT";display:block;margin-bottom:8px;color:#d8b13f;font-weight:900;letter-spacing:.3px}

/* Change Monitor */
.change-summary{font-weight:850}
.pill.System{background:#eef4ff;color:#1849a9}

/* Stock Inventory */
.pill.in_stock,.pill.installed{background:#e6f7ed;color:#087443}
.pill.allocated{background:#eef4ff;color:#1849a9}
.pill.returned{background:#f2f4f7;color:#344054}
.pill.damaged,.pill.lost,.pill.discontinued{background:#ffe6e6;color:#b42318}

/* IP Management */
.pill.assigned{background:#e6f7ed;color:#087443}
.pill.available{background:#eef4ff;color:#1849a9}
.pill.reserved{background:#fff8dc;color:#8a6a00}
.pill.quarantine{background:#ffe6e6;color:#b42318}

/* Professional PBX editor */
.pbx-editor{padding:24px;border-color:#dde5db;box-shadow:0 18px 46px rgba(17,48,27,.08)}
.pbx-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid #e6ebe4}
.pbx-editor-head h2{font-size:25px;margin:3px 0 5px;letter-spacing:-.6px}
.pbx-editor-head p{margin:0}
.pbx-eyebrow{color:var(--green);font-size:11px;font-weight:900;letter-spacing:1.25px;text-transform:uppercase}
.pbx-form{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pbx-form label{display:flex;flex-direction:column;gap:5px;font-size:13px}
.pbx-form label small{margin:0;min-height:17px;font-size:11px;line-height:1.35}
.pbx-form input,.pbx-form select,.pbx-form textarea{border-color:#d7dfd5;border-radius:11px;background:#fbfcfb;transition:border-color .18s,box-shadow .18s,background .18s}
.pbx-form input:focus,.pbx-form select:focus,.pbx-form textarea:focus{outline:0;border-color:#4a8c55;background:#fff;box-shadow:0 0 0 4px rgba(40,122,53,.11)}
.client-picker{border:1px solid #dbe3d9;border-radius:15px;background:#f8faf8;padding:16px}
.client-picker-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.client-picker-head label{font-size:14px;margin-bottom:2px}
.client-picker-head small{display:block;color:var(--muted);font-size:12px}
.client-count{white-space:nowrap;border:1px solid #d9e2d7;border-radius:999px;background:#fff;color:#667085;font-size:12px;font-weight:800;padding:6px 10px}
.client-count.has-selection{background:#e8f6eb;border-color:#b9ddc0;color:#146c31}
.client-search{position:relative;margin-bottom:11px}
.client-search span{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#667085;font-size:20px;line-height:1;pointer-events:none}
.client-search input{padding-left:40px;background:#fff}
.client-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:260px;overflow:auto;padding:2px 5px 2px 2px;scrollbar-color:#b8c8b7 transparent}
.client-option{position:relative;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;min-height:58px;padding:9px 11px;border:1px solid #dfe6dd;border-radius:11px;background:#fff;cursor:pointer;transition:border-color .16s,background .16s,transform .16s}
.client-option:hover{border-color:#9fbea4;background:#fbfefb;transform:translateY(-1px)}
.client-option input{width:17px;height:17px;margin:0;accent-color:var(--green)}
.client-option span{min-width:0}
.client-option b,.client-option small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.client-option b{font-size:12px;color:#1d2939}
.client-option small{min-height:0!important;margin-top:3px!important;color:#667085;font-size:10px!important;letter-spacing:.2px}
.client-option i{display:grid;width:22px;height:22px;place-items:center;border-radius:50%;background:#e8f6eb;color:#167036;font-size:12px;font-style:normal;opacity:0;transform:scale(.75);transition:.16s}
.client-option:has(input:checked){border-color:#72a77a;background:#f1f9f2;box-shadow:inset 0 0 0 1px rgba(40,122,53,.08)}
.client-option:has(input:checked) i{opacity:1;transform:scale(1)}
.client-picker-empty{text-align:center;color:var(--muted);font-size:13px;margin:14px 0 4px}
.pbx-form-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:2px}
.pbx-form-actions button,.pbx-form-actions .btn{min-width:170px;text-align:center}
@media(max-width:1100px){.client-options{grid-template-columns:repeat(2,minmax(0,1fr))}.pbx-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.pbx-editor{padding:17px}.pbx-editor-head{display:block}.pbx-editor-head>.pill{margin-top:12px}.pbx-form,.client-options{grid-template-columns:1fr}.client-picker-head{align-items:flex-start}.client-options{max-height:320px}.pbx-form-actions{flex-direction:column-reverse}.pbx-form-actions button,.pbx-form-actions .btn{width:100%}}

/* Supplier services and monthly margin index */
.supplier-hero,.finance-index-head,.supplier-cost-head{display:flex;align-items:center;justify-content:space-between;gap:20px}
.supplier-hero h2{margin:3px 0 6px}
.supplier-hero p{margin:0}
.finance-index{border-top:4px solid var(--gold);background:linear-gradient(145deg,#fff,#f8fbf7)}
.finance-index-head{margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid #e5ebe3}
.finance-index-head h2{margin:3px 0 0;font-size:25px}
.finance-index-head form{min-width:210px}
.finance-index-head label{font-size:12px}
.finance-index-head input{margin-top:5px;background:#fff}
.finance-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
.finance-kpis .card{box-shadow:none;background:#fff;border-color:#e1e7df}
.finance-kpis .card strong{font-size:27px}
.finance-kpis .card small{display:block;color:var(--muted);margin-top:5px;font-size:11px;line-height:1.35}
.finance-disclaimer{margin:14px 0 0;padding:11px 13px;border-radius:10px;background:#fff8dc;color:#725b09;font-size:12px;border-left:4px solid var(--gold)}
.supplier-cost-group{margin:16px 0 24px;border:1px solid #dde5db;border-radius:15px;overflow:hidden;background:#fff}
.supplier-cost-head{padding:14px 16px;background:linear-gradient(90deg,#eff6ef,#fbfcfa)}
.supplier-cost-head b,.supplier-cost-head small{display:block}
.supplier-cost-head b{font-size:15px;color:#173b22}
.supplier-cost-head small{margin-top:4px;color:var(--muted);font-size:11px}
.supplier-cost-head>div:last-child{text-align:right}
.supplier-cost-head span,.supplier-cost-head strong{display:block}
.supplier-cost-head span{font-size:11px;color:var(--muted)}
.supplier-cost-head strong{margin-top:3px;color:var(--green2);font-size:18px}
.supplier-cost-group table{margin:0;border:0;border-radius:0;box-shadow:none}
.supplier-service-editor{border-left:5px solid var(--green)}
.finance-summary-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(135deg,#fff 40%,#f6edc8)}
.finance-summary-hero h2{margin:3px 0 6px;font-size:28px}
.finance-summary-hero p{margin:0}
.finance-period{min-width:220px}
.finance-period label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700}
.finance-period input{background:#fff}
.financial-breakdowns{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:18px}
.financial-breakdowns>.panel{margin:0}
.supplier-period-bar{display:grid;grid-template-columns:1fr 220px auto;align-items:center;gap:14px;padding:15px 18px}
.supplier-period-bar b,.supplier-period-bar small{display:block}
.supplier-period-bar small{margin-top:3px;color:var(--muted)}
.supplier-period-bar form,.supplier-period-bar input{width:100%}
@media(max-width:1000px){.finance-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.financial-breakdowns{grid-template-columns:1fr}.supplier-period-bar{grid-template-columns:1fr}.supplier-period-bar .btn{width:100%;text-align:center}}
@media(max-width:700px){.supplier-hero,.finance-summary-hero,.finance-index-head,.supplier-cost-head{align-items:flex-start;flex-direction:column}.finance-period,.finance-index-head form{width:100%}.finance-kpis{grid-template-columns:1fr}.supplier-cost-head>div:last-child{text-align:left}}

/* Client VoIP allocation */
.client-service-stack{display:flex;flex-direction:column;gap:7px;min-width:220px}
.client-service-chip{display:flex;align-items:flex-start;gap:8px;padding:6px 8px;border:1px solid #e1e8df;border-radius:10px;background:#f9fbf8}
.client-service-chip>.pill{flex:0 0 auto;margin-top:1px}
.client-service-chip span:last-child,.client-service-chip b,.client-service-chip small{display:block}
.client-service-chip b{font-size:12px;line-height:1.3}
.client-service-chip small{margin-top:2px;color:var(--muted);font-size:10px}
.client-service-chip.legacy-package{border-style:dashed;background:#fffaf0}
.client-voip-panel{border-top:4px solid var(--gold)}
.client-voip-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding-bottom:15px;margin-bottom:17px;border-bottom:1px solid #e5ebe3}
.client-voip-head h2{margin:3px 0 5px}
.client-voip-head p{margin:0}
.voip-link-form{padding:16px;border:1px solid #dfe7dd;border-radius:14px;background:linear-gradient(145deg,#f8fbf8,#fff)}
.voip-link-form label{display:flex;flex-direction:column;gap:5px;font-size:13px}
.voip-link-form label small{margin:0;min-height:17px;font-size:11px}
.voip-link-action{display:flex;justify-content:flex-end}
.voip-link-action button{min-width:210px}
@media(max-width:700px){.client-voip-head{flex-direction:column}.voip-link-action button{width:100%}}

/* Global working search */
.app-header{display:grid;grid-template-columns:minmax(180px,1fr) minmax(360px,720px) auto;gap:18px}
.global-search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;width:100%}
.global-search-field{display:flex;align-items:center;height:43px;padding-left:13px;border:1px solid #d7dfd5;border-radius:999px;background:#fff;box-shadow:0 4px 14px rgba(28,70,39,.05)}
.global-search-field>span{color:#557361;font-size:22px;line-height:1}
.global-search input{width:100%;height:41px;border:0!important;background:transparent;padding:0 13px;box-shadow:none!important}
.global-search button{height:43px;padding:8px 18px}
.header-user{white-space:nowrap;font-size:13px;font-weight:750;color:#475467}
.search-results-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.search-result-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.search-result{display:grid;grid-template-columns:110px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:72px;padding:12px 14px;border:1px solid #dfe6dd;border-radius:13px;background:#fff;transition:.16s}
.search-result:hover{transform:translateY(-1px);border-color:#8eb596;box-shadow:0 8px 20px rgba(20,70,35,.08)}
.search-result-type{width:max-content;max-width:110px;padding:5px 8px;border-radius:999px;background:#edf7ee;color:var(--green2);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.4px}
.search-result b,.search-result small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-result b{font-size:13px;color:#1d2939}
.search-result small{margin-top:5px;color:var(--muted);font-size:11px}
.search-result i{font-size:27px;color:var(--gold);font-style:normal}
.global-search-empty{text-align:center;padding:38px}
.search-hero{background:radial-gradient(circle at 88% 15%,rgba(216,180,54,.2),transparent 24%),linear-gradient(120deg,#f8fcf8,#fff)}
.search-empty-icon{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 12px;border-radius:18px;background:#edf7ee;color:var(--green2);font-size:31px;font-weight:900}
.search-type-summary{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:7px}.search-type-summary span{padding:7px 10px;border:1px solid #dbe5d9;border-radius:999px;background:#f8fbf8;color:#3d5b47;font-size:11px}.search-type-summary b{display:inline-grid;place-items:center;min-width:19px;height:19px;margin-left:4px;border-radius:50%;background:var(--green2);color:#fff}
.search-group{margin-top:22px}.search-group>h3{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid #e7ece6;color:#244c31}.search-group>h3 span{display:inline-grid;place-items:center;min-width:23px;height:23px;border-radius:50%;background:#fff3c7;color:#705600;font-size:11px}
.recurring-control{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:18px}.recurring-form{display:flex;align-items:end;gap:9px}.recurring-form label{display:grid;gap:5px}.recurring-control .notice{grid-column:1/-1}.notice.subtle{margin:0;background:#f4f8f3}
.supplier-bill-editor{border-top:3px solid var(--gold)}
@media(max-width:1150px){.app-header{grid-template-columns:1fr auto}.global-search{grid-column:1/-1;grid-row:2}.search-result-list{grid-template-columns:1fr}.recurring-control{grid-template-columns:1fr}.recurring-control .notice{grid-column:auto}}
@media(max-width:700px){.app-header{display:flex!important;align-items:stretch!important;flex-direction:column}.header-user{position:absolute;right:18px;top:27px}.global-search{display:grid}.search-results-head{align-items:flex-start;flex-direction:column}.search-result{grid-template-columns:1fr auto}.search-result-type{grid-column:1/-1}.search-result i{grid-column:2;grid-row:2}.search-result span:nth-child(2){grid-column:1;grid-row:2}}

/* Client-aware invoicing */
.invoice-client-snapshot{display:grid;grid-template-columns:1.3fr .55fr 1fr 1fr;gap:10px;margin:16px 0 20px;padding:14px;border:1px solid #dbe5d9;border-left:5px solid var(--gold);border-radius:14px;background:linear-gradient(120deg,#fbfdf9,#fffaf0)}
.invoice-client-snapshot>div{min-width:0;padding:4px 10px}.invoice-client-snapshot small,.invoice-client-snapshot b{display:block}.invoice-client-snapshot small{color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.45px}.invoice-client-snapshot b{margin-top:5px;overflow:hidden;text-overflow:ellipsis;color:#173b24}
.reference-cell{min-width:210px}.reference-cell select,.reference-cell input{width:100%;min-width:180px}.new-domain{margin-top:6px;border-color:var(--gold)!important;background:#fffdf4!important}

/* Unsaved-work protection */
.unsaved-dialog[hidden]{display:none}.unsaved-dialog{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:20px;background:rgba(8,29,16,.66);backdrop-filter:blur(5px)}
.unsaved-dialog-card{width:min(520px,100%);padding:30px;border:1px solid #dbe5d9;border-top:6px solid var(--gold);border-radius:20px;background:#fff;box-shadow:0 30px 90px rgba(0,0,0,.28);text-align:center}.unsaved-dialog-card h2{margin:10px 0 7px;color:#123b20}.unsaved-dialog-card p{margin:0 0 22px;color:var(--muted)}.unsaved-icon{display:grid;place-items:center;width:46px;height:46px;margin:auto;border-radius:50%;background:#fff4ca;color:#775b00;font-size:25px;font-weight:900}.unsaved-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:9px}.unsaved-actions .danger{background:#a02b2b;color:#fff}.unsaved-actions button{min-width:135px}
@media(max-width:900px){.invoice-client-snapshot{grid-template-columns:1fr 1fr}}@media(max-width:600px){.invoice-client-snapshot{grid-template-columns:1fr}.unsaved-actions{flex-direction:column}.unsaved-actions button{width:100%}}

/* Actionable onboarding exceptions */
.onboarding-hero{background:radial-gradient(circle at 90% 10%,rgba(215,179,50,.2),transparent 25%),linear-gradient(125deg,#f8fcf8,#fff)}
.onboarding-filter{display:grid;gap:5px;min-width:min(360px,100%);font-size:11px;font-weight:800;color:#536b5a;text-transform:uppercase;letter-spacing:.35px}.onboarding-filter input{min-width:0;background:#fff}
.onboarding-client-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.onboarding-client-card{padding:17px;border:1px solid #dce6dc;border-left:4px solid var(--gold);border-radius:15px;background:linear-gradient(145deg,#fff,#fbfdf9);box-shadow:0 5px 16px rgba(23,61,33,.04)}.onboarding-client-card[hidden]{display:none}
.onboarding-client-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.onboarding-client-title b,.onboarding-client-title small{display:block}.onboarding-client-title b{color:#173c24}.onboarding-client-title small{margin-top:4px;color:var(--muted);font-size:11px}.onboarding-badges{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:5px}.missing-field-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0}.missing-field-groups>div{padding:10px 12px;border-radius:11px;background:#fff7df}.missing-field-groups small{display:block;margin-bottom:5px;color:#705500;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.4px}.missing-field-groups ul{margin:0;padding-left:17px;color:#4f4011;font-size:12px}.missing-field-groups li+li{margin-top:3px}.onboarding-complete{margin:14px 0;color:#087443;font-weight:750}.onboarding-client-select{min-width:min(420px,100%)}
@media(max-width:1050px){.onboarding-client-list{grid-template-columns:1fr}}@media(max-width:650px){.onboarding-client-title{flex-direction:column}.onboarding-badges{justify-content:flex-start}.missing-field-groups{grid-template-columns:1fr}.onboarding-filter,.onboarding-client-select{width:100%;min-width:0}}

/* Phase 8: zero-touch credential profiles */
.credentials-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;background:linear-gradient(130deg,#f6fbf6,#fffaf0)}.credentials-hero h2{margin:4px 0;font-size:30px}.credentials-hero p{margin:0;color:var(--muted)}.credential-shield{min-width:190px;padding:17px;border-radius:15px;background:#123c24;color:#fff;text-align:center}.credential-shield b,.credential-shield span{display:block}.credential-shield b{color:#f1cf56;font-size:20px}.credential-shield span{font-size:9px}.profile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}.profile-grid article{padding:16px;border:1px solid var(--line);border-radius:15px;background:#fff}.profile-title{display:flex;justify-content:space-between;gap:10px}.profile-title b,.profile-title small{display:block}.profile-title small{margin-top:4px;color:var(--muted);font-size:10px}.profile-grid dl{margin:14px 0}.profile-grid dl div{display:flex;justify-content:space-between;gap:8px;padding:6px 0;border-top:1px solid #edf0ed;font-size:10px}.profile-grid dt{color:var(--muted);font-weight:800}.profile-grid dd{margin:0;text-align:right}.profile-grid button{width:100%}.zero-touch-flow>div{display:flex;align-items:center;justify-content:center;gap:15px}.zero-touch-flow span{padding:12px 15px;border-radius:12px;background:#edf7ef;font-size:11px;font-weight:800}.zero-touch-flow span b{display:inline-grid;place-items:center;width:22px;height:22px;margin-right:5px;border-radius:50%;background:#176534;color:#fff}.zero-touch-flow i{color:var(--gold);font-size:22px}@media(max-width:1000px){.profile-grid{grid-template-columns:1fr 1fr}.zero-touch-flow>div{align-items:stretch;flex-direction:column}.zero-touch-flow i{display:none}}@media(max-width:650px){.credentials-hero{align-items:flex-start;flex-direction:column}.credential-shield{width:100%}.profile-grid{grid-template-columns:1fr}}

/* Phase 7: telemetry readiness */
.telemetry-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;background:linear-gradient(130deg,#f4fbf5,#eef7ff)}.telemetry-hero h2{margin:4px 0;font-size:30px}.telemetry-hero p{margin:0;color:var(--muted)}.telemetry-score{min-width:180px;padding:18px;border-radius:16px;background:#123c24;color:#fff;text-align:center}.telemetry-score b,.telemetry-score span{display:block}.telemetry-score b{color:#f1cf56;font-size:35px}.telemetry-score span{font-size:10px}.telemetry-control{display:flex;justify-content:space-between;align-items:center;gap:20px}.telemetry-control h2,.telemetry-control p{margin:0}.telemetry-control p{margin-top:5px}.telemetry-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.telemetry-grid article{padding:14px;border:1px solid #e0e7df;border-radius:14px;background:#fff}.telemetry-device{display:flex;gap:9px;align-items:flex-start}.telemetry-device b,.telemetry-device small{display:block}.telemetry-device small{margin-top:3px;color:var(--muted);font-size:10px}.telemetry-grid ul{margin:12px 0;padding-left:18px;color:#8a4b00;font-size:11px}.telemetry-grid li+li{margin-top:4px}.telemetry-actions{display:flex;gap:12px}.telemetry-actions a{color:var(--green2);font-size:10px;font-weight:900}@media(max-width:1000px){.telemetry-grid{grid-template-columns:1fr 1fr}}@media(max-width:650px){.telemetry-hero,.telemetry-control{align-items:flex-start;flex-direction:column}.telemetry-score{width:100%}.telemetry-grid{grid-template-columns:1fr}}

/* Phase 6: capacity and lifecycle */
.capacity-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;background:linear-gradient(125deg,#102d1c,#244a33);color:#fff}.capacity-hero h2{margin:4px 0;font-size:30px}.capacity-hero p{margin:0;color:#dce8df}.capacity-kpis{display:grid;grid-template-columns:repeat(2,minmax(170px,1fr));gap:8px}.capacity-kpis span{padding:12px;border:1px solid rgba(255,255,255,.16);border-radius:13px;background:rgba(255,255,255,.07);font-size:10px;text-transform:uppercase}.capacity-kpis b{display:block;color:#f4d462;font-size:18px}.capacity-risk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.capacity-risk-grid article{padding:14px;border:1px solid #eadfc1;border-radius:14px;background:#fffdf6}.capacity-risk-grid b,.capacity-risk-grid small{display:block}.capacity-risk-grid small{margin-top:3px;color:var(--muted);font-size:10px}.capacity-risk-grid strong{display:block;margin:11px 0 5px;font-size:26px}.capacity-risk-grid p{font-size:10px;color:var(--muted)}.capacity-risk-grid a{color:var(--green2);font-size:10px;font-weight:900}.capacity-register table{min-width:1250px}.capacity-edit{display:flex;gap:5px;min-width:150px}.capacity-edit input{width:84px;padding:7px}.capacity-edit button{padding:7px 9px}.headroom-meter{width:120px;height:6px;margin-bottom:6px;background:#e8ede8;border-radius:99px;overflow:hidden}.headroom-meter i{display:block;height:100%;background:#1b914b}.headroom-meter i.high{background:#e6a51a}.headroom-meter i.critical{background:#dc3e32}@media(max-width:1050px){.capacity-hero{align-items:flex-start;flex-direction:column}.capacity-kpis{width:100%}.capacity-risk-grid{grid-template-columns:1fr 1fr}}@media(max-width:650px){.capacity-kpis,.capacity-risk-grid{grid-template-columns:1fr}}

/* Phase 5: service assurance */
.assurance-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;background:linear-gradient(125deg,#f8fcf7,#fff8df)}.assurance-hero h2{font-size:30px;margin:4px 0}.assurance-hero p{margin:0;color:var(--muted)}.assurance-kpis{display:grid;grid-template-columns:repeat(2,minmax(170px,1fr));gap:8px}.assurance-kpis span{padding:12px;border:1px solid #dbe6d9;border-radius:13px;background:#fff;color:#607064;font-size:10px;text-transform:uppercase}.assurance-kpis b{display:block;color:#174d29;font-size:19px}.assurance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.impact-panel{border-left:5px solid var(--gold)}.assurance-list{display:grid;margin-top:12px}.assurance-list article{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:10px;align-items:center;padding:11px 2px;border-top:1px solid var(--line)}.assurance-list b,.assurance-list small{display:block}.assurance-list small{margin-top:3px;color:var(--muted);font-size:10px}.assurance-list strong{font-size:12px}.assurance-list a{color:var(--green2);font-size:10px;font-weight:900}.site-score-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}.site-score-grid article{padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}.site-score-grid b,.site-score-grid small,.site-score-grid strong{display:block}.site-score-grid small{margin:4px 0 10px;color:var(--muted);font-size:10px}.site-score-grid strong{font-size:22px}.site-meter{height:5px;margin:9px 0;background:#e9eee9;border-radius:99px;overflow:hidden}.site-meter i{display:block;height:100%;background:linear-gradient(90deg,#d5a82d,#188244);border-radius:inherit}.assurance-table{max-height:520px;overflow:auto}.assurance-table table{margin-bottom:0}.assurance-table td small{display:block;color:var(--muted);font-size:9px}.timeline-list article{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:12px 2px;border-top:1px solid var(--line)}.timeline-list i{width:10px;height:10px;margin-top:4px;border-radius:50%;background:#e7a51b}.timeline-list i.resolved{background:#12a150}.timeline-list i.open{background:#e14538}.timeline-list b,.timeline-list small{display:block}.timeline-list small{margin-top:3px;color:var(--muted);font-size:10px}.timeline-list p{margin:6px 0 0;font-size:11px}@media(max-width:1100px){.assurance-hero{align-items:flex-start;flex-direction:column}.assurance-kpis{width:100%}.site-score-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:750px){.assurance-grid,.assurance-kpis,.site-score-grid{grid-template-columns:1fr}.assurance-list article{grid-template-columns:1fr auto}.assurance-list a{grid-column:1/-1}}

/* Phase 4: network intelligence */
.network-intelligence-wide{width:min(1880px,calc(100vw - 330px));margin-left:50%;transform:translateX(-50%)}.intelligence-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;background:linear-gradient(125deg,#102d1c,#185b31);color:#fff}.intelligence-hero h2{margin:4px 0;font-size:30px}.intelligence-hero p{margin:0;color:#dbe9dd}.intelligence-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;min-width:520px}.intelligence-kpis span{padding:13px;border:1px solid rgba(255,255,255,.17);border-radius:13px;background:rgba(255,255,255,.07);font-size:10px;text-transform:uppercase}.intelligence-kpis b{display:block;color:#f2cf58;font-size:25px}.root-cause-panel{border-left:5px solid var(--danger)}.root-incident-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.root-incident-grid article{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px;border-radius:14px;background:#fff5f4;border:1px solid #ffd4d0}.root-incident-grid small,.root-incident-grid b{display:block}.root-incident-grid small{color:var(--muted);font-size:10px}.root-incident-grid p{margin:5px 0 0;font-size:11px}.root-incident-grid a{font-size:11px;font-weight:900;color:var(--danger)}.root-pulse{width:10px;height:10px;border-radius:50%;background:var(--danger);box-shadow:0 0 0 5px rgba(180,35,24,.12)}.topology-panel{overflow:hidden}.topology-canvas{display:grid;grid-template-columns:repeat(3,minmax(300px,1fr));gap:18px;margin-top:18px;overflow-x:auto}.topology-branch{position:relative;padding:2px}.topology-node{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:13px;border:1px solid #dbe5db;border-radius:14px;background:#fff;box-shadow:0 5px 15px rgba(20,60,30,.06)}.topology-node.root-node{background:#eff8f1;border-color:#bcd9c2}.topology-node b,.topology-node small,.topology-node span{display:block}.topology-node b{font-size:12px}.topology-node small{margin:3px 0;color:#66756b;font-size:10px}.topology-node span{color:#8a958d;font-size:9px}.topology-children{display:grid;gap:8px;margin:16px 0 0 30px;padding-left:18px;border-left:2px solid #cbdccb}.topology-children .topology-node:before{content:"";position:absolute;left:-20px;top:50%;width:18px;border-top:2px solid #cbdccb}.node-score,.health-number{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;font-weight:900}.score-good{background:#dff5e5;color:#087443}.score-warn{background:#fff1cf;color:#9a6700}.score-bad{background:#ffe2df;color:#b42318}.status-dot{width:9px;height:9px;border-radius:50%;background:#98a2a0}.topology-node.online .status-dot{background:#12a150}.topology-node.offline .status-dot{background:#e14538}.topology-node.unreachable .status-dot{background:#e7a51b}.topology-legend{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:10px}.topology-legend i{width:9px;height:9px;border-radius:50%}.topology-legend .good{background:#12a150}.topology-legend .warn{background:#e7a51b}.topology-legend .bad{background:#e14538}.intelligence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.intel-list{display:grid;margin-top:12px}.intel-list article{position:relative;padding:11px 2px;border-top:1px solid var(--line)}.intel-list b,.intel-list small,.intel-list code{display:block}.intel-list small{margin-top:3px;color:var(--muted);font-size:10px}.intel-list code{margin-top:6px;color:#355b3f;font-size:10px;white-space:normal}.health-row{display:grid!important;grid-template-columns:auto 1fr auto;gap:10px;align-items:center}.health-row a{font-size:11px;font-weight:900;color:var(--green2)}@media(max-width:1200px){.network-intelligence-wide{width:100%;margin:0;transform:none}.intelligence-hero{align-items:flex-start;flex-direction:column}.intelligence-kpis{width:100%;min-width:0}.topology-canvas{grid-template-columns:repeat(2,minmax(280px,1fr))}.root-incident-grid{grid-template-columns:1fr 1fr}}@media(max-width:750px){.intelligence-kpis{grid-template-columns:1fr 1fr}.topology-canvas,.intelligence-grid,.root-incident-grid{grid-template-columns:1fr}}

/* Phase 3: unified Operations Centre */
.operations-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;background:radial-gradient(circle at 85% 10%,rgba(199,163,61,.23),transparent 28%),linear-gradient(135deg,#f8fcf8,#fff)}.operations-hero h2{font-size:30px;margin:3px 0 7px}.operations-score{min-width:145px;padding:18px;border:1px solid #d7e5d7;border-radius:18px;background:rgba(255,255,255,.8);text-align:center}.operations-score b{display:block;color:var(--danger);font-size:38px;line-height:1}.operations-score span{color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase}.operations-jump{position:sticky;top:8px;z-index:5;display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:14px 0;padding:9px;border:1px solid var(--line);border-radius:16px;background:rgba(244,247,243,.93);backdrop-filter:blur(10px)}.operations-jump a{display:flex;justify-content:space-between;gap:8px;padding:10px 12px;border-radius:11px;background:#fff;color:#24412b;font-size:12px;font-weight:800}.operations-jump b{color:var(--green2)}.operations-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ops-queue{margin:0;scroll-margin-top:82px;min-width:0}.ops-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.ops-head h2{margin:2px 0 0}.ops-kicker{color:var(--green);font-size:10px;font-weight:900;letter-spacing:.65px;text-transform:uppercase}.ops-list{display:grid;margin-top:12px;border-top:1px solid var(--line)}.ops-list article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;padding:12px 2px;border-bottom:1px solid var(--line);align-items:start}.ops-copy{min-width:0}.ops-copy b,.ops-copy small{display:block}.ops-copy b{color:#193a23;font-size:13px}.ops-copy small{margin-top:4px;color:var(--muted);font-size:11px;line-height:1.45;overflow-wrap:anywhere}.ops-actions{grid-column:1/-1;display:flex;gap:12px}.ops-actions a{color:var(--green2);font-size:11px;font-weight:900}.ops-actions a:hover{text-decoration:underline}.ops-empty{margin:15px 0 0;padding:13px;border-radius:12px;background:#edf8f0;color:var(--ok);font-weight:750;font-size:12px}@media(max-width:1100px){.operations-jump{grid-template-columns:repeat(3,1fr)}.operations-grid{grid-template-columns:1fr}}@media(max-width:650px){.operations-hero{align-items:flex-start;flex-direction:column}.operations-score{width:100%}.operations-jump{position:static;grid-template-columns:repeat(2,1fr)}}
.multi-recipient-send{display:flex!important;align-items:center;gap:6px;margin-top:7px}.multi-recipient-send input{width:240px;min-width:180px;height:37px;font-size:11px}.multi-recipient-send button{white-space:nowrap}
@media(max-width:700px){.multi-recipient-send{align-items:stretch;flex-direction:column}.multi-recipient-send input,.multi-recipient-send button{width:100%}}

/* Professional invoice workspace */
.invoice-workspace-hero{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:25px 28px!important;background:radial-gradient(circle at 92% 12%,rgba(209,174,57,.22),transparent 28%),linear-gradient(125deg,#fff,#f7fbf7)}
.invoice-workspace-hero h2{font-size:26px;margin:5px 0 7px!important}.invoice-workspace-hero p{max-width:790px;margin:0;line-height:1.55}
.invoice-workflow{display:flex;align-items:center;gap:8px;flex-shrink:0}.invoice-workflow span{display:flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid #dfe7dc;border-radius:999px;background:rgba(255,255,255,.82);color:#425d4a;font-size:11px;font-weight:800;white-space:nowrap}.invoice-workflow b{display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:#174f29;color:#fff;font-size:10px}
.invoice-compose-panel{padding:25px 28px!important;border-color:#dce5d9;box-shadow:0 16px 38px rgba(20,57,30,.07)}
.invoice-compose-heading,.invoice-section-heading,.invoice-register-head{display:flex;align-items:center;justify-content:space-between;gap:18px}.invoice-compose-heading h2,.invoice-register-head h2{margin:4px 0 0}.invoice-draft-label,.invoice-count{padding:7px 11px;border-radius:999px;background:#f3f6f2;color:#526558;font-size:11px;font-weight:800}
.invoice-meta-grid{margin:17px 0 8px;padding:17px;border:1px solid #e0e7de;border-radius:15px;background:#f9fbf8}.invoice-meta-grid label{display:grid;gap:6px}.invoice-meta-grid label small{margin:0;color:#526558;font-size:10px;text-transform:uppercase;letter-spacing:.5px}.invoice-meta-grid input,.invoice-meta-grid select{height:45px;border-color:#d8e1d6;background:#fff;font-weight:650}
.invoice-client-snapshot{margin:12px 0 26px!important;padding:18px!important;border:0!important;border-radius:15px!important;background:linear-gradient(115deg,#143e23,#1f6033)!important;color:#fff;box-shadow:0 12px 25px rgba(20,62,35,.14)}.invoice-client-snapshot>div{padding:2px 14px!important;border-right:1px solid rgba(255,255,255,.15)}.invoice-client-snapshot>div:last-child{border-right:0}.invoice-client-snapshot small{color:#cce0d1!important}.invoice-client-snapshot b{color:#fff!important;white-space:normal!important;line-height:1.4}.invoice-client-snapshot>b{color:#eef7f0;font-size:13px}
.invoice-section-heading{margin:8px 0 11px}.invoice-section-heading h3{margin:4px 0 2px;font-size:19px}.invoice-section-heading p{margin:0;font-size:12px}.invoice-section-heading button{padding:9px 13px}
.billing-lines-table{margin:0!important;border:1px solid #dce5da;border-radius:15px;overflow:auto!important;background:#fff}.billing-lines-table table{min-width:1180px;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}.billing-lines-table th{padding:11px 10px;background:#133e22;color:#deeadf;font-size:9px;letter-spacing:.75px}.billing-lines-table td{padding:12px 9px;vertical-align:middle;background:#fff}.billing-lines-table tbody tr:hover td{background:#fbfdfb}.billing-lines-table input,.billing-lines-table select{height:41px;min-width:0!important;padding:8px 10px;border-radius:9px;font-size:12px}.billing-lines-table .item-desc{min-width:220px!important}.billing-lines-table .reference-cell{min-width:230px}.billing-lines-table .reference-cell select,.billing-lines-table .reference-cell input{min-width:210px!important}.billing-lines-table .qty{width:85px}.billing-lines-table .price{width:125px}.billing-lines-table .line-total{min-width:105px;color:#194f2b;font-size:14px;font-weight:900}.billing-lines-table td:last-child button{padding:7px 10px;font-size:10px}
.invoice-compose-footer{display:flex;align-items:center;justify-content:flex-end;gap:35px;margin-top:18px;padding:17px 19px;border-radius:15px;background:linear-gradient(120deg,#f7faf6,#fff8df)}.invoice-compose-footer>div{display:grid;text-align:right}.invoice-compose-footer small{color:#66756a;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.6px}.invoice-compose-footer strong{color:#155b2b;font-size:30px;line-height:1.1}.invoice-compose-footer span{margin-top:3px;color:#7a877d;font-size:10px}.invoice-create-button{min-width:190px;height:46px;background:linear-gradient(135deg,#1d6c35,#123e22);box-shadow:0 9px 20px rgba(22,79,41,.18)}.invoice-create-button span{margin-left:10px;color:#fff;font-size:17px}
.invoice-save-actions{display:flex!important;align-items:center;justify-content:flex-end;gap:8px;text-align:left!important}.invoice-save-actions .secondary{height:46px;padding:13px 15px}
.invoice-register{padding:0!important;overflow:hidden}.invoice-register-head{padding:22px 25px 16px}.invoice-register-head p{margin:4px 0 0}.invoice-register-table{overflow-x:auto}.invoice-register-table table{min-width:1320px;margin:0!important;border:0!important;border-top:1px solid #e2e8e0!important;border-radius:0!important;box-shadow:none!important}.invoice-register-table th{padding:11px 13px;background:#f2f6f1;color:#3f6049;font-size:9px}.invoice-register-table td{padding:15px 13px;vertical-align:middle}.invoice-register-table tbody tr:hover td{background:#fbfdfb}.invoice-register-table td small,.invoice-register-table td b{display:block}.invoice-register-table td small{margin-top:4px;color:#78847b;font-size:10px}.invoice-number{color:#174d29;font-size:12px}.invoice-description{display:block;max-width:310px;color:#344a3a;font-size:11px;line-height:1.4}.invoice-row-amount{color:#143f23;font-size:15px;white-space:nowrap}
.invoice-actions{min-width:440px}.invoice-quick-actions{display:flex;align-items:center;gap:6px}.invoice-quick-actions form{margin:0}.invoice-quick-actions button,.invoice-quick-actions .btn{height:34px;padding:7px 10px;border-radius:9px;font-size:10px}.invoice-view-button{background:#174f2a!important;color:#fff!important}.invoice-email-actions{display:grid!important;grid-template-columns:minmax(230px,1fr) auto;align-items:end!important;gap:7px!important;margin-top:9px!important;padding-top:9px;border-top:1px solid #e3e9e1}.invoice-email-actions label{display:grid;gap:4px}.invoice-email-actions label small{margin:0;color:#77847b;font-size:9px;text-transform:uppercase;letter-spacing:.45px}.invoice-email-actions input{width:100%!important;min-width:0!important;height:35px!important;border-radius:9px}.invoice-email-actions>div{display:flex;gap:5px}.invoice-email-actions button{height:35px;padding:7px 9px;font-size:9px}
.invoice-edit-button{background:#eef4ff!important;border-color:#c9d7f2!important;color:#1849a9!important}.invoice-delete-form{margin-left:auto!important}.invoice-delete-form button{background:#fff1f0!important;border:1px solid #f1c4c0!important;color:#a52a20!important}.invoice-delete-form button:hover{background:#a52a20!important;color:#fff!important}
@media(max-width:1250px){.invoice-workspace-hero{align-items:flex-start;flex-direction:column}.invoice-workflow{flex-wrap:wrap}.invoice-actions{min-width:390px}.invoice-email-actions{grid-template-columns:1fr}.invoice-email-actions>div{justify-content:flex-start}}
@media(max-width:700px){.invoice-compose-panel{padding:18px!important}.invoice-compose-heading,.invoice-section-heading,.invoice-register-head,.invoice-compose-footer{align-items:flex-start;flex-direction:column}.invoice-compose-footer{gap:12px}.invoice-compose-footer>div{text-align:left}.invoice-save-actions{align-items:stretch!important;flex-direction:column;width:100%}.invoice-save-actions .btn,.invoice-create-button{width:100%;text-align:center}.invoice-workflow{align-items:stretch;flex-direction:column;width:100%}.invoice-workflow span{justify-content:flex-start}.invoice-client-snapshot>div{border-right:0;border-bottom:1px solid rgba(255,255,255,.15);padding:10px!important}.invoice-client-snapshot>div:last-child{border-bottom:0}}

/* UmojaCore 2026 global workspace */
:root{
  --shell:#082414;--shell-2:#0e3b22;--brand:#17713a;--brand-hover:#0f5a2c;
  --accent:#d4ad38;--canvas:#f3f6f1;--surface:#fff;--surface-soft:#f8faf7;
  --text:#17251c;--text-soft:#617066;--border:#dfe6df;
  --shadow-sm:0 2px 8px rgba(20,48,29,.05);--shadow-md:0 12px 32px rgba(20,48,29,.08);
  --radius-sm:10px;--radius-md:16px;--radius-lg:22px;
}
html{scroll-behavior:smooth}body{background:var(--canvas);color:var(--text);font-size:14px;line-height:1.45}
body:before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(circle at 75% 0,rgba(212,173,56,.08),transparent 28%),linear-gradient(180deg,#f8faf6,var(--canvas) 330px)}
aside.zen-illustration-sidebar{width:272px;padding:16px 14px 24px;background:linear-gradient(180deg,#061b0e,#0a2d18 58%,#0d4724)!important;border-right:1px solid rgba(255,255,255,.08);box-shadow:12px 0 38px rgba(7,32,17,.12)}
aside .brand-owned{padding:12px;margin:0 0 14px;border-radius:18px;box-shadow:none}
aside .brand-owned img{width:116px;margin-bottom:8px;border-radius:14px}
aside .brand-owned strong{font-size:18px}aside .brand-owned small{font-size:10px}
.zen-nav-group{margin:7px 0;padding:4px;border-radius:15px;box-shadow:none!important}
.zen-nav-group summary{min-height:42px;padding:10px 12px;border-radius:12px;font-size:13px}
.zen-nav-group a{min-height:36px;margin:3px 2px;padding:8px 11px 8px 14px;border:1px solid transparent;border-radius:10px;font-size:12px}
.zen-nav-group a:before{width:5px;height:5px}.zen-nav-group a:hover{transform:none}
aside a.is-active{background:linear-gradient(90deg,rgba(212,173,56,.24),rgba(255,255,255,.1))!important;border-color:rgba(237,210,126,.3)!important;color:#fff!important;box-shadow:inset 3px 0 0 var(--accent)}
aside a.is-active:before{background:#ffe792;opacity:1;box-shadow:0 0 0 4px rgba(255,231,146,.12)}
main{margin-left:272px;padding:0;min-width:0}
.workspace-content{width:min(1680px,100%);margin:0 auto;padding:22px 28px 42px}
.app-header{position:sticky!important;top:0;z-index:20;display:grid!important;grid-template-columns:minmax(190px,.7fr) minmax(360px,1.5fr) auto!important;align-items:center!important;gap:22px!important;margin:0!important;padding:14px 28px!important;border:0!important;border-bottom:1px solid rgba(212,221,213,.92)!important;border-radius:0!important;background:rgba(252,253,251,.92)!important;box-shadow:0 4px 18px rgba(20,48,29,.045)!important;backdrop-filter:blur(16px)}
.page-heading{min-width:0}.page-heading>span{display:block;color:#758279;font-size:9px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.page-heading h1{overflow:hidden;margin:2px 0 0!important;color:#132b1c;font-size:22px!important;line-height:1.2;letter-spacing:-.025em;text-overflow:ellipsis;white-space:nowrap}
.header-user{display:flex;align-items:center;gap:9px;padding-left:16px;border-left:1px solid var(--border);color:var(--text)}
.header-user>span:last-child{display:grid}.header-user b{font-size:12px}.header-user small{color:var(--text-soft);font-size:10px}
.user-avatar{display:grid!important;place-items:center;width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,var(--brand),var(--shell-2));color:#fff;font-size:13px;font-weight:900;box-shadow:0 5px 13px rgba(18,87,43,.18)}
.global-search{max-width:680px;margin:auto}.global-search-field{height:40px;border-color:#d8e0d8;box-shadow:none}.global-search input{height:38px}.global-search button{height:40px;padding:8px 16px;border-radius:11px}
.mobile-nav-toggle,.nav-backdrop{display:none}
.panel,.card{border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-sm)}
.panel{margin:0 0 18px;padding:21px 22px;border-radius:var(--radius-md);transition:border-color .18s,box-shadow .18s}
.panel:hover{border-color:#d4ded5;box-shadow:var(--shadow-md);transform:none}
.panel h2{font-size:19px;letter-spacing:-.02em}.panel h3{letter-spacing:-.015em}
.hero-panel{padding:23px 24px;border-left:0;border-top:3px solid var(--accent);border-radius:var(--radius-lg);background:linear-gradient(120deg,#fff 45%,#fbf7e9)}
.grid{gap:16px}.card{padding:18px;border-radius:var(--radius-md)}.card strong{font-size:29px;letter-spacing:-.03em}
button,.btn{min-height:38px;padding:9px 14px;border-radius:var(--radius-sm);background:var(--brand);box-shadow:0 4px 12px rgba(18,96,48,.12);transition:background .15s,transform .15s,box-shadow .15s}
button:hover,.btn:hover{background:var(--brand-hover);box-shadow:0 6px 15px rgba(18,96,48,.18);transform:translateY(-1px)}
button:focus-visible,.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid rgba(212,173,56,.38);outline-offset:2px}
button.secondary,.btn.secondary{background:#f3f8f3;color:#165d31;border-color:#cfe0d2;box-shadow:none}
input,select,textarea{border-color:#d7e0d7;border-radius:var(--radius-sm);background:#fff;box-shadow:inset 0 1px 2px rgba(20,48,29,.025);transition:border-color .15s,box-shadow .15s}
input:hover,select:hover,textarea:hover{border-color:#bdcbbf}input:focus,select:focus,textarea:focus{border-color:#66a477;box-shadow:0 0 0 3px rgba(35,126,61,.1);outline:0}
table{margin:12px 0;border-color:var(--border);border-radius:var(--radius-md);box-shadow:none}
th{padding:11px 12px;background:#123f24;color:#e8f2ea;font-size:9px;letter-spacing:.08em}
td{padding:12px;border-color:#e7ece7;font-size:12px}tbody tr:nth-child(even) td{background:#fbfcfa}tbody tr:hover td{background:#f5f9f4}
.pill{padding:4px 8px;font-size:10px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.025)}
.notice,.alert{border-radius:var(--radius-sm);font-size:12px}
pre{border:1px solid #1c3a29;border-radius:var(--radius-md);background:#07160d;color:#daf1df}
@media(max-width:1180px){.app-header{grid-template-columns:minmax(170px,.7fr) minmax(280px,1.3fr) auto!important}.workspace-content{padding:20px}}
@media(max-width:900px){
  body{overflow-x:hidden}body.nav-open{overflow:hidden}
  aside.zen-illustration-sidebar{position:fixed!important;inset:0 auto 0 0!important;z-index:60;width:min(310px,86vw)!important;min-height:100vh!important;border-radius:0!important;transform:translateX(-105%);transition:transform .22s ease}
  body.nav-open aside.zen-illustration-sidebar{transform:translateX(0)}
  .nav-backdrop{position:fixed;inset:0;z-index:55;width:100%;height:100%;border:0;border-radius:0;background:rgba(4,24,12,.58);box-shadow:none;backdrop-filter:blur(3px)}
  body.nav-open .nav-backdrop{display:block}.nav-backdrop:hover{transform:none;background:rgba(4,24,12,.58)}
  main{margin-left:0}.app-header{grid-template-columns:auto minmax(0,1fr) auto!important;padding:12px 16px!important;gap:12px!important}
  .mobile-nav-toggle{display:grid;place-content:center;gap:4px;width:40px;height:40px;padding:0;border-radius:11px;background:#edf5ef;box-shadow:none}
  .mobile-nav-toggle span{display:block;width:18px;height:2px;border-radius:2px;background:#174c2a}
  .page-heading>span{display:none}.page-heading h1{font-size:18px!important}.global-search{grid-column:1/-1;grid-row:2;max-width:none}
  .header-user{padding-left:0;border-left:0}.header-user>span:last-child{display:none}.workspace-content{padding:16px}
}
@media(max-width:640px){
  .panel,.hero-panel{padding:17px;border-radius:14px}.grid{grid-template-columns:1fr}.form,.form.two,.split{grid-template-columns:1fr}
  table{display:block;overflow-x:auto}th,td{white-space:nowrap}.global-search button{padding-inline:12px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Dashboard network availability graph */
.network-status-panel{padding:23px 25px}.network-status-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.network-status-heading h2{margin:3px 0 3px}.network-status-heading p{margin:0}.network-status-kicker{color:var(--brand);font-size:9px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.network-status-current{display:flex;align-items:center;gap:11px;min-width:190px;padding:10px 13px;border:1px solid var(--border);border-radius:13px;background:var(--surface-soft)}.network-status-current>div{display:grid}.network-status-current strong{color:#154f2a;font-size:21px;line-height:1}.network-status-current small{margin-top:4px;color:var(--text-soft);font-size:10px}.status-dot{width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 5px rgba(45,155,82,.12)}.status-dot.is-healthy{background:#2d9b52}.status-dot.has-outage{background:#c33c36;box-shadow:0 0 0 5px rgba(195,60,54,.12)}
.network-status-chart{height:226px;margin:17px 0 5px}.network-status-chart svg{display:block;width:100%;height:100%;overflow:visible}.chart-grid{stroke:#e1e8e1;stroke-width:1;stroke-dasharray:4 5}.chart-y-label,.chart-x-label{fill:#718077;font-family:Segoe UI,Arial,sans-serif;font-size:10px}.chart-line{fill:none;stroke:#248649;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.chart-point{fill:#fff;stroke:#248649;stroke-width:2;vector-effect:non-scaling-stroke}
.network-status-footer{display:flex;align-items:center;gap:20px;color:var(--text-soft);font-size:10px}.network-status-footer span{display:flex;align-items:center;gap:7px}.network-status-footer a{margin-left:auto;color:var(--brand);font-weight:800}.legend-line{display:inline-block;width:22px;height:3px;border-radius:5px;background:#248649}.network-status-empty{display:grid;place-items:center;min-height:190px;margin:17px 0;padding:25px;border:1px dashed #cfdacf;border-radius:14px;background:#fafcf9;text-align:center}.network-status-empty b{color:#31533b}.network-status-empty span{margin-top:5px;color:var(--text-soft);font-size:11px}
@media(max-width:700px){.network-status-panel{padding:17px}.network-status-heading{flex-direction:column}.network-status-current{width:100%}.network-status-chart{height:190px}.network-status-footer{align-items:flex-start;flex-wrap:wrap}.network-status-footer a{width:100%;margin-left:0}}

/* RouterOS operations workbench */
.routeros-workbench{overflow:hidden;border:1px solid #24332a;border-radius:15px;background:#18221c;box-shadow:0 18px 42px rgba(15,38,22,.16)}.routeros-toolbar{display:grid;grid-template-columns:minmax(210px,.7fr) minmax(300px,1.6fr) minmax(180px,.6fr);align-items:center;gap:18px;padding:12px 16px;border-bottom:1px solid #35453a;background:#202b25;color:#eef7f0}.routeros-toolbar>div{display:flex;align-items:center;gap:10px}.routeros-toolbar span{display:grid}.routeros-toolbar small{color:#91a79a;font-size:9px}.routeros-toolbar select{width:100%;border-color:#4a5b50;background:#17201b;color:#eff8f1}.routeros-brand-mark{display:grid!important;place-items:center;width:30px;height:30px;border-radius:8px;background:#7952b3;color:white;font-weight:900}.routeros-session-state{justify-self:end}.routeros-session-state>i{width:9px;height:9px;border-radius:50%;background:#d86158;box-shadow:0 0 0 4px rgba(216,97,88,.13)}.routeros-session-state>i.is-up{background:#56c478;box-shadow:0 0 0 4px rgba(86,196,120,.13)}.routeros-workspace{display:grid;grid-template-columns:245px minmax(0,1fr);min-height:610px}.routeros-palette{position:static;width:auto;padding:18px;border-right:1px solid #34443a;background:#1d2822;color:#e7f1ea}.routeros-palette h3{margin:4px 0;font-size:14px}.routeros-palette p{margin:0;color:#91a79a;font-size:10px}.routeros-palette nav{display:grid;gap:7px;margin-top:22px}.routeros-palette nav>span{margin-bottom:3px;color:#789082;font-size:9px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}.routeros-palette button{display:grid;gap:2px;width:100%;padding:10px;border:1px solid #35473c;border-radius:8px;background:#243229;color:#dff2e4;text-align:left;cursor:pointer}.routeros-palette button:hover{border-color:#5a8066;background:#2a3b30}.routeros-palette button small{overflow:hidden;color:#8fab98;font:9px Consolas,monospace;text-overflow:ellipsis;white-space:nowrap}.routeros-audit-note{margin-top:20px!important;padding:11px;border:1px solid #34483a;border-radius:8px;background:#17211b}.routeros-terminal{display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-width:0;background:#050806}.routeros-terminal-bar{display:flex;align-items:center;justify-content:space-between;padding:9px 13px;border-bottom:1px solid #252d28;background:#111713;color:#adbbb1;font:10px Consolas,monospace}.routeros-terminal-bar>span:last-child{display:flex;gap:6px}.routeros-terminal-bar i{width:8px;height:8px;border-radius:50%;background:#506057}.routeros-screen{min-height:520px;max-height:68vh;overflow:auto;padding:23px;color:#d6f7dd;font:12px/1.55 Consolas,"SFMono-Regular",monospace}.routeros-banner{display:grid;gap:7px;margin-bottom:24px;color:#64d989}.routeros-banner b{font-size:18px;letter-spacing:.12em}.routeros-banner span{color:#7e9c87}.routeros-executed{margin-bottom:13px;color:#edf8ef}.routeros-executed span,.routeros-prompt span{color:#53dc78}.routeros-screen pre{margin:0;color:#d9e6dc;font:inherit;white-space:pre-wrap;word-break:break-word}.routeros-exit{margin-top:20px;color:#d8aa54}.routeros-exit.is-success{color:#62d783}.routeros-exit.is-error{color:#ef7770}.routeros-idle{display:grid;place-items:center;align-content:center;height:100%;min-height:420px;color:#728178;text-align:center}.routeros-idle span{margin-top:6px;font-size:10px}.routeros-prompt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;padding:12px 14px;border-top:1px solid #28322b;background:#0d120f;color:#d8e5db;font:11px Consolas,monospace}.routeros-prompt input{height:34px;border:1px solid #33453a;background:#161f19;color:#ebf8ed;font:12px Consolas,monospace}.routeros-prompt button{height:34px;border-radius:7px}.routeros-prompt button:disabled,.routeros-prompt input:disabled{opacity:.45}
@media(max-width:900px){.routeros-toolbar{grid-template-columns:1fr}.routeros-session-state{justify-self:start}.routeros-workspace{grid-template-columns:1fr}.routeros-palette{border-right:0;border-bottom:1px solid #34443a}.routeros-palette nav{grid-template-columns:repeat(2,minmax(0,1fr))}.routeros-screen{min-height:390px}.routeros-idle{min-height:300px}}@media(max-width:600px){.routeros-palette nav{grid-template-columns:1fr}.routeros-prompt{grid-template-columns:1fr}.routeros-prompt span{display:none}.routeros-screen{padding:16px;font-size:11px}}
.form-section-label{margin-top:5px;padding-top:14px;border-top:1px solid var(--border);color:var(--brand);font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}

/* Incident command centre */
.incident-hero{display:flex;align-items:center;justify-content:space-between;gap:24px}.incident-hero h2{margin:4px 0}.incident-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;margin-bottom:14px}.incident-kpis>div{display:grid;gap:5px;padding:17px;border:1px solid var(--border);border-radius:13px;background:var(--surface);box-shadow:var(--shadow)}.incident-kpis span{color:var(--text-soft);font-size:9px;font-weight:800;text-transform:uppercase}.incident-kpis b{color:#174e2a;font-size:22px}.incident-kpis .danger b{color:#b42318}.incident-analysis{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px;margin:15px 0}.incident-analysis>div{display:grid;gap:5px;padding:14px;border-radius:11px;background:#f3f7f2}.incident-analysis small{color:var(--text-soft);text-transform:uppercase}.incident-actions{display:grid;grid-template-columns:1.4fr .8fr;gap:14px}.diagnostic-launch{align-content:start;padding:17px;border:1px solid #bad8c2;border-radius:12px;background:#edf8f0}.diagnostic-launch h3,.diagnostic-launch p{margin:0}.incident-timeline{display:grid;gap:0;margin-top:18px}.incident-timeline article{display:flex;gap:12px;padding:11px 3px;border-top:1px solid var(--border)}.incident-timeline i{width:9px;height:9px;margin-top:5px;border-radius:50%;background:#26944b}.incident-timeline article>div{display:grid;gap:2px}.incident-timeline small,.incident-table small{display:block;color:var(--text-soft);font-size:9px}.incident-timeline p{margin:2px 0}.pill.acknowledged,.pill.investigating{background:#fff0cf;color:#8b5a00}@media(max-width:1050px){.incident-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.incident-analysis,.incident-actions{grid-template-columns:1fr}}@media(max-width:600px){.incident-hero{align-items:flex-start;flex-direction:column}.incident-kpis{grid-template-columns:1fr}}

/* Incident queue readability */
.incident-table{overflow-x:auto}.incident-table table{min-width:1050px}.incident-table th,.incident-table td{vertical-align:top;line-height:1.35}.incident-table td:nth-child(1){min-width:245px}.incident-table td:nth-child(2){min-width:210px}.incident-table td:nth-child(3){min-width:260px}

/* Unified subscriber provisioning */
.provisioning-hero{display:flex;align-items:center;justify-content:space-between;gap:24px}.provisioning-hero h2{margin:4px 0}.subscriber-picker{max-width:680px;margin:14px 0}.provisioning-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.provisioning-form fieldset{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:12px;margin:0;padding:18px;border:1px solid var(--border);border-radius:14px;background:#fbfdfb}.provisioning-form legend{padding:0 8px;color:#176d34;font-weight:900}.provisioning-form fieldset label{display:grid;gap:6px}.provisioning-form .migration-check{grid-column:1/-1;display:flex;align-items:flex-start;gap:8px;padding:11px;border-radius:10px;background:#fff6df}.provisioning-form .migration-check input{width:auto}.pool-preview,.provision-summary{grid-column:1/-1;padding:12px;border-radius:10px;background:#eef7f0;color:#235e34}.provision-summary{display:grid;gap:3px}.provision-submit{grid-column:1/-1;min-height:48px}.credential-once{display:flex;flex-wrap:wrap;align-items:center;gap:14px}.credential-once b,.credential-once small{flex-basis:100%}@media(max-width:900px){.provisioning-hero{align-items:flex-start;flex-direction:column}.provisioning-form{grid-template-columns:1fr}}@media(max-width:580px){.provisioning-form fieldset{grid-template-columns:1fr}.provisioning-form .migration-check,.pool-preview,.provision-summary{grid-column:auto}}

/* Customer communications and SLA control */
.comms-centre{border-top:4px solid #1d7b3c}.sla-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:15px 0}.sla-strip>div{display:grid;gap:4px;padding:14px;border-radius:11px;background:#f3f7f2}.sla-strip small,.communication-meta span{color:var(--text-soft);font-size:10px}.sla-strip b{color:#174e2a;font-size:19px}.comms-draft-tools{display:flex;align-items:end;gap:12px;padding:15px;border:1px solid #dbe6dc;border-radius:12px;background:#fbfdfb}.comms-draft-tools label{min-width:260px}.comms-draft-tools p{flex:1;margin:0}.communication-list{display:grid;gap:12px;margin-top:15px}.communication-list article{padding:15px;border:1px solid var(--border);border-radius:12px;background:#fff}.communication-meta{display:flex;align-items:center;gap:12px;margin-bottom:10px}.communication-meta span{flex:1}.communication-review{display:grid;grid-template-columns:1fr auto;align-items:end;gap:10px}.communication-review textarea{grid-row:span 2;min-height:145px;font-family:inherit}.communication-review label{min-width:220px}.pill.approved{background:#e7efff;color:#2454a6}.pill.sent{background:#def3e4;color:#08722d}@media(max-width:850px){.sla-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.comms-draft-tools,.communication-meta{align-items:stretch;flex-direction:column}.communication-review{grid-template-columns:1fr}.communication-review textarea{grid-row:auto}}

/* Governed network jobs */
.jobs-hero{display:flex;align-items:center;justify-content:space-between;gap:25px}.jobs-hero h2{margin:4px 0}.automation-guard{display:grid;gap:4px;min-width:340px;padding:14px 17px;border:1px solid #bad8c2;border-radius:12px;background:#edf8f0;color:#174e2a}.automation-guard span{font-size:10px}.jobs-compose{display:grid;grid-template-columns:1fr 1fr;gap:14px}.jobs-compose>.panel{margin-top:0}.job-command{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:14px 0;padding:14px;border-radius:10px;background:#102119;color:#d8f2df}.job-command code{color:#70e28d}.job-command span{font-size:10px}.job-approval{display:flex;align-items:end;gap:10px}.job-approval label{flex:1}.job-results{display:grid;gap:8px}.job-results details{border:1px solid var(--border);border-radius:10px;background:#fafcf9}.job-results summary{display:flex;align-items:center;gap:12px;padding:12px;cursor:pointer}.job-results summary span{flex:1;color:var(--text-soft);font-size:10px}.job-results pre{max-height:330px;overflow:auto;margin:0;padding:15px;border-radius:0 0 10px 10px;background:#08110c;color:#d8f2df;white-space:pre-wrap}.job-table small{display:block;max-width:420px;overflow:hidden;color:var(--text-soft);font-size:9px;text-overflow:ellipsis;white-space:nowrap}.pill.completed,.pill.success{background:#def3e4;color:#08722d}.pill.partial,.pill.running{background:#fff0cf;color:#8b5a00}.pill.failed{background:#fde4e4;color:#b42318}@media(max-width:900px){.jobs-hero{align-items:flex-start;flex-direction:column}.automation-guard{min-width:0;width:100%}.jobs-compose{grid-template-columns:1fr}.job-command,.job-approval{align-items:stretch;flex-direction:column}}

/* Client 360 */
.client360-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:25px}.client360-hero h2{margin:3px 0;font-size:25px}.client360-hero p{margin:0;color:var(--text-soft)}.client360-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.client360-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.client360-kpis>div{display:grid;gap:5px;padding:18px;border:1px solid var(--border);border-radius:14px;background:var(--surface);box-shadow:var(--shadow)}.client360-kpis span{color:var(--text-soft);font-size:10px;font-weight:800;text-transform:uppercase}.client360-kpis b{color:#174e2a;font-size:22px}.client360-kpis small{color:var(--text-soft)}.client360-kpis .needs-attention{border-color:#ead3a8;background:#fffaf0}.client360-kpis .needs-attention b{color:#a95c19}.client360-attention{display:flex;align-items:center;gap:20px;border-left:4px solid #d58a28}.client360-attention>div:nth-child(2){display:flex;flex:1;flex-wrap:wrap;gap:7px}.client360-attention>div:nth-child(2) span{padding:6px 9px;border-radius:8px;background:#fff2dc;color:#925015;font-size:10px;font-weight:800}.client360-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.client360-grid>.panel{margin:0;padding:20px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.section-heading h2{margin:2px 0}.section-heading>a{font-size:10px;font-weight:800}.client360-list{display:grid}.client360-list article{display:flex;align-items:center;gap:11px;min-height:58px;padding:10px 4px;border-top:1px solid var(--border)}.client360-list article:first-child{border-top:0}.client360-list article>div{display:grid;flex:1;min-width:0}.client360-list article small{overflow:hidden;margin-top:3px;color:var(--text-soft);font-size:9px;text-overflow:ellipsis;white-space:nowrap}.client360-list article strong{color:#174e2a}.service-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#e8f4eb;color:#176033;font-weight:900}
@media(max-width:1000px){.client360-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.client360-grid{grid-template-columns:1fr}}@media(max-width:650px){.client360-hero,.client360-attention{align-items:flex-start;flex-direction:column}.client360-actions{justify-content:flex-start}.client360-kpis{grid-template-columns:1fr}}
.subscriber-business-workspace{margin-top:18px}.subscriber-billing-grid,.subscriber-ledger-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:16px}.subscriber-billing-grid>div,.subscriber-ledger-grid>div{border:1px solid #dfe8df;border-radius:14px;padding:16px;background:#fbfdf9}.subscriber-billing-grid label{display:grid;gap:6px;margin:10px 0}.compact-payment-form{grid-template-columns:repeat(2,minmax(0,1fr))}.compact-payment-form button{grid-column:1/-1}.readiness-summary{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}@media(max-width:900px){.subscriber-billing-grid,.subscriber-ledger-grid{grid-template-columns:1fr}.compact-payment-form{grid-template-columns:1fr}}
.pppoe-account-control{margin-top:18px}.account-search{min-width:280px}.account-search input{margin-top:5px}.account-table{overflow:auto}.account-table td small{display:block;margin-top:4px;color:#647267}.account-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.account-actions form{margin:0}.account-actions button,.account-actions .btn{white-space:nowrap;padding:8px 11px}@media(max-width:760px){.account-search{min-width:100%}}
.new-subscriber-billing{display:grid;grid-template-columns:2fr 1fr 1fr 2fr;gap:14px;align-items:end}.new-subscriber-billing label{display:grid;gap:6px}.new-subscriber-billing .migration-check{display:flex}@media(max-width:900px){.new-subscriber-billing{grid-template-columns:1fr 1fr}.new-subscriber-billing>div,.new-subscriber-billing .migration-check{grid-column:1/-1}}

/* Post-create invoice and quote handoff */
.document-complete{display:grid;grid-template-columns:minmax(260px,1fr) minmax(420px,1.35fr);align-items:center;gap:24px;border:1px solid #a9d2b3;border-left:5px solid #15733a;background:linear-gradient(110deg,#f1faf3,#fffdf4);box-shadow:0 15px 35px rgba(21,80,40,.12)}.document-complete-copy h2{margin:4px 0 6px;color:#104e27}.document-complete-copy p{margin:0 0 7px;color:var(--text-soft)}.document-complete-copy small{color:#42634b}.document-complete-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.document-send-form{display:grid;grid-template-columns:minmax(190px,1fr) auto;grid-column:1/-1;gap:8px;margin:0}.document-complete-actions>.btn{display:flex;align-items:center;justify-content:center;min-height:40px;text-align:center}@media(max-width:900px){.document-complete{grid-template-columns:1fr}.document-send-form{grid-template-columns:1fr}}@media(max-width:560px){.document-complete-actions{grid-template-columns:1fr}.document-send-form{grid-template-columns:1fr}.document-complete-actions>.btn{grid-column:1}}

/* invoice-register-cleanup-v1 */
.invoice-register-table table{min-width:1180px}.invoice-register-table th:last-child{min-width:410px}.invoice-register-table tbody tr{border-bottom:1px solid #e8eee7}.invoice-actions{min-width:410px}.invoice-action-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.invoice-action-bar form{margin:0}.invoice-action-bar button,.invoice-action-bar .btn{height:34px;padding:7px 11px;border-radius:9px;font-size:10px;white-space:nowrap}.invoice-action-separator{width:1px;height:22px;margin:0 2px;background:#dce5dc}.invoice-manual-button{background:#fff!important;border-color:#b9d9c1!important}.invoice-more-actions{margin-top:8px;border-top:1px solid #e7ece6}.invoice-more-actions summary{width:max-content;padding:8px 1px 1px;color:#52675a;font-size:10px;font-weight:850;cursor:pointer;list-style:none}.invoice-more-actions summary::-webkit-details-marker{display:none}.invoice-more-actions summary:after{content:'+';display:inline-grid;place-items:center;width:17px;height:17px;margin-left:6px;border-radius:50%;background:#edf4ed;color:#245a32}.invoice-more-actions[open] summary:after{content:'–'}.invoice-more-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px;margin-top:8px;padding:10px;border:1px solid #e1e9e0;border-radius:11px;background:#fafcf9}.invoice-email-actions{margin:0!important;padding:0!important;border:0!important}.invoice-more-panel>.invoice-delete-form{align-self:end;margin:0!important}.invoice-more-panel>.invoice-delete-form button{height:35px;padding:7px 10px;font-size:9px}@media(max-width:1250px){.invoice-more-panel{grid-template-columns:1fr}.invoice-more-panel>.invoice-delete-form{justify-self:start}}