@import 'tailwindcss';

@config "../tailwind.config.js";

/*
  The default border color has changed to `currentcolor` in Tailwind CSS v4,
  so we've added these compatibility styles to make sure everything still
  looks the same as it did with Tailwind CSS v3.

  Apply border-color defaults only to elements that typically have borders,
  avoiding interference with layout elements like flex containers.
*/
@layer base {
  button,
  input,
  select,
  textarea,
  [class*="border"] {
    border-color: var(--color-gray-200, currentcolor);
  }
}

/* Enhanced typography and rendering */
:root {
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  line-height: 1.5;
  font-weight: 400;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Full viewport layout for dashboard */
body {
  margin: 0;
  min-height: 100vh;
  background: transparent; /* Let our gradient background show through */
}

#root {
  min-height: 100vh;
  width: 100%;
}