.apps-view {
    padding: 32px 48px;
    height: 100%;
    overflow-y: auto;
    background: #f9fafb;
}

.page-header {
    margin-bottom: 24px;
    
    h1 {
        font-size: 24px;
        color: #1f2937;
        margin-bottom: 8px;
    }
    
    p {
        color: #6b7280;
        font-size: 14px;
    }
}

.toolbar-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    
    .search-input {
        max-width: 400px;
    }
}

.category-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
    flex-wrap: wrap;
    
    .tab-item {
        padding: 8px 20px;
        border-radius: 20px;
        font-size: 14px;
        color: #6b7280;
        background: #fff;
        border: 1px solid #e5e7eb;
        cursor: pointer;
        transition: all 0.2s;
        
        &:hover {
            color: #0055AA;
            border-color: #0055AA;
        }
        
        &.active {
            color: #fff;
            background: #0055AA;
            border-color: #0055AA;
        }
    }
}

.agents-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}
