:root {
    --nr-bg: #040b12;
    --nr-surface: #091521;
    --nr-surface-2: #0d1c2b;
    --nr-line: rgba(130, 197, 255, .13);
    --nr-text: #edf8ff;
    --nr-muted: #8ea5b8;
    --nr-cyan: #20d8f6;
    --nr-green: #76ff45;
    --nr-danger: #ff5f76;
    --nr-radius: 22px;
    --nr-shadow: 0 24px 70px rgba(0, 0, 0, .3);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.nr-app {
    min-height: 100vh;
    margin: 0;
    color: var(--nr-text);
    background:
        radial-gradient(circle at 8% 0, rgba(32, 216, 246, .11), transparent 24rem),
        radial-gradient(circle at 92% 10%, rgba(118, 255, 69, .06), transparent 22rem),
        linear-gradient(155deg, #06111b 0%, var(--nr-bg) 56%, #03080d 100%);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a { color: var(--nr-cyan); }
.nr-gradient { background: linear-gradient(90deg, var(--nr-cyan), var(--nr-green)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nr-muted, .text-secondary, .text-muted { color: var(--nr-muted) !important; }
.nr-logo { width: auto; height: 44px; object-fit: contain; }
.nr-logo-large { width: min(100%, 340px); height: auto; object-fit: contain; }

.nr-sidebar {
    width: 276px;
    min-height: 100vh;
    padding: 22px 16px;
    position: sticky;
    top: 0;
    background: rgba(5, 13, 21, .91);
    border-right: 1px solid var(--nr-line);
    backdrop-filter: blur(18px);
}
.nr-sidebar-label { margin: 22px 12px 8px; color: #668096; font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.nr-sidebar .nav-link {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 3px 0;
    padding: 11px 13px;
    color: #a9bdcd;
    border: 1px solid transparent;
    border-radius: 13px;
    font-weight: 650;
    transition: .18s ease;
}
.nr-sidebar .nav-link i { width: 21px; color: #6f8799; font-size: 1.05rem; }
.nr-sidebar .nav-link:hover, .nr-sidebar .nav-link.active {
    color: #fff;
    background: linear-gradient(90deg, rgba(32, 216, 246, .13), rgba(118, 255, 69, .055));
    border-color: rgba(32, 216, 246, .12);
    transform: translateX(2px);
}
.nr-sidebar .nav-link.active i { color: var(--nr-cyan); }
.nr-account { padding: 14px; border: 1px solid var(--nr-line); border-radius: 17px; background: rgba(255,255,255,.025); }
.nr-avatar { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #041017; background: linear-gradient(135deg, var(--nr-cyan), var(--nr-green)); font-weight: 900; }

.nr-main { min-width: 0; padding: 22px clamp(16px, 3vw, 38px) 42px; }
.nr-topbar {
    min-height: 80px;
    margin-bottom: 22px;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid var(--nr-line);
    border-radius: var(--nr-radius);
    background: rgba(8, 20, 31, .72);
    backdrop-filter: blur(14px);
}
.nr-page-title { margin: 0; font-size: clamp(1.45rem, 3vw, 2rem); font-weight: 850; letter-spacing: -.025em; }
.nr-page-kicker { margin-top: 3px; color: var(--nr-muted); font-size: .88rem; }

.card, .modal-content, .nr-panel {
    color: var(--nr-text);
    background: linear-gradient(155deg, rgba(13, 29, 43, .94), rgba(7, 17, 27, .97));
    border: 1px solid var(--nr-line);
    border-radius: var(--nr-radius);
    box-shadow: var(--nr-shadow);
}
.card-header, .card-footer { padding: 17px 20px; background: rgba(255,255,255,.018); border-color: var(--nr-line); }
.card-body { padding: 20px; }
.nr-stat { position: relative; overflow: hidden; }
.nr-stat::after { content: ""; position: absolute; width: 110px; height: 110px; right: -42px; top: -48px; border-radius: 50%; background: rgba(32,216,246,.08); }
.nr-stat-icon, .stat-icon { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 15px; color: var(--nr-cyan); background: rgba(32,216,246,.09); border: 1px solid rgba(32,216,246,.12); font-size: 1.25rem; }

.btn { border-radius: 12px; font-weight: 750; }
.btn-nr { color: #031017; border: 0; background: linear-gradient(90deg, var(--nr-cyan), var(--nr-green)); box-shadow: 0 10px 28px rgba(32,216,246,.12); }
.btn-nr:hover, .btn-nr:focus { color: #031017; filter: brightness(1.08); transform: translateY(-1px); }
.btn-outline-nr { color: #eaf7ff; border: 1px solid rgba(117, 188, 241, .25); background: rgba(255,255,255,.018); }
.btn-outline-nr:hover { color: #fff; border-color: rgba(32,216,246,.5); background: rgba(32,216,246,.07); }

.form-label { margin-bottom: 7px; color: #dbeaf5; font-weight: 650; }
.form-control, .form-select {
    min-height: 48px;
    color: var(--nr-text);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px;
    background-color: rgba(255,255,255,.035);
}
.form-control:focus, .form-select:focus { color: #fff; border-color: var(--nr-cyan); background-color: rgba(255,255,255,.05); box-shadow: 0 0 0 .22rem rgba(32,216,246,.11); }
.form-control::placeholder { color: #61788b; }
.form-select option { color: #edf8ff; background: #0a1723; }
.form-check-input:checked { border-color: var(--nr-cyan); background-color: var(--nr-cyan); }

.table { --bs-table-bg: transparent; --bs-table-color: var(--nr-text); --bs-table-hover-color: #fff; --bs-table-hover-bg: rgba(32,216,246,.035); --bs-table-border-color: rgba(255,255,255,.065); }
.table thead th { padding: 14px 18px; color: #7890a4; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.table tbody td { padding: 16px 18px; }
.badge { padding: .48em .72em; border-radius: 9px; }
.badge-soft { color: #c9ffb0; border: 1px solid rgba(118,255,69,.2); background: rgba(118,255,69,.07); }
.alert { border: 1px solid currentColor; border-radius: 15px; background: rgba(255,255,255,.035); }
.alert pre { color: inherit; background: transparent !important; border: 0 !important; white-space: pre-wrap; }
.progress { background: rgba(255,255,255,.07); border-radius: 99px; }
.progress-bar { background: linear-gradient(90deg, var(--nr-cyan), #4ca8ff); }
pre { max-height: 480px; overflow: auto; padding: 16px; color: #bcecff; border: 1px solid var(--nr-line); border-radius: 14px; background: #02070c !important; }

.nr-empty { padding: 52px 24px; text-align: center; color: var(--nr-muted); }
.nr-empty i { display: block; margin-bottom: 12px; color: #526b7f; font-size: 2.4rem; }
.pagination { --bs-pagination-bg: rgba(255,255,255,.025); --bs-pagination-border-color: var(--nr-line); --bs-pagination-color: #c8d8e4; --bs-pagination-hover-bg: rgba(32,216,246,.08); --bs-pagination-hover-color: #fff; --bs-pagination-active-bg: var(--nr-cyan); --bs-pagination-active-border-color: var(--nr-cyan); }

@media (max-width: 991.98px) {
    .nr-main { padding: 14px 14px 32px; }
    .nr-topbar { min-height: 68px; border-radius: 17px; }
    .card, .nr-panel { border-radius: 18px; }
    .offcanvas { background: #06111b; }
}

@media (max-width: 575.98px) {
    .nr-topbar { align-items: flex-start; }
    .nr-topbar .btn .nr-button-label { display: none; }
    .table tbody td, .table thead th { padding-left: 13px; padding-right: 13px; }
}
