@import "tailwindcss";

@theme {
  --font-sans: -apple-system, BlinkMacSystemFont, sans-serif;

  --text-xs: 11px;
  --text-base: 13px;

  --color-bg: #282828;
  --color-selected-unfocused: #2e2e2e;

  --color-primary: #0051d2;
  --color-button: #606060;
  --color-button-primary: #1563d7;
  --color-button-primary-active: #239bed;
  --color-button-active: #777777;

  --color-popover: #1e1e1e;
  --color-popover-surface: #212121;
  --color-surface: #2b2b2b;
  --color-surface-border: #4b4b4b;

  --color-indicator-green: #32d74b;
  --color-indicator-red: #ff453a;
  --color-switch-track: #cacaca;
  --color-switch-disabled: #414141;
  --color-switch-enabled: #1664da;

  --color-sidebar: #383838;
  --color-sidebar-unfocused: #141414;
  --color-secondary: #b4b4b4;
  --color-secondary-unfocused: #555555;
}

* {
  @apply select-none cursor-default focus-visible:shadow-blue-300;
}

body {
  @apply bg-bg text-neutral-200 min-h-screen text-base leading-tight;
}

#root {
  @apply min-h-screen;
}

/*[popover]:popover-open {
  @apply translate-y-0 opacity-100 transition-discrete;
}
[popover] {
  @apply absolute w-lg mx-auto bg-popover text-neutral-200 py-4 px-4 rounded-lg border border-surface-border;
}
[popover]::backdrop {
  @apply bg-black/25 transition-discrete;
}

@starting-style {
  [popover]:popover-open {
    @apply -translate-y-16 opacity-0 transition-all duration-200 transition-discrete absolute w-lg mx-auto bg-popover text-neutral-200 py-4 px-4 rounded-lg border border-surface-border;
  }
}*/