/* ═══════════════════════════════════════════════════════════════════════
   HoneyDash Enterprise Theme
   Layered on top of AdminLTE dark-theme.css — controls palette, density,
   and all sensor / protocol / severity badge colours.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Custom properties ──────────────────────────────────────────────── */
:root {
  --hd-bg:       #0d1117;
  --hd-surface:  #161b22;
  --hd-surface2: #1c2333;
  --hd-surface3: #21262d;
  --hd-border:   #21262d;
  --hd-border2:  #30363d;
  --hd-text:     #c9d1d9;
  --hd-text2:    #8b949e;
  --hd-text3:    #6e7681;
  --hd-muted:    #8b949e;  /* recessive label text; AA on dark surfaces */
  --hd-blue:     #1f6feb;
  --hd-blue2:    #388bfd;
  --hd-blue3:    #58a6ff;
  --hd-green:    #1a7f37;
  --hd-green2:   #2ea043;
  --hd-green3:   #3fb950;
  --hd-amber:    #9e6a03;
  --hd-amber2:   #d29922;
  --hd-amber3:   #f0883e;
  --hd-red:      #b91c1c;
  --hd-red2:     #cf222e;
  --hd-red3:     #f85149;
  --hd-purple:   #6e40c9;
  --hd-purple2:  #8957e5;
  --hd-purple3:  #a371f7;
  --hd-teal:     #0a6977;
  --hd-teal2:    #138f9c;
  --hd-teal3:    #39d3bb;
  --hd-pink:     #8250df;
  --hd-pink2:    #d2a8ff;
}

/* ── Page & layout ──────────────────────────────────────────────────── */
body,
html                            { background: var(--hd-bg) !important; }
.content-wrapper                { background: var(--hd-bg) !important; min-height: calc(100vh - 57px) !important; }
.wrapper                        { background: var(--hd-bg) !important; }

/* ── Top navbar ─────────────────────────────────────────────────────── */
.main-header.navbar {
  background: var(--hd-surface) !important;
  border-bottom: 1px solid var(--hd-border) !important;
  box-shadow: none !important;
}
.main-header .nav-link,
.main-header .navbar-nav .nav-link { color: var(--hd-text2) !important; font-size: 13px !important; }
.main-header .nav-link:hover       { color: var(--hd-text)  !important; }
.navbar-badge                       { font-size: 9px !important; }

/* ── Sidebar ────────────────────────────────────────────────────────── */
.main-sidebar,
.main-sidebar .sidebar             { background: var(--hd-surface) !important; }
.main-sidebar {
  border-right: 1px solid var(--hd-border) !important;
  position: fixed !important;
  top: 0 !important;
  bottom: 0 !important;
  height: 100vh !important;
  overflow: hidden !important;
}
.main-sidebar .sidebar {
  height: calc(100vh - 57px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.main-sidebar .sidebar::-webkit-scrollbar { width: 6px; }
.main-sidebar .sidebar::-webkit-scrollbar-thumb { background: var(--hd-border2); border-radius: 8px; }
.brand-link {
  background: var(--hd-surface) !important;
  border-bottom: 1px solid var(--hd-border) !important;
  padding: 12px 16px !important;
}
.brand-text                        { color: var(--hd-text) !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: 0.05em; }

.nav-sidebar .nav-link,
.nav-sidebar .nav-link p           { color: var(--hd-text2) !important; font-size: 12.5px !important; font-weight: 500 !important; }
.nav-sidebar .nav-link             { border-radius: 0 !important; border-left: 2px solid transparent !important; transition: all .15s; }
.nav-sidebar .nav-link.active,
.nav-sidebar .nav-link:hover       { background: rgba(56,139,253,.08) !important; border-left-color: var(--hd-blue2) !important; }
.nav-sidebar .nav-link.active p,
.nav-sidebar .nav-link:hover p     { color: var(--hd-blue3) !important; }
.nav-sidebar .nav-icon             { color: var(--hd-text3) !important; }
.nav-sidebar .nav-link.active .nav-icon,
.nav-sidebar .nav-link:hover .nav-icon { color: var(--hd-blue3) !important; }

.user-panel                        { border-bottom: 1px solid var(--hd-border) !important; }
.user-panel .info a                { color: var(--hd-text2) !important; font-size: 13px !important; }
.user-panel .image img             { border: 2px solid var(--hd-border2) !important; }

.hd-nav-section {
  color: var(--hd-text3) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .11em !important;
  padding: 12px 12px 5px !important;
}

.hd-soc-sidebar {
  margin: 12px 8px 16px;
  padding: 10px;
  border: 1px solid rgba(88,166,255,.18);
  border-radius: 6px;
  background: linear-gradient(180deg, rgba(28,35,51,.92), rgba(13,17,23,.74));
}
.hd-soc-title,
.hd-soc-row,
.hd-soc-remote-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.hd-soc-title {
  color: var(--hd-text);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--hd-border);
}
.hd-soc-title i { color: var(--hd-blue3); margin-right: 5px; }
.hd-soc-live {
  padding: 1px 6px;
  border-radius: 3px;
  background: rgba(63,185,80,.14);
  color: var(--hd-green3);
  font-size: 9px;
  font-weight: 800;
}
.hd-soc-row {
  padding: 7px 0;
  border-bottom: 1px solid rgba(139,148,158,.12);
  font-size: 11.5px;
  color: var(--hd-text2);
}
.hd-soc-row strong {
  color: var(--hd-text);
  font-variant-numeric: tabular-nums;
}
.hd-soc-state {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  margin-right: 5px;
  vertical-align: middle;
}
.hd-soc-state-ok { background: var(--hd-green3); box-shadow: 0 0 8px rgba(63,185,80,.65); }
.hd-soc-state-warn { background: var(--hd-amber2); }
.hd-soc-state-bad { background: var(--hd-red3); box-shadow: 0 0 8px rgba(248,81,73,.55); }
.hd-soc-remote {
  margin-top: 9px;
  padding: 8px;
  border: 1px solid rgba(137,87,229,.24);
  border-radius: 5px;
  background: rgba(137,87,229,.07);
}
.hd-soc-remote-head {
  color: var(--hd-text);
  font-size: 11px;
  font-weight: 700;
}
.hd-soc-remote-head i { color: var(--hd-purple3); margin-right: 4px; }
.hd-soc-chip {
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}
.hd-soc-chip-ok { background: rgba(63,185,80,.14); color: var(--hd-green3); }
.hd-soc-chip-warn { background: rgba(210,153,34,.14); color: var(--hd-amber2); }
.hd-soc-chip-muted { background: rgba(139,148,158,.12); color: var(--hd-text3); }
.hd-soc-muted {
  margin-top: 5px;
  color: var(--hd-text3);
  font-size: 10.5px;
  line-height: 1.35;
}
.hd-soc-muted code {
  display: block;
  margin-top: 2px;
  color: var(--hd-blue3);
  background: rgba(13,17,23,.45);
  border: 1px solid rgba(139,148,158,.14);
  border-radius: 3px;
  padding: 3px 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hd-soc-footer {
  margin-top: 8px;
  color: var(--hd-text3);
  font-size: 10px;
}

/* ── Cards ──────────────────────────────────────────────────────────── */
.card {
  background: var(--hd-surface) !important;
  border: 1px solid var(--hd-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
.card-header {
  background: var(--hd-surface) !important;
  border-bottom: 1px solid var(--hd-border) !important;
  padding: .55rem 1rem !important;
  border-radius: 6px 6px 0 0 !important;
}
.card-title {
  color: var(--hd-text) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
  margin-bottom: 0 !important;
}
.card-body   { padding: .75rem 1rem !important; }
.card-footer {
  background: var(--hd-surface) !important;
  border-top: 1px solid var(--hd-border) !important;
  font-size: 12px !important;
  color: var(--hd-text3) !important;
}

/* Card coloured top borders (outline variants) */
.card.card-outline.card-primary  { border-top: 2px solid var(--hd-blue2)  !important; }
.card.card-outline.card-success  { border-top: 2px solid var(--hd-green3) !important; }
.card.card-outline.card-danger   { border-top: 2px solid var(--hd-red3)   !important; }
.card.card-outline.card-warning  { border-top: 2px solid var(--hd-amber2) !important; }
.card.card-outline.card-info     { border-top: 2px solid var(--hd-blue3)  !important; }
.card.card-primary:not(.card-outline) { border-top: 2px solid var(--hd-blue2) !important; }

/* Coloured card header overrides */
.card-header.bg-info,
.card-header.bg-primary   { background: rgba(31,111,235,.25) !important; border-bottom-color: rgba(31,111,235,.35) !important; }
.card-header.bg-success   { background: rgba(26,127,55,.25)  !important; border-bottom-color: rgba(26,127,55,.35) !important; }
.card-header.bg-danger    { background: rgba(185,28,28,.25)  !important; border-bottom-color: rgba(185,28,28,.35) !important; }
.card-header.bg-warning   { background: rgba(158,106,3,.25)  !important; border-bottom-color: rgba(158,106,3,.35) !important; }
.card-header.bg-dark      { background: var(--hd-surface2)  !important; border-bottom-color: var(--hd-border2) !important; }

/* ── Info-boxes (KPI tiles) ─────────────────────────────────────────── */
.info-box {
  background: var(--hd-surface) !important;
  border: 1px solid var(--hd-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  min-height: 64px !important;
  margin-bottom: 14px !important;
}
.info-box-icon {
  border-radius: 5px 0 0 5px !important;
  font-size: 1.3rem !important;
  width: 58px !important;
  line-height: 64px !important;
}
.info-box-text {
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
  color: var(--hd-text2) !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.info-box-number {
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  color: var(--hd-text) !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: -.01em;
}
.info-box-more { color: var(--hd-text3) !important; font-size: 11px !important; }

/* Muted icon colour treatments */
.info-box-icon.bg-danger,   .info-box-icon[style*="#dc3545"],
.info-box-icon[style*="bg-danger"]   { background: rgba(185,28,28,.2)  !important; color: var(--hd-red3)   !important; }
.info-box-icon.bg-warning            { background: rgba(158,106,3,.2)  !important; color: var(--hd-amber2) !important; }
.info-box-icon.bg-success            { background: rgba(26,127,55,.2)  !important; color: var(--hd-green3) !important; }
.info-box-icon.bg-info,
.info-box-icon.bg-primary            { background: rgba(31,111,235,.2) !important; color: var(--hd-blue3)  !important; }
.info-box-icon.bg-secondary          { background: rgba(110,118,129,.15) !important; color: var(--hd-text2) !important; }
.info-box-icon[style*="#3b0764"],
.info-box-icon[style*="background:#3b0764"],
.info-box-icon[style*="linear-gradient(135deg,#3b0764"] { background: rgba(110,64,201,.2) !important; color: var(--hd-purple3) !important; }
.info-box-icon[style*="#9c27b0"],
.info-box-icon[style*="#fd7e14"],
.info-box-icon[style*="#9c27"]  { background: rgba(110,64,201,.2) !important; color: var(--hd-purple3) !important; }

/* ── Tables ─────────────────────────────────────────────────────────── */
.table {
  color: var(--hd-text) !important;
  font-size: 12.5px !important;
  border-color: var(--hd-border) !important;
}
.table thead th {
  background: var(--hd-surface2) !important;
  color: var(--hd-text2) !important;
  border-color: var(--hd-border2) !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  white-space: nowrap !important;
  padding: 7px 10px !important;
}
.table td {
  border-color: var(--hd-border) !important;
  vertical-align: middle !important;
  padding: 5px 10px !important;
  color: var(--hd-text) !important;
}
.table-striped tbody tr:nth-of-type(odd)  { background-color: rgba(255,255,255,.018) !important; }
.table-hover   tbody tr:hover             { background-color: rgba(56,139,253,.07)   !important; }
.table-bordered                           { border-color: var(--hd-border) !important; }

/* DataTables */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing { color: var(--hd-text2) !important; font-size: 12px !important; }
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
  background: var(--hd-surface2) !important;
  border: 1px solid var(--hd-border2) !important;
  color: var(--hd-text) !important;
  border-radius: 4px !important;
  padding: 3px 8px !important;
  font-size: 12px !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
  background: var(--hd-surface2) !important;
  border: 1px solid var(--hd-border2) !important;
  color: var(--hd-text2) !important;
  border-radius: 4px !important;
  font-size: 12px !important;
  padding: 3px 9px !important;
  margin: 1px !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: var(--hd-blue) !important;
  border-color: var(--hd-blue) !important;
  color: #fff !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: var(--hd-surface3) !important;
  border-color: var(--hd-blue2) !important;
  color: var(--hd-blue3) !important;
}

/* ── Forms ──────────────────────────────────────────────────────────── */
.form-control,
.custom-select,
select.form-control {
  background: var(--hd-surface2) !important;
  border: 1px solid var(--hd-border2) !important;
  color: var(--hd-text) !important;
  border-radius: 4px !important;
  font-size: 12.5px !important;
  height: calc(1.5em + .65rem + 2px) !important;
}
.form-control:focus,
.custom-select:focus {
  border-color: var(--hd-blue2) !important;
  box-shadow: 0 0 0 2px rgba(56,139,253,.18) !important;
  background: var(--hd-surface2) !important;
  color: var(--hd-text) !important;
}
.form-control::placeholder  { color: var(--hd-text3) !important; }
select option               { background: var(--hd-surface2) !important; color: var(--hd-text) !important; }
textarea.form-control       { height: auto !important; }
label {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  color: var(--hd-text2) !important;
  margin-bottom: 4px !important;
}
.input-group-text {
  background: var(--hd-surface3) !important;
  border: 1px solid var(--hd-border2) !important;
  color: var(--hd-text2) !important;
  font-size: 12px !important;
}

/* ── Buttons ────────────────────────────────────────────────────────── */
.btn {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  border-radius: 5px !important;
  letter-spacing: .02em !important;
  padding: .3rem .7rem !important;
}
.btn-lg { padding: .45rem 1rem !important; font-size: 13px !important; }
.btn-sm, .btn-xs { padding: .2rem .55rem !important; font-size: 11px !important; }

.btn-primary   { background: var(--hd-blue)   !important; border-color: var(--hd-blue)   !important; color: #fff !important; }
.btn-primary:hover { background: var(--hd-blue2) !important; border-color: var(--hd-blue2) !important; }
.btn-success   { background: var(--hd-green)  !important; border-color: var(--hd-green)  !important; color: #fff !important; }
.btn-success:hover { background: var(--hd-green2) !important; }
.btn-danger    { background: var(--hd-red)    !important; border-color: var(--hd-red)    !important; color: #fff !important; }
.btn-danger:hover  { background: var(--hd-red2)  !important; }
.btn-warning   { background: var(--hd-amber)  !important; border-color: var(--hd-amber)  !important; color: var(--hd-amber3) !important; }
.btn-info      { background: rgba(31,111,235,.18) !important; border-color: rgba(31,111,235,.4) !important; color: var(--hd-blue3) !important; }
.btn-info:hover    { background: rgba(31,111,235,.3) !important; }
.btn-default,
.btn-secondary { background: var(--hd-surface2) !important; border-color: var(--hd-border2) !important; color: var(--hd-text2) !important; }
.btn-default:hover,
.btn-secondary:hover { background: var(--hd-surface3) !important; border-color: var(--hd-blue2) !important; color: var(--hd-blue3) !important; }
.btn-tool      { color: var(--hd-text3) !important; }
.btn-tool:hover { color: var(--hd-text) !important; }

/* ── Badges (generic) ───────────────────────────────────────────────── */
.badge-info     { background: rgba(31,111,235,.2)  !important; color: var(--hd-blue3)   !important; border: 1px solid rgba(31,111,235,.3); }
.badge-success  { background: rgba(26,127,55,.2)   !important; color: var(--hd-green3)  !important; border: 1px solid rgba(26,127,55,.3); }
.badge-danger   { background: rgba(185,28,28,.2)   !important; color: var(--hd-red3)    !important; border: 1px solid rgba(185,28,28,.3); }
.badge-warning  { background: rgba(158,106,3,.2)   !important; color: var(--hd-amber2)  !important; border: 1px solid rgba(158,106,3,.3); }
.badge-secondary{ background: rgba(110,118,129,.18) !important; color: var(--hd-text2) !important; border: 1px solid rgba(110,118,129,.25); }
.badge-primary  { background: rgba(31,111,235,.2)  !important; color: var(--hd-blue3)  !important; border: 1px solid rgba(31,111,235,.3); }
.badge-dark     { background: var(--hd-surface3) !important; color: var(--hd-text2) !important; border: 1px solid var(--hd-border2); }
.navbar-badge   { top: 5px !important; right: 4px !important; }

/* ── Severity badges ────────────────────────────────────────────────── */
.badge-high   {
  background: rgba(185,28,28,.22) !important;
  color: #fca5a5 !important;
  border: 1px solid rgba(185,28,28,.4) !important;
  padding: 2px 7px !important; border-radius: 4px !important;
  font-size: 10px !important; font-weight: 700 !important;
}
.badge-medium {
  background: rgba(158,106,3,.22) !important;
  color: #fcd34d !important;
  border: 1px solid rgba(158,106,3,.4) !important;
  padding: 2px 7px !important; border-radius: 4px !important;
  font-size: 10px !important; font-weight: 700 !important;
}
.badge-low {
  background: rgba(31,111,235,.18) !important;
  color: #93c5fd !important;
  border: 1px solid rgba(31,111,235,.3) !important;
  padding: 2px 7px !important; border-radius: 4px !important;
  font-size: 10px !important; font-weight: 700 !important;
}

/* ── Protocol badges ────────────────────────────────────────────────── */
.proto-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 700;
  font-family: 'SFMono-Regular', Consolas, monospace;
  letter-spacing: .03em;
  white-space: nowrap;
}
.proto-ssh     { background:rgba(31,111,235,.18); color:#58a6ff; border:1px solid rgba(31,111,235,.35); }
.proto-telnet  { background:rgba(110,118,129,.18);color:#8b949e; border:1px solid rgba(110,118,129,.3); }
.proto-http    { background:rgba(193,90,0,.2);    color:#f0883e; border:1px solid rgba(193,90,0,.35); }
.proto-https   { background:rgba(130,80,223,.2);  color:#d2a8ff; border:1px solid rgba(130,80,223,.35); }
.proto-smb     { background:rgba(185,28,28,.2);   color:#f85149; border:1px solid rgba(185,28,28,.35); }
.proto-ftp     { background:rgba(110,64,201,.2);  color:#a371f7; border:1px solid rgba(110,64,201,.35); }
.proto-mysql   { background:rgba(26,127,55,.2);   color:#3fb950; border:1px solid rgba(26,127,55,.35); }
.proto-mssql   { background:rgba(9,105,218,.2);   color:#58a6ff; border:1px solid rgba(9,105,218,.35); }
.proto-sip     { background:rgba(10,105,119,.2);  color:#39d3bb; border:1px solid rgba(10,105,119,.35); }

/* ── Sensor badges ──────────────────────────────────────────────────── */
.sensor-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 600;
  font-family: 'SFMono-Regular', Consolas, monospace;
  white-space: nowrap;
}
.sensor-cowrie  { background:rgba(31,111,235,.15); color:#58a6ff; border:1px solid rgba(31,111,235,.3); }
.sensor-dionaea { background:rgba(185,28,28,.15);  color:#f85149; border:1px solid rgba(185,28,28,.3); }
.sensor-remote  { background:rgba(110,64,201,.15); color:#a371f7; border:1px solid rgba(110,64,201,.3); }
.sensor-unknown { background:rgba(110,118,129,.15);color:#8b949e; border:1px solid rgba(110,118,129,.25); }

/* ── Modals ─────────────────────────────────────────────────────────── */
.modal-content {
  background: var(--hd-surface) !important;
  border: 1px solid var(--hd-border2) !important;
  border-radius: 8px !important;
  box-shadow: 0 16px 48px rgba(0,0,0,.55) !important;
}
.modal-header {
  background: var(--hd-surface2) !important;
  border-bottom: 1px solid var(--hd-border) !important;
  border-radius: 8px 8px 0 0 !important;
  padding: .7rem 1rem !important;
}
.modal-header.bg-info,
.modal-header.bg-primary { background: rgba(31,111,235,.25) !important; border-bottom-color: rgba(31,111,235,.35) !important; }
.modal-header.bg-danger  { background: rgba(185,28,28,.25)  !important; border-bottom-color: rgba(185,28,28,.35)  !important; }
.modal-header.bg-warning { background: rgba(158,106,3,.25)  !important; border-bottom-color: rgba(158,106,3,.35)  !important; }
.modal-header.bg-success { background: rgba(26,127,55,.25)  !important; border-bottom-color: rgba(26,127,55,.35)  !important; }
.modal-title { font-size: 13px !important; font-weight: 700 !important; color: var(--hd-text) !important; letter-spacing: .04em; }
.modal-footer {
  background: var(--hd-surface) !important;
  border-top: 1px solid var(--hd-border) !important;
  border-radius: 0 0 8px 8px !important;
  padding: .6rem 1rem !important;
}
.close { color: var(--hd-text3) !important; text-shadow: none !important; opacity: .7 !important; }
.close:hover { color: var(--hd-text) !important; opacity: 1 !important; }

/* ── Dropdowns ──────────────────────────────────────────────────────── */
.dropdown-menu {
  background: var(--hd-surface2) !important;
  border: 1px solid var(--hd-border2) !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.5) !important;
  padding: 4px 0 !important;
}
.dropdown-item             { color: var(--hd-text2) !important; font-size: 12.5px !important; padding: 6px 14px !important; }
.dropdown-item:hover,
.dropdown-item:focus       { background: rgba(56,139,253,.1) !important; color: var(--hd-text) !important; }
.dropdown-divider          { border-color: var(--hd-border) !important; margin: 3px 0 !important; }
.dropdown-header           { color: var(--hd-text3) !important; font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .06em !important; }

/* ── Progress bars ──────────────────────────────────────────────────── */
.progress            { background: var(--hd-surface3) !important; border-radius: 4px !important; height: 5px !important; }
.progress-bar        { border-radius: 4px !important; }
.progress-bar.bg-danger   { background: var(--hd-red2)   !important; }
.progress-bar.bg-warning  { background: var(--hd-amber2) !important; }
.progress-bar.bg-success  { background: var(--hd-green2) !important; }
.progress-bar.bg-info,
.progress-bar.bg-primary  { background: var(--hd-blue2)  !important; }

/* ── Nav tabs ───────────────────────────────────────────────────────── */
.nav-tabs                        { border-bottom: 1px solid var(--hd-border) !important; }
.nav-tabs .nav-link              { color: var(--hd-text2) !important; font-size: 12px !important; font-weight: 600 !important; border: none !important; border-bottom: 2px solid transparent !important; padding: 6px 14px !important; border-radius: 0 !important; }
.nav-tabs .nav-link:hover        { color: var(--hd-text) !important; border-bottom-color: var(--hd-border2) !important; background: none !important; }
.nav-tabs .nav-link.active       { color: var(--hd-blue3) !important; border-bottom-color: var(--hd-blue2) !important; background: none !important; }
.tab-content                     { padding-top: 12px; }

/* ── List groups ────────────────────────────────────────────────────── */
.list-group-item {
  background: var(--hd-surface2) !important;
  border-color: var(--hd-border) !important;
  color: var(--hd-text) !important;
  font-size: 12.5px !important;
  padding: 8px 12px !important;
}
.list-group-item:hover         { background: var(--hd-surface3) !important; }
.list-group-item-danger        { background: rgba(185,28,28,.18) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.3) !important; }
.list-group-item-warning       { background: rgba(158,106,3,.18)  !important; color: #fcd34d !important; border-color: rgba(158,106,3,.3)  !important; }
.list-group-item-info          { background: rgba(31,111,235,.18) !important; color: #93c5fd !important; border-color: rgba(31,111,235,.3) !important; }

/* ── Alerts/callouts ────────────────────────────────────────────────── */
.alert-info    { background: rgba(31,111,235,.12) !important; border-color: rgba(31,111,235,.3) !important; color: var(--hd-blue3) !important; }
.alert-danger  { background: rgba(185,28,28,.12)  !important; border-color: rgba(185,28,28,.3)  !important; color: #fca5a5 !important; }
.alert-warning { background: rgba(158,106,3,.12)  !important; border-color: rgba(158,106,3,.3)  !important; color: var(--hd-amber2) !important; }
.alert-success { background: rgba(26,127,55,.12)  !important; border-color: rgba(26,127,55,.3)  !important; color: var(--hd-green3) !important; }
.callout       { background: var(--hd-surface2) !important; border-color: var(--hd-border2) !important; }
.callout.callout-info    { border-left-color: var(--hd-blue2)  !important; }
.callout.callout-danger  { border-left-color: var(--hd-red3)   !important; }
.callout.callout-warning { border-left-color: var(--hd-amber2) !important; }

/* ── Content header / breadcrumb ────────────────────────────────────── */
.content-header          { padding: 12px 20px 8px !important; }
.content-header h1       { font-size: 1rem !important; font-weight: 700 !important; color: var(--hd-text) !important; letter-spacing: .03em; margin-bottom: 0 !important; }
.content-header .breadcrumb { background: transparent !important; margin-bottom: 0 !important; padding: 0 !important; }
.breadcrumb-item a       { color: var(--hd-blue2) !important; font-size: 11.5px !important; }
.breadcrumb-item.active  { color: var(--hd-text3) !important; font-size: 11.5px !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--hd-text3) !important; }

/* ── Footer ─────────────────────────────────────────────────────────── */
.main-footer {
  background: var(--hd-surface) !important;
  border-top: 1px solid var(--hd-border) !important;
  color: var(--hd-text3) !important;
  font-size: 11px !important;
  padding: 10px 20px !important;
}

/* ── Code / pre ─────────────────────────────────────────────────────── */
code {
  background: rgba(31,111,235,.12) !important;
  color: #a5d6ff !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
  font-size: 11px !important;
  font-family: 'SFMono-Regular', Consolas, monospace !important;
}
pre {
  background: var(--hd-surface2) !important;
  border: 1px solid var(--hd-border) !important;
  color: var(--hd-text) !important;
  border-radius: 5px !important;
  font-size: 11.5px !important;
  padding: 10px 14px !important;
}

/* ── Misc utilities ─────────────────────────────────────────────────── */
.text-muted   { color: var(--hd-text3) !important; }
.text-sm      { font-size: 11.5px !important; }
hr            { border-color: var(--hd-border) !important; margin: 10px 0 !important; }
.small, small { font-size: 11px !important; color: var(--hd-text2) !important; }

/* ── Scrollbars ─────────────────────────────────────────────────────── */
::-webkit-scrollbar             { width: 6px; height: 6px; }
::-webkit-scrollbar-track       { background: var(--hd-bg); }
::-webkit-scrollbar-thumb       { background: var(--hd-border2); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--hd-text3); }

/* ── Sensor selector strip ──────────────────────────────────────────── */
.sensor-strip {
  display: flex;
  gap: 6px;
  align-items: center;
  background: var(--hd-surface);
  border: 1px solid var(--hd-border);
  border-radius: 6px;
  padding: 6px 10px;
  margin-bottom: 14px;
}
.sensor-strip label {
  margin: 0 8px 0 0 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  color: var(--hd-text3) !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
  white-space: nowrap;
}
.sensor-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  border: 1px solid var(--hd-border2);
  background: var(--hd-surface2);
  color: var(--hd-text2);
  cursor: pointer;
  transition: all .15s;
  user-select: none;
  letter-spacing: .02em;
}
.sensor-btn .dot {
  width: 6px; height: 6px; border-radius: 50%; display: inline-block;
}
.sensor-btn:hover        { border-color: var(--hd-blue2); color: var(--hd-blue3); }
.sensor-btn.active       { border-color: var(--hd-blue2) !important; background: rgba(56,139,253,.12) !important; color: var(--hd-blue3) !important; }
.sensor-btn.active-cowrie   { border-color: rgba(31,111,235,.5) !important; background: rgba(31,111,235,.12) !important; color: var(--hd-blue3) !important; }
.sensor-btn.active-dionaea  { border-color: rgba(185,28,28,.5)  !important; background: rgba(185,28,28,.12)  !important; color: #f85149 !important; }
.sensor-btn.active-remote   { border-color: rgba(110,64,201,.5) !important; background: rgba(110,64,201,.12) !important; color: var(--hd-purple3) !important; }
.dot-all     { background: var(--hd-text2); }
.dot-cowrie  { background: var(--hd-blue3); }
.dot-dionaea { background: var(--hd-red3); }
.dot-remote  { background: var(--hd-purple3); }

/* ── Mini live metrics strip ────────────────────────────────────────── */
.mini-metrics {
  display: flex;
  gap: 0;
  background: var(--hd-surface);
  border: 1px solid var(--hd-border);
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 14px;
}
.mini-metric {
  flex: 1;
  padding: 8px 14px;
  border-right: 1px solid var(--hd-border);
  text-align: center;
}
.mini-metric:last-child { border-right: none; }
.mini-metric .mm-val {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--hd-text);
  display: block;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.mini-metric .mm-lbl {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--hd-text3);
  display: block;
}

/* ── Threat banner ──────────────────────────────────────────────────── */
.threat-banner {
  padding: 6px 16px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  border-bottom: none !important;
}
.threat-banner.threat-low      { background: rgba(31,111,235,.18) !important; color: var(--hd-blue3) !important; border-top: 2px solid var(--hd-blue2) !important; }
.threat-banner.threat-medium   { background: rgba(158,106,3,.18)  !important; color: var(--hd-amber2) !important; border-top: 2px solid var(--hd-amber2) !important; }
.threat-banner.threat-high     { background: rgba(185,28,28,.2)   !important; color: #fca5a5 !important; border-top: 2px solid var(--hd-red3) !important; }
.threat-banner.threat-critical { background: rgba(185,28,28,.35)  !important; color: #fca5a5 !important; border-top: 2px solid var(--hd-red3) !important; animation: pulse-banner 1.5s ease-in-out infinite; }
@keyframes pulse-banner { 0%,100%{opacity:1} 50%{opacity:.7} }

/* ── Live indicator dot ─────────────────────────────────────────────── */
.live-dot {
  width: 7px; height: 7px;
  background: var(--hd-green3);
  border-radius: 50%;
  display: inline-block;
  box-shadow: 0 0 0 0 rgba(63,185,80,.4);
  animation: live-pulse 2s ease-in-out infinite;
}
@keyframes live-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(63,185,80,.4); }
  70%  { box-shadow: 0 0 0 6px rgba(63,185,80,0); }
  100% { box-shadow: 0 0 0 0 rgba(63,185,80,0); }
}

/* ── Protocol section dividers ──────────────────────────────────────── */
.proto-section-header {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--hd-text3);
  padding: 4px 0 2px;
  border-bottom: 1px solid var(--hd-border);
  margin-bottom: 8px;
}

/* ── API key display ────────────────────────────────────────────────── */
.api-key-box {
  background: var(--hd-surface2);
  border: 1px solid var(--hd-border2);
  border-radius: 5px;
  padding: 8px 12px;
  font-family: 'SFMono-Regular', Consolas, monospace;
  font-size: 12px;
  color: var(--hd-blue3);
  letter-spacing: .04em;
  word-break: break-all;
}

/* ── Acknowledged / status rows ─────────────────────────────────────── */
tr.acknowledged td { opacity: .55; text-decoration: line-through; }
tr.ack-row        { opacity: .55; }

/* ── Column sizing helpers ──────────────────────────────────────────── */
.col-nowrap { white-space: nowrap !important; }
.col-tight  { padding: 4px 6px !important; }

/* ── info-box typography — consistent across all pages ─────────────── */
.info-box                  { background: var(--hd-surface) !important; border: 1px solid var(--hd-border) !important; border-radius: 6px !important; box-shadow: none !important; }
.info-box:hover            { border-color: var(--hd-border2) !important; box-shadow: none !important; }
.info-box-text             { color: var(--hd-text2) !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: .06em !important; font-weight: 700 !important; }
.info-box-number           { color: var(--hd-text) !important; font-size: 1.5rem !important; font-weight: 700 !important; font-variant-numeric: tabular-nums !important; }
.info-box-icon             { border-radius: 6px 0 0 6px !important; }

/* ── card-header title — consistent across all pages ───────────────── */
.card-title                { font-size: 11px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .07em !important; color: var(--hd-text2) !important; }
.card                      { background: var(--hd-surface) !important; border: 1px solid var(--hd-border) !important; border-radius: 6px !important; }
.card-header               { background: var(--hd-surface) !important; border-bottom: 1px solid var(--hd-border) !important; padding: 10px 14px !important; border-radius: 6px 6px 0 0 !important; }
.card-body                 { color: var(--hd-text) !important; }
.card.card-outline         { border-top-width: 2px !important; }
.card.card-primary.card-outline  { border-top-color: var(--hd-blue2) !important; }
.card.card-warning.card-outline  { border-top-color: var(--hd-amber2) !important; }
.card.card-danger.card-outline   { border-top-color: var(--hd-red2) !important; }
.card.card-success.card-outline  { border-top-color: var(--hd-green2) !important; }

/* ── Density toggle ─────────────────────────────────────────────────── */
.hd-density-toggle {
  display: inline-flex;
  background: var(--hd-surface2);
  border: 1px solid var(--hd-border2);
  border-radius: 4px;
  padding: 2px;
  gap: 1px;
  vertical-align: middle;
  margin-left: 6px;
}
.hd-density-btn {
  width: 26px; height: 22px;
  border: none; border-radius: 3px;
  background: transparent; color: var(--hd-text2);
  cursor: pointer; font-size: 10px;
  display: flex; align-items: center; justify-content: center;
  transition: background .12s, color .12s;
  line-height: 1;
}
.hd-density-btn.active { background: var(--hd-surface3); color: var(--hd-text); }
.hd-density-btn:hover:not(.active) { color: var(--hd-text); }

/* Comfortable (default) — current spacing */
.hd-density-comfortable .table td,
.hd-density-comfortable .table th {
  padding: 7px 10px !important;
  font-size: 12.5px !important;
}

/* Compact — analyst sees ~40% more rows */
.hd-density-compact .table td,
.hd-density-compact .table th {
  padding: 3px 8px !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}
.hd-density-compact .badge { font-size: 9.5px !important; padding: 1px 5px !important; }
.hd-density-compact .btn-sm { padding: 1px 6px !important; font-size: 10px !important; }

/* ── Reduced motion — global ────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .live-dot,
  .threat-banner.threat-critical,
  .dot-online,
  .live-indicator,
  #wsStatusDot.online      { animation: none !important; }
  *,
  *::before,
  *::after                 { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}