/* Ajustes propios sobre Tabler. Deliberadamente pocos: cuanto menos se toque el
   sistema de diseño, menos se rompe al actualizarlo. */

/* `.page` de Tabler usa `min-height: 100%`, que necesita una cadena de alturas hasta
   el viewport. `#app` es el único eslabón que añadimos, así que lo cerramos aquí. */
html, body, #app { height: 100%; }

.app-brand-logo {
  width: 2rem; height: 2rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: .5rem;
  background: linear-gradient(135deg, var(--tblr-primary), var(--tblr-cyan));
  color: #fff;
}

/* Celdas monoespaciadas para números de serie, VLANs y coordenadas de puerto:
   alinear los dígitos hace que un SN erróneo salte a la vista. */
.mono { font-family: var(--tblr-font-monospace); font-size: .8125rem; }

/* Traza de comandos: se lee como una consola, porque es lo que es. */
.command-log {
  background: var(--tblr-bg-surface-dark, #1a2234);
  color: #e5e7eb;
  font-family: var(--tblr-font-monospace);
  font-size: .8125rem;
  border-radius: var(--tblr-border-radius);
  padding: .75rem 1rem;
  overflow-x: auto;
  white-space: pre-wrap;
  word-break: break-word;
}
.command-log .cmd-prompt { color: #7dd3fc; }
.command-log .cmd-text   { color: #f8fafc; font-weight: 600; }
.command-log .cmd-out    { color: #94a3b8; }
.command-log .cmd-err    { color: #fca5a5; }

.sparkline { display: block; width: 100%; height: 48px; }

/* Estado vacío: en un panel de operación, "no hay nada" y "está cargando" no
   pueden parecer lo mismo. */
.empty-compact { padding: 2rem 1rem; text-align: center; color: var(--tblr-secondary); }

.table-clickable tbody tr { cursor: pointer; }

.form-hint code { font-size: .75rem; }

.wizard-step-done .step-item-title { color: var(--tblr-success); }

.json-editor {
  font-family: var(--tblr-font-monospace);
  font-size: .8125rem;
  min-height: 9rem;
}

@media (max-width: 575.98px) {
  .navbar-brand-text { display: none; }
}