/**
 * Font Display Optimization
 * 
 * This file ensures all web fonts use font-display: swap to:
 * 1. Eliminate FOIT (Flash of Invisible Text)
 * 2. Improve First Contentful Paint (FCP)
 * 3. Reduce Cumulative Layout Shift (CLS)
 * 
 * font-display: swap tells the browser to:
 * - Show fallback text immediately
 * - Swap in the custom font when ready
 */


/* Arial - Subtitle font */
@font-face {
  font-family: 'Arial';
  src: url('/font/Arial.woff2') format('woff2'),
       url('/font/Arial.woff') format('woff');
  font-display: swap;
  font-weight: normal;
  font-style: normal;
}

/* Roboto - Subtitle font */
@font-face {
  font-family: 'Roboto';
  src: url('/font/Roboto.woff2') format('woff2');
  font-display: swap;
  font-weight: normal;
  font-style: normal;
}

/* Galada - Subtitle font */
@font-face {
  font-family: 'Galada';
  src: url('/font/Galada.woff2') format('woff2');
  font-display: swap;
  font-weight: normal;
  font-style: normal;
}

/* Noto Sans Devanagari - Subtitle font for Hindi/Indian languages */
@font-face {
  font-family: 'Noto Sans Devanagari';
  src: url('/font/NotoSansDevanagari-Regular.ttf') format('truetype');
  font-display: swap;
  font-weight: normal;
  font-style: normal;
}

/* Manrope - Primary UI font */
@font-face {
  font-family: 'Manrope';
  src: url('/font/Manrope-Regular.ttf') format('truetype');
  font-display: swap;
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Manrope';
  src: url('/font/Manrope-Medium.ttf') format('truetype');
  font-display: swap;
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Manrope';
  src: url('/font/Manrope-Bold.ttf') format('truetype');
  font-display: swap;
  font-weight: 700;
  font-style: normal;
}

/* Manrope aliases for common variations */
@font-face {
  font-family: 'manrope';
  src: url('/font/Manrope-Regular.ttf') format('truetype');
  font-display: swap;
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'manrope-Medium';
  src: url('/font/Manrope-Medium.ttf') format('truetype');
  font-display: swap;
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'manrope-Bold';
  src: url('/font/Manrope-Bold.ttf') format('truetype');
  font-display: swap;
  font-weight: 700;
  font-style: normal;
}


/* Expo Vector Icons - Apply swap to all icon fonts */
@font-face {
  font-family: 'Ionicons';
  font-display: swap !important;
}

@font-face {
  font-family: 'MaterialIcons';
  font-display: swap !important;
}

@font-face {
  font-family: 'MaterialCommunityIcons';
  font-display: swap !important;
}

@font-face {
  font-family: 'FontAwesome';
  font-display: swap !important;
}

@font-face {
  font-family: 'FontAwesome5';
  font-display: swap !important;
}

@font-face {
  font-family: 'FontAwesome6';
  font-display: swap !important;
}

/* 
 * Fallback font stacks with similar metrics to reduce CLS
 * These ensure minimal layout shift when custom fonts swap in
 */
body {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica', 'Arial', sans-serif;
}

/* For subtitle rendering - ensure fallback fonts with similar metrics */
.subtitle-text {
  font-family: 'Arial', 'Helvetica Neue', 'Helvetica', sans-serif;
}

.subtitle-text-roboto {
  font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.subtitle-text-galada {
  font-family: 'Galada', 'Georgia', serif;
}

.subtitle-text-devanagari {
  font-family: 'Noto Sans Devanagari', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ========================================
 * Remotion Caption Preset Fonts
 * ======================================== */











/* Press Start 2P - For Game preset */
@font-face {
  font-family: 'Press Start 2P';
  src: url('/font/PressStart2P-Regular.ttf') format('truetype');
  font-display: swap;
  font-weight: 400;
  font-style: normal;
}

/* Note: The following fonts are loaded via Google Fonts in load-font.ts:
 * - Bebas Neue
 * - Poppins
 * - Arimo
 * - Modak
 * - Quicksand
 * - Pricedown (for GTA presets)
 * - Cooper Black (for matcha preset)
 */