@import "tailwindcss";

/* QSupport Custom Themes and Utility Classes */
:root {
  --color-primary: #6366f1;
  --color-primary-hover: #4f46e5;
  --color-bg-dark: #020617;
  --color-card-dark: #0f172a;
}

body {
  background-color: var(--color-bg-dark);
  color: #f8fafc;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  user-select: none;
}

/* 10-Digit ID Custom Typography */
.id-display {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  letter-spacing: 0.15em;
  font-feature-settings: "tnum";
}

/* Remote Viewer Canvas */
.remote-screen-container {
  aspect-ratio: 16 / 9;
  background-color: #000000;
  cursor: crosshair;
}

/* Smooth modal transitions */
.modal-backdrop {
  backdrop-filter: blur(8px);
}