/* Parallel UI stability fixes — loaded last so delayed component styles cannot override them. */
:root {
  --parallel-text-font: "IBM Plex Sans", "IBM Plex Sans Fallback", Arial, sans-serif;
}

html,
body,
button,
input,
textarea,
select,
option,
table,
th,
td {
  font-family: var(--parallel-text-font) !important;
}

/* Keep the compact terminal typography consistent after the app finishes loading. */
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
label,
small,
strong,
.token-name,
.token-symbol,
.section-title,
.column-title,
.search-input,
.search-input::placeholder,
input::placeholder,
textarea::placeholder {
  font-family: var(--parallel-text-font) !important;
}

/* Token artwork: the camera belongs to the direct image-hover state only. */
.parallel-token-avatar {
  position: relative !important;
  overflow: visible !important;
}

.parallel-token-avatar .parallel-camera-overlay,
.parallel-token-avatar [class*="camera"],
.parallel-token-avatar [data-camera-overlay] {
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: inherit !important;
  color: #fff !important;
  background: rgba(4, 10, 18, 0.58) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  transition: opacity 140ms ease, visibility 140ms ease !important;
}

@media (hover: hover) and (pointer: fine) {
  .parallel-token-avatar:hover .parallel-camera-overlay,
  .parallel-token-avatar:hover [class*="camera"],
  .parallel-token-avatar:hover [data-camera-overlay] {
    opacity: 1 !important;
    visibility: visible !important;
  }
}

.parallel-camera-overlay svg {
  width: 16px !important;
  height: 16px !important;
  display: block !important;
  stroke: currentColor !important;
}

/* Use the genuine saved Sui artwork for every avatar network badge. */
.parallel-sui-avatar-badge {
  position: absolute !important;
  right: -4px !important;
  bottom: -4px !important;
  z-index: 7 !important;
  display: grid !important;
  place-items: center !important;
  width: 15px !important;
  height: 15px !important;
  padding: 2px !important;
  border: 1px solid #5db7ff !important;
  border-radius: 50% !important;
  background: #07111d !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

.parallel-sui-avatar-badge img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: contain !important;
  object-position: center !important;
}

/* Center the connection/indexer telemetry while retaining preset-left and tools-right. */
.parallel-footer-layout {
  position: fixed !important;
}

.parallel-footer-center {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  z-index: 4 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: max-content !important;
  max-width: 52vw !important;
  transform: translate(-50%, -50%) !important;
  white-space: nowrap !important;
}

.parallel-footer-center > * {
  margin: 0 !important;
  flex: 0 0 auto !important;
}

@media (max-width: 980px) {
  .parallel-footer-center {
    display: none !important;
  }
}