/* ===================================
   NISEA DEBUG LAYOUT (khusus developer)
   -----------------------------------
   Mewarnai tiap lapisan layout (shell Dasbor + halaman modul di iframe)
   dgn warna kontras yg sengaja "tabrakan", supaya batas tiap container,
   jarak (margin) & padding kelihatan jelas -- dipakai saat merapikan
   spacing utk layar kecil. Tiap layer anak punya warna beda dari induknya,
   jadi strip warna induk yg nongol di sekitar anak = padding induk.

   Hanya aktif kalau <html> punya class .ns-debug-layout -- di-set oleh
   script di include/header.php dari localStorage 'nsDebugLayout', di-toggle
   lewat tombol topbar Dasbor (cuma dirender utk role developer, lihat
   dasbor.php + dasbor.js). Tanpa class itu file ini no-op.
=================================== */

/* ---------- shell Dasbor ---------- */

html.ns-debug-layout .main-header                  { background:#ff1744 !important; }
html.ns-debug-layout .app-topbar-inner             { outline:1px dashed #000; outline-offset:-1px; }
html.ns-debug-layout #iframe-navtab                { background:#ffea00 !important; }
html.ns-debug-layout .content-wrapper.iframe-mode  { background:#651fff !important; }
html.ns-debug-layout .app-panel                    { background:#00b0ff !important; }
html.ns-debug-layout .content-wrapper.iframe-mode .tab-content { background:#00e676 !important; }
html.ns-debug-layout .main-footer                  { background:#f50057 !important; }
html.ns-debug-layout .app-right-rail               { background:#ff6d00 !important; }

/* sidebar -- bg aside, brand, area scroll, ul menu, li item, a link, label <p>,
   chip icon, header grup & divider. Tiap layer beda warna supaya margin
   nav-link (warna li nongol) & padding (warna link nongol di sekitar <p>/icon)
   kelihatan. Link aktif sengaja ikut ditimpa supaya ukurannya bisa dibanding. */
html.ns-debug-layout .main-sidebar                 { background:#ff1744 !important; }
html.ns-debug-layout .nisea-sidebar .brand-link    { background:#ffea00 !important; }
html.ns-debug-layout .nisea-sidebar .sidebar       { background:#00e676 !important; }
html.ns-debug-layout .nisea-sidebar .nav-sidebar   { background:#2979ff !important; }
html.ns-debug-layout .nisea-sidebar .nav-item      { background:#d500f9 !important; }
html.ns-debug-layout .nisea-sidebar .nav-treeview  { background:#7c4dff !important; }
html.ns-debug-layout .nisea-sidebar .nav-link,
html.ns-debug-layout .nisea-sidebar .nav-sidebar .nav-item.has-treeview > .nav-link.active { background:#ffd180 !important; }
html.ns-debug-layout .nisea-sidebar .nav-link > p  { background:#76ff03 !important; }
html.ns-debug-layout .nisea-sidebar .nav-header    { background:#18ffff !important; }
html.ns-debug-layout .nisea-sidebar .dropdown-divider { background:#000 !important; }
html.ns-debug-layout .nisea-sidebar .nav-link,
html.ns-debug-layout .nisea-sidebar .nav-item,
html.ns-debug-layout .nisea-sidebar .nav-header{
    outline:1px dashed rgba(0,0,0,.55);
    outline-offset:-1px;
}

/* ---------- halaman modul (iframe) ---------- */

html.ns-debug-layout body                          { background:#212121 !important; }
html.ns-debug-layout .content-wrapper.tab-wrap     { background:#ff3b30 !important; }
html.ns-debug-layout .content-header               { background:#ff9100 !important; }
html.ns-debug-layout .header-toolbar               { background:#ffeb3b !important; }
html.ns-debug-layout .header-title                 { background:#76ff03 !important; }
html.ns-debug-layout .header-actions               { background:#18ffff !important; }
html.ns-debug-layout .content                      { background:#d500f9 !important; }
html.ns-debug-layout .container-fluid              { background:#2979ff !important; }
html.ns-debug-layout .row                          { background:#00c853 !important; }
html.ns-debug-layout [class^="col-"],
html.ns-debug-layout [class*=" col-"]              { background:#ff4081 !important; }
html.ns-debug-layout .form-group                   { background:#ffd180 !important; }
html.ns-debug-layout .input-group                  { background:#00e5ff !important; }
html.ns-debug-layout .card                         { background:#ff6d00 !important; }
html.ns-debug-layout .card-header                  { background:#aeea00 !important; }
html.ns-debug-layout .card-body                    { background:#ea80fc !important; }
html.ns-debug-layout .card-footer                  { background:#ffab40 !important; }
html.ns-debug-layout .table-utils                  { background:#c6ff00 !important; }
html.ns-debug-layout .ns-detail-tabstrip-bare,
html.ns-debug-layout .nav-tabs                     { background:#7c4dff !important; }
html.ns-debug-layout .ns-table-scroll,
html.ns-debug-layout .ns-detail-table-scroll       { background:#8d6e63 !important; }
html.ns-debug-layout .dataTables_wrapper           { background:#a1887f !important; }
html.ns-debug-layout .dataTables_wrapper > .row    { background:#4db6ac !important; }
html.ns-debug-layout .ns-detail-summary            { background:#c6ff00 !important; }

/* garis batas tiap blok -- outline (bukan border) supaya tidak menambah
   ukuran box & tidak menggeser layout yg sedang diteliti */
html.ns-debug-layout .content-wrapper.tab-wrap,
html.ns-debug-layout .content-header,
html.ns-debug-layout .header-toolbar,
html.ns-debug-layout .header-title,
html.ns-debug-layout .header-actions,
html.ns-debug-layout .content,
html.ns-debug-layout .container-fluid,
html.ns-debug-layout .row,
html.ns-debug-layout [class^="col-"],
html.ns-debug-layout [class*=" col-"],
html.ns-debug-layout .form-group,
html.ns-debug-layout .input-group,
html.ns-debug-layout .card,
html.ns-debug-layout .ns-table-scroll,
html.ns-debug-layout .ns-detail-table-scroll,
html.ns-debug-layout .ns-detail-summary{
    outline:1px dashed rgba(0,0,0,.55);
    outline-offset:-1px;
}

/* elemen isi (input/tabel/tombol) tetap terbaca di atas warna debug */
html.ns-debug-layout .form-control,
html.ns-debug-layout .select2-selection,
html.ns-debug-layout table.table td,
html.ns-debug-layout table.table th{
    outline:1px solid rgba(0,0,0,.35);
    outline-offset:-1px;
}

/* penanda mode aktif -- pojok kanan bawah tiap dokumen */
html.ns-debug-layout body::after{
    content:"DEBUG LAYOUT";
    position:fixed;
    right:6px;
    bottom:6px;
    z-index:99999;
    padding:2px 6px;
    font:700 10px/1.4 monospace;
    color:#fff;
    background:#000;
    border:1.5px solid #fff;
    pointer-events:none;
}