/*
 * Puente entre la paleta corporativa (paleta-colores.css, variables --flnx-*) y Tabler (--tblr-*).
 * Tabler deriva hovers, fondos suaves y bordes a partir de estas variables base.
 * Contraste: el texto sobre warning/danger/info es oscuro; success usa su variante -hover
 * (más oscura) como color base para que el texto blanco supere 4.5:1.
 */
:root,
:root[data-bs-theme] {
  --tblr-font-sans-serif: 'Inter Variable', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  /* cv11 = «a» de un solo piso de Inter (variante alternativa). */
  --tblr-font-feature-settings: 'cv11' 1;

  --tblr-primary: var(--flnx-primary);
  --tblr-primary-rgb: var(--flnx-primary-rgb);
  --tblr-primary-fg: var(--flnx-text-light);

  --tblr-secondary: var(--flnx-secondary);
  --tblr-secondary-rgb: var(--flnx-secondary-rgb);
  --tblr-secondary-fg: var(--flnx-text-dark);

  --tblr-success: var(--flnx-success-hover);
  --tblr-success-rgb: 86, 112, 32;
  --tblr-success-fg: var(--flnx-text-light);

  --tblr-warning: var(--flnx-warning);
  --tblr-warning-rgb: var(--flnx-warning-rgb);
  --tblr-warning-fg: var(--flnx-text-dark);

  --tblr-danger: var(--flnx-danger);
  --tblr-danger-rgb: var(--flnx-danger-rgb);
  --tblr-danger-fg: var(--flnx-text-dark);

  /* flnx-info (#EBEAE9) es una superficie, no un color de aviso: para "info" se usa el terciario. */
  --tblr-info: var(--flnx-tertiary);
  --tblr-info-rgb: var(--flnx-tertiary-rgb);
  --tblr-info-fg: var(--flnx-text-dark);

  --tblr-dark: var(--flnx-dark);
  --tblr-dark-rgb: var(--flnx-dark-rgb);
  --tblr-light: var(--flnx-light);
  --tblr-light-rgb: var(--flnx-light-rgb);

  /* Superficies */
  --tblr-body-bg: light-dark(var(--flnx-light), #1d1711);
  --tblr-bg-surface: light-dark(#ffffff, #2a2119);
  --tblr-bg-surface-secondary: light-dark(var(--flnx-light), #241c15);
  --tblr-body-color: light-dark(var(--flnx-dark), var(--flnx-info));
  --tblr-border-color: light-dark(#e6dfd8, #4a3d31);

  --flnx-brand: light-dark(var(--flnx-primary), var(--flnx-tertiary));
  --flnx-rail-fg: light-dark(#7b7772, #b8b1aa);
}

/* Contraste: en Tabler el texto de una alerta usa el color principal (amarillo/naranja ilegibles sobre fondo claro). */
.alert {
  --tblr-alert-color: var(--tblr-body-color);
}
/* El naranja de la paleta con texto oscuro funciona como relleno; como texto o contorno se usa su variante oscura. */
.text-danger { color: light-dark(var(--flnx-danger-hover), var(--flnx-danger)) !important; }
.btn-outline-danger {
  --tblr-btn-color: light-dark(var(--flnx-danger-hover), var(--flnx-danger));
  --tblr-btn-border-color: light-dark(var(--flnx-danger-hover), var(--flnx-danger));
  --tblr-btn-hover-color: var(--flnx-text-dark);
  --tblr-btn-hover-bg: var(--flnx-danger);
  --tblr-btn-hover-border-color: var(--flnx-danger);
}

body, button, input, select, textarea { font-feature-settings: 'cv11' 1; }

/* Búsqueda global (Ctrl+K) */
.flnx-search { position: fixed; inset: 0; z-index: 2000; display: flex; align-items: flex-start; justify-content: center; padding: 10vh 1rem 1rem; background: rgba(0, 0, 0, .45); }
.flnx-search[hidden] { display: none; }
.flnx-search-box { width: 100%; max-width: 40rem; max-height: 75vh; display: flex; flex-direction: column; overflow: hidden; background: var(--tblr-bg-surface); border: 1px solid var(--tblr-border-color); border-radius: var(--tblr-border-radius-lg, .5rem); box-shadow: 0 1rem 3rem rgba(0, 0, 0, .3); }
.flnx-search-input { border: 0; border-bottom: 1px solid var(--tblr-border-color); border-radius: 0; padding: 1rem 1.25rem; font-size: 1.1rem; box-shadow: none !important; }
.flnx-search-results { overflow-y: auto; padding: .5rem; }
.flnx-search-group { padding: .5rem .75rem .25rem; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--tblr-secondary); }
.flnx-search-item { display: flex; align-items: center; gap: .5rem; padding: .5rem .75rem; border-radius: var(--tblr-border-radius, .375rem); color: inherit; text-decoration: none; }
.flnx-search-item small { margin-left: auto; color: var(--tblr-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 45%; }
.flnx-search-item.active, .flnx-search-item:hover { background: var(--tblr-active-bg, rgba(0, 0, 0, .06)); color: inherit; }
.flnx-search-empty { padding: 1.5rem; text-align: center; color: var(--tblr-secondary); }

/* Escáner: casillas de alcance con borde suave también al estar marcadas (el primario pleno resaltaba demasiado). */
.flnx-scan-modules .form-selectgroup-input:checked + .form-selectgroup-label { border-color: color-mix(in srgb, var(--tblr-primary) 40%, var(--tblr-border-color)); }

/* kbd en fuente mono: sus glifos quedan más altos que en la sans de Tabler; 2px arriba los centra ópticamente. */
kbd.font-monospace { padding-top: 2px; }

/* Cliente de APIs */
.flnx-api-pre { max-height: 32rem; overflow: auto; white-space: pre-wrap; word-break: break-word; font-size: .8125rem; }
.flnx-api-item { cursor: pointer; }
.flnx-api-item.active { background: var(--tblr-active-bg, rgba(0,0,0,.05)); }