Spaces:
Running
Running
| @tailwind base; | |
| @tailwind components; | |
| @tailwind utilities; | |
| @layer base { | |
| /* ---- Dark theme (default) ---------------------------------------- */ | |
| :root, | |
| .dark { | |
| --background: 214 10% 8%; | |
| --foreground: 210 13% 89%; | |
| --card: 214 9% 11%; | |
| --card-foreground: 210 13% 89%; | |
| --popover: 214 10% 10%; | |
| --popover-foreground: 210 13% 89%; | |
| --primary: 157 39% 43%; | |
| --primary-foreground: 156 32% 9%; | |
| --secondary: 214 8% 16%; | |
| --secondary-foreground: 210 13% 89%; | |
| --muted: 214 8% 14%; | |
| --muted-foreground: 214 7% 58%; | |
| --accent: 199 34% 56%; | |
| --accent-foreground: 205 35% 10%; | |
| --success: 150 38% 47%; | |
| --warning: 35 66% 55%; | |
| --danger: 4 56% 58%; | |
| --border: 214 8% 17%; | |
| --input: 214 8% 19%; | |
| --ring: 157 39% 43%; | |
| --radius: 0.5rem; | |
| } | |
| /* ---- Light theme (future-ready: add `light` class to <html>) ------ */ | |
| .light { | |
| --background: 210 16% 98%; | |
| --foreground: 215 19% 15%; | |
| --card: 0 0% 100%; | |
| --card-foreground: 215 19% 15%; | |
| --popover: 0 0% 100%; | |
| --popover-foreground: 215 19% 15%; | |
| --primary: 157 41% 34%; | |
| --primary-foreground: 0 0% 100%; | |
| --secondary: 214 16% 93%; | |
| --secondary-foreground: 215 19% 20%; | |
| --muted: 214 17% 95%; | |
| --muted-foreground: 216 10% 42%; | |
| --accent: 199 40% 40%; | |
| --accent-foreground: 0 0% 100%; | |
| --success: 150 42% 33%; | |
| --warning: 32 66% 40%; | |
| --danger: 4 56% 48%; | |
| --border: 214 15% 88%; | |
| --input: 214 15% 84%; | |
| --ring: 157 41% 34%; | |
| } | |
| * { | |
| @apply border-border; | |
| } | |
| body { | |
| @apply bg-background text-foreground antialiased; | |
| font-feature-settings: "cv02", "cv03", "cv04", "cv11"; | |
| /* Barely-there dot grid adds depth without the AI neon-gradient feel. */ | |
| background-image: radial-gradient( | |
| hsl(var(--foreground) / 0.035) 1px, | |
| transparent 1px | |
| ); | |
| background-size: 30px 30px; | |
| } | |
| html { | |
| scroll-behavior: smooth; | |
| } | |
| } | |
| @layer utilities { | |
| .glass { | |
| background: hsl(var(--background) / 0.8); | |
| backdrop-filter: blur(10px) saturate(120%); | |
| -webkit-backdrop-filter: blur(10px) saturate(120%); | |
| } | |
| .grid-bg { | |
| background-image: radial-gradient( | |
| hsl(var(--border) / 0.5) 1px, | |
| transparent 1px | |
| ); | |
| background-size: 22px 22px; | |
| } | |
| .no-scrollbar::-webkit-scrollbar { | |
| display: none; | |
| } | |
| .no-scrollbar { | |
| -ms-overflow-style: none; | |
| scrollbar-width: none; | |
| } | |
| } | |
| /* ---- Leaflet dark-map polish --------------------------------------- */ | |
| .leaflet-container { | |
| background: hsl(var(--background)); | |
| font-family: inherit; | |
| } | |
| .leaflet-bar, | |
| .leaflet-bar a { | |
| background: hsl(var(--card)); | |
| color: hsl(var(--foreground)); | |
| border-color: hsl(var(--border)) ; | |
| } | |
| .leaflet-bar a:hover { | |
| background: hsl(var(--secondary)); | |
| } | |
| .leaflet-popup-content-wrapper, | |
| .leaflet-popup-tip { | |
| background: hsl(var(--popover)); | |
| color: hsl(var(--popover-foreground)); | |
| border-radius: var(--radius); | |
| box-shadow: 0 8px 28px hsl(220 30% 2% / 0.45); | |
| } | |
| .leaflet-popup-content { | |
| margin: 0.85rem 1rem; | |
| font-size: 0.8rem; | |
| } | |
| .leaflet-control-attribution { | |
| background: hsl(var(--card) / 0.7) ; | |
| color: hsl(var(--muted-foreground)) ; | |
| } | |
| .leaflet-control-attribution a { | |
| color: hsl(var(--accent)) ; | |
| } | |