@import "tailwindcss";
@import "flowbite/src/themes/default";
@plugin "flowbite/plugin";
@source "../../app/Views/**/*.php";
@source "../../public/**/*.js";
@source "../../node_modules/flowbite/**/*.js";

/* ===== Variáveis (LIGHT) ===== */
:root {
  --background: 0 0% 100%;
  --foreground: 222.2 84% 4.9%;
  --card: 0 0% 100%;
  --card-foreground: 222.2 84% 4.9%;
  --popover: 0 0% 100%;
  --popover-foreground: 222.2 84% 4.9%;
  --primary: 221.2 83.2% 53.3%;
  --primary-foreground: 210 40% 98%;
  --secondary: 210 40% 96%;
  --secondary-foreground: 222.2 84% 4.9%;
  --muted: 210 40% 96%;
  --muted-foreground: 215.4 16.3% 46.9%;
  --accent: 210 40% 96%;
  --accent-foreground: 222.2 84% 4.9%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 210 40% 98%;
  --border: 214.3 31.8% 91.4%;
  --input: 214.3 31.8% 91.4%;
  --ring: 221.2 83.2% 53.3%;

  /* Sidebar / Chrome */
  --chrome-bg: 215 28% 17%;
  --chrome-foreground: 210 40% 98%;
  --chrome-muted-foreground: 215 16% 75%;
  --chrome-border: 215 20% 24%;
  --chrome-hover: 215 24% 22%;
  --chrome-active: 215 24% 26%;
  --chrome-input: 215 22% 20%;
  --chrome-placeholder: 215 12% 65%;
}

/* ===== Variáveis (DARK) ===== */
.dark {
  --background: 222.2 84% 4.9%;
  --foreground: 210 40% 98%;
  --card: 222.2 84% 4.9%;
  --card-foreground: 210 40% 98%;
  --popover: 222.2 84% 4.9%;
  --popover-foreground: 210 40% 98%;
  --primary: 217.2 91.2% 59.8%;
  --primary-foreground: 222.2 84% 4.9%;
  --secondary: 217.2 32.6% 17.5%;
  --secondary-foreground: 210 40% 98%;
  --muted: 217.2 32.6% 17.5%;
  --muted-foreground: 215 20.2% 65.1%;
  --accent: 217.2 32.6% 17.5%;
  --accent-foreground: 210 40% 98%;
  --destructive: 0 62.8% 30.6%;
  --destructive-foreground: 210 40% 98%;
  --border: 217.2 32.6% 17.5%;
  --input: 217.2 32.6% 17.5%;
  --ring: 224.3 76.3% 94.1%;

  --chrome-bg: 215 28% 17%;
  --chrome-foreground: 210 40% 98%;
  --chrome-muted-foreground: 215 16% 75%;
  --chrome-border: 215 20% 24%;
  --chrome-hover: 215 24% 22%;
  --chrome-active: 215 24% 26%;
  --chrome-input: 215 22% 20%;
  --chrome-placeholder: 215 12% 65%;
}

/* Scrollbar etc (puro CSS) */
.sidebar-scroll{
  scrollbar-width: thin; scrollbar-color: rgba(148,163,184,.25) transparent; -webkit-overflow-scrolling: touch;
}
.sidebar-scroll::-webkit-scrollbar{ width: 8px; }
.sidebar-scroll::-webkit-scrollbar-track{ background: transparent; }
.sidebar-scroll::-webkit-scrollbar-thumb{
  background-color: rgba(148,163,184,.25);
  border-radius: 9999px; border: 2px solid transparent; background-clip: padding-box;
}
.sidebar-scroll:hover::-webkit-scrollbar-thumb{ background-color: rgba(148,163,184,.35); }
.dark .sidebar-scroll{ scrollbar-color: rgba(148,163,184,.25) transparent; }
.dark .sidebar-scroll::-webkit-scrollbar-thumb{ background-color: rgba(148,163,184,.25); }