@import "tailwindcss";

@theme inline {
  --color-airtel-red: #ED1C24;
  --color-airtel-red-dark: #C41920;
  --color-airtel-red-light: #FF4D53;
  --color-airtel-black: #1A1A1A;
  --color-airtel-gray-900: #2D2D2D;
  --color-airtel-gray-700: #4A4A4A;
  --color-airtel-gray-500: #7A7A7A;
  --color-airtel-gray-300: #B0B0B0;
  --color-airtel-gray-100: #F0F0F0;
  --color-airtel-gray-50: #F8F8F8;
  --color-airtel-white: #FFFFFF;
  --color-airtel-green: #22C55E;
  --color-airtel-gold: #F59E0B;
  --color-airtel-blue: #3B82F6;
  --font-sans: var(--font-geist-sans);
  --font-mono: var(--font-geist-mono);
}

body {
  background: #F8F8F8;
  color: #1A1A1A;
  font-family: Arial, Helvetica, sans-serif;
}

/* Mobile-first: max-width container for PWA feel */
.app-container {
  max-width: 430px;
  margin: 0 auto;
  min-height: 100vh;
  background: white;
  position: relative;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 4px;
}
::-webkit-scrollbar-track {
  background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 2px;
}