@font-face { font-family: 'Vazirmatn'; src: url('/fonts/vazirmatn-v33.003/fonts/webfonts/Vazirmatn[wght].woff2') format('woff2-variations'), url('/fonts/vazirmatn-v33.003/fonts/webfonts/Vazirmatn-Regular.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Shabnam'; src: url('/fonts/shabnam-font-v5.0.1/Shabnam.woff2') format('woff2'), url('/fonts/shabnam-font-v5.0.1/Shabnam.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Shabnam'; src: url('/fonts/shabnam-font-v5.0.1/Shabnam-Bold.woff2') format('woff2'), url('/fonts/shabnam-font-v5.0.1/Shabnam-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Shabnam'; src: url('/fonts/shabnam-font-v5.0.1/Shabnam-Medium.woff2') format('woff2'), url('/fonts/shabnam-font-v5.0.1/Shabnam-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Sahel'; src: url('/fonts/sahel-font-v3.4.0/Sahel-VF.woff2') format('woff2-variations'), url('/fonts/sahel-font-v3.4.0/Sahel.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Lalezar'; src: url('/fonts/Lalezar-Font-fontyab.com_/Lalezar-Font/TTF/Lalezar-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'IranNastaliq'; src: url('/fonts/IranNastaliq/IranNastaliq/IranNastaliq.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'IranianSans'; src: url('/fonts/A-Iranian-Sans/A-Iranian-Sans/Iranian Sans.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; } @import "tailwindcss"; @theme { --font-sans: "Vazirmatn"; --font-vazir: "Vazirmatn"; --font-shabnam: "Shabnam"; --font-sahel: "Sahel"; --font-lalezar: "Lalezar", cursive; --font-nastaliq: "IranNastaliq", serif; --font-iranian-sans: "IranianSans"; /* Brand Colors */ --color-canina-blue: #1E4053; --color-canina-gold: #F1B646; --color-canina-teal: #9BC8CC; --color-canina-dark: #060709; /* Core UI color mappings (harmonies based on brand palette) */ --color-medical-gray-50: #FFFFFF; /* pure white main background */ --color-medical-gray-100: #F4F7F6; /* light warm gray for alternate sections */ --color-medical-gray-200: #E5ECE9; /* light box background / border color */ --color-medical-gray-300: #C2D5CE; /* subtle borders */ --color-medical-gray-400: #9BC8CC; /* card backgrounds / accent borders */ --color-medical-gray-500: #6B8B8E; /* secondary text */ --color-medical-gray-600: #4A6366; /* muted dark text */ --color-medical-gray-700: #2C3E42; /* deep text */ --color-medical-gray-800: #19272B; /* very dark text */ --color-medical-gray-900: #060709; /* primary font color / logo */ } @layer base { :root { font-family: "Vazirmatn" !important; } html, body, #root { font-family: "Vazirmatn" !important; @apply bg-medical-gray-50 text-medical-gray-900 antialiased max-w-[100vw]; font-feature-settings: "ss01", "ss02", "cv01", "cv11"; } button, a { cursor: pointer; } button, a, [role="button"], .cursor-pointer { @apply cursor-pointer; } /* Smooth hover transitions for all interactive elements */ button, a, .group, .transition-all { @apply transition-all duration-300; } /* Default mild hover effects */ button:hover, .cursor-pointer:hover { @apply opacity-90; } a:hover { @apply opacity-80; } } @layer utilities { .font-vazir { font-family: "Vazirmatn"; } } /* Custom scrollbar for a professional look */ ::-webkit-scrollbar { width: 6px; } ::-webkit-scrollbar-track { background: var(--color-medical-gray-100); } ::-webkit-scrollbar-thumb { background: var(--color-medical-gray-300); border-radius: 3px; } ::-webkit-scrollbar-thumb:hover { background: var(--color-canina-blue); }