:root {
    --m4b-bg: #f4f6f8;
    --m4b-border: rgba(15, 23, 42, 0.09);
}

body {
    background: var(--m4b-bg);
    color: #172033;
}

.card {
    border: 1px solid var(--m4b-border);
    border-radius: 0.85rem;
    box-shadow: 0 0.25rem 1.25rem rgba(15, 23, 42, 0.04);
}

.metric-card .card-body {
    padding: 1.35rem;
}

.metric-label {
    color: #6c757d;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.metric-value {
    font-size: 1.65rem;
    font-weight: 700;
    margin-top: 0.5rem;
}

.metric-detail {
    color: #6c757d;
    font-size: 0.9rem;
    margin-top: 0.2rem;
}

.system-row {
    align-items: center;
    border-bottom: 1px solid var(--m4b-border);
    display: flex;
    justify-content: space-between;
    padding: 0.75rem 0;
}

.status-dot {
    border-radius: 50%;
    display: inline-block;
    height: 0.7rem;
    width: 0.7rem;
}

.status-loading { background: #ffc107; }
.status-ok { background: #198754; box-shadow: 0 0 0 0.22rem rgba(25, 135, 84, 0.13); }
.status-error { background: #dc3545; box-shadow: 0 0 0 0.22rem rgba(220, 53, 69, 0.13); }

.table > :not(caption) > * > * { padding: 0.85rem 1rem; }
.table thead th { color: #6c757d; font-size: 0.78rem; letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; }
.event-item { padding: 1rem 1.25rem; }
.event-dot { border-radius: 50%; flex: 0 0 auto; height: .65rem; margin-top: .35rem; width: .65rem; }
.action-row { align-items: center; border-bottom: 1px solid var(--m4b-border); display: flex; gap: .8rem; padding: .8rem 0; }
.action-row:last-child { border-bottom: 0; }
.action-row strong { font-size: 1.3rem; min-width: 2rem; }

.device-link { color: inherit; text-decoration: none; }
.device-link:hover { text-decoration: underline; }
.back-link { display: inline-block; margin-bottom: .5rem; color: var(--muted); text-decoration: none; }
.detail-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap: 1rem; }
.detail-list { display: grid; grid-template-columns: minmax(120px, .8fr) 1.4fr; gap: .7rem 1rem; margin: 0; }
.detail-list dt { color: var(--muted); }
.detail-list dd { margin: 0; overflow-wrap: anywhere; }

.history-error {
    max-width: 28rem;
    overflow-wrap: anywhere;
}

@media (max-width: 767.98px) {
    .detail-list {
        grid-template-columns: 1fr;
        gap: .2rem;
    }
    .detail-list dd {
        margin-bottom: .65rem;
    }
}

/* Dashboard 2.0 – NOC Foundation */
.dashboard-kicker{color:#b42318;font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.dashboard-live{align-items:center;background:#fff;border:1px solid var(--m4b-border);border-radius:999px;color:#667085;display:flex;font-size:.84rem;gap:.6rem;padding:.55rem .85rem}.noc-metric{overflow:hidden;position:relative}.noc-metric:before{content:"";inset:0 auto 0 0;position:absolute;width:4px}.metric-success:before{background:#198754}.metric-warning:before{background:#e6a700}.metric-danger:before{background:#dc3545}.metric-secondary:before{background:#6c757d}.metric-icon{align-items:center;background:#f4f6f8;border-radius:.8rem;display:flex;font-size:1.4rem;height:2.8rem;justify-content:center;width:2.8rem}.metric-success .metric-icon{background:#e9f7ef;color:#198754}.metric-warning .metric-icon{background:#fff7db;color:#a36f00}.metric-danger .metric-icon{background:#fdecec;color:#dc3545}.compact-metric .card-body{padding:1rem 1.15rem}.compact-icon{align-items:center;background:#eef2f6;border-radius:.75rem;color:#344054;display:flex;font-size:1.2rem;height:2.6rem;justify-content:center;width:2.6rem}.compact-value{font-size:1.35rem;font-weight:800;margin-top:.1rem}#dashboard-map{height:430px;min-height:360px}.dashboard-map-marker-wrap{background:transparent;border:0}.dashboard-map-marker{align-items:center;background:var(--marker);border:3px solid #fff;border-radius:50%;box-shadow:0 4px 12px rgba(16,24,40,.28);color:#fff;display:flex;font-size:.78rem;font-weight:800;height:38px;justify-content:center;width:38px}.dashboard-scroll{max-height:486px;overflow:auto}.problem-item{padding:1rem 1.15rem}.dashboard-device-table .device-row{cursor:pointer}.dashboard-device-table .device-row:hover{background:#f8fafc}.monitor-mini{border-radius:5px;font-size:.68rem;font-weight:800;padding:.2rem .38rem}.monitor-mini.icmp{background:#eaf3ff;color:#1764b0}.monitor-mini.ssh{background:#f0ecff;color:#6441a5}.latency-pill{background:#edf8f1;border-radius:6px;color:#15713c;font-size:.75rem;font-weight:700;padding:.22rem .45rem}.overview-row{align-items:center;border-bottom:1px solid var(--m4b-border);display:flex;justify-content:space-between;padding:.8rem 0}.overview-row:last-child{border-bottom:0}.dashboard-events{max-height:230px;overflow:auto}.quick-actions{display:grid;gap:.75rem;grid-template-columns:repeat(2,1fr)}.quick-actions a{align-items:center;background:#f8fafc;border:1px solid var(--m4b-border);border-radius:.75rem;color:#344054;display:flex;flex-direction:column;font-weight:700;gap:.45rem;padding:1rem;text-decoration:none}.quick-actions a:hover{background:#eef2f6;color:#101828}.quick-actions i{font-size:1.35rem}@media(max-width:767.98px){#dashboard-map{height:340px}.dashboard-device-table th:nth-child(3),.dashboard-device-table td:nth-child(3),.dashboard-device-table th:nth-child(5),.dashboard-device-table td:nth-child(5){display:none}.dashboard-live{display:none}}

/* M4B NOC Navigation Foundation 0.6.0 */
:root {
    --m4b-red: #cf2e2e;
    --m4b-red-dark: #a91f1f;
    --m4b-nav: #10151d;
    --m4b-nav-muted: #9ca8b7;
}

.m4b-navbar {
    background: linear-gradient(90deg, #0d1117 0%, #151c26 100%);
    min-height: 72px;
}

.m4b-brand {
    align-items: center;
    display: flex;
    gap: .7rem;
    margin-right: 1.6rem;
    min-width: 310px;
    padding: .35rem 0;
}

.m4b-brand-icon {
    align-items: center;
    background: var(--m4b-red);
    border-radius: .7rem;
    color: #fff;
    display: inline-flex;
    font-size: 1.2rem;
    height: 2.55rem;
    justify-content: center;
    width: 2.55rem;
}

.m4b-brand-copy { display: flex; flex-direction: column; line-height: 1.12; }
.m4b-brand-copy strong { color: #fff; font-size: .97rem; letter-spacing: .01em; }
.m4b-brand-copy small { color: var(--m4b-nav-muted); font-size: .67rem; margin-top: .25rem; }

.m4b-main-nav { align-items: center; gap: .12rem; }
.m4b-main-nav .nav-link {
    align-items: center;
    border-radius: .55rem;
    color: #c3ccd8;
    display: flex;
    font-size: .9rem;
    font-weight: 600;
    gap: .42rem;
    padding: .62rem .76rem !important;
}
.m4b-main-nav .nav-link:hover { background: rgba(255,255,255,.07); color: #fff; }
.m4b-main-nav .nav-link.active { background: rgba(207,46,46,.18); color: #fff; }
.m4b-main-nav .nav-link.active i { color: #ff6b6b; }

.m4b-dropdown {
    border: 1px solid rgba(15,23,42,.1);
    border-radius: .85rem;
    box-shadow: 0 1rem 2.5rem rgba(15,23,42,.18);
    min-width: 235px;
    padding: .5rem;
}
.m4b-dropdown .dropdown-header { color: #98a2b3; font-size: .69rem; font-weight: 800; letter-spacing: .08em; padding: .55rem .7rem .35rem; text-transform: uppercase; }
.m4b-dropdown .dropdown-item {
    align-items: center;
    border-radius: .55rem;
    color: #344054;
    display: flex;
    font-size: .9rem;
    font-weight: 600;
    gap: .65rem;
    padding: .62rem .7rem;
}
.m4b-dropdown .dropdown-item i { color: #667085; font-size: 1rem; width: 1.15rem; }
.m4b-dropdown .dropdown-item:hover { background: #f2f4f7; color: #101828; }
.m4b-settings-menu { min-width: 270px; }
.m4b-terminal-link { color: #8a4b00 !important; }

.m4b-nav-meta { align-items: center; display: flex; gap: .7rem; margin-left: .8rem; }
.m4b-system-pill {
    align-items: center;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 999px;
    color: #d0d5dd;
    display: flex;
    font-size: .8rem;
    gap: .45rem;
    padding: .42rem .65rem;
    text-decoration: none;
}
.m4b-system-pill:hover { background: rgba(255,255,255,.12); color: #fff; }
.m4b-version { color: #8d99a8; font-size: .73rem; white-space: nowrap; }
.m4b-page { max-width: 1920px; }

@media (max-width: 1199.98px) {
    .m4b-navbar { min-height: 64px; }
    .m4b-brand { min-width: 0; }
    .m4b-main-nav { align-items: stretch; gap: .2rem; padding: .8rem 0; }
    .m4b-main-nav .nav-link { justify-content: flex-start; }
    .m4b-dropdown { border: 0; box-shadow: none; margin-left: 1.1rem; min-width: auto; }
    .m4b-nav-meta { border-top: 1px solid rgba(255,255,255,.08); margin: .25rem 0 0; padding: .85rem 0 .3rem; }
}

@media (max-width: 575.98px) {
    .m4b-brand-copy strong { font-size: .84rem; }
    .m4b-brand-copy small { display: none; }
    .m4b-brand-icon { height: 2.2rem; width: 2.2rem; }
}

/* M4B NOC Dark Workspace 0.6.0-alpha.2 */
:root{--noc-bg:#080d14;--noc-panel:#101721;--noc-panel-2:#151e2a;--noc-border:#243041;--noc-text:#e8edf5;--noc-muted:#8d9aaa;--noc-red:#e33b3b;--noc-sidebar:250px;--noc-topbar:72px}html,body{min-height:100%}body.m4b-noc-body{background:var(--noc-bg);color:var(--noc-text);overflow-x:hidden}.m4b-shell{display:flex;min-height:100vh}.m4b-sidebar{background:linear-gradient(180deg,#0c121b 0%,#0a1018 100%);border-right:1px solid var(--noc-border);display:flex;flex:0 0 var(--noc-sidebar);flex-direction:column;height:100vh;left:0;position:fixed;top:0;width:var(--noc-sidebar);z-index:1040}.m4b-sidebar-brand{align-items:center;border-bottom:1px solid var(--noc-border);color:#fff;display:flex;gap:.75rem;height:var(--noc-topbar);padding:0 1.15rem;text-decoration:none}.m4b-brand-mark{align-items:center;background:linear-gradient(135deg,#ef4444,#b91c1c);border-radius:.7rem;box-shadow:0 6px 18px rgba(227,59,59,.25);display:flex;font-size:1.15rem;height:2.5rem;justify-content:center;width:2.5rem}.m4b-sidebar-brand strong,.m4b-sidebar-brand small{display:block}.m4b-sidebar-brand strong{font-size:.96rem}.m4b-sidebar-brand small{color:var(--noc-muted);font-size:.73rem;margin-top:.1rem}.m4b-side-nav{flex:1;overflow-y:auto;padding:1rem .75rem}.m4b-nav-label{color:#596677;font-size:.65rem;font-weight:800;letter-spacing:.12em;margin:1.25rem .7rem .45rem;text-transform:uppercase}.m4b-side-link{align-items:center;background:transparent;border:0;border-radius:.58rem;color:#9ba7b7;display:flex;font-size:.88rem;font-weight:650;gap:.7rem;margin:.15rem 0;padding:.68rem .75rem;text-align:left;text-decoration:none;width:100%}.m4b-side-link>i:first-child{font-size:1.02rem;width:1.2rem}.m4b-side-link:hover{background:#151e29;color:#fff}.m4b-side-link.active{background:linear-gradient(90deg,rgba(227,59,59,.22),rgba(227,59,59,.06));box-shadow:inset 3px 0 var(--noc-red);color:#fff}.m4b-side-link.active>i:first-child{color:#ff6565}.m4b-side-toggle[aria-expanded=true] .toggle-chevron{transform:rotate(180deg)}.toggle-chevron{font-size:.75rem;transition:transform .2s}.m4b-subnav{border-left:1px solid #2b3747;margin:.15rem 0 .3rem 1.35rem;padding:.2rem 0 .2rem .7rem}.m4b-subnav a{border-radius:.45rem;color:#8996a6;display:flex;font-size:.82rem;justify-content:space-between;margin:.08rem 0;padding:.48rem .65rem;text-decoration:none}.m4b-subnav a:hover,.m4b-subnav a.active{background:#151e29;color:#fff}.m4b-admin-badge{background:#3c2d12;border-radius:.25rem;color:#f8c76a;font-size:.58rem;padding:.12rem .3rem}.m4b-sidebar-footer{border-top:1px solid var(--noc-border);padding:1rem}.m4b-sidebar-footer a{align-items:center;color:#b7c1ce;display:flex;font-size:.78rem;gap:.5rem;text-decoration:none}.m4b-sidebar-footer small{color:#566273;display:block;font-size:.68rem;margin:.45rem 0 0 1.2rem}.m4b-workspace{margin-left:var(--noc-sidebar);min-width:0;width:calc(100% - var(--noc-sidebar))}.m4b-topbar{align-items:center;background:rgba(12,18,27,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--noc-border);display:flex;height:var(--noc-topbar);justify-content:space-between;padding:0 1.5rem;position:sticky;top:0;z-index:1030}.m4b-global-search{align-items:center;background:#111924;border:1px solid #2a3646;border-radius:.65rem;color:#7f8c9d;display:flex;font-size:.84rem;gap:.65rem;max-width:600px;padding:.65rem .8rem;text-align:left;width:min(48vw,600px)}.m4b-global-search:hover{border-color:#41516a;color:#c4ccd7}.m4b-global-search span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.m4b-global-search kbd{background:#202b39;border:1px solid #344154;color:#aab4c1;margin-left:auto}.m4b-top-actions{align-items:center;display:flex;gap:.55rem}.m4b-icon-button{align-items:center;background:#121a25;border:1px solid #263244;border-radius:.55rem;color:#9da9b8;display:flex;height:2.45rem;justify-content:center;position:relative;text-decoration:none;width:2.45rem}.m4b-icon-button:hover{background:#1a2431;color:#fff}.m4b-notification-dot{background:#ef4444;border:2px solid #0e151f;border-radius:50%;height:.55rem;position:absolute;right:.35rem;top:.35rem;width:.55rem}.m4b-user-chip{align-items:center;border-left:1px solid var(--noc-border);display:flex;gap:.6rem;margin-left:.25rem;padding-left:.8rem}.m4b-user-chip strong,.m4b-user-chip small{display:block}.m4b-user-chip strong{font-size:.78rem}.m4b-user-chip small{color:var(--noc-muted);font-size:.67rem}.m4b-avatar{align-items:center;background:linear-gradient(135deg,#3b4759,#202a38);border:1px solid #455268;border-radius:50%;display:flex;font-size:.65rem;font-weight:800;height:2.4rem;justify-content:center;width:2.4rem}.m4b-mobile-menu{background:transparent;border:0;color:#fff;display:none;font-size:1.5rem}.m4b-content{max-width:1900px;padding:1.5rem 1.7rem 2.5rem;width:100%}
.m4b-noc-body .card{background:var(--noc-panel);border-color:var(--noc-border);box-shadow:0 .5rem 1.8rem rgba(0,0,0,.16);color:var(--noc-text)}.m4b-noc-body .card-header,.m4b-noc-body .card-header.bg-white{background:#111923!important;border-color:var(--noc-border);color:var(--noc-text)}.m4b-noc-body .text-secondary{color:var(--noc-muted)!important}.m4b-noc-body .table{--bs-table-bg:transparent;--bs-table-color:#d9e0ea;--bs-table-border-color:var(--noc-border);--bs-table-hover-bg:#16202c;--bs-table-hover-color:#fff}.m4b-noc-body .dashboard-device-table .device-row:hover{background:#16202c}.m4b-noc-body .list-group-item{background:var(--noc-panel);border-color:var(--noc-border);color:var(--noc-text)}.m4b-noc-body .list-group-item-action:hover{background:#16202c;color:#fff}.m4b-noc-body .dashboard-live{background:#111923;border-color:var(--noc-border);color:var(--noc-muted)}.m4b-noc-body .compact-icon,.m4b-noc-body .metric-icon{background:#182331}.m4b-noc-body .quick-actions a{background:#131c27;border-color:var(--noc-border);color:#bbc5d2}.m4b-noc-body .quick-actions a:hover{background:#1a2634;color:#fff}.m4b-noc-body .overview-row,.m4b-noc-body .system-row{border-color:var(--noc-border)}.m4b-noc-body .btn-dark{background:#e23b3b;border-color:#e23b3b}.m4b-noc-body .btn-dark:hover{background:#c92d2d;border-color:#c92d2d}.m4b-noc-body .btn-outline-primary{--bs-btn-color:#6ea8fe;--bs-btn-border-color:#375b89;--bs-btn-hover-bg:#24476f}.m4b-noc-body .btn-outline-secondary{--bs-btn-color:#a8b2c0;--bs-btn-border-color:#3b485b;--bs-btn-hover-bg:#263244}.m4b-noc-body #dashboard-map{background:#0e151e}.m4b-noc-body .leaflet-control-zoom a{background:#121b26;color:#d7deea;border-color:#2d3a4c}.m4b-noc-body .leaflet-popup-content-wrapper,.m4b-noc-body .leaflet-popup-tip{background:#121b26;color:#e8edf5}.m4b-noc-body .leaflet-popup-content a{color:#73a7ff}.m4b-noc-body .dashboard-kicker{color:#ff5d5d}.m4b-noc-body .metric-success .metric-icon{background:rgba(25,135,84,.16)}.m4b-noc-body .metric-warning .metric-icon{background:rgba(230,167,0,.16)}.m4b-noc-body .metric-danger .metric-icon{background:rgba(220,53,69,.16)}.m4b-noc-body .metric-secondary .metric-icon{background:rgba(108,117,125,.16)}.m4b-noc-body .latency-pill{background:rgba(25,135,84,.15);color:#6ee7a0}.m4b-noc-body .monitor-mini.icmp{background:rgba(13,110,253,.16);color:#79adff}.m4b-noc-body .monitor-mini.ssh{background:rgba(111,66,193,.18);color:#bd9cff}
.command-dialog{max-width:680px}.command-palette{background:#101721;border:1px solid #344154;border-radius:.9rem;box-shadow:0 2rem 5rem rgba(0,0,0,.48);overflow:hidden}.command-search-row{align-items:center;border-bottom:1px solid var(--noc-border);display:flex;gap:.8rem;padding:1rem 1.1rem}.command-search-row>i{color:#7f8c9d;font-size:1.1rem}.command-search-row input{background:transparent;border:0;color:#fff;flex:1;font-size:1rem;outline:0}.command-search-row input::placeholder{color:#697688}.command-search-row kbd,.command-footer kbd{background:#202b39;border:1px solid #344154;color:#aab4c1}.command-results{max-height:430px;overflow:auto;padding:.55rem}.command-item{align-items:center;background:transparent;border:0;border-radius:.58rem;color:#bbc5d2;display:flex;gap:.75rem;padding:.72rem .75rem;text-align:left;width:100%}.command-item:hover,.command-item.selected{background:#1a2634;color:#fff}.command-item strong,.command-item small{display:block}.command-item strong{font-size:.88rem}.command-item small{color:#7f8c9d;font-size:.74rem;margin-top:.12rem}.command-icon{align-items:center;background:#222e3d;border-radius:.5rem;color:#c5cfdb;display:flex;height:2.15rem;justify-content:center;width:2.15rem}.command-item>i:last-child{color:#536174}.command-empty{color:#738094;padding:2.5rem;text-align:center}.command-footer{border-top:1px solid var(--noc-border);color:#697688;display:flex;font-size:.7rem;gap:1rem;justify-content:flex-end;padding:.55rem .8rem}.command-footer span{align-items:center;display:flex;gap:.25rem}
@media(max-width:991.98px){.m4b-sidebar{box-shadow:1rem 0 3rem rgba(0,0,0,.45);transform:translateX(-105%);transition:transform .22s ease}.m4b-sidebar.open{transform:translateX(0)}.m4b-workspace{margin-left:0;width:100%}.m4b-mobile-menu{display:block}.m4b-topbar{gap:.75rem;padding:0 .85rem}.m4b-global-search{flex:1;width:auto}.m4b-global-search span{display:none}.m4b-content{padding:1rem}.m4b-user-chip{display:none}}@media(max-width:575.98px){.m4b-global-search kbd{display:none}.m4b-top-actions .m4b-icon-button:first-child{display:none}.m4b-content{padding:.85rem}}

/* Authentication and user management */
.m4b-login-body{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 15% 20%,rgba(13,110,253,.18),transparent 32%),radial-gradient(circle at 85% 75%,rgba(111,66,193,.16),transparent 34%),#07101f;color:#e8eef8}.m4b-login-card{width:min(100%,460px);padding:38px;border:1px solid rgba(148,163,184,.18);border-radius:24px;background:rgba(13,24,43,.92);box-shadow:0 28px 80px rgba(0,0,0,.42);backdrop-filter:blur(16px)}.m4b-login-brand{display:flex;align-items:center;gap:14px;margin-bottom:34px}.m4b-login-brand strong,.m4b-login-brand small{display:block}.m4b-login-brand small{color:#8da2c0;font-size:.72rem;text-transform:uppercase;letter-spacing:.12em}.m4b-login-card h1{font-size:2rem;font-weight:750}.m4b-login-card .form-control{background:#0a1628;border-color:#263750;color:#eef5ff}.m4b-login-footer{text-align:center;color:#70839f;font-size:.78rem;margin-top:28px}.m4b-user-chip{display:flex;align-items:center;gap:10px;background:transparent;color:inherit;text-align:left;padding:5px 8px;border-radius:12px}.m4b-user-chip:hover{background:rgba(255,255,255,.05)}.m4b-user-chip strong,.m4b-user-chip small{display:block;line-height:1.2}.m4b-user-chip small{color:#8395ad;font-size:.72rem}.m4b-panel{background:rgba(13,24,43,.86);border-color:rgba(148,163,184,.14)}
