/*
 * Erponix color skin.
 * Visual-only layer: no sizing, spacing, or font changes.
 */
:root {
    --background: 216 33% 98%;
    --foreground: 222 47% 11%;
    --card: 0 0% 100%;
    --card-foreground: 222 47% 11%;
    --popover: 0 0% 100%;
    --popover-foreground: 222 47% 11%;
    --primary: 160 84% 39%;
    --primary-foreground: 0 0% 100%;
    --secondary: 215 36% 96%;
    --secondary-foreground: 222 47% 11%;
    --muted: 214 38% 96%;
    --muted-foreground: 218 15% 44%;
    --accent: 173 72% 94%;
    --accent-foreground: 168 76% 25%;
    --destructive: 349 89% 60%;
    --destructive-foreground: 0 0% 100%;
    --border: 215 26% 90%;
    --input: 215 26% 90%;
    --ring: 168 76% 42%;
    --sidebar-background: 0 0% 100%;
    --sidebar-foreground: 222 24% 28%;
    --sidebar-primary: 160 84% 39%;
    --sidebar-primary-foreground: 0 0% 100%;
    --sidebar-accent: 204 100% 96%;
    --sidebar-accent-foreground: 222 47% 20%;
    --sidebar-border: 214 30% 91%;
    --sidebar-ring: 168 76% 42%;
}

body {
    background:
        radial-gradient(circle at 18% 8%, rgba(20, 184, 166, 0.08), transparent 28rem),
        radial-gradient(circle at 88% 0%, rgba(99, 102, 241, 0.08), transparent 24rem),
        hsl(var(--background));
}

[data-sidebar="sidebar"] {
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
    border-color: hsl(var(--sidebar-border));
    box-shadow: 8px 0 24px rgba(31, 41, 55, 0.04);
}

[data-sidebar="header"] {
    border-bottom: 1px solid hsl(var(--sidebar-border) / 0.78);
}

[data-sidebar="input"] {
    background: #ffffff;
    border-color: hsl(var(--sidebar-border));
}

[data-sidebar="input"]:focus-visible {
    border-color: hsl(var(--primary));
    box-shadow: 0 0 0 3px hsl(var(--primary) / 0.12);
}

[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 1) [data-sidebar="menu-button"] > svg:first-child,
[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 1) [data-sidebar="menu-sub-button"] > svg:first-child {
    color: #0ea5e9;
}

[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 2) [data-sidebar="menu-button"] > svg:first-child,
[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 2) [data-sidebar="menu-sub-button"] > svg:first-child {
    color: #8b5cf6;
}

[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 3) [data-sidebar="menu-button"] > svg:first-child,
[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 3) [data-sidebar="menu-sub-button"] > svg:first-child {
    color: #f97316;
}

[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 4) [data-sidebar="menu-button"] > svg:first-child,
[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 4) [data-sidebar="menu-sub-button"] > svg:first-child {
    color: #10b981;
}

[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 5) [data-sidebar="menu-button"] > svg:first-child,
[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n + 5) [data-sidebar="menu-sub-button"] > svg:first-child {
    color: #3b82f6;
}

[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n) [data-sidebar="menu-button"] > svg:first-child,
[data-sidebar="menu"] > [data-sidebar="menu-item"]:nth-child(6n) [data-sidebar="menu-sub-button"] > svg:first-child {
    color: #ec4899;
}

[data-sidebar="menu-button"] {
    color: hsl(var(--sidebar-foreground));
}

[data-sidebar="menu-button"]:hover,
[data-sidebar="menu-button"][data-state="open"],
[data-sidebar="menu-button"][data-active="true"] {
    background: linear-gradient(90deg, hsl(var(--primary) / 0.14), rgba(47, 140, 255, 0.10));
    color: hsl(var(--sidebar-accent-foreground));
}

[data-sidebar="menu-button"][data-active="true"] {
    border-left-color: hsl(var(--primary));
    box-shadow: inset 3px 0 0 hsl(var(--primary)), 0 8px 18px hsl(var(--primary) / 0.08);
}

[data-sidebar="menu-sub"] {
    border-left-color: hsl(var(--primary) / 0.22);
}

[data-sidebar="menu-sub-button"]:hover,
[data-sidebar="menu-sub-button"][data-active="true"] {
    background: linear-gradient(90deg, hsl(var(--primary) / 0.12), rgba(139, 92, 246, 0.08));
    color: hsl(var(--accent-foreground));
}

[data-sidebar="menu-sub-button"][data-active="true"] {
    box-shadow: inset 3px 0 0 hsl(var(--primary));
}

header[class*="bg-background"] {
    background: rgba(255, 255, 255, 0.88);
    border-bottom-color: hsl(var(--border));
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.65), 0 10px 28px rgba(31, 41, 55, 0.04);
}

main[class*="bg-background"] {
    background:
        radial-gradient(circle at 86% 4%, rgba(99, 102, 241, 0.07), transparent 22rem),
        hsl(var(--background));
}

[class~="bg-card"][class~="border"] {
    border-color: hsl(var(--border));
    box-shadow: 0 10px 30px rgba(31, 41, 55, 0.04);
}

input,
textarea,
button[role="combobox"],
[cmdk-input] {
    border-color: hsl(var(--input));
}

input:focus-visible,
textarea:focus-visible,
button[role="combobox"]:focus-visible {
    border-color: hsl(var(--primary));
    box-shadow: 0 0 0 3px hsl(var(--primary) / 0.12);
}

thead tr,
table thead tr,
table thead th {
    background: linear-gradient(180deg, #f7fbff 0%, #eef6ff 100%) !important;
}

table thead th {
    color: #5f6675;
    border-bottom-color: hsl(var(--border));
}

table tbody tr {
    transition: background-color 0.18s ease, box-shadow 0.18s ease;
}

table tbody tr:hover {
    background: linear-gradient(90deg, hsl(var(--primary) / 0.055), rgba(99, 102, 241, 0.045));
}

.bg-primary {
    background: hsl(var(--primary)) !important;
}

.hover\:bg-primary\/90:hover {
    background: hsl(var(--primary) / 0.9) !important;
}

.text-primary,
a.text-blue-600,
.text-blue-600 {
    color: #2563eb !important;
}

a.text-blue-600:hover,
.hover\:text-blue-700:hover {
    color: #1d4ed8 !important;
}

.bg-gray-100 {
    background-color: #eef6ff !important;
}

.text-green-600 {
    color: #0ea66f !important;
}

.text-orange-600 {
    color: #f97316 !important;
}

.text-purple-600 {
    color: #7c3aed !important;
}

.bg-yellow-100 {
    background-color: #fff4c7 !important;
}

.text-yellow-800 {
    color: #9a6700 !important;
}

.bg-red-100 {
    background-color: #ffe7ee !important;
}

.text-red-800,
.text-red-600 {
    color: #dc2626 !important;
}

.dark {
    --background: 222 47% 7%;
    --foreground: 210 40% 98%;
    --card: 222 38% 10%;
    --card-foreground: 210 40% 98%;
    --popover: 222 38% 10%;
    --popover-foreground: 210 40% 98%;
    --primary: 160 84% 43%;
    --primary-foreground: 222 47% 8%;
    --secondary: 222 28% 16%;
    --secondary-foreground: 210 40% 98%;
    --muted: 222 28% 16%;
    --muted-foreground: 215 20% 70%;
    --accent: 173 46% 18%;
    --accent-foreground: 168 76% 76%;
    --border: 222 25% 20%;
    --input: 222 25% 24%;
    --ring: 168 76% 48%;
    --sidebar-background: 222 38% 10%;
    --sidebar-foreground: 210 40% 92%;
    --sidebar-accent: 222 28% 16%;
    --sidebar-accent-foreground: 210 40% 98%;
    --sidebar-border: 222 25% 20%;
}

.dark body,
.dark main[class*="bg-background"] {
    background:
        radial-gradient(circle at 18% 8%, rgba(20, 184, 166, 0.12), transparent 28rem),
        radial-gradient(circle at 88% 0%, rgba(99, 102, 241, 0.13), transparent 24rem),
        hsl(var(--background));
}

.dark [data-sidebar="sidebar"],
.dark header[class*="bg-background"] {
    background: rgba(15, 23, 42, 0.92);
}

.dark thead tr,
.dark table thead tr,
.dark table thead th {
    background: linear-gradient(180deg, #172033 0%, #111827 100%) !important;
}