141 lines
3.4 KiB
CSS
141 lines
3.4 KiB
CSS
|
@import "tailwindcss";
|
||
|
|
|
||
|
|
:root {
|
||
|
|
--font-size: 16px;
|
||
|
|
--background: #fff;
|
||
|
|
--foreground: oklch(.145 0 0);
|
||
|
|
--card: #fff;
|
||
|
|
--card-foreground: oklch(.145 0 0);
|
||
|
|
--popover: oklch(1 0 0);
|
||
|
|
--popover-foreground: oklch(.145 0 0);
|
||
|
|
--primary: #FF6B00;
|
||
|
|
--primary-foreground: #FFFFFF;
|
||
|
|
--secondary: #FFFFFF;
|
||
|
|
--secondary-foreground: #1F2937;
|
||
|
|
--accent: #F5F5F5;
|
||
|
|
--muted: #ececf0;
|
||
|
|
--muted-foreground: #717182;
|
||
|
|
--accent-foreground: #030213;
|
||
|
|
--destructive: #d4183d;
|
||
|
|
--destructive-foreground: #fff;
|
||
|
|
--border: #E5E7EB;
|
||
|
|
--input: transparent;
|
||
|
|
--input-background: #f3f3f5;
|
||
|
|
--switch-background: #cbced4;
|
||
|
|
--font-weight-medium: 500;
|
||
|
|
--font-weight-normal: 400;
|
||
|
|
--font-weight-semibold: 600;
|
||
|
|
--font-weight-bold: 700;
|
||
|
|
--ring: oklch(.708 0 0);
|
||
|
|
--chart-1: oklch(.646 .222 41.116);
|
||
|
|
--chart-2: oklch(.6 .118 184.704);
|
||
|
|
--chart-3: oklch(.398 .07 227.392);
|
||
|
|
--chart-4: oklch(.828 .189 84.429);
|
||
|
|
--chart-5: oklch(.769 .188 70.08);
|
||
|
|
--radius: .75rem;
|
||
|
|
--sidebar: oklch(.985 0 0);
|
||
|
|
--sidebar-foreground: oklch(.145 0 0);
|
||
|
|
--sidebar-primary: #030213;
|
||
|
|
--sidebar-primary-foreground: oklch(.985 0 0);
|
||
|
|
--sidebar-accent: oklch(.97 0 0);
|
||
|
|
--sidebar-accent-foreground: oklch(.205 0 0);
|
||
|
|
--sidebar-border: oklch(.922 0 0);
|
||
|
|
--sidebar-ring: oklch(.708 0 0);
|
||
|
|
}
|
||
|
|
|
||
|
|
* {
|
||
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Mobile Responsive Global Styles */
|
||
|
|
body {
|
||
|
|
overflow-x: hidden;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
-moz-osx-font-smoothing: grayscale;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Prevent zoom on input focus (iOS) */
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
|
||
|
|
input,
|
||
|
|
select,
|
||
|
|
textarea {
|
||
|
|
font-size: 16px !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (max-width: 500px) {
|
||
|
|
|
||
|
|
input,
|
||
|
|
select,
|
||
|
|
textarea {
|
||
|
|
font-size: 12px !important;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Touch-friendly buttons */
|
||
|
|
@media (max-width: 1024px) {
|
||
|
|
|
||
|
|
button,
|
||
|
|
a {
|
||
|
|
min-height: 30px;
|
||
|
|
min-width: 44px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Smooth scroll for mobile */
|
||
|
|
* {
|
||
|
|
-webkit-overflow-scrolling: touch;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Hide scrollbar but keep functionality */
|
||
|
|
.hide-scrollbar {
|
||
|
|
-ms-overflow-style: none;
|
||
|
|
scrollbar-width: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.hide-scrollbar::-webkit-scrollbar {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.dark {
|
||
|
|
--background: oklch(.145 0 0);
|
||
|
|
--foreground: oklch(.985 0 0);
|
||
|
|
--card: oklch(.145 0 0);
|
||
|
|
--card-foreground: oklch(.985 0 0);
|
||
|
|
--popover: oklch(.145 0 0);
|
||
|
|
--popover-foreground: oklch(.985 0 0);
|
||
|
|
--primary: oklch(.985 0 0);
|
||
|
|
--primary-foreground: oklch(.205 0 0);
|
||
|
|
--secondary: oklch(.269 0 0);
|
||
|
|
--secondary-foreground: oklch(.985 0 0);
|
||
|
|
--muted: oklch(.269 0 0);
|
||
|
|
--muted-foreground: oklch(.708 0 0);
|
||
|
|
--accent: oklch(.269 0 0);
|
||
|
|
--accent-foreground: oklch(.985 0 0);
|
||
|
|
--destructive: oklch(.396 .141 25.723);
|
||
|
|
--destructive-foreground: oklch(.637 .237 25.331);
|
||
|
|
--border: oklch(.269 0 0);
|
||
|
|
--input: oklch(.269 0 0);
|
||
|
|
--ring: oklch(.439 0 0);
|
||
|
|
--font-weight-medium: 500;
|
||
|
|
--font-weight-normal: 400;
|
||
|
|
--chart-1: oklch(.488 .243 264.376);
|
||
|
|
--chart-2: oklch(.696 .17 162.48);
|
||
|
|
--chart-3: oklch(.769 .188 70.08);
|
||
|
|
--chart-4: oklch(.627 .265 303.9);
|
||
|
|
--chart-5: oklch(.645 .246 16.439);
|
||
|
|
--sidebar: oklch(.205 0 0);
|
||
|
|
--sidebar-foreground: oklch(.985 0 0);
|
||
|
|
--sidebar-primary: oklch(.488 .243 264.376);
|
||
|
|
--sidebar-primary-foreground: oklch(.985 0 0);
|
||
|
|
--sidebar-accent: oklch(.269 0 0);
|
||
|
|
--sidebar-accent-foreground: oklch(.985 0 0);
|
||
|
|
--sidebar-border: oklch(.269 0 0);
|
||
|
|
--sidebar-ring: oklch(.439 0 0);
|
||
|
|
}
|
||
|
|
|
||
|
|
html {
|
||
|
|
font-size: var(--font-size);
|
||
|
|
}
|