122 lines
3.7 KiB
CSS
122 lines
3.7 KiB
CSS
@import "tailwindcss";
|
|
|
|
/*
|
|
* Design tokens per winofyfrontenddoc.md §1.2 (Figma design-system page).
|
|
* Light-mode only — the source file documents no dark-mode variants, so we
|
|
* don't invent any rather than guess.
|
|
*/
|
|
:root {
|
|
--background: #FFFFFF; /* پسزمینه — app background */
|
|
--surface: #fffbfe; /* سفید — card/sheet surface */
|
|
--foreground: #111827; /* gray-900 */
|
|
|
|
--primary: #006a6a; /* فیروزهای — customer brand accent */
|
|
--primary-foreground: #ffffff;
|
|
--primary-action: #223d5d; /* auth-flow button/heading accent, see §1.2 */
|
|
|
|
--brand-secondary: #1a237e; /* یاقوتی — seller brand accent */
|
|
|
|
--success: #1b6b3a;
|
|
--error: #ba1a1a;
|
|
--destructive: #ba1a1a;
|
|
--destructive-foreground: #ffffff;
|
|
|
|
--teal: #2e807a;
|
|
--teal-light: #e0f2f1;
|
|
--teal-bg: #e6f0f0;
|
|
--teal-border: #a7f3d0;
|
|
--blue-bg: #ecf2f8;
|
|
|
|
/* designspec.md (C05/C06) §1.2 — exact hex, not Tailwind's OKLCH-based emerald/slate defaults */
|
|
--page-bg: #f8fafc;
|
|
--emerald-bg: #ecfdf5;
|
|
--emerald-border: #a7f3d0;
|
|
--emerald-text-strong: #065f46;
|
|
--emerald-500: #10b981;
|
|
|
|
--gray-50: #f9fafb;
|
|
--gray-100: #f3f4f6;
|
|
--gray-300: #e5e7eb;
|
|
--gray-500: #9ca3af;
|
|
--gray-600: #6b7280;
|
|
--gray-700: #4b5563;
|
|
--gray-800: #1f2937;
|
|
--gray-900: #111827;
|
|
|
|
--secondary: var(--gray-100); /* generic UI secondary surface, distinct from brand-secondary */
|
|
--secondary-foreground: var(--gray-900);
|
|
--muted: var(--gray-100);
|
|
--muted-foreground: var(--gray-600);
|
|
--border: var(--gray-300);
|
|
}
|
|
|
|
@theme inline {
|
|
--color-background: var(--background);
|
|
--color-surface: var(--surface);
|
|
--color-foreground: var(--foreground);
|
|
|
|
--color-primary: var(--primary);
|
|
--color-primary-foreground: var(--primary-foreground);
|
|
--color-primary-action: var(--primary-action);
|
|
--color-brand-secondary: var(--brand-secondary);
|
|
|
|
--color-success: var(--success);
|
|
--color-error: var(--error);
|
|
--color-destructive: var(--destructive);
|
|
--color-destructive-foreground: var(--destructive-foreground);
|
|
|
|
--color-teal: var(--teal);
|
|
--color-teal-light: var(--teal-light);
|
|
--color-teal-bg: var(--teal-bg);
|
|
--color-teal-border: var(--teal-border);
|
|
--color-blue-bg: var(--blue-bg);
|
|
|
|
--color-page-bg: var(--page-bg);
|
|
--color-emerald-bg: var(--emerald-bg);
|
|
--color-emerald-border: var(--emerald-border);
|
|
--color-emerald-text-strong: var(--emerald-text-strong);
|
|
--color-emerald-500: var(--emerald-500);
|
|
|
|
--color-gray-50: var(--gray-50);
|
|
--color-gray-100: var(--gray-100);
|
|
--color-gray-300: var(--gray-300);
|
|
--color-gray-500: var(--gray-500);
|
|
--color-gray-600: var(--gray-600);
|
|
--color-gray-700: var(--gray-700);
|
|
--color-gray-800: var(--gray-800);
|
|
--color-gray-900: var(--gray-900);
|
|
|
|
--color-secondary: var(--secondary);
|
|
--color-secondary-foreground: var(--secondary-foreground);
|
|
--color-muted: var(--muted);
|
|
--color-muted-foreground: var(--muted-foreground);
|
|
--color-border: var(--border);
|
|
|
|
--font-sans: var(--font-vazirmatn);
|
|
|
|
/* Type scale — §1.3. Line-height is 100% throughout the source file. */
|
|
--text-display-large: 57px;
|
|
--text-display-large--line-height: 1;
|
|
--text-display-medium: 45px;
|
|
--text-display-medium--line-height: 1;
|
|
--text-headline-large: 32px;
|
|
--text-headline-large--line-height: 1;
|
|
--text-headline-medium: 28px;
|
|
--text-headline-medium--line-height: 1;
|
|
--text-title-large: 22px;
|
|
--text-title-large--line-height: 1;
|
|
--text-title-medium: 16px;
|
|
--text-title-medium--line-height: 1;
|
|
--text-body-large: 16px;
|
|
--text-body-large--line-height: 1;
|
|
--text-body-medium: 14px;
|
|
--text-body-medium--line-height: 1;
|
|
--text-label: 12px;
|
|
--text-label--line-height: 1;
|
|
}
|
|
|
|
body {
|
|
background: var(--background);
|
|
color: var(--foreground);
|
|
font-family: var(--font-sans), system-ui, sans-serif;
|
|
}
|