/* Modal Fix CSS - Đảm bảo modal hiển thị trên tất cả các element khác */

/* Modal z-index fix */
.modal {
    z-index: 10000 !important;
}

.modal-content {
    z-index: 10001 !important;
    position: relative;
}

/* Responsive modal improvements */
@media (max-width: 768px) {
    .modal-content {
        width: 95% !important;
        margin: 10% auto !important;
        max-height: 80vh !important;
    }
    
    .modal-header {
        padding: 15px 20px !important;
    }
    
    .modal-header h3 {
        font-size: 1.2rem !important;
    }
    
    .modal-body {
        padding: 20px !important;
    }
}

@media (max-width: 480px) {
    .modal-content {
        width: 98% !important;
        margin: 5% auto !important;
        max-height: 90vh !important;
    }
    
    .modal-header {
        padding: 12px 15px !important;
    }
    
    .modal-header h3 {
        font-size: 1.1rem !important;
    }
    
    .modal-body {
        padding: 15px !important;
    }
}

/* Đảm bảo modal không bị che bởi header */
.main-header {
    z-index: 999 !important;
}

.mobile-header {
    z-index: 1001 !important;
}

.mobile-footer {
    z-index: 1000 !important;
}

/* Top banner z-index */
.top-banner {
    z-index: 1000 !important;
}