@font-face {
  font-family: 'Vazirmatn';
  src: url('/fonts/VazirmatnVariable.woff2') format('woff2 supports variations'),
       url('/fonts/VazirmatnVariable.woff2') format('woff2-variations');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@import "tailwindcss";

@theme {
  --font-sans: "Vazirmatn", sans-serif;
  --font-vazir: "Vazirmatn", sans-serif;
  
  /* 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", sans-serif !important;
  }

  html, body, #root {
    font-family: "Vazirmatn", sans-serif !important;
    @apply bg-medical-gray-50 text-medical-gray-900 antialiased;
    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", sans-serif;
  }
}

/* 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);
}