/* Clientes da rede (UniFi) */
.uc-kpi small { display: flex; align-items: center; gap: 6px; }
.uc-kpi small svg { width: 13px; height: 13px; }
.uc-sites { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.uc-sites .badge svg { width: 12px; height: 12px; vertical-align: -2px; }
.uc-stale { color: hsl(var(--warning)); font-weight: 600; display: inline-flex; gap: 4px; align-items: center; }
.uc-stale svg { width: 13px; height: 13px; }

/* dispositivos */
.uc-devs { margin: 16px 0; }
.uc-dev-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; padding: 12px 16px 16px; }
.uc-dev { display: grid; grid-template-columns: 32px 1fr auto; grid-template-rows: auto 4px; column-gap: 10px; row-gap: 8px; align-items: center;
  text-align: left; font: inherit; color: inherit; background: hsl(var(--card)); border: 1px solid hsl(var(--border)); padding: 10px 12px; cursor: pointer; }
.uc-dev:hover { border-color: hsl(var(--primary) / .5); }
.uc-dev.on { border-color: hsl(var(--primary)); box-shadow: inset 0 0 0 1px hsl(var(--primary)); background: hsl(var(--nav-active)); }
.uc-dev-ic { width: 32px; height: 32px; display: grid; place-items: center; background: hsl(var(--muted)); color: hsl(var(--primary)); grid-row: 1; }
.uc-dev-ic svg { width: 17px; height: 17px; }
.uc-dev-t { min-width: 0; display: flex; flex-direction: column; }
.uc-dev-t b { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.uc-dev-t small { font-size: 11.5px; color: hsl(var(--muted-fg)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.uc-dev-n { font-size: 18px; font-weight: 700; font-variant-numeric: tabular-nums; }
.uc-meter { grid-column: 1 / -1; height: 4px; background: hsl(var(--muted)); overflow: hidden; }
.uc-meter span { display: block; height: 100%; background: #2a78d6; }
.dark .uc-meter span { background: #3987e5; }
.uc-off { color: hsl(var(--danger)); display: inline-flex; gap: 3px; align-items: center; }
.uc-off svg { width: 11px; height: 11px; }

/* barra de filtros */
.uc-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 12px 16px; border-bottom: 1px solid hsl(var(--border)); }
.uc-bar .right { margin-left: auto; }
.uc-cnt { font-weight: 500; opacity: .75; margin-left: 2px; font-variant-numeric: tabular-nums; }
.uc-search { display: flex; align-items: center; gap: 6px; border: 1px solid hsl(var(--border)); background: hsl(var(--input-bg)); padding: 0 8px; min-width: 240px; }
.uc-search svg { width: 14px; height: 14px; color: hsl(var(--muted-fg)); }
.uc-search input { border: 0; outline: 0; background: transparent; padding: 6px 0; font: inherit; font-size: 13px; color: inherit; width: 100%; }

/* tabela */
.uc-tbl tbody tr { cursor: pointer; }
.uc-tbl td { vertical-align: middle; font-size: 13px; }
.uc-tbl td.mono { font-size: 12px; white-space: nowrap; }
.uc-sort { cursor: pointer; user-select: none; white-space: nowrap; }
.uc-sort svg { width: 13px; height: 13px; vertical-align: -2px; margin-left: 2px; }
.uc-sort.on { color: hsl(var(--primary)); }
.uc-name { display: flex; align-items: center; gap: 10px; min-width: 200px; }
.uc-name > div { display: flex; flex-direction: column; min-width: 0; }
.uc-name small, .uc-sub { display: block; font-size: 11.5px; color: hsl(var(--muted-fg)); }
.uc-type { width: 28px; height: 28px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; }
.uc-type svg { width: 15px; height: 15px; }
.uc-wifi { background: rgba(42, 120, 214, .12); color: #2a78d6; }
.uc-wired { background: rgba(235, 104, 52, .12); color: #c4521f; }
.uc-vpn { background: hsl(var(--violet) / .12); color: hsl(var(--violet)); }
.uc-other { background: hsl(var(--muted)); color: hsl(var(--muted-fg)); }
.dark .uc-wifi { color: #5a9cea; background: rgba(57, 135, 229, .18); }
.dark .uc-wired { color: #e57a4e; background: rgba(217, 89, 38, .2); }
.uc-up { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.uc-up svg { width: 14px; height: 14px; color: hsl(var(--muted-fg)); }
.uc-b { font-size: 10.5px; padding: 0 6px; vertical-align: 1px; }
.uc-b svg { width: 11px; height: 11px; vertical-align: -1px; }
.uc-ci { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; max-width: 170px; overflow: hidden; text-overflow: ellipsis; }
.uc-ci svg { width: 13px; height: 13px; }
.uc-add { white-space: nowrap; }
.uc-row-off td { color: hsl(var(--muted-fg)); }
.uc-row-off .uc-type { filter: grayscale(1); opacity: .7; }

/* detalhes */
.drawer .dh h3 .uc-type { display: inline-grid; vertical-align: middle; margin-right: 6px; }
.uc-kv { width: 100%; border-collapse: collapse; font-size: 13px; }
.uc-kv th { text-align: left; font-weight: 600; color: hsl(var(--muted-fg)); width: 40%; padding: 7px 10px 7px 0; vertical-align: top; }
.uc-kv td { padding: 7px 0; border-bottom: 1px solid hsl(var(--border)); }
.uc-kv tr:first-child td, .uc-kv tr:first-child th { padding-top: 0; }
.uc-copy { padding: 2px 4px; vertical-align: middle; }
.uc-copy svg { width: 13px; height: 13px; }
.uc-st { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; }
.uc-st svg { width: 14px; height: 14px; }
.uc-st.on { color: hsl(var(--success)); }
.uc-st.off { color: hsl(var(--danger)); }
.uc-help code { font-size: 12px; }

@media (max-width: 720px) {
  .uc-search { min-width: 0; flex: 1 1 100%; }
  .uc-bar .right { margin-left: 0; }
}

/* Wi-Fi: banda, sinal, taxa e retries */
.uc-wf { display: flex; flex-wrap: nowrap; gap: 8px; white-space: nowrap; margin-top: 3px; font-size: 11.5px; color: hsl(var(--muted-fg)); align-items: center; }
.uc-band { font-weight: 600; font-size: 11px; color: hsl(var(--fg)); background: hsl(var(--muted)); padding: 0 5px; margin-left: 2px; }
.uc-q { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.uc-q svg { width: 12px; height: 12px; }
.uc-q.q-ok { color: hsl(var(--success)); }
.uc-q.q-warn { color: hsl(var(--warning)); font-weight: 600; }
.uc-q.q-bad { color: hsl(var(--danger)); font-weight: 600; }
.uc-radios { grid-column: 1 / -1; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; font-size: 11.5px; }
.uc-radios small { color: hsl(var(--muted-fg)); font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; }
.uc-radios b { font-weight: 600; color: hsl(var(--fg)); margin-right: 2px; }
.uc-radios.in { font-size: 13px; }
.uc-dev:has(.uc-radios) { grid-template-rows: auto 4px auto; }

.uc-name > div > .badge { align-self: flex-start; margin-top: 2px; }
.uc-radios { gap: 8px; white-space: nowrap; }
.uc-sub.mono { font-size: 11px; }

/* importação da descoberta UniFi para o CMDB */
.drawer:has(.uc-imp-wrap) { width: min(1000px, 96vw); max-width: 96vw; }
.uc-imp-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; font-size: 13px; margin-bottom: 8px; }
.uc-imp-bar label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.uc-imp-sel { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; font-size: 12.5px; }
.uc-imp-sel .muted { margin-left: auto; font-weight: 600; }
.uc-imp-wrap { max-height: 58vh; overflow: auto; border: 1px solid hsl(var(--border)); border-radius: 10px; }
.uc-imp-wrap thead th { position: sticky; top: 0; background: hsl(var(--card)); z-index: 1; }
.uc-imp td { vertical-align: middle; font-size: 13px; padding-top: 6px; padding-bottom: 6px; }
.uc-imp tr:not(.on) td { opacity: .62; }
.uc-imp tr:not(.on) td:first-child { opacity: 1; }
.uc-imp-n { display: flex; align-items: center; gap: 6px; }
.uc-imp-n input { width: 100%; min-width: 160px; }
.uc-imp select { min-width: 140px; }
.uc-imp-src { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; flex-shrink: 0; }
.uc-imp-src svg { width: 14px; height: 14px; }
.uc-imp-src.dev { background: hsl(var(--primary) / .14); color: hsl(var(--primary)); }
