* {
    box-sizing: border-box !important;
}

.metadata-gen-container * {
    max-width: 100% !important;
}

@media (max-width: 1024px) {
    .metadata-gen-container {
        display: flex !important;
        flex-direction: column !important;
        padding: 10px !important;
        gap: 15px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .metadata-gen-left-container,
    .metadata-gen-right-container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 15px !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 768px) {
    .metadata-gen-container {
        padding: 8px !important;
        gap: 10px !important;
    }

    .metadata-gen-left-container,
    .metadata-gen-right-container {
        padding: 12px !important;
    }
    
    .metadata-gen-heading h1 {
        font-size: 16px !important;
    }
    
    .metadata-gen-upload-container{
        display: flow !important;
        gap: 0px !important;
    }
    
    .metadata-gen-upload-area {
        height: 360px !important;
        padding: 10px !important;
        width: 100% !important;
    }
    
    .metadata-gen-files-display{
        width: 100% !important;
    }
    
    .metadata-gen-essential-container{
        display: flex !important;
        flex-direction: column !important;
    }
    
    .metadata-gen-section-title{
        font-size: 14px !important;
    }
    
    .metadata-gen-section-subtitle{
        font-size: 10px !important;
    }
    
    .metadata-gen-section-header{
        padding: 0px !important;
    }
    
    .metadata-gen-export-content {
        padding: 10px !important;
    }
    
    .metadata-gen-platform-grid {
        gap: 6px !important;
    }
    
    .metadata-gen-basic-settings{
        padding: 10px !important;
        margin-top: 20px !important;
    }
    
    .metadata-gen-additional-grid{
        display: flex !important;
        flex-direction: column !important;
        padding: 0px !important;
    }
    
    #advancedSection{
        padding: 0px !important;
    }
    
    .metadata-gen-files-header-left{
        display: none !important;
    }
    
    .metadata-gen-files-actions{
        width: 100% !important;
        justify-content: space-between !important;
    }

    .metadata-gen-privacy-notice{
        font-size: 12px !important;
        display: block !important;
    }
    
    .metadata-gen-progress-header{
        padding: 10px !important;
    }
    
    .metadata-gen-progress-stat{
        font-size: 12px !important;
        gap: 3px !important;
    }
    
    .metadata-gen-current-file{
        display: none !important;   
    }
    
    .metadata-gen-result-first-row {
        display: grid !important;
    }
    
    .metadata-gen-add-keyword-btn{
        width: 35px !important;
        height: 35px !important;
    }
    
    .metadata-gen-result-description{
        font-size: 12px !important;
    }
    
    .metadata-gen-result-model-info{
        font-size: 10px !important;
    }
    
    .metadata-gen-reset-btn{
        font-size: 10px !important;
        padding: 10px 12px !important;
    }
    
    .metadata-gen-results-title{
        font-size: 14px !important;
    }
    
    .metadata-gen-beta-tag{
        display: none !important;
    }
    
    .metadata-gen-api-section {
        margin-top: 15px !important;
        margin-bottom: 15px !important;
    }
    
    .metadata-gen-dropdown {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .metadata-gen-dropdown-content {
        padding: 15px !important;
    }
    
    .metadata-gen-api-input {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .metadata-gen-input-group {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
    }
    
    .metadata-gen-verify-btn {
        width: 100% !important;
        margin-top: 5px !important;
    }
    
    .metadata-gen-clean-select {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .metadata-gen-export-btn {
        width: 100% !important;
        padding: 12px !important;
        font-size: 14px !important;
    }
}

@media (max-width: 480px) {
    .metadata-gen-container {
        padding: 5px !important;
        gap: 8px !important;
    }
    
    .metadata-gen-left-container,
    .metadata-gen-right-container {
        padding: 8px !important;
    }
    
    .metadata-gen-heading h1 {
        font-size: 20px !important;
        line-height: 1.2 !important;
    }
    
    .metadata-gen-dropdown-header {
        padding: 10px !important;
    }
    
    .metadata-gen-dropdown-content {
        padding: 10px !important;
    }
    
    .metadata-gen-api-input {
        font-size: 14px !important;
        padding: 8px !important;
    }
    
    .metadata-gen-verify-btn {
        padding: 10px !important;
        font-size: 14px !important;
    }
}
