@media (max-width: 768px) {
    body, 
    .page,
    .view-container,
    .content,
    .app-grid, 
    .web-grid,
    .main-content,
    .page-content {
        padding-top: 15px !important;
    }
    
    .view-container {
        margin-top: -15px !important;
    }
    
    .k-toolbar,
    .toolbar,
    .grid-toolbar,
    .page-toolbar,
    .app-grid .k-toolbar,
    .web-grid .k-toolbar {
        position: sticky !important;
        top: 0 !important;
        z-index: 100 !important;
        background: white !important;
        border-bottom: 1px solid #dee2e6 !important;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
        margin-bottom: 0 !important;
    }
    
    .k-grid {
        min-height: calc(100vh - 140px) !important;
    }
}

@media (max-width: 480px) {
    body, 
    .page,
    .view-container,
    .content,
    .app-grid,
    .web-grid,
    .main-content,
    .page-content {
        padding-top: 15px !important;
    }
    
    .view-container {
        margin-top: -15px !important;
    }
    
    .k-toolbar,
    .toolbar,
    .grid-toolbar,
    .page-toolbar {
        padding: 0.5rem !important;
        flex-wrap: wrap !important;
        gap: 0.25rem !important;
    }
    
    .k-toolbar .k-button,
    .toolbar .k-button,
    .grid-toolbar .k-button,
    .page-toolbar .k-button {
        margin: 0.125rem !important;
        padding: 0.375rem 0.5rem !important;
        font-size: 0.875rem !important;
        min-width: 40px !important;
    }
    
    .k-toolbar .k-button .command-text,
    .toolbar .k-button .command-text {
        display: none !important;
    }
}

@media (min-width: 481px) and (max-width: 768px) {
    body, 
    .page,
    .view-container,
    .content,
    .app-grid,
    .web-grid,
    .main-content,
    .page-content {
        padding-top: 15px !important;
    }
    
    .view-container {
        margin-top: -15px !important;
    }
    
    .k-toolbar,
    .toolbar {
        padding: 0.75rem !important;
    }
}

@media (min-width: 769px) {
    .view-container,
    .content,
    .app-grid,
    .web-grid {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
    
    .k-toolbar,
    .toolbar,
    .grid-toolbar,
    .page-toolbar {
        position: static !important;
        background: transparent !important;
        border-bottom: none !important;
        box-shadow: none !important;
    }
}

.modal,
.k-window,
.modal .view-container,
.modal .content,
.modal .app-grid,
.modal .web-grid,
.k-window .view-container,
.k-window .content,
.k-window .app-grid,
.k-window .web-grid {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.modal .k-toolbar,
.modal .toolbar,
.k-window .k-toolbar,
.k-window .toolbar {
    position: static !important;
    background: transparent !important;
    border-bottom: none !important;
    box-shadow: none !important;
}