/* Custom Styles for Bloodmoney 2 */

/* Game iframe styles */
.game-iframe {
    aspect-ratio: 16/10;
    min-height: 600px;
    width: 100%;
}

.game-frame {
    width: 100%;
    height: 70vh;
    min-height: 600px;
    max-height: 900px;
}

.youtube-iframe {
    aspect-ratio: 16/9;
}

/* Game navigation styles */
.game-nav-item img {
    aspect-ratio: 1/1;
    object-fit: cover;
}

@media (max-width: 768px) {
    .game-iframe {
        min-height: 500px;
    }
    
    .game-frame {
        height: 60vh;
        min-height: 500px;
        max-height: 700px;
    }
    
    .game-nav .grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 480px) {
    .game-nav .grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Fullscreen styles */
.fullscreen-iframe {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 9999 !important;
    border-radius: 0 !important;
    max-height: none !important;
}

.fullscreen-container {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 9998 !important;
    background: black;
    border-radius: 0 !important;
}

/* Gradient backgrounds */
.gradient-bg {
    background: linear-gradient(135deg, #007AFF 0%, #AF52DE 100%);
}

.gradient-hero {
    background: linear-gradient(135deg, #34C759 0%, #007AFF 100%);
}

/* Glass effect */
.glass-effect {
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Hover effects */
.hover-scale {
    transition: transform 0.3s ease;
}

.hover-scale:hover {
    transform: scale(1.02);
}

/* Section padding */
.section-padding {
    padding: 4rem 1rem;
}

@media (max-width: 768px) {
    .section-padding {
        padding: 2rem 1rem;
    }
}

/* Tailwind color extensions */
:root {
    --apple-blue: #007AFF;
    --apple-gray: #8E8E93;
    --apple-light-gray: #F2F2F7;
    --apple-dark: #1C1C1E;
    --apple-green: #34C759;
    --apple-red: #FF3B30;
    --apple-orange: #FF9500;
    --apple-purple: #AF52DE;
    --apple-yellow: #FFCC00;
}