File size: 3,195 Bytes
e9d5b7d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 |
@tailwind base;
@tailwind components;
@tailwind utilities;
body {
font-family: var(--font-inter), Arial, Helvetica, sans-serif;
}
@layer base {
:root {
--background: 210 40% 98%; /* Lighter, cleaner background */
--foreground: 222 47% 11%; /* Dark blue for strong contrast */
--card: 0 0% 100%; /* Pure White */
--card-foreground: 222 47% 11%;
--popover: 0 0% 100%;
--popover-foreground: 222 47% 11%;
--primary: 220 70% 50%; /* Vibrant, professional Blue */
--primary-foreground: 0 0% 100%; /* White */
--secondary: 210 40% 93%; /* Softer gray for secondary elements */
--secondary-foreground: 222 30% 25%;
--muted: 210 40% 90%; /* Muted gray */
--muted-foreground: 210 30% 50%;
--accent: 260 80% 60%; /* Rich Purple for accents */
--accent-foreground: 0 0% 100%; /* White */
--destructive: 0 75% 55%; /* Clear Red for destructive actions */
--destructive-foreground: 0 0% 100%;
--border: 210 30% 85%;
--input: 210 30% 95%;
--ring: 220 70% 55%; /* Primary blue for rings */
--radius: 0.75rem; /* Slightly larger radius for a softer look */
/* Chart colors */
--chart-1: 220 70% 50%;
--chart-2: 160 60% 45%;
--chart-3: 30 80% 55%;
--chart-4: 280 65% 60%;
--chart-5: 340 75% 55%;
--sidebar-background: 220 30% 97%;
--sidebar-foreground: 220 18% 12%;
--sidebar-primary: 225 75% 60%;
--sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 250 70% 65%;
--sidebar-accent-foreground: 0 0% 100%;
--sidebar-border: 220 25% 90%;
--sidebar-ring: 225 75% 65%;
}
.dark {
--background: 222 47% 8%; /* Very dark blue for background */
--foreground: 210 40% 96%; /* Light gray/off-white for text */
--card: 222 40% 12%; /* Darker card for depth */
--card-foreground: 210 40% 96%;
--popover: 222 40% 10%;
--popover-foreground: 210 40% 96%;
--primary: 220 70% 65%; /* Lighter, vibrant Blue for dark mode */
--primary-foreground: 222 47% 11%; /* Dark text on light primary */
--secondary: 222 30% 18%; /* Darker secondary */
--secondary-foreground: 210 30% 85%;
--muted: 222 25% 22%;
--muted-foreground: 210 25% 70%;
--accent: 260 70% 70%; /* Lighter Purple for dark mode */
--accent-foreground: 0 0% 98%;
--destructive: 0 65% 60%; /* Adjusted red for dark */
--destructive-foreground: 0 0% 98%;
--border: 222 25% 28%;
--input: 222 25% 20%;
--ring: 220 70% 65%;
/* Chart colors for dark theme */
--chart-1: 220 70% 60%;
--chart-2: 160 60% 55%;
--chart-3: 30 80% 65%;
--chart-4: 280 65% 70%;
--chart-5: 340 75% 65%;
--sidebar-background: 222 40% 12%;
--sidebar-foreground: 210 40% 96%;
--sidebar-primary: 220 70% 65%;
--sidebar-primary-foreground: 222 47% 11%;
--sidebar-accent: 260 70% 70%;
--sidebar-accent-foreground: 0 0% 98%;
--sidebar-border: 222 25% 28%;
--sidebar-ring: 220 70% 65%;
}
}
@layer base {
* {
@apply border-border;
}
body {
@apply bg-background text-foreground;
min-height: 100vh;
display: flex;
flex-direction: column;
}
main {
flex-grow: 1;
}
}
|