:root {
    --nmc-bg: #0f172a;
    --nmc-bg-2: #111827;
    --nmc-panel: #1e293b;
    --nmc-panel-2: #172033;
    --nmc-border: rgba(148, 163, 184, 0.18);
    --nmc-text: #f8fafc;
    --nmc-muted: #94a3b8;
    --nmc-soft: #cbd5e1;
    --nmc-blue: #38bdf8;
    --nmc-green: #22c55e;
    --nmc-amber: #f59e0b;
    --nmc-red: #ef4444;
    --nmc-purple: #8b5cf6;
    --nmc-shadow: 0 24px 80px rgba(0,0,0,0.35);
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
    margin: 0;
    font-family: "Segoe UI", Arial, sans-serif;
    background: radial-gradient(circle at top left, rgba(56,189,248,0.18), transparent 32%), var(--nmc-bg);
    color: var(--nmc-text);
}
a { color: inherit; }

/* Login */
.nmc-login-body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px;
    background:
        radial-gradient(circle at 20% 20%, rgba(56,189,248,0.26), transparent 28%),
        radial-gradient(circle at 80% 70%, rgba(139,92,246,0.22), transparent 30%),
        linear-gradient(135deg, #020617 0%, #0f172a 60%, #111827 100%);
}
.nmc-login-wrap { width: 100%; max-width: 1080px; display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 32px; align-items: center; }
.nmc-login-hero { padding: 42px; }
.nmc-login-badge { display:inline-flex; gap:8px; align-items:center; padding: 8px 12px; border:1px solid var(--nmc-border); border-radius: 999px; color: var(--nmc-soft); background: rgba(15,23,42,0.56); }
.nmc-login-hero h1 { font-size: 52px; line-height: 1.02; margin: 24px 0 14px; letter-spacing: -1.5px; }
.nmc-login-hero p { color: var(--nmc-muted); font-size: 18px; max-width: 620px; }
.nmc-login-metrics { display:grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 34px; }
.nmc-login-metric { padding:16px; background: rgba(30,41,59,0.64); border:1px solid var(--nmc-border); border-radius:16px; }
.nmc-login-metric strong { display:block; font-size:24px; }
.nmc-login-metric span { color:var(--nmc-muted); font-size:12px; }
.nmc-login-card { background: rgba(15,23,42,0.86); border:1px solid var(--nmc-border); box-shadow: var(--nmc-shadow); border-radius: 24px; padding: 34px; backdrop-filter: blur(14px); }
.nmc-login-logo { display:flex; align-items:center; gap:12px; margin-bottom: 28px; }
.nmc-logo-mark, .nmc-brand-mark { width:44px; height:44px; display:flex; align-items:center; justify-content:center; border-radius:12px; background: linear-gradient(135deg, var(--nmc-blue), var(--nmc-purple)); font-weight:800; color:#fff; box-shadow:0 12px 34px rgba(56,189,248,0.18); }
.nmc-login-card h2 { margin:0 0 6px; font-size: 26px; }
.nmc-login-card .muted { color: var(--nmc-muted); margin-bottom: 24px; }
.nmc-form-group { margin-bottom: 18px; }
.nmc-form-group label { display:block; margin-bottom:8px; color: var(--nmc-soft); font-size: 13px; font-weight:600; }
.nmc-input, input[type="text"], input[type="email"], input[type="password"], input[type="number"], select, textarea {
    width:100%; min-width: 0; padding: 12px 14px; border:1px solid var(--nmc-border); background: rgba(15,23,42,0.82); color: var(--nmc-text); border-radius: 12px; outline: none;
}
.nmc-input:focus, input:focus, select:focus, textarea:focus { border-color: rgba(56,189,248,0.8); box-shadow: 0 0 0 3px rgba(56,189,248,0.12); }
.nmc-button, button, input[type="submit"] { border:0; padding: 11px 16px; border-radius: 12px; background: linear-gradient(135deg, #0ea5e9, #2563eb); color:#fff; font-weight:700; cursor:pointer; }
.nmc-button.full { width: 100%; }
.nmc-login-links { display:flex; justify-content:space-between; align-items:center; margin-top:16px; color:var(--nmc-muted); font-size:13px; }
.nmc-error, .error { color: #fecaca; background: rgba(239,68,68,0.12); border:1px solid rgba(239,68,68,0.35); padding: 12px; border-radius: 12px; }
.nmc-success, .success { color: #bbf7d0; background: rgba(34,197,94,0.12); border:1px solid rgba(34,197,94,0.35); padding: 12px; border-radius: 12px; }

/* Shell */
.nmc-shell { display:flex; min-height:100vh; }
.nmc-sidebar { width: 282px; background: rgba(17,24,39,0.96); border-right: 1px solid var(--nmc-border); padding: 18px 14px; position: sticky; top:0; height:100vh; overflow:auto; }
.nmc-brand { display:flex; gap:12px; align-items:center; padding: 8px 8px 22px; border-bottom:1px solid var(--nmc-border); margin-bottom:18px; }
.nmc-brand-title { font-weight:800; line-height:1.1; }
.nmc-brand-subtitle { color:var(--nmc-muted); font-size:12px; margin-top:3px; }
.nmc-nav-section { color: var(--nmc-muted); text-transform: uppercase; font-size: 11px; letter-spacing: .12em; margin: 18px 12px 8px; }
.nmc-nav-item { display:flex; align-items:center; gap:10px; padding: 11px 12px; border-radius: 12px; text-decoration: none; color: var(--nmc-soft); margin-bottom: 4px; }
.nmc-nav-item:hover, .nmc-nav-item.active { background: rgba(56,189,248,0.13); color: var(--nmc-text); }
.nmc-nav-item.disabled { opacity:.42; cursor:not-allowed; }
.nmc-nav-icon { width: 20px; text-align:center; color: var(--nmc-blue); }
.nmc-main { flex:1; min-width:0; display:flex; flex-direction:column; }
.nmc-topbar { min-height: 82px; display:flex; align-items:center; justify-content:space-between; padding: 18px 28px; border-bottom: 1px solid var(--nmc-border); background: rgba(15,23,42,0.86); backdrop-filter: blur(10px); position: sticky; top:0; z-index:10; }
.nmc-topbar h1 { margin:2px 0 0; font-size:24px; letter-spacing:-.3px; }
.nmc-kicker { color:var(--nmc-muted); font-size:12px; text-transform:uppercase; letter-spacing:.12em; }
.nmc-topbar-actions { display:flex; align-items:center; gap:12px; }
.nmc-search { color:var(--nmc-muted); border:1px solid var(--nmc-border); background: rgba(30,41,59,0.58); border-radius:999px; padding:10px 16px; min-width:220px; }
.nmc-env { background: rgba(245,158,11,0.16); color:#fde68a; border:1px solid rgba(245,158,11,0.32); border-radius:999px; padding:7px 10px; font-weight:800; font-size:12px; }
.nmc-user { display:flex; align-items:center; gap:8px; color:var(--nmc-soft); }
.nmc-user-avatar { width:32px; height:32px; display:flex; align-items:center; justify-content:center; border-radius:50%; background: rgba(56,189,248,0.18); border:1px solid rgba(56,189,248,0.32); }
.nmc-logout { color: var(--nmc-muted); text-decoration:none; padding:8px 10px; }
.nmc-content { padding: 28px; flex:1; }
.nmc-footer { display:flex; gap:18px; flex-wrap:wrap; color:var(--nmc-muted); font-size:12px; padding: 18px 28px; border-top:1px solid var(--nmc-border); }

/* Components */
h2 { margin: 0 0 18px; font-size:26px; }
h3 { margin-top:0; }
.card, .nmc-card { background: rgba(30,41,59,0.72); border:1px solid var(--nmc-border); border-radius:18px; padding:20px; margin-bottom:18px; box-shadow:0 12px 34px rgba(0,0,0,0.16); }
.nmc-dashboard-grid { display:grid; grid-template-columns: repeat(4, minmax(160px, 1fr)); gap:18px; margin-bottom:22px; }
.nmc-stat-card { background: linear-gradient(180deg, rgba(30,41,59,0.9), rgba(15,23,42,0.9)); border:1px solid var(--nmc-border); border-radius:20px; padding:20px; position:relative; overflow:hidden; }
.nmc-stat-card:after { content:""; position:absolute; right:-28px; top:-28px; width:92px; height:92px; border-radius:50%; background:rgba(56,189,248,0.10); }
.nmc-stat-label { color:var(--nmc-muted); font-size:13px; }
.nmc-stat-value { font-size:34px; font-weight:800; margin-top:6px; }
.nmc-stat-note { color:var(--nmc-muted); font-size:12px; margin-top:8px; }
.nmc-command-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.nmc-command-actions { display:flex; gap:10px; flex-wrap:wrap; }
.nmc-secondary-button { background: rgba(30,41,59,0.9); border:1px solid var(--nmc-border); color:var(--nmc-text); }
.nmc-table-wrap { max-height: 68vh; overflow:auto; border:1px solid var(--nmc-border); border-radius:16px; background: rgba(30,41,59,0.64); }
table { width:100%; border-collapse: collapse; color: var(--nmc-soft); background: transparent; }
th, td { padding: 12px 14px; border-bottom:1px solid var(--nmc-border); text-align:left; }
th { position: sticky; top:0; background: #111827; color: var(--nmc-text); z-index:2; font-size:12px; text-transform:uppercase; letter-spacing:.06em; }
tr:hover td { background: rgba(56,189,248,0.06); }
.badge { display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:5px 9px; font-size:12px; font-weight:700; }
.badge.green { background:rgba(34,197,94,0.14); color:#bbf7d0; }
.badge.amber { background:rgba(245,158,11,0.14); color:#fde68a; }
.badge.red { background:rgba(239,68,68,0.14); color:#fecaca; }
.muted { color:var(--nmc-muted); }

@media (max-width: 960px) {
    .nmc-login-wrap { grid-template-columns: 1fr; }
    .nmc-login-hero { padding: 8px; }
    .nmc-sidebar { display:none; }
    .nmc-topbar { flex-direction:column; align-items:flex-start; gap:14px; }
    .nmc-dashboard-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
    .nmc-dashboard-grid, .nmc-login-metrics { grid-template-columns: 1fr; }
    .nmc-login-hero h1 { font-size: 34px; }
    .nmc-content { padding: 16px; }
}

/* Update 013a - NOC/SOC readability improvements */
:root {
    --nmc-table-bg: #0b1220;
    --nmc-table-row: #111827;
    --nmc-table-row-alt: #162033;
    --nmc-table-row-hover: #243244;
    --nmc-table-row-selected: #0f3b57;
    --nmc-table-header: #020617;
    --nmc-table-text: #f8fafc;
    --nmc-table-muted: #dbeafe;
    --nmc-input-bg: #0b1220;
    --nmc-input-border: #64748b;
    --nmc-modal-bg: #0b1220;
    --nmc-modal-header: #020617;
}

/* Tables: higher contrast, more readable for long NOC/SOC sessions */
.nmc-table-wrap,
.table-wrap,
.table-container {
    background: var(--nmc-table-bg);
    border-color: rgba(148, 163, 184, 0.38);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03), 0 20px 50px rgba(0,0,0,0.20);
}

table,
.nmc-table {
    color: var(--nmc-table-text);
    background: var(--nmc-table-bg);
    font-size: 14px;
}

th,
.nmc-table th {
    background: var(--nmc-table-header);
    color: #ffffff;
    border-bottom: 1px solid rgba(148, 163, 184, 0.55);
    font-weight: 800;
    letter-spacing: .075em;
}

td,
.nmc-table td {
    color: #eef2ff;
    border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}

tbody tr,
.nmc-table tbody tr {
    background: var(--nmc-table-row);
}

tbody tr:nth-child(even),
.nmc-table tbody tr:nth-child(even) {
    background: var(--nmc-table-row-alt);
}

tbody tr:hover td,
.nmc-table tbody tr:hover td,
tr:hover td {
    background: var(--nmc-table-row-hover) !important;
    color: #ffffff;
}

tr.selected td,
tr.is-selected td,
.nmc-selected td,
.nmc-table tr.selected td,
.nmc-table tr.is-selected td {
    background: var(--nmc-table-row-selected) !important;
    color: #ffffff;
    box-shadow: inset 3px 0 0 var(--nmc-blue);
}

.nmc-table a,
table a {
    color: #7dd3fc;
    font-weight: 700;
}

/* Command/search areas */
.nmc-command-bar,
.command-bar {
    background: rgba(15, 23, 42, 0.52);
    border: 1px solid rgba(148, 163, 184, 0.20);
    border-radius: 16px;
    padding: 12px;
}

/* Forms: improve contrast in modals and settings pages */
.nmc-input,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="url"],
select,
textarea {
    background: var(--nmc-input-bg);
    color: #ffffff;
    border: 1px solid var(--nmc-input-border);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}

.nmc-input::placeholder,
input::placeholder,
textarea::placeholder {
    color: #94a3b8;
}

label,
.nmc-form-group label {
    color: #e2e8f0;
    font-weight: 700;
}

select option {
    background: #0b1220;
    color: #ffffff;
}

/* Modals / popups: readable dark panels */
.nmc-modal,
.modal,
.popup,
.popup-box,
dialog,
.nmc-modal-content,
.modal-content {
    background: var(--nmc-modal-bg) !important;
    color: #f8fafc !important;
    border: 1px solid rgba(148, 163, 184, 0.48) !important;
    box-shadow: 0 32px 90px rgba(0,0,0,0.62) !important;
}

.nmc-modal-header,
.modal-header,
.popup-header {
    background: var(--nmc-modal-header) !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.36) !important;
}

.nmc-modal-body,
.modal-body,
.popup-body {
    color: #e5e7eb !important;
}

.nmc-modal-footer,
.modal-footer,
.popup-footer {
    background: rgba(15,23,42,0.92) !important;
    border-top: 1px solid rgba(148, 163, 184, 0.30) !important;
}

/* Browser alert-style custom boxes and generic panels */
.nmc-card,
.card,
.panel,
.box {
    color: #f8fafc;
    border-color: rgba(148, 163, 184, 0.30);
}

/* Status badges: keep colours vivid but readable */
.badge.green,
.nmc-badge.green,
.status-active {
    background: rgba(34,197,94,0.22) !important;
    color: #dcfce7 !important;
    border: 1px solid rgba(34,197,94,0.40);
}

.badge.amber,
.nmc-badge.amber,
.status-pending,
.status-warning {
    background: rgba(245,158,11,0.24) !important;
    color: #fffbeb !important;
    border: 1px solid rgba(245,158,11,0.42);
}

.badge.red,
.nmc-badge.red,
.status-disabled,
.status-critical {
    background: rgba(239,68,68,0.24) !important;
    color: #fee2e2 !important;
    border: 1px solid rgba(239,68,68,0.42);
}

/* Buttons: stronger text contrast */
.nmc-secondary-button,
button.nmc-secondary-button,
.secondary,
.btn-secondary {
    background: #1f2937 !important;
    color: #ffffff !important;
    border: 1px solid rgba(148, 163, 184, 0.42) !important;
}

button:hover,
.nmc-button:hover,
.nmc-secondary-button:hover,
input[type="submit"]:hover {
    filter: brightness(1.08);
}

/* Utility classes for future screens */
.nmc-readable-text { color: #f8fafc !important; }
.nmc-readable-muted { color: #cbd5e1 !important; }
.nmc-scroll-table { max-height: 68vh; overflow: auto; }

/* Update 015d: force in-tab modal overlay behaviour for management editors */
.nmc-modal-backdrop,
.modal-backdrop,
.nmc-overlay {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 99999 !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 28px !important;
    background: rgba(2, 6, 23, 0.78) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    overflow: auto !important;
}

.nmc-modal-backdrop[style*="display: flex"],
.nmc-modal-backdrop.is-open,
.modal-backdrop[style*="display: flex"],
.modal-backdrop.is-open {
    display: flex !important;
}

.nmc-modal-backdrop[style*="display:none"],
.nmc-modal-backdrop[style*="display: none"],
.modal-backdrop[style*="display:none"],
.modal-backdrop[style*="display: none"] {
    display: none !important;
}

.nmc-modal-backdrop > .nmc-modal,
.modal-backdrop > .modal,
#tenantModal > .nmc-modal {
    position: relative !important;
    width: min(980px, calc(100vw - 56px)) !important;
    max-width: 980px !important;
    max-height: calc(100vh - 56px) !important;
    overflow: auto !important;
    margin: auto !important;
    border-radius: 20px !important;
}

#tenantModal .nmc-modal-large {
    width: min(1080px, calc(100vw - 56px)) !important;
    max-width: 1080px !important;
}

body.nmc-modal-open {
    overflow: hidden !important;
}
