| @import "tailwindcss"; |
|
|
| @custom-variant dark (&:where(.dark, .dark *)); |
|
|
| @theme inline { |
| --color-background: var(--background); |
| --color-foreground: var(--foreground); |
| --color-card: var(--card); |
| --color-card-foreground: var(--card-foreground); |
| --color-popover: var(--popover); |
| --color-popover-foreground: var(--popover-foreground); |
| --color-primary: var(--primary); |
| --color-primary-foreground: var(--primary-foreground); |
| --color-secondary: var(--secondary); |
| --color-secondary-foreground: var(--secondary-foreground); |
| --color-muted: var(--muted); |
| --color-muted-foreground: var(--muted-foreground); |
| --color-accent: var(--accent); |
| --color-accent-foreground: var(--accent-foreground); |
| --color-destructive: var(--destructive); |
| --color-destructive-foreground: var(--destructive-foreground); |
| --color-success: var(--success); |
| --color-success-foreground: var(--success-foreground); |
| --color-warning: var(--warning); |
| --color-warning-foreground: var(--warning-foreground); |
| --color-border: var(--border); |
| --color-input: var(--input); |
| --color-ring: var(--ring); |
| --color-sidebar: var(--sidebar); |
| --color-sidebar-foreground: var(--sidebar-foreground); |
| --color-sidebar-border: var(--sidebar-border); |
| --color-sidebar-accent: var(--sidebar-accent); |
| --font-sans: var(--font-inter); |
| --font-mono: var(--font-jetbrains-mono); |
| --radius-sm: 0.25rem; |
| --radius-md: 0.375rem; |
| --radius-lg: 0.5rem; |
| --radius-xl: 0.75rem; |
| } |
|
|
| :root { |
| --background: #f7f8fa; |
| --foreground: #0b1220; |
| --card: #ffffff; |
| --card-foreground: #0b1220; |
| --popover: #ffffff; |
| --popover-foreground: #0b1220; |
| --primary: #1d4ed8; |
| --primary-foreground: #ffffff; |
| --secondary: #eef2ff; |
| --secondary-foreground: #1e293b; |
| --muted: #f1f5f9; |
| --muted-foreground: #64748b; |
| --accent: #e0f2fe; |
| --accent-foreground: #075985; |
| --destructive: #dc2626; |
| --destructive-foreground: #ffffff; |
| --success: #15803d; |
| --success-foreground: #ffffff; |
| --warning: #b45309; |
| --warning-foreground: #ffffff; |
| --border: #e2e8f0; |
| --input: #e2e8f0; |
| --ring: #1d4ed8; |
| --sidebar: #0f172a; |
| --sidebar-foreground: #cbd5e1; |
| --sidebar-border: #1e293b; |
| --sidebar-accent: #1e293b; |
| } |
|
|
| .dark { |
| --background: #0a0f1a; |
| --foreground: #e6edf7; |
| --card: #0f172a; |
| --card-foreground: #e6edf7; |
| --popover: #0f172a; |
| --popover-foreground: #e6edf7; |
| --primary: #60a5fa; |
| --primary-foreground: #0a0f1a; |
| --secondary: #1e293b; |
| --secondary-foreground: #e6edf7; |
| --muted: #1e293b; |
| --muted-foreground: #94a3b8; |
| --accent: #1e3a8a; |
| --accent-foreground: #dbeafe; |
| --destructive: #f87171; |
| --destructive-foreground: #0a0f1a; |
| --success: #34d399; |
| --success-foreground: #0a0f1a; |
| --warning: #fbbf24; |
| --warning-foreground: #0a0f1a; |
| --border: #1e293b; |
| --input: #1e293b; |
| --ring: #60a5fa; |
| --sidebar: #060a13; |
| --sidebar-foreground: #cbd5e1; |
| --sidebar-border: #1e293b; |
| --sidebar-accent: #1e293b; |
| } |
|
|
| * { |
| border-color: var(--border); |
| } |
|
|
| html, |
| body { |
| background: var(--background); |
| color: var(--foreground); |
| font-family: var(--font-inter), ui-sans-serif, system-ui, sans-serif; |
| -webkit-font-smoothing: antialiased; |
| } |
|
|
| ::-webkit-scrollbar { |
| width: 10px; |
| height: 10px; |
| } |
| ::-webkit-scrollbar-track { |
| background: transparent; |
| } |
| ::-webkit-scrollbar-thumb { |
| background: var(--border); |
| border-radius: 9999px; |
| } |
| ::-webkit-scrollbar-thumb:hover { |
| background: var(--muted-foreground); |
| } |
|
|
| |
| @media print { |
| body * { |
| visibility: hidden; |
| } |
| .print-area, |
| .print-area * { |
| visibility: visible; |
| } |
| .print-area { |
| position: absolute; |
| left: 0; |
| top: 0; |
| width: 100%; |
| padding: 1rem; |
| background: #fff !important; |
| color: #000 !important; |
| } |
| } |
|
|