/* SmartTech Billing v1.0.7 — Noction Reference-Aligned Operations UI
   Reference goals: narrow icon rail, flat graphite panels, dense data tables,
   restrained orange accents, compact typography, no decorative glass effects. */
:root{
  --nx107-bg:#101112;
  --nx107-sidebar:#171819;
  --nx107-top:#1b1c1d;
  --nx107-panel:#1d1e20;
  --nx107-panel-2:#232426;
  --nx107-panel-3:#292b2d;
  --nx107-line:#303235;
  --nx107-line-soft:#282a2c;
  --nx107-text:#eceeef;
  --nx107-muted:#8f9498;
  --nx107-dim:#656a6e;
  --nx107-orange:#ff8a00;
  --nx107-orange-2:#f3a03a;
  --nx107-green:#52d273;
  --nx107-cyan:#69a9d6;
  --nx107-red:#e05d5d;
  --nx107-yellow:#e5aa45;
}
html,body{background:var(--nx107-bg)!important}
body.sb-noction-ref-v107{
  --bg:var(--nx107-bg)!important;
  --panel:var(--nx107-panel)!important;
  --panel-soft:var(--nx107-panel-2)!important;
  --line:var(--nx107-line)!important;
  --text:var(--nx107-text)!important;
  --muted:var(--nx107-muted)!important;
  --primary:var(--nx107-orange)!important;
  --success:var(--nx107-green)!important;
  --danger:var(--nx107-red)!important;
  color:var(--nx107-text)!important;
  background:var(--nx107-bg)!important;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
  font-size:12px!important;
  letter-spacing:0!important;
}
body.sb-noction-ref-v107 *,body.sb-noction-ref-v107 *:before,body.sb-noction-ref-v107 *:after{box-sizing:border-box}
body.sb-noction-ref-v107 ::selection{background:#6b430e;color:#fff}
body.sb-noction-ref-v107 ::-webkit-scrollbar{width:7px;height:7px}
body.sb-noction-ref-v107 ::-webkit-scrollbar-track{background:#141516}
body.sb-noction-ref-v107 ::-webkit-scrollbar-thumb{background:#3a3c3f;border-radius:0}
body.sb-noction-ref-v107 ::-webkit-scrollbar-thumb:hover{background:#4b4e51}

/* --- Desktop shell: Noction-like narrow navigation rail --- */
@media (min-width:1051px){
  body.sb-noction-ref-v107{--sidebar:78px!important}
  body.sb-noction-ref-v107 .sidebar{
    width:78px!important;
    padding:0 7px 10px!important;
    background:var(--nx107-sidebar)!important;
    border-right:1px solid #292b2d!important;
    box-shadow:none!important;
    overflow-x:visible!important;
  }
  body.sb-noction-ref-v107 .main{width:calc(100% - 78px)!important;margin-left:78px!important}
  body.sb-noction-ref-v107 .brand-panel{
    height:49px!important;
    justify-content:center!important;
    gap:0!important;
    margin:0 -7px 5px!important;
    padding:4px 0!important;
    border-bottom:1px solid #2c2e30!important;
    background:#1d1e20!important;
  }
  body.sb-noction-ref-v107 .brand-logo{
    width:43px!important;height:39px!important;flex:0 0 43px!important;
    border:0!important;border-radius:0!important;background:transparent!important;
  }
  body.sb-noction-ref-v107 .brand-logo img{max-width:39px!important;max-height:34px!important;filter:none!important}
  body.sb-noction-ref-v107 .brand-text{display:none!important}
  body.sb-noction-ref-v107 .sidebar-search{
    position:relative!important;
    width:46px!important;height:36px!important;
    margin:5px auto 8px!important;padding:0!important;
    justify-content:center!important;
    border:0!important;border-radius:2px!important;
    background:transparent!important;color:#b7bbbe!important;
    cursor:text!important;box-shadow:none!important;
  }
  body.sb-noction-ref-v107 .sidebar-search:hover{background:#202224!important;color:#fff!important}
  body.sb-noction-ref-v107 .sidebar-search .search-icon{width:18px!important;height:18px!important}
  body.sb-noction-ref-v107 .sidebar-search input{
    position:fixed!important;z-index:60!important;left:83px!important;top:55px!important;
    width:0!important;height:36px!important;opacity:0!important;pointer-events:none!important;
    padding:0!important;border:1px solid #3a3c3f!important;border-radius:2px!important;
    background:#1e2022!important;color:#f2f3f4!important;box-shadow:0 10px 24px rgba(0,0,0,.28)!important;
    transition:width .14s ease,opacity .14s ease,padding .14s ease!important;
  }
  body.sb-noction-ref-v107 .sidebar-search:focus-within input{
    width:230px!important;opacity:1!important;pointer-events:auto!important;padding:0 11px!important;
  }
  body.sb-noction-ref-v107 .nav-menu{display:block!important;padding:0!important}
  body.sb-noction-ref-v107 .nav-group{margin:0!important;padding:4px 0!important;border-top:1px solid #242628!important}
  body.sb-noction-ref-v107 .nav-group:first-child{border-top:0!important}
  body.sb-noction-ref-v107 .nav-group>small{display:none!important}
  body.sb-noction-ref-v107 .nav-link{
    position:relative!important;
    width:62px!important;min-height:49px!important;
    display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
    gap:2px!important;margin:1px 0!important;padding:5px 2px!important;
    border:0!important;border-left:2px solid transparent!important;border-radius:0!important;
    background:transparent!important;color:#8f9498!important;
    font-size:7px!important;font-weight:650!important;line-height:1.05!important;text-align:center!important;
    text-transform:uppercase!important;letter-spacing:.02em!important;
    transition:background .12s ease,color .12s ease,border-color .12s ease!important;
    overflow:hidden!important;
  }
  body.sb-noction-ref-v107 .nav-link:hover{background:#202224!important;color:#eceeef!important;border-left-color:#606467!important}
  body.sb-noction-ref-v107 .nav-link.active{background:#242526!important;color:#fff!important;border-left-color:var(--nx107-orange)!important}
  body.sb-noction-ref-v107 .nav-link .nav-icon{
    width:23px!important;height:23px!important;flex:0 0 23px!important;
    display:grid!important;place-items:center!important;
    border:0!important;border-radius:0!important;background:transparent!important;color:#9ca1a5!important;
  }
  body.sb-noction-ref-v107 .nav-link .nav-icon svg{width:20px!important;height:20px!important;stroke-width:1.7!important}
  body.sb-noction-ref-v107 .nav-link.active .nav-icon{background:transparent!important;color:var(--nx107-orange)!important}
  body.sb-noction-ref-v107 .nav-link>span:last-child:not(.nav-icon){
    display:block!important;width:56px!important;max-height:17px!important;overflow:hidden!important;
    color:inherit!important;font-size:6.7px!important;line-height:8px!important;white-space:normal!important;text-overflow:clip!important;
  }
  body.sb-noction-ref-v107 .sidebar-footer{
    min-height:42px!important;display:flex!important;justify-content:center!important;
    margin:5px -7px -10px!important;padding:7px 0!important;border-top:1px solid #292b2d!important;background:#171819!important;
  }
  body.sb-noction-ref-v107 .sidebar-footer img{width:26px!important;height:26px!important}
  body.sb-noction-ref-v107 .sidebar-footer>div{display:none!important}
  body.sb-noction-ref-v107 .hamb{display:none!important}
}

/* --- Top bar --- */
body.sb-noction-ref-v107 .topbar{
  height:46px!important;min-height:46px!important;
  padding:0 14px!important;gap:8px!important;
  background:var(--nx107-top)!important;
  border-bottom:1px solid #2b2d2f!important;
  box-shadow:none!important;backdrop-filter:none!important;
}
@media(min-width:1051px){body.sb-noction-ref-v107 .topbar-title{display:none!important}}
body.sb-noction-ref-v107 .topbar-title h1{font-size:13px!important;font-weight:700!important;color:#f0f1f2!important}
body.sb-noction-ref-v107 .topbar-title p{font-size:9px!important;color:#757a7e!important}
body.sb-noction-ref-v107 .topbar-control-cluster{gap:5px!important;align-items:center!important}
body.sb-noction-ref-v107 .enterprise-nas-selector,
body.sb-noction-ref-v107 .top-pill,
body.sb-noction-ref-v107 .operator-profile,
body.sb-noction-ref-v107 .logout{
  min-height:32px!important;height:32px!important;
  border:1px solid #343638!important;border-radius:2px!important;
  background:#222426!important;box-shadow:none!important;color:#c9cccf!important;
}
body.sb-noction-ref-v107 .enterprise-nas-selector{padding:2px 6px!important;gap:6px!important;max-width:330px!important}
body.sb-noction-ref-v107 .nas-context-copy small{font-size:6.5px!important;letter-spacing:.08em!important;color:#777d81!important}
body.sb-noction-ref-v107 .nas-context-copy b{font-size:8px!important;color:#d7d9db!important}
body.sb-noction-ref-v107 .nas-context-select{
  min-width:150px!important;max-width:190px!important;height:25px!important;
  border:0!important;border-left:1px solid #37393b!important;border-radius:0!important;
  background:#222426!important;color:#e7e9ea!important;font-size:9px!important;
}
body.sb-noction-ref-v107 .nas-live-indicator{width:10px!important;height:10px!important;border:1px solid #3b3d40!important;border-radius:50%!important;background:#1b1c1e!important}
body.sb-noction-ref-v107 .nas-live-indicator i{width:5px!important;height:5px!important;box-shadow:none!important}
body.sb-noction-ref-v107 .top-pill{padding:0 9px!important;font-size:8px!important;font-weight:600!important}
body.sb-noction-ref-v107 .top-pill .status-dot{width:5px!important;height:5px!important;box-shadow:none!important}
body.sb-noction-ref-v107 .operator-profile{padding:0 8px!important;gap:6px!important}
body.sb-noction-ref-v107 .operator-avatar{width:23px!important;height:23px!important;border-radius:1px!important;border:1px solid #3a3c3e!important;background:#1d1f20!important;color:#b5b9bc!important}
body.sb-noction-ref-v107 .operator-avatar-icon{width:13px!important;height:13px!important}
body.sb-noction-ref-v107 .operator-copy b{font-size:8px!important;color:#eceeef!important}
body.sb-noction-ref-v107 .operator-copy small{font-size:6.8px!important;color:#777c80!important}
body.sb-noction-ref-v107 .logout{padding:0 9px!important;color:#d2d5d7!important;background:#222426!important;font-size:8px!important;font-weight:700!important}
body.sb-noction-ref-v107 .logout:hover{border-color:#6a4518!important;background:#2b251d!important;color:#ffad4d!important}
body.sb-noction-ref-v107 .btn-icon,body.sb-noction-ref-v107 .logout-icon{width:13px!important;height:13px!important}

/* --- Page frame --- */
body.sb-noction-ref-v107 .content{max-width:none!important;width:100%!important;margin:0!important;padding:13px 15px 18px!important;background:var(--nx107-bg)!important}
body.sb-noction-ref-v107 .page-head{
  min-height:51px!important;display:flex!important;align-items:center!important;
  margin:0 0 10px!important;padding:0 1px 8px!important;
  border-bottom:1px solid #2a2c2e!important;
}
body.sb-noction-ref-v107 .page-head h2{margin:3px 0 0!important;font-size:16px!important;font-weight:650!important;letter-spacing:-.01em!important;color:#f0f1f2!important}
body.sb-noction-ref-v107 .crumb{font-size:7px!important;font-weight:700!important;letter-spacing:.08em!important;color:#777d81!important;text-transform:uppercase!important}
body.sb-noction-ref-v107 .page-symbol{width:24px!important;height:24px!important;border-radius:1px!important;background:#202224!important;border:1px solid #333538!important;color:var(--nx107-orange)!important}
body.sb-noction-ref-v107 .page-symbol svg{width:14px!important;height:14px!important}
body.sb-noction-ref-v107 .page-badge{display:none!important}

/* --- Core panels --- */
body.sb-noction-ref-v107 :is(.card,.enterprise-card,.panel,.widget,.box,.fin22-panel,.sys23-panel,.rad-panel,.wa18-card,.wab81-card,.hot-card,.users-card,.invoice-card,.payment-card,.router-card,.ppp-card,.package-card){
  border:1px solid var(--nx107-line)!important;border-radius:1px!important;
  background:var(--nx107-panel)!important;box-shadow:none!important;
}
body.sb-noction-ref-v107 .card{margin-bottom:10px!important;padding:12px!important}
body.sb-noction-ref-v107 .card-head{gap:8px!important;margin-bottom:8px!important;padding:0!important}
body.sb-noction-ref-v107 .card-head h3,body.sb-noction-ref-v107 .card h3{font-size:12px!important;font-weight:650!important;letter-spacing:0!important;color:#f0f1f2!important}
body.sb-noction-ref-v107 .card-head p,body.sb-noction-ref-v107 .muted{font-size:8px!important;line-height:1.35!important;color:#777d81!important}
body.sb-noction-ref-v107 .grid,body.sb-noction-ref-v107 .grid3,body.sb-noction-ref-v107 .row,body.sb-noction-ref-v107 .monitor-grid,body.sb-noction-ref-v107 .dashboard-charts{gap:10px!important}

/* --- Buttons --- */
body.sb-noction-ref-v107 :where(.btn,button.btn,a.btn,.logout,a[class*="btn-modern"],button[class*="btn-modern"]){
  min-height:30px!important;height:30px!important;padding:0 10px!important;
  border:1px solid #3a3c3f!important;border-radius:2px!important;
  background:#292b2d!important;color:#e8e9ea!important;
  box-shadow:none!important;text-shadow:none!important;
  font-size:8px!important;font-weight:700!important;letter-spacing:.01em!important;
  transition:background .12s,border-color .12s,color .12s!important;
}
body.sb-noction-ref-v107 :where(.btn,button.btn,a.btn):hover{background:#323436!important;border-color:#4b4e50!important;color:#fff!important;transform:none!important}
body.sb-noction-ref-v107 :where(.btn.primary,.btn.btn-primary,button.primary,a.primary,.action-primary){
  background:var(--nx107-orange)!important;border-color:var(--nx107-orange)!important;color:#111!important;font-weight:800!important;
}
body.sb-noction-ref-v107 :where(.btn.primary,.btn.btn-primary,button.primary,a.primary,.action-primary):hover{background:#ffa129!important;border-color:#ffa129!important;color:#111!important}
body.sb-noction-ref-v107 .btn.small,body.sb-noction-ref-v107 .btn-sm{min-height:26px!important;height:26px!important;padding:0 8px!important;font-size:7.5px!important}

/* --- Forms --- */
body.sb-noction-ref-v107 :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  min-height:33px!important;padding:6px 9px!important;
  border:1px solid #3b3d40!important;border-radius:1px!important;
  background:#17191a!important;color:#e5e7e8!important;
  box-shadow:none!important;outline:none!important;font-size:9px!important;
}
body.sb-noction-ref-v107 :where(input,select,textarea):focus{border-color:#8f5b1c!important;box-shadow:0 0 0 1px #8f5b1c!important}
body.sb-noction-ref-v107 label{color:#aeb2b5!important;font-size:8.5px!important;font-weight:600!important}
body.sb-noction-ref-v107 fieldset{border:1px solid #333538!important;border-radius:1px!important;background:#1a1c1d!important}

/* --- Data tables: dense operations-console style --- */
body.sb-noction-ref-v107 .table-wrap{border:1px solid #2f3133!important;border-radius:0!important;background:#191a1c!important;box-shadow:none!important}
body.sb-noction-ref-v107 table{width:100%!important;border-collapse:collapse!important;background:#1b1c1e!important;color:#cfd2d4!important;font-size:8.5px!important}
body.sb-noction-ref-v107 table th{
  height:30px!important;padding:6px 8px!important;
  border:0!important;border-bottom:1px solid #343638!important;
  background:#222426!important;color:#d8dadd!important;
  font-size:7.5px!important;font-weight:700!important;letter-spacing:.025em!important;text-transform:none!important;
}
body.sb-noction-ref-v107 table td{
  height:33px!important;padding:6px 8px!important;border:0!important;border-bottom:1px solid #292b2d!important;
  background:#1c1d1f!important;color:#c9ccce!important;vertical-align:middle!important;
}
body.sb-noction-ref-v107 table tbody tr:nth-child(even) td{background:#1f2022!important}
body.sb-noction-ref-v107 table tbody tr:hover td{background:#27292b!important;color:#fff!important}
body.sb-noction-ref-v107 table tr:last-child td{border-bottom:0!important}
body.sb-noction-ref-v107 table td b{color:#f1f2f3!important;font-weight:650!important}

/* --- Status chips --- */
body.sb-noction-ref-v107 :where(.badge,.status-badge,.live-pill,.limit-pill,.page-badge){
  min-height:19px!important;padding:2px 6px!important;
  border:1px solid #45484b!important;border-radius:9px!important;
  background:#242628!important;color:#bfc3c5!important;
  box-shadow:none!important;font-size:6.8px!important;font-weight:750!important;letter-spacing:.02em!important;
}
body.sb-noction-ref-v107 :where(.badge.ok,.status-badge.ok,.badge.success,.status-online){border-color:#31563c!important;background:#1d2a21!important;color:#72d98e!important}
body.sb-noction-ref-v107 :where(.badge.warning,.status-badge.warning){border-color:#5a472c!important;background:#2a241b!important;color:#e5b35d!important}
body.sb-noction-ref-v107 :where(.badge.fail,.badge.error,.badge.danger,.status-badge.fail){border-color:#573536!important;background:#2b2021!important;color:#e98080!important}

/* --- Dashboard, aligned to supplied Noction reference --- */
body.sb-noction-ref-v107.page-index .dashboard-noc{display:block!important}
body.sb-noction-ref-v107.page-index .kpi-help-banner,
body.sb-noction-ref-v107.page-index .router-gate-banner{
  min-height:45px!important;margin:0 0 9px!important;padding:8px 10px!important;
  border:1px solid #303235!important;border-radius:1px!important;background:#1d1e20!important;box-shadow:none!important;
}
body.sb-noction-ref-v107.page-index .kpi-help-banner b,body.sb-noction-ref-v107.page-index .router-gate-banner h3{font-size:10px!important;color:#ededee!important}
body.sb-noction-ref-v107.page-index .kpi-help-banner span,body.sb-noction-ref-v107.page-index .router-gate-banner p{font-size:7.5px!important;color:#777d81!important}
body.sb-noction-ref-v107.page-index .kpi-compact{
  grid-template-columns:repeat(7,minmax(105px,1fr))!important;gap:7px!important;margin-bottom:10px!important;
}
body.sb-noction-ref-v107.page-index .mini-kpi{
  min-height:75px!important;padding:9px 9px 8px!important;
  border:1px solid #303235!important;border-radius:1px!important;background:#1d1e20!important;box-shadow:none!important;
}
body.sb-noction-ref-v107.page-index .mini-kpi:after{display:none!important}
body.sb-noction-ref-v107.page-index .mini-kpi:before{content:""!important;position:absolute!important;left:-1px!important;top:-1px!important;bottom:-1px!important;width:2px!important;background:#505356!important;border-radius:0!important}
body.sb-noction-ref-v107.page-index .mini-kpi.success:before{background:var(--nx107-green)!important}
body.sb-noction-ref-v107.page-index .mini-kpi.warning:before,body.sb-noction-ref-v107.page-index .mini-kpi.purple:before{background:var(--nx107-orange)!important}
body.sb-noction-ref-v107.page-index .mini-kpi.danger:before{background:var(--nx107-red)!important}
body.sb-noction-ref-v107.page-index .mini-kpi.cyan:before{background:var(--nx107-cyan)!important}
body.sb-noction-ref-v107.page-index .mini-kpi .kpi-icon{width:19px!important;height:19px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#a6aaad!important}
body.sb-noction-ref-v107.page-index .mini-kpi .kpi-icon svg{width:16px!important;height:16px!important}
body.sb-noction-ref-v107.page-index .mini-kpi em{font-size:6.8px!important;letter-spacing:.03em!important;color:#858a8e!important;font-style:normal!important}
body.sb-noction-ref-v107.page-index .mini-kpi>b{margin:5px 0 2px!important;font-size:18px!important;font-weight:700!important;color:#f0f1f2!important;letter-spacing:-.02em!important}
body.sb-noction-ref-v107.page-index .mini-kpi>small{font-size:6.8px!important;color:#6f7478!important;line-height:1.15!important}
body.sb-noction-ref-v107.page-index .monitor-grid.noc-focus{grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr)!important;gap:10px!important;align-items:stretch!important}
body.sb-noction-ref-v107.page-index .monitor-grid.lower{grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr)!important;gap:10px!important;align-items:stretch!important}
body.sb-noction-ref-v107.page-index .monitor-grid>.card{margin-bottom:0!important;height:100%!important}
body.sb-noction-ref-v107.page-index .billing-revenue-strip,
body.sb-noction-ref-v107.page-index .billing-health-grid,
body.sb-noction-ref-v107.page-index .ops-grid,
body.sb-noction-ref-v107.page-index .queue-enterprise-meters,
body.sb-noction-ref-v107.page-index .sb-uplink-metrics,
body.sb-noction-ref-v107.page-index .sb-uplink-meta{gap:6px!important}
body.sb-noction-ref-v107.page-index :is(.billing-revenue-strip>div,.billing-health-grid>a,.ops-grid>div,.queue-enterprise-meters>div,.sb-uplink-metric,.sb-uplink-meta>div){
  border:1px solid #303235!important;border-radius:1px!important;background:#202224!important;box-shadow:none!important;
}
body.sb-noction-ref-v107.page-index .billing-revenue-strip>div{min-height:57px!important;padding:8px!important}
body.sb-noction-ref-v107.page-index .billing-health-grid>a,body.sb-noction-ref-v107.page-index .ops-grid>div{min-height:52px!important;padding:7px 8px!important}
body.sb-noction-ref-v107.page-index :is(.billing-revenue-strip,.billing-health-grid,.ops-grid) span{font-size:6.8px!important;color:#8b9094!important;letter-spacing:.04em!important}
body.sb-noction-ref-v107.page-index :is(.billing-revenue-strip,.billing-health-grid,.ops-grid) b{font-size:15px!important;color:#eff0f1!important;font-weight:700!important}
body.sb-noction-ref-v107.page-index .live-uplink{background:#1d1e20!important;border-color:#303235!important}
body.sb-noction-ref-v107.page-index .sb-ring-rx{stroke:var(--nx107-orange)!important;filter:none!important}
body.sb-noction-ref-v107.page-index .sb-ring-tx{stroke:var(--nx107-cyan)!important;filter:none!important}
body.sb-noction-ref-v107.page-index .sb-ring-track{stroke:#2b2d2f!important}
body.sb-noction-ref-v107.page-index .sb-uplink-metric.rx{border-left:2px solid var(--nx107-orange)!important}
body.sb-noction-ref-v107.page-index .sb-uplink-metric.tx{border-left:2px solid var(--nx107-cyan)!important}
body.sb-noction-ref-v107.page-index .sb-metric-bar{height:3px!important;border-radius:0!important;background:#131415!important}
body.sb-noction-ref-v107.page-index .sb-uplink-metric.rx .sb-metric-bar i{background:var(--nx107-orange)!important}
body.sb-noction-ref-v107.page-index .sb-uplink-metric.tx .sb-metric-bar i{background:var(--nx107-cyan)!important}
body.sb-noction-ref-v107.page-index .billing-health-note{border-radius:0!important;background:#18191b!important;border-top:1px solid #2d2f31!important;font-size:7px!important;color:#707579!important}

/* --- Sync progress + notifications harmonized with Noction shell --- */
body.sb-noction-ref-v107 .st-sync-modal__panel,
body.sb-noction-ref-v107 .st-sync-progress,
body.sb-noction-ref-v107 .st-message,
body.sb-noction-ref-v107 .app-toast{
  border-radius:1px!important;border-color:#3a3c3f!important;background:#1f2022!important;box-shadow:0 14px 34px rgba(0,0,0,.35)!important;
}
body.sb-noction-ref-v107 .st-sync-progress__bar>i,
body.sb-noction-ref-v107 .st-sync-bar>i{background:var(--nx107-orange)!important;box-shadow:none!important}
body.sb-noction-ref-v107 .st-message--success{border-left:2px solid var(--nx107-green)!important}
body.sb-noction-ref-v107 .st-message--error{border-left:2px solid var(--nx107-red)!important}
body.sb-noction-ref-v107 .st-message--warning{border-left:2px solid var(--nx107-yellow)!important}
body.sb-noction-ref-v107 .st-message--info{border-left:2px solid var(--nx107-orange)!important}

/* --- Footer --- */
body.sb-noction-ref-v107 .footer{padding:9px 15px!important;border-top:1px solid #292b2d!important;background:#171819!important;color:#61666a!important;font-size:7.5px!important}

/* --- Auth pages: same flat Noction language --- */
body.auth-noction-page.sb-noction-ref-v107-auth,
body.sb-digital-auth.sb-noction-ref-v107-auth{
  background:#111213!important;color:#eceeef!important;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
}
body.sb-noction-ref-v107-auth :is(.auth-card,.login-card,.register-card,.auth-panel,.form-card,.auth-shell,.auth-box){
  border-radius:1px!important;border:1px solid #343638!important;background:#1d1e20!important;box-shadow:none!important;
}
body.sb-noction-ref-v107-auth :is(input,select,textarea){border-radius:1px!important;border-color:#3a3d40!important;background:#17191a!important;color:#eef0f1!important;box-shadow:none!important}
body.sb-noction-ref-v107-auth :is(button,.btn,a.btn){border-radius:2px!important;box-shadow:none!important}
body.sb-noction-ref-v107-auth :is(.btn-primary,button[type="submit"],.primary){background:#ff8a00!important;border-color:#ff8a00!important;color:#111!important;font-weight:800!important}

/* --- Installer --- */
body.installer-graphite.sb-noction-ref-v107-installer{background:#111213!important;color:#eceeef!important}
body.sb-noction-ref-v107-installer :is(.install-shell,.installer-shell,.install-card,.step-card,.panel,.card){border-radius:1px!important;border-color:#343638!important;background:#1d1e20!important;box-shadow:none!important}
body.sb-noction-ref-v107-installer :is(input,select,textarea){border-radius:1px!important;border-color:#3b3d40!important;background:#17191a!important;color:#eef0f1!important}
body.sb-noction-ref-v107-installer :is(button,.btn,.mode-card){border-radius:2px!important;box-shadow:none!important}
body.sb-noction-ref-v107-installer :is(button[type="submit"],.primary,.btn-primary){background:#ff8a00!important;border-color:#ff8a00!important;color:#111!important}

/* --- Responsive: restore readable navigation drawer on smaller screens --- */
@media(max-width:1350px){
  body.sb-noction-ref-v107.page-index .kpi-compact{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  body.sb-noction-ref-v107.page-index .monitor-grid.noc-focus,
  body.sb-noction-ref-v107.page-index .monitor-grid.lower{grid-template-columns:1fr!important}
}
@media(max-width:1050px){
  body.sb-noction-ref-v107 .sidebar{width:260px!important;padding:10px!important;background:#171819!important;border-right:1px solid #303235!important}
  body.sb-noction-ref-v107 .main{width:100%!important;margin-left:0!important}
  body.sb-noction-ref-v107 .brand-panel{height:auto!important;justify-content:flex-start!important;padding:8px!important}
  body.sb-noction-ref-v107 .brand-text{display:block!important}
  body.sb-noction-ref-v107 .brand-text strong{font-size:11px!important;color:#f1f2f3!important}
  body.sb-noction-ref-v107 .brand-text span{font-size:8px!important;color:#7b8084!important}
  body.sb-noction-ref-v107 .sidebar-search{width:auto!important;margin:8px 0!important;padding:0 9px!important;border:1px solid #343638!important;border-radius:2px!important;background:#1e2022!important}
  body.sb-noction-ref-v107 .sidebar-search input{position:static!important;width:100%!important;opacity:1!important;pointer-events:auto!important;background:transparent!important}
  body.sb-noction-ref-v107 .nav-group>small{display:block!important;color:#666b6f!important;font-size:7px!important;letter-spacing:.1em!important}
  body.sb-noction-ref-v107 .nav-link{min-height:36px!important;flex-direction:row!important;justify-content:flex-start!important;gap:8px!important;padding:5px 8px!important;border-radius:1px!important;font-size:9px!important;text-transform:none!important;text-align:left!important}
  body.sb-noction-ref-v107 .nav-link>span:last-child:not(.nav-icon){width:auto!important;max-height:none!important;font-size:9px!important;line-height:1.2!important;white-space:nowrap!important}
  body.sb-noction-ref-v107 .sidebar-footer{justify-content:flex-start!important}
  body.sb-noction-ref-v107 .sidebar-footer>div{display:block!important}
  body.sb-noction-ref-v107 .hamb{display:grid!important;border-radius:2px!important;background:#222426!important}
  body.sb-noction-ref-v107 .topbar{padding:0 9px!important}
  body.sb-noction-ref-v107 .topbar-title{display:none!important}
  body.sb-noction-ref-v107 .operator-copy,body.sb-noction-ref-v107 .enterprise-clock{display:none!important}
  body.sb-noction-ref-v107 .enterprise-nas-selector{max-width:230px!important}
  body.sb-noction-ref-v107 .nas-context-copy{display:none!important}
  body.sb-noction-ref-v107 .nas-context-select{min-width:125px!important;max-width:160px!important;border-left:0!important}
}
@media(max-width:720px){
  body.sb-noction-ref-v107 .content{padding:10px!important}
  body.sb-noction-ref-v107 .page-head{min-height:44px!important;margin-bottom:8px!important}
  body.sb-noction-ref-v107 .page-head h2{font-size:14px!important}
  body.sb-noction-ref-v107.page-index .kpi-compact{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.sb-noction-ref-v107 .top-pill,body.sb-noction-ref-v107 .operator-profile{display:none!important}
  body.sb-noction-ref-v107 .enterprise-nas-selector{max-width:190px!important}
  body.sb-noction-ref-v107 table{font-size:8px!important}
  body.sb-noction-ref-v107 table th,body.sb-noction-ref-v107 table td{white-space:nowrap!important}
}
@media(max-width:460px){body.sb-noction-ref-v107.page-index .kpi-compact{grid-template-columns:1fr!important}}