/*!
 * Optimized Font Loading Strategy for FreeBonus.net
 * Implements font-display: swap for better Core Web Vitals
 * Includes proper fallback fonts to minimize layout shift
 */

/* ===================================
   FONT FACE DECLARATIONS WITH FONT-DISPLAY
   ================================= */

/* Roboto Font Family - Primary Text Font */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap; /* Show fallback immediately, swap when loaded */
    src: url('https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmSU5fBBc4.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fBBc4.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmWUlfBBc4.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Orbitron Font Family - Heading Font */
@font-face {
    font-family: 'Orbitron';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('https://fonts.gstatic.com/s/orbitron/v29/yMJMMIlzdpvBhQQL_SC3X9yhF25-T1nyGy6BoWgz.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Orbitron';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('https://fonts.gstatic.com/s/orbitron/v29/yMJQMIlzdpvBhQQL_SC3X9yhF25-T1nyOy6FpGUz.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Orbitron';
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url('https://fonts.gstatic.com/s/orbitron/v29/yMJQMIlzdpvBhQQL_SC3X9yhF25-T1nyKy6FpGUz.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ===================================
   OPTIMIZED FONT STACKS WITH FALLBACKS
   ================================= */

/* CSS Custom Properties for Font Stacks */
:root {
    /* Primary font stack with system fallbacks */
    --font-primary: 'Roboto', 
                    -apple-system, 
                    BlinkMacSystemFont, 
                    'Segoe UI', 
                    'Helvetica Neue', 
                    Arial, 
                    sans-serif;
    
    /* Heading font stack with monospace fallbacks */
    --font-heading: 'Orbitron', 
                    'SF Mono', 
                    Monaco, 
                    'Cascadia Code', 
                    'Roboto Mono', 
                    Consolas, 
                    'Courier New', 
                    monospace;
    
    /* Font metrics for layout stability */
    --font-primary-metrics: 1.0; /* Roboto metrics */
    --font-heading-metrics: 0.9; /* Orbitron metrics */
}

/* ===================================
   FONT LOADING OPTIMIZATION CLASSES
   ================================= */

/* Font loading states for better UX */
.fonts-loading {
    visibility: hidden;
}

.fonts-loaded {
    visibility: visible;
}

/* Smooth transition when fonts load */
.font-smooth-transition {
    transition: font-family 0.2s ease-in-out;
}

/* ===================================
   FALLBACK FONT ADJUSTMENTS
   ================================= */

/* Adjust fallback fonts to match web font metrics */
.font-fallback-roboto {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    font-size: 1.05em; /* Slightly larger to match Roboto */
    letter-spacing: 0.01em;
}

.font-fallback-orbitron {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
    font-size: 0.95em; /* Slightly smaller to match Orbitron */
    letter-spacing: 0.05em;
}

/* ===================================
   PERFORMANCE OPTIMIZATIONS
   ================================= */

/* Optimize font rendering */
.optimize-font-rendering {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "liga" 1, "kern" 1;
}

/* Critical text that should never be invisible */
.critical-text {
    font-family: var(--font-primary);
    font-display: block; /* Always show text, even with fallback */
}

/* ===================================
   RESPONSIVE FONT LOADING
   ================================= */

/* Reduce font weights on slower connections */
@media (prefers-reduced-data: reduce) {
    :root {
        --font-primary: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
        --font-heading: 'SF Mono', Monaco, Consolas, 'Courier New', monospace;
    }
}

/* Optimize for slow connections */
@media (max-width: 768px) and (max-resolution: 1dppx) {
    .font-weight-optimization {
        font-weight: 400 !important; /* Use only regular weight on slow mobile */
    }
}

/* ===================================
   FONT LOADING JAVASCRIPT HOOKS
   ================================= */

/* Classes for JavaScript font loading detection */
.js-fonts-loading .font-dependent {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.js-fonts-loaded .font-dependent {
    opacity: 1;
}

/* ===================================
   ACCESSIBILITY IMPROVEMENTS
   ================================= */

/* Respect user preferences */
@media (prefers-reduced-motion: reduce) {
    .font-smooth-transition,
    .js-fonts-loading .font-dependent,
    .js-fonts-loaded .font-dependent {
        transition: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    :root {
        --font-primary: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
        --font-heading: 'SF Mono', Monaco, Consolas, 'Courier New', monospace;
    }
}
