/* VeriTrust Suite — shared console layer (2026-07 Sigil Console kit)
   ───────────────────────────────────────────────────────────────────
   Loaded by every panel AFTER tokens.css / luxe.css / glass.css.
   Pure additive a11y + chrome for the shared command palette (vt-palette.js).
   Uses only existing CSS variables — no new colors, no fonts, no CDN. */

/* accessibility: visible gold focus ring for keyboard users.
   :where() keeps specificity at zero so it never overrides app styles. */
.luxe :where(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--gold-300);
  outline-offset: 2px;
}

/* skip link — first tab stop, hidden until focused */
.vtc-skip {
  position: fixed; z-index: 400; top: 12px; inset-inline-start: 12px;
  padding: 10px 16px; border-radius: 99px; border: none; cursor: pointer;
  background: linear-gradient(180deg, var(--gold-300), var(--gold));
  color: #1A1304; font: 800 12.5px/1 var(--sans, system-ui); text-decoration: none;
  transform: translateY(-250%); transition: transform .18s var(--ease-out, ease-out);
}
.vtc-skip:focus { transform: none; }

/* keyboard hint chip */
.vtc-kbd {
  display: inline-flex; align-items: center;
  font-family: var(--mono, ui-monospace, monospace); font-size: 10px; font-weight: 700;
  line-height: 1; letter-spacing: 0.4px; color: var(--text-lo);
  padding: 5px 7px; border-radius: 6px; border: 1px solid var(--hairline-2);
  background: rgba(255,255,255,0.03); white-space: nowrap;
}

/* ---- command palette (vt-palette.js) ---- */
.vtc-pal-overlay {
  position: fixed; inset: 0; z-index: 500;
  background: rgba(2,6,12,0.66);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  display: flex; justify-content: center; align-items: flex-start;
  padding: 9vh 18px 18px;
}
.vtc-pal {
  width: min(600px, 96vw); max-height: 70vh;
  display: flex; flex-direction: column;
  border-radius: var(--r-xl, 20px); padding: 14px;
  background: var(--card, rgba(13,29,48,0.92));
  border: 1px solid var(--hairline-2);
  box-shadow: var(--sh-float, 0 24px 70px rgba(0,0,0,0.55));
  animation: vtc-in .2s var(--ease-out, ease-out);
}
@keyframes vtc-in { from { transform: translateY(8px); } to { transform: none; } }
.vtc-pal-inputrow {
  display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 14px;
  border-radius: 13px; background: var(--card-2, rgba(255,255,255,0.05));
  border: 1px solid var(--gold-line); flex-shrink: 0;
}
.vtc-pal-input {
  flex: 1; min-width: 0; border: none; background: none; outline: none;
  color: var(--text-hi); font: 600 14.5px/1.2 var(--sans, system-ui);
}
.vtc-pal-list { overflow-y: auto; margin-top: 10px; scrollbar-width: none; }
.vtc-pal-list::-webkit-scrollbar { display: none; }
.vtc-pal-eyebrow {
  font: 700 9.5px/1 var(--sans, system-ui); letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--gold-300); padding: 8px 10px 7px;
}
.vtc-pal-row {
  width: 100%; display: flex; align-items: center; gap: 11px;
  padding: 11px 12px; border-radius: 11px; border: 1px solid transparent;
  background: none; cursor: pointer; text-align: start; font: inherit; color: inherit;
}
.vtc-pal-row.on { background: var(--gold-glow); border-color: var(--gold-line); }
.vtc-pal-dot {
  width: 6px; height: 6px; border-radius: 99px; flex-shrink: 0;
  background: var(--hairline-2);
}
.vtc-pal-row.on .vtc-pal-dot { background: var(--gold); box-shadow: 0 0 7px var(--gold); }
.vtc-pal-a {
  flex: 1; min-width: 0; font-size: 13.5px; font-weight: 700; color: var(--text-hi);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.vtc-pal-row.on .vtc-pal-a { color: var(--gold-100); }
.vtc-pal-b {
  font-size: 10.5px; font-weight: 600; color: var(--text-lo); flex-shrink: 0;
  white-space: nowrap;
}
.vtc-pal-empty { text-align: center; padding: 26px 0 14px; font: 600 13px/1.5 var(--sans, system-ui); color: var(--text-lo); }
.vtc-pal-foot {
  display: flex; align-items: center; gap: 14px; flex-shrink: 0;
  padding: 10px 10px 2px; margin-top: 8px; border-top: 1px solid var(--hairline);
  font: 600 11px/1 var(--sans, system-ui); color: var(--text-lo);
}
.vtc-pal-foot span { display: inline-flex; align-items: center; gap: 6px; }

@media (prefers-reduced-motion: reduce) {
  .vtc-pal { animation: none; }
  .vtc-skip { transition: none; }
  /* suite-wide: collapse decorative motion (foil sheen, pulses, entrances)
     for users who ask for reduced motion. Transitions stay instant, states
     still apply — nothing is hidden, it just stops moving. */
  .luxe *, .luxe *::before, .luxe *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}