:root {
	--primary: oklch(68% 0.145 232);
	--primary-foreground: oklch(99% 0.01 230);
	--secondary: oklch(97% 0.012 235);
	--secondary-foreground: oklch(27% 0.035 235);
	--muted: oklch(97.2% 0.008 235);
	--muted-foreground: oklch(51% 0.025 245);
	--accent: oklch(95.8% 0.026 230);
	--accent-foreground: oklch(39% 0.09 231);
	--border: oklch(91.5% 0.012 240);
	--input: oklch(90.5% 0.014 240);
	--ring: oklch(68% 0.145 232);
	--radius: 0.5rem;
	--sidebar: oklch(99.2% 0.004 235);
	--sidebar-primary: oklch(62% 0.145 232);
	--sidebar-primary-foreground: oklch(99% 0.01 230);
	--sidebar-accent: oklch(95.8% 0.026 230);
	--sidebar-accent-foreground: oklch(39% 0.09 231);
	--sidebar-border: oklch(91.5% 0.012 240);
	--sidebar-ring: oklch(68% 0.145 232);
	--chart-1: oklch(65% 0.16 232);
	--chart-2: oklch(67% 0.15 165);
	--chart-3: oklch(72% 0.17 72);
	--chart-4: oklch(61% 0.17 290);
	--chart-5: oklch(62% 0.19 28);
}

[data-mode="dark"] {
	--background: oklch(16.5% 0.016 245);
	--foreground: oklch(96.5% 0.008 235);
	--card: oklch(20.5% 0.018 245);
	--card-foreground: oklch(96.5% 0.008 235);
	--popover: oklch(20.5% 0.018 245);
	--popover-foreground: oklch(96.5% 0.008 235);
	--primary: oklch(72% 0.14 232);
	--primary-foreground: oklch(18% 0.025 240);
	--secondary: oklch(25% 0.02 245);
	--secondary-foreground: oklch(94% 0.01 235);
	--muted: oklch(25% 0.02 245);
	--muted-foreground: oklch(72% 0.025 235);
	--accent: oklch(28% 0.04 235);
	--accent-foreground: oklch(88% 0.06 225);
	--border: oklch(100% 0 0 / 12%);
	--input: oklch(100% 0 0 / 16%);
	--ring: oklch(72% 0.14 232);
	--sidebar: oklch(18.5% 0.018 245);
	--sidebar-primary: oklch(72% 0.14 232);
	--sidebar-primary-foreground: oklch(18% 0.025 240);
	--sidebar-accent: oklch(28% 0.04 235);
	--sidebar-accent-foreground: oklch(88% 0.06 225);
	--sidebar-border: oklch(100% 0 0 / 10%);
	--sidebar-ring: oklch(72% 0.14 232);
}

html,
body {
	letter-spacing: 0;
}

#content > header {
	border-bottom: 1px solid var(--border);
	background: color-mix(in oklab, var(--background) 94%, transparent);
	backdrop-filter: blur(12px);
}

#content > main {
	background: color-mix(in oklab, var(--muted) 55%, var(--background));
}

[data-slot="sidebar-inner"] {
	border-inline-end: 1px solid var(--sidebar-border);
	box-shadow: none;
}

[data-slot="sidebar-header"] {
	padding-top: 0.75rem;
	padding-bottom: 0.5rem;
}

[data-slot="sidebar-group-label"] {
	color: color-mix(in oklab, var(--sidebar-foreground) 48%, transparent);
	font-size: 0.6875rem;
	font-weight: 600;
}

[data-slot="sidebar-menu-button"] {
	position: relative;
	border-radius: 0.375rem;
}

[data-slot="sidebar-menu-button"][data-active="true"] {
	color: var(--sidebar-accent-foreground);
	font-weight: 600;
}

[data-slot="sidebar-menu-button"][data-active="true"]::before {
	position: absolute;
	inset-block: 0.375rem;
	inset-inline-start: 0;
	width: 0.1875rem;
	border-radius: 999px;
	background: var(--sidebar-primary);
	content: "";
}

[data-slot="card"] {
	gap: 1rem;
	padding-block: 1rem;
	border-radius: 0.5rem;
	box-shadow: 0 1px 2px rgb(15 23 42 / 5%);
}

[data-slot="card-header"],
[data-slot="card-content"] {
	padding-inline: 1.25rem;
}

[data-slot="button"],
[data-slot="tabs-list"],
[data-slot="tabs-trigger"],
input,
textarea,
button[role="combobox"] {
	border-radius: 0.375rem;
}

[data-slot="button"] {
	box-shadow: none;
}

[data-slot="button"]:not(:disabled):active {
	transform: translateY(1px);
}

[data-slot="tabs-list"] {
	padding: 0.1875rem;
	border: 1px solid var(--border);
}

table thead tr {
	background: color-mix(in oklab, var(--muted) 72%, var(--background));
}

table th {
	color: color-mix(in oklab, var(--foreground) 72%, transparent);
	font-size: 0.75rem;
	font-weight: 600;
}

table tbody tr {
	transition: background-color 120ms ease;
}

table tbody tr:hover {
	background: color-mix(in oklab, var(--accent) 52%, transparent);
}

[role="dialog"],
[role="alertdialog"] {
	border-radius: 0.5rem;
}

* {
	scrollbar-color: color-mix(in oklab, var(--muted-foreground) 40%, transparent)
		transparent;
	scrollbar-width: thin;
}

img[alt="商户控制台"] {
	border-radius: 0.5rem;
	background: white;
	object-fit: contain;
}

body:has(input[name="username"]) .text-foreground.relative.h-full.overflow-hidden.bg-muted {
	border-inline-end: 1px solid var(--border);
	background: color-mix(in oklab, var(--primary) 7%, var(--background));
}

body:has(input[name="username"]) .text-foreground.relative.h-full.overflow-hidden.bg-muted > .absolute {
	display: none;
}

body:has(input[name="username"]) .relative.z-20.flex.h-full > :last-child {
	position: relative;
	display: grid;
	min-height: 26rem;
	place-items: center;
	overflow: hidden;
	border: 1px solid var(--border);
	border-radius: 0.5rem;
	background: var(--background);
	box-shadow: 0 12px 32px rgb(15 23 42 / 8%);
}

body:has(input[name="username"]) .relative.z-20.flex.h-full > :last-child > * {
	display: none;
}

body:has(input[name="username"]) .relative.z-20.flex.h-full > :last-child::before {
	display: block;
	width: min(20rem, 78%);
	aspect-ratio: 1;
	background: url("/images/logo.png") center / contain no-repeat;
	content: "";
}

@media (max-width: 639px) {
	#content > main {
		background: var(--background);
	}

	[data-slot="card"] {
		padding-block: 0.875rem;
	}

	[data-slot="card-header"],
	[data-slot="card-content"] {
		padding-inline: 1rem;
	}
}
