:root {
  --ui-bg: #070913;
  --ui-bg-soft: #0d1326;
  --ui-surface: #12142a;
  --ui-surface-2: #171934;
  --ui-border: #1ed4de;
  --ui-text: #f5f8ff;
  --ui-muted: #babce0;
  --ui-accent: #14f2ff;
  --ui-good: #63ff94;
  --ui-warn: #ffd166;
  --ui-danger: #ff5f7a;
  --ui-radius: 12px;
}

html,
body,
#root {
  min-height: 100%;
}

body {
  margin: 0;
  background: linear-gradient(180deg, #05040d 0%, var(--ui-bg) 48%, #120b21 100%) !important;
  color: var(--ui-text) !important;
  font-family: "Rajdhani", "Trebuchet MS", "Segoe UI", sans-serif !important;
}

#root {
  color: inherit;
}

a {
  color: #7ef9ff;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
[type="button"],
[type="submit"],
[type="reset"] {
  border: 1px solid var(--ui-border) !important;
  background: linear-gradient(180deg, #1d2450 0%, #131939 100%) !important;
  color: #f1f5ff !important;
  border-radius: 10px !important;
  min-height: 34px;
  cursor: pointer;
}

button:hover,
[type="button"]:hover,
[type="submit"]:hover,
[type="reset"]:hover {
  filter: brightness(1.06);
}

input,
select,
textarea {
  border: 1px solid #365e73 !important;
  background: #0c1228 !important;
  color: #eef3ff !important;
  border-radius: 10px !important;
  padding: 8px 10px;
}

[class*="panel"],
[class*="card"],
[class*="layout"],
[class*="container"],
[class*="dashboard"],
[class*="monitor"],
[class*="storage"],
[class*="classifier"] {
  border-radius: var(--ui-radius);
}

.App {
  min-height: 100vh;
}

/* Xt3ndr simplified and reliable click behavior */
.xt3ndr-page {
  background: transparent !important;
  color: var(--ui-text) !important;
  padding: 14px !important;
}

.xt3ndr-shell {
  max-width: 100% !important;
  gap: 10px !important;
}

.xt3ndr-hero,
.xt3ndr-panel,
.xt3ndr-chat-panel,
.xt3ndr-mqtt-panel,
.xt3ndr-venue-panel,
.xt3ndr-chair-panel,
.xt3ndr-conference-layout,
.xt3ndr-modal,
.xt3ndr-connectivity-modal {
  background: linear-gradient(180deg, var(--ui-surface) 0%, var(--ui-surface-2) 100%) !important;
  border: 1px solid var(--ui-border) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.5) !important;
}

.xt3ndr-mode,
.xt3ndr-mode-sticky,
.xt3ndr-mode-floating {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  z-index: 3 !important;
  pointer-events: auto !important;
}

.xt3ndr-mode-floating-hidden {
  display: none !important;
}

.xt3ndr-mode > * {
  pointer-events: auto !important;
}

.xt3ndr-board,
.xt3ndr-conference-stage,
.xt3ndr-chat-list,
.xt3ndr-task-list,
.xt3ndr-diagnostics-table-wrap,
.xt3ndr-connectivity-table-wrap {
  background: rgba(8, 11, 25, 0.82) !important;
  border: 1px solid var(--ui-border) !important;
}

.xt3ndr-modal-backdrop,
.xt3ndr-venue-viewer-backdrop,
.xt3ndr-venue-model-backdrop,
.xt3ndr-venue-assign-backdrop {
  background: rgba(3, 8, 16, 0.62) !important;
}

.xt3ndr-error,
.is-danger,
.xt3ndr-page .is-danger {
  border-color: #a84848 !important;
  background: rgba(125, 36, 36, 0.48) !important;
}

@media (max-width: 980px) {
  .xt3ndr-page {
    padding: 10px !important;
  }
}
