#adminLogsNav{display:none}
#adminLogsNav.admin-only-visible{display:flex}

.admin-logs-view{display:none}
.admin-logs-view.active{display:block}

.admin-logs-card{
  background:#fff;
  border:1px solid #e4e7ec;
  border-radius:14px;
  padding:18px;
}

.admin-logs-toolbar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:12px;
}

.admin-logs-toolbar select,
.admin-logs-toolbar input[type="search"]{
  min-height:38px;
}

.admin-logs-toolbar input[type="search"]{
  min-width:240px;
  flex:1 1 320px;
}

.admin-logs-status{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-left:auto;
  font-size:13px;
  color:#667085;
}

.admin-logs-status-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#98a2b3;
}

.admin-logs-status.connected .admin-logs-status-dot{background:#12b76a}
.admin-logs-status.reconnecting .admin-logs-status-dot{background:#f79009}
.admin-logs-status.disconnected .admin-logs-status-dot{background:#d0d5dd}

.admin-logs-options{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:10px;
  color:#667085;
  font-size:13px;
}

.admin-logs-options label{
  display:inline-flex;
  align-items:center;
  gap:7px;
  flex-direction:row;
}

.admin-logs-options input[type="checkbox"]{width:auto}

.admin-logs-stream{
  height:min(64vh,720px);
  min-height:360px;
  overflow:auto;
  background:#101828;
  border:1px solid #1d2939;
  border-radius:10px;
  padding:12px;
  font-family:Consolas,"Courier New",monospace;
  font-size:12.5px;
  line-height:1.5;
  color:#f2f4f7;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.admin-log-line{
  display:grid;
  grid-template-columns:92px 54px minmax(0,1fr);
  gap:10px;
  padding:2px 0;
  border-bottom:1px solid rgba(255,255,255,.035);
}

.admin-log-time{color:#98a2b3}
.admin-log-level{text-transform:uppercase;font-weight:800}
.admin-log-line.info .admin-log-level{color:#84caff}
.admin-log-line.warn .admin-log-level{color:#fec84b}
.admin-log-line.error .admin-log-level{color:#fda29b}
.admin-log-message{color:#f2f4f7}

.admin-logs-empty{
  color:#98a2b3;
  padding:18px 6px;
  text-align:center;
}

@media(max-width:720px){
  .admin-logs-card{padding:12px}
  .admin-logs-status{margin-left:0;width:100%}
  .admin-logs-stream{min-height:320px;height:58vh}
  .admin-log-line{grid-template-columns:76px 46px minmax(0,1fr);gap:7px;font-size:11px}
}
