/* Custom styles that can't be done with Tailwind */
iframe {
    background-color: #f8fafc;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .flex-col {
        flex-direction: column;
    }
    
    iframe {
        height: 300px;
    }
}

/* Animation for frame loading */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

iframe {
    animation: fadeIn 0.3s ease-in-out;
}