/* Qxs presentation layer. Existing Filament layouts, controls and state stay native. */
:root {
  --qxs-bg: #08090b;
  --qxs-surface: #0e1117;
  --qxs-surface-raised: #121720;
  --qxs-line: #252c38;
  --qxs-text: #d6d8de;
  --qxs-muted: #9aa3b4;
  --qxs-blue: #275ff0;
  --qxs-blue-soft: #acc6ff;
}

.fi-body {
  background: var(--qxs-bg) !important;
  color: var(--qxs-text);
  -webkit-font-smoothing: antialiased;
}

.fi-body ::selection {
  background: #2852a5;
  color: #fff;
}
.fi-main,
.fi-main-ctn {
  min-width: 0;
}
.fi-page {
  row-gap: 1.5rem;
}
.fi-header-heading {
  color: #edf1fa;
  letter-spacing: -0.025em;
}
.fi-header-subheading {
  color: var(--qxs-muted);
}

.fi-topbar,
.fi-topbar > nav,
.fi-sidebar,
.fi-sidebar-header {
  background-color: #0b0e13 !important;
  box-shadow: none !important;
}
.fi-topbar {
  border-bottom: 1px solid var(--qxs-line);
}
.fi-sidebar {
  border-inline-end: 1px solid #202631;
}
.fi-sidebar-group-label {
  color: #8492aa;
  letter-spacing: 0.035em;
  font-size: 0.7rem;
}
.fi-sidebar-item-btn {
  border-radius: 4px;
  min-height: 39px;
}
.fi-sidebar-item-label {
  color: #b9c1d0;
  font-weight: 450;
}
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
  background: #12203a !important;
  box-shadow: inset 2px 0 0 #4f83ff;
}
.fi-sidebar-item.fi-active
  > .fi-sidebar-item-btn
  > :is(.fi-sidebar-item-label, .fi-icon) {
  color: #c6d9ff !important;
}
.fi-sidebar-item:not(.fi-active) > .fi-sidebar-item-btn:hover {
  background: #141b28 !important;
}
.fi-sidebar-close-overlay {
  background-color: rgb(0 0 0 / 65%) !important;
}

.qxs-brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #e7edf9;
}
.qxs-brand-mark {
  width: 27px;
  height: 27px;
  flex: none;
  color: #6494ff;
}
.qxs-brand-word {
  font:
    800 25px/1 Arial,
    sans-serif;
  letter-spacing: -0.07em;
  color: #e7edf9;
}
.qxs-brand-dot {
  margin-inline-start: 2px;
  color: #5c8dff;
}

.qxs-banner {
  position: relative;
  isolation: isolate;
  width: 100%;
  height: clamp(220px, 23vw, 260px);
  min-width: 0;
  overflow: hidden;
  border: 1px solid #26354d;
  border-bottom-color: #315da6;
  border-radius: 5px;
  background: #03050a;
}
.qxs-banner-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.qxs-banner-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #dfeaff;
  font:
    900 clamp(80px, 13vw, 160px)/1 "Arial Black",
    Impact,
    sans-serif;
  letter-spacing: -0.07em;
  pointer-events: none;
}
.qxs-banner[data-qxs-ready="true"] .qxs-banner-fallback {
  visibility: hidden;
}
.qxs-motion-toggle {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid #34445f;
  border-radius: 4px;
  background: rgb(8 15 27 / 85%);
  color: #c6d8fb;
  cursor: pointer;
  transition:
    background-color 140ms,
    border-color 140ms;
}
.qxs-motion-toggle[hidden] {
  display: none;
}
.qxs-motion-toggle:hover {
  border-color: #6c95e8;
  background: #13223b;
}
.qxs-motion-toggle svg {
  width: 20px;
  height: 20px;
}
.qxs-motion-play {
  display: none;
}
.qxs-banner[data-qxs-paused="true"] .qxs-motion-pause {
  display: none;
}
.qxs-banner[data-qxs-paused="true"] .qxs-motion-play {
  display: block;
}
.qxs-motion-toggle:focus-visible {
  outline: 2px solid #a9c8ff;
  outline-offset: 3px;
}

/* Surface styling does not change dimensions, visibility or behavior of forms. */
.fi-section,
.fi-ta-ctn,
.fi-sc-tabs.fi-contained,
.fi-wi-stats-overview-stat,
.fi-modal-window,
.fi-dropdown-panel,
.fi-simple-main,
.fi-no-notification {
  background-color: var(--qxs-surface) !important;
  border-radius: 6px;
  box-shadow: 0 0 0 1px var(--qxs-line) !important;
}
.fi-section-header,
.fi-ta-header,
.fi-ta-toolbar,
.fi-ta-header-toolbar,
.fi-ta-footer,
.fi-modal-header {
  border-color: var(--qxs-line) !important;
}
.fi-section-header-heading,
.fi-ta-header-heading,
.fi-modal-heading,
.fi-wi-stats-overview-stat-value {
  color: #edf2ff;
}
.fi-section-header-description,
.fi-modal-description,
.fi-fo-field-wrp-helper-text,
.fi-ta-header-description {
  color: var(--qxs-muted);
}
.fi-tabs {
  border-color: var(--qxs-line) !important;
  background-color: #0c1018;
}
.fi-tabs-item {
  border-radius: 3px;
}
.fi-tabs-item.fi-active {
  background-color: #182944 !important;
  color: #d1e1ff !important;
}
.fi-dropdown-list-item:not(.fi-disabled):hover {
  background: #19243a !important;
}

.fi-ta-table thead {
  background: #111722;
}
.fi-ta-header-cell {
  color: #a4b2cb;
}
.fi-ta-header-cell-label {
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.025em;
}
.fi-ta-table :is(tr, td, th) {
  border-color: #202733 !important;
}
.fi-ta-row:not(.fi-selected):hover {
  background-color: #111b2a !important;
}
.fi-ta-row.fi-selected {
  background-color: #172b4c !important;
}
.fi-ta-text-item-label {
  color: #d2d9e6;
}
.fi-ta-empty-state-heading {
  color: #dfe8f8;
}
.fi-ta-empty-state-description {
  color: #9aa8bf;
}

.fi-input-wrp {
  background-color: #0a1019 !important;
  border-radius: 4px;
}
.fi-input-wrp:not(.fi-invalid) {
  box-shadow: 0 0 0 1px #303c51 !important;
}
.fi-input-wrp:not(.fi-invalid):focus-within {
  box-shadow: 0 0 0 2px #6a97ff !important;
}
.fi-input-wrp.fi-disabled {
  background-color: #10141c !important;
  opacity: 0.7;
}
.fi-input,
.fi-textarea,
.fi-select-input {
  color: #e4ebf8 !important;
}
.fi-input::placeholder,
.fi-textarea::placeholder {
  color: #8591a7;
  opacity: 1;
}
.fi-fo-field-wrp-label,
.fi-fo-field-label {
  color: #c1ccdf;
}
.fi-fo-select-option:hover {
  background-color: #192b49 !important;
}

.fi-btn {
  min-height: 36px;
  border-radius: 4px;
  font-weight: 500;
  letter-spacing: 0.005em;
  transition:
    background-color 140ms,
    border-color 140ms,
    box-shadow 140ms;
}
.fi-btn:not(.fi-color),
.fi-btn.fi-color-gray {
  border: 1px solid #34415a;
  background-color: #121c2d !important;
  color: #dce7fa !important;
}
.fi-btn.fi-color-primary:not(.fi-outlined) {
  border: 1px solid #5583fa;
  background-color: #2759d6 !important;
  color: #f3f7ff !important;
  box-shadow: none;
}
.fi-btn.fi-color-primary:not(.fi-outlined):not([disabled]):hover {
  background-color: #3268ed !important;
}
.fi-btn.fi-color-primary.fi-outlined {
  border: 1px solid #436aa8;
  background-color: #111d31 !important;
  color: #bfd5ff !important;
}
.fi-btn.fi-color-primary > .fi-icon {
  color: currentColor !important;
}
.fi-btn:focus-visible,
.fi-icon-btn:focus-visible,
.fi-sidebar-item-btn:focus-visible {
  outline: 2px solid #9ec0ff;
  outline-offset: 3px;
}
.fi-btn[disabled],
.fi-btn.fi-disabled {
  opacity: 0.55;
}

/* The original workspace uses inline amber colors; override appearance only. */
.fi-page :is(section, article, details)[style*="background:#18181b"],
.fi-page :is(section, article, details)[style*="background: #18181b"] {
  background-color: var(--qxs-surface) !important;
  border-color: var(--qxs-line) !important;
  border-radius: 6px !important;
}
.fi-page article[style*="background:#202024"] {
  background-color: #101621 !important;
  border-color: #2a3548 !important;
}
.fi-page div[style*="background:#27272a"] {
  background-color: #151e2d !important;
  border-radius: 4px !important;
}
.fi-page [style*="color:#f59e0b"],
.fi-page [style*="color: #f59e0b"],
.fi-page a div[style*="color:#fbbf24"] {
  color: #95b9ff !important;
}
.fi-page :is(a, button)[style*="background:#f59e0b"],
.fi-page :is(a, button)[style*="background: #f59e0b"] {
  min-height: 38px;
  border: 1px solid #507fea !important;
  border-radius: 4px !important;
  background-color: #2759d6 !important;
  color: #f1f5ff !important;
}
.fi-page :is(a, button)[style*="background:#f59e0b"]:hover {
  background-color: #3268ed !important;
}
.fi-page :is(a, button)[style]:focus-visible {
  outline: 2px solid #a9c8ff;
  outline-offset: 3px;
}

@media (max-width: 767px) {
  .qxs-banner {
    height: 175px;
    border-radius: 4px;
  }
  .qxs-banner-fallback {
    font-size: 100px;
  }
  .fi-page {
    row-gap: 1.1rem;
  }
  .fi-sidebar {
    border-inline-end-color: #34425a;
  }
  .fi-page section[style*="repeat(auto-fit,minmax(245px,1fr))"] {
    grid-template-columns: repeat(
      auto-fit,
      minmax(min(100%, 245px), 1fr)
    ) !important;
  }
  .fi-page div[style*="repeat(auto-fit,minmax(330px,1fr))"] {
    grid-template-columns: repeat(
      auto-fit,
      minmax(min(100%, 330px), 1fr)
    ) !important;
  }
}
@media (max-width: 420px) {
  .qxs-banner {
    height: 155px;
  }
  .qxs-banner-fallback {
    font-size: 86px;
  }
  .qxs-brand-mark {
    width: 24px;
    height: 24px;
  }
  .qxs-brand-word {
    font-size: 23px;
  }
}
@media (pointer: coarse) {
  .fi-btn:not(.fi-size-xs),
  .fi-sidebar-item-btn {
    min-height: 44px;
  }
  .fi-input,
  .fi-textarea,
  .fi-select-input {
    font-size: 16px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .qxs-motion-toggle {
    transition: none;
  }
}
@media (forced-colors: active) {
  .qxs-banner {
    border-color: CanvasText;
  }
  .qxs-banner-canvas {
    visibility: hidden;
  }
  .qxs-banner .qxs-banner-fallback {
    visibility: visible;
    color: CanvasText;
  }
  .qxs-motion-toggle {
    border-color: ButtonText;
    color: ButtonText;
  }
}