@import "tailwindcss";
@theme {
--font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
/* Dark theme defaults */
--color-background: #0f172a;
--color-foreground: #f1f5f9;
--color-muted: #334155;
--color-muted-foreground: #94a3b8;
--color-accent: #1e293b;
--color-accent-foreground: #f1f5f9;
--color-primary: #3b82f6;
--color-primary-foreground: #ffffff;
--color-border: #334155;
--color-card: #1e293b;
--color-input: #334155;
--color-ring: #3b82f6;
--color-destructive: #ef4444;
--color-secondary: #334155;
--color-secondary-foreground: #f1f5f9;
}
@layer base {
html {
scroll-behavior: smooth;
}
body {
background-color: var(--color-background);
color: var(--color-foreground);
font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
}
@layer components {
.btn {
padding: 0.5rem 1rem;
border-radius: 0.5rem;
font-weight: 500;
transition: color 0.2s, background-color 0.2s;
}
.btn-primary {
background-color: #2563eb;
color: white;
}
.btn-primary:hover {
background-color: #1d4ed8;
}
.btn-secondary {
background-color: #4b5563;
color: white;
}
.btn-secondary:hover {
background-color: #374151;
}
.btn-success {
background-color: #16a34a;
color: white;
}
.btn-success:hover {
background-color: #15803d;
}
.btn-danger {
background-color: #dc2626;
color: white;
}
.btn-danger:hover {
background-color: #b91c1c;
}
.btn:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.card {
background: rgba(30, 41, 59, 0.6);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border: 1px solid rgba(148, 163, 184, 0.12);
border-radius: 0.5rem;
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.2);
padding: 1.5rem;
}
.input {
background-color: var(--color-input);
border: 1px solid var(--color-border);
border-radius: 0.5rem;
padding: 0.5rem 0.75rem;
color: white;
}
.input::placeholder {
color: #9ca3af;
}
.input:focus {
outline: none;
box-shadow: 0 0 0 2px #3b82f6;
border-color: transparent;
}
}
/* Custom scrollbar */
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background-color: #1f2937;
}
::-webkit-scrollbar-thumb {
background-color: #4b5563;
border-radius: 0.25rem;
}
::-webkit-scrollbar-thumb:hover {
background-color: #6b7280;
}
/* Loading animation */
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.animate-spin {
animation: spin 1s linear infinite;
}
/* Glassmorphism utilities */
@layer components {
.glass {
background: rgba(15, 23, 42, 0.7);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border: 1px solid rgba(148, 163, 184, 0.12);
}
.glass-light {
background: rgba(30, 41, 59, 0.6);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
border: 1px solid rgba(148, 163, 184, 0.15);
}
}
