/* ============================================
   PAPERCLIP INDIGO THEME v6
   ============================================ */

/* Force variables with higher specificity */
html.dark, .dark {
  --primary: oklch(65% .2 277) !important;
  --primary-foreground: #fff !important;
  --radius: .5rem !important;
  --ring: oklch(65% .2 277) !important;
  --background: #0f1729 !important;
  --foreground: #e2e8f0 !important;
  --card: #162037 !important;
  --card-foreground: #e2e8f0 !important;
  --popover: #162037 !important;
  --popover-foreground: #e2e8f0 !important;
  --secondary: #1e293b !important;
  --secondary-foreground: #e2e8f0 !important;
  --muted: #1e293b !important;
  --muted-foreground: #94a3b8 !important;
  --accent: #1e293b !important;
  --accent-foreground: #e2e8f0 !important;
  --border: #2a3a5c !important;
  --input: #2a3a5c !important;
  --sidebar-background: #0c1323 !important;
  --sidebar-foreground: #cbd5e1 !important;
  --sidebar-primary: #6366f1 !important;
  --sidebar-primary-foreground: #fff !important;
  --sidebar-accent: #1e293b !important;
  --sidebar-accent-foreground: #e2e8f0 !important;
  --sidebar-border: #1e3a5f !important;
}

/* Force background color on body directly */
html.dark body,
.dark body {
  background-color: #0f1729 !important;
  color: #e2e8f0 !important;
}

/* Force on the main app container */
html.dark #root,
html.dark [data-slot="content"],
html.dark main {
  background-color: #0f1729 !important;
}

/* Sidebar */
html.dark [data-slot="sidebar"],
html.dark aside[class*="border-r"],
html.dark nav[class*="flex-col"] {
  background-color: #0c1323 !important;
  border-color: #1e3a5f !important;
}

/* Sidebar active item */
html.dark [data-active="true"],
html.dark [aria-current="page"] {
  background-color: #1e3a6f !important;
  color: #a5b4fc !important;
}

/* Cards */
html.dark .bg-card,
html.dark [class*="bg-card"] {
  background-color: #162037 !important;
  border-color: #2a3a5c !important;
}

/* Buttons primary */
html.dark .bg-primary {
  background-color: #4f46e5 !important;
  color: #fff !important;
}
html.dark .bg-primary:hover {
  background-color: #4338ca !important;
}

/* Text primary */
html.dark .text-primary {
  color: #818cf8 !important;
}

/* Border */
html.dark .border-border,
html.dark [class*="border-border"] {
  border-color: #2a3a5c !important;
}

/* Muted background */
html.dark .bg-muted,
html.dark [class*="bg-muted"] {
  background-color: #1e293b !important;
}

/* Focus rings */
html.dark *:focus-visible {
  outline: 2px solid #6366f1 !important;
  outline-offset: 2px;
}

/* Input focus */
html.dark input:focus,
html.dark textarea:focus {
  border-color: #6366f1 !important;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.25) !important;
}

/* Scrollbar */
html.dark *::-webkit-scrollbar-thumb {
  background: #2a3a5c !important;
  border-radius: 4px;
}
html.dark *::-webkit-scrollbar-track {
  background: #0f1729 !important;
}

/* Rounded corners everywhere */
html.dark [class*="rounded-lg"] { border-radius: .5rem !important; }
html.dark [class*="rounded-xl"] { border-radius: .75rem !important; }
html.dark [class*="rounded-md"] { border-radius: .375rem !important; }

/* === LIGHT MODE === */
html:not(.dark), :root:not(.dark) {
  --primary: #4f46e5 !important;
  --primary-foreground: #fff !important;
  --ring: #4f46e5 !important;
  --sidebar-background: #f1f5f9 !important;
  --sidebar-primary: #4f46e5 !important;
}
