/*
 * QS Web Console — small CSS on top of Tailwind CDN.
 *
 * Tailwind handles 99% of styling. Anything here is either (a) a hack
 * that Tailwind can't do cleanly (e.g. scrollbar colour) or (b) a
 * brand-specific rule we don't want to sprinkle through templates.
 */

/* Scrollbars — slim + brand-accent so big SQL tables don't look cheap. */
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: #f1f5f9; }
*::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
*::-webkit-scrollbar-thumb:hover { background: #0b3d91; }

/* Mono font used by SQL console + pipeline tables. Using Inter + JetBrains
   Mono keeps a consistent x-height so the two fonts don't visually clash. */
@font-face {
  font-family: 'Inter';
  font-display: swap;
  src: local('Inter');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-display: swap;
  src: local('JetBrains Mono');
}

/* HTMX polling indicator — shows briefly while a fragment is in-flight
   so the operator knows data is refreshing. */
.htmx-indicator { opacity: 0; transition: opacity 120ms ease-in-out; }
.htmx-request .htmx-indicator { opacity: 1; }
.htmx-request.htmx-indicator { opacity: 1; }

/* Alerts page matchers column wraps too eagerly otherwise. */
.matchers-cell { word-break: break-all; }