55 lines
1.8 KiB
CSS
55 lines
1.8 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
/* Theme tokens */
|
|
:root {
|
|
--bg: 255 255 255;
|
|
--surface: 248 250 252;
|
|
--text: 17 24 39;
|
|
--primary: 255 115 0;
|
|
--accent: 14 165 233;
|
|
--muted: 100 116 139;
|
|
}
|
|
.dark {
|
|
--bg: 2 6 23;
|
|
--surface: 15 23 42;
|
|
--text: 241 245 249;
|
|
--primary: 255 140 66;
|
|
--accent: 56 189 248;
|
|
--muted: 148 163 184;
|
|
}
|
|
|
|
@layer base {
|
|
html { font-family: Inter, system-ui, ui-sans-serif, sans-serif; }
|
|
body { @apply bg-[rgb(var(--bg))] text-[rgb(var(--text))] antialiased; }
|
|
}
|
|
|
|
@layer components {
|
|
.card { @apply rounded-2xl bg-[rgb(var(--surface))]/80 backdrop-blur-xl shadow-lg; }
|
|
/* Consistent glassmorphism card for light/dark */
|
|
/* More transparent + stronger blur for true glass effect */
|
|
.glass-card { @apply rounded-2xl backdrop-blur-2xl backdrop-saturate-150 shadow-xl border bg-white/25 dark:bg-white/5 border-white/30 dark:border-white/10; }
|
|
/* Solid card (no transparency), uses theme surface */
|
|
.solid-card { @apply rounded-2xl bg-[rgb(var(--surface))] shadow-xl border border-slate-200/70 dark:border-white/10; }
|
|
.btn { @apply inline-flex items-center justify-center rounded-xl px-4 py-2 font-medium transition; }
|
|
.btn-primary { @apply btn bg-[rgb(var(--primary))] text-white hover:brightness-110 active:brightness-90; }
|
|
.input { @apply w-full rounded-xl border border-slate-200/60 bg-white/60 px-3 py-2 outline-none focus:ring-2 focus:ring-[rgb(var(--accent))]; }
|
|
}
|
|
|
|
/* micro animations used by alerts */
|
|
@keyframes shakeX {
|
|
0%,100%{transform:translateX(0)}
|
|
20%{transform:translateX(-2px)}
|
|
40%{transform:translateX(2px)}
|
|
60%{transform:translateX(-2px)}
|
|
80%{transform:translateX(2px)}
|
|
}
|
|
.alert-anim {
|
|
animation: fadeIn .18s ease, shakeX .24s ease;
|
|
}
|
|
@keyframes fadeIn {
|
|
from{opacity:0; transform:translateY(-2px)}
|
|
to{opacity:1; transform:translateY(0)}
|
|
}
|